/* Admin Styles for Backlink Index Checker Pro Plugin */



.backlink-checker-container {

    max-width: 1200px;

    margin: 20px 0;

}



/* Tab Navigation */

.nav-tab-wrapper {

    margin-bottom: 20px;

}



.tab-panel {

    margin-top: 20px;

}



/* Results Summary */

.results-summary-box {

    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

    color: white;

    padding: 20px;

    border-radius: 8px;

    margin-bottom: 20px;

}



.results-summary-box h3 {

    margin: 0 0 15px 0;

    color: white;

}



.summary-stats {

    display: flex;

    gap: 20px;

    flex-wrap: wrap;

}



.stat-item {

    background: rgba(255,255,255,0.2);

    padding: 15px;

    border-radius: 6px;

    text-align: center;

    min-width: 100px;

    backdrop-filter: blur(10px);

}



.stat-number {

    display: block;

    font-size: 2em;

    font-weight: bold;

    color: #fff;

}



.stat-label {

    display: block;

    font-size: 0.9em;

    opacity: 0.9;

    margin-top: 5px;

}



/* Results Table */

#results-table-container {

    margin-top: 20px;

}



.table-controls {

    margin-bottom: 15px;

    text-align: right;

}



.table-controls .button {

    margin-left: 10px;

}



#results-table {

    margin-top: 15px;

}



#results-table th {

    background: #f8f9fa;

    font-weight: 600;

}



.url-cell {

    max-width: 300px;

}



.url-display {

    font-family: monospace;

    background: #f8f9fa;

    padding: 4px 8px;

    border-radius: 3px;

    font-size: 13px;

    word-break: break-all;

    line-height: 1.4;

}



/* Status Badges */

.status-badge, .index-badge {

    display: inline-block;

    padding: 4px 8px;

    border-radius: 4px;

    font-size: 12px;

    font-weight: 600;

    text-align: center;

    min-width: 80px;

}



.status-badge.status-live {

    background: #d4edda;

    color: #155724;

    border: 1px solid #c3e6cb;

}



.status-badge.status-error {

    background: #f8d7da;

    color: #721c24;

    border: 1px solid #f5c6cb;

}



.status-badge.status-processing {

    background: #fff3cd;

    color: #856404;

    border: 1px solid #ffeaa7;

}



.index-badge.index-yes {

    background: #d4edda;

    color: #155724;

    border: 1px solid #c3e6cb;

}



.index-badge.index-no {

    background: #f8d7da;

    color: #721c24;

    border: 1px solid #f5c6cb;

}



.index-badge.index-checking {

    background: #e2e3e5;

    color: #495057;

    border: 1px solid #ced4da;

}



/* Table Row States */

.table-row.status-processing {

    background-color: #fff9e6;

    opacity: 0.8;

}



.table-row.status-live {

    background-color: #f8fff9;

}



.table-row.status-error {

    background-color: #fff8f8;

}



/* Action Buttons */

.actions-cell .button {

    margin-right: 5px;

    padding: 4px 8px;

    min-height: auto;

    font-size: 12px;

}



/* Completion Message */

.completion-message {

    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);

    color: #155724;

    padding: 25px;

    border-radius: 8px;

    text-align: center;

    margin: 20px 0;

}



.completion-message h3 {

    margin: 0 0 15px 0;

    color: #155724;

}



.completion-stats {

    background: rgba(255,255,255,0.9);

    padding: 15px;

    border-radius: 6px;

    margin: 15px 0;

    text-align: left;

}



.completion-stats ul {

    margin: 10px 0;

    padding-left: 20px;

}



.completion-actions {

    margin-top: 20px;

}



.completion-actions .button {

    margin: 0 10px;

}



.checker-form {

    background: #fff;

    border: 1px solid #ccd0d4;

    border-radius: 4px;

    padding: 20px;

    margin-bottom: 20px;

    box-shadow: 0 1px 1px rgba(0,0,0,.04);

}



.checker-form h2 {

    margin-top: 0;

    color: #23282d;

    font-size: 1.3em;

}



.form-table th {

    padding: 15px 10px 15px 0;

    vertical-align: top;

}



.form-table td {

    padding: 15px 10px;

}



.regular-text {

    width: 100%;

    max-width: 500px;

}



.large-text {

    width: 100%;

    max-width: 500px;

}



#results-container {

    background: #f8f9fa;

    border: 1px solid #e1e5e9;

    border-radius: 4px;

    padding: 20px;

    margin: 20px 0;

}



#results-container h2 {

    margin-top: 0;

    color: #23282d;

}



.search-result {

    background: #fff;

    border: 1px solid #ddd;

    border-radius: 4px;

    padding: 15px;

    margin-bottom: 15px;

}



.search-result h4 {

    margin: 0 0 10px 0;

    color: #0073aa;

}



.search-result .search-query {

    background: #f1f1f1;

    border: 1px solid #ddd;

    border-radius: 3px;

    padding: 8px 12px;

    font-family: monospace;

    font-size: 14px;

    margin: 10px 0;

    word-break: break-all;

}



.google-search-btn {

    background: #4285f4 !important;

    border-color: #4285f4 !important;

    color: #fff !important;

    text-decoration: none !important;

    display: inline-block;

    padding: 8px 16px;

    border-radius: 4px;

    font-weight: 500;

    margin: 10px 0;

    transition: background-color 0.3s;

}



.google-search-btn:hover {

    background: #3367d6 !important;

    border-color: #3367d6 !important;

    color: #fff !important;

}



.instructions-box {

    background: #e7f3ff;

    border: 1px solid #b8daff;

    border-radius: 4px;

    padding: 20px;

    margin: 20px 0;

}



.instructions-box h3 {

    margin-top: 0;

    color: #004085;

}



.instructions-box h4 {

    color: #004085;

    margin-top: 20px;

}



.instructions-box ol {

    margin: 15px 0;

    padding-left: 20px;

}



.instructions-box li {

    margin-bottom: 8px;

    line-height: 1.5;

}



.code-example {

    background: #f8f9fa;

    border: 1px solid #dee2e6;

    border-radius: 4px;

    padding: 15px;

    margin: 10px 0;

    font-family: monospace;

}



.code-example code {

    background: none;

    padding: 0;

    font-size: 14px;

}



/* Loading spinner */

.spinner {

    display: inline-block;

    width: 12px;

    height: 12px;

    border: 2px solid #f3f3f3;

    border-top: 2px solid #0073aa;

    border-radius: 50%;

    animation: spin 1s linear infinite;

    margin-right: 5px;

}



@keyframes spin {

    0% { transform: rotate(0deg); }

    100% { transform: rotate(360deg); }

}



/* Progress Bar Styles */

#progress-container {

    animation: slideDown 0.3s ease-out;

}



@keyframes slideDown {

    from {

        opacity: 0;

        transform: translateY(-20px);

    }

    to {

        opacity: 1;

        transform: translateY(0);

    }

}



.progress-bar-container {

    position: relative;

    box-shadow: inset 0 1px 3px rgba(0,0,0,0.2);

}



#progress-bar {

    transition: width 0.3s ease;

    background: linear-gradient(45deg, #0073aa, #005a87);

    box-shadow: 0 1px 3px rgba(0,0,0,0.2);

}



#progress-percentage {

    text-shadow: 0 1px 2px rgba(0,0,0,0.3);

    font-weight: bold;

}



/* Status Indicators */

.status-indicator {

    display: inline-block;

    padding: 4px 8px;

    border-radius: 3px;

    font-size: 12px;

    font-weight: bold;

    margin-bottom: 10px;

}



.status-indicator.processing {

    background: #fff3cd;

    color: #856404;

    border: 1px solid #ffeaa7;

}



.status-indicator.ready {

    background: #d4edda;

    color: #155724;

    border: 1px solid #c3e6cb;

}



.status-indexed {

    background: #d4edda;

    color: #155724;

    border: 1px solid #c3e6cb;

}



.status-not-indexed {

    background: #f8d7da;

    color: #721c24;

    border: 1px solid #f5c6cb;

}



/* URL Processing Animation */

.bulk-result {

    border-bottom: 1px solid #eee;

    padding: 15px 0;

    transition: all 0.3s ease;

}



.bulk-result:last-child {

    border-bottom: none;

}



.bulk-result[data-url-index] {

    opacity: 0.7;

    transform: translateX(-10px);

    animation: slideInProcessing 0.3s ease forwards;

}



@keyframes slideInProcessing {

    to {

        opacity: 1;

        transform: translateX(0);

    }

}



/* Search Actions Animation */

.search-actions {

    transition: opacity 0.3s ease;

}



.google-search-btn[disabled] {

    opacity: 0.6;

    cursor: not-allowed;

    pointer-events: none;

}



/* Progress Counter Styles */

#progress-container div[style*="display: inline-block"] {

    background: #f8f9fa;

    padding: 5px 10px;

    border-radius: 4px;

    border: 1px solid #dee2e6;

    font-size: 13px;

}



/* Animated Progress Text */

#progress-status {

    animation: fadeInOut 2s ease-in-out infinite;

}



@keyframes fadeInOut {

    0%, 100% { opacity: 1; }

    50% { opacity: 0.7; }

}



/* Frontend Styles */

.backlink-checker-frontend {

    background: #fff;

    border: 1px solid #ddd;

    border-radius: 6px;

    padding: 20px;

    margin: 20px 0;

    max-width: 600px;

}



.backlink-checker-frontend h3 {

    margin-top: 0;

    color: #333;

}



.backlink-checker-frontend .form-group {

    margin-bottom: 15px;

}



.backlink-checker-frontend label {

    display: block;

    margin-bottom: 5px;

    font-weight: 600;

    color: #333;

}



.backlink-checker-frontend input[type="url"] {

    width: 100%;

    padding: 8px 12px;

    border: 1px solid #ddd;

    border-radius: 4px;

    font-size: 14px;

}



.backlink-checker-frontend button {

    background: #0073aa;

    color: #fff;

    border: none;

    padding: 10px 20px;

    border-radius: 4px;

    cursor: pointer;

    font-size: 14px;

    font-weight: 500;

}



.backlink-checker-frontend button:hover {

    background: #005a87;

}



.backlink-checker-frontend #frontend-results {

    margin-top: 20px;

    padding-top: 20px;

    border-top: 1px solid #eee;

}



/* Responsive Design */

@media (max-width: 768px) {

    .backlink-checker-container {

        margin: 10px 0;

    }

    

    .checker-form {

        padding: 15px;

    }

    

    .regular-text,

    .large-text {

        max-width: 100%;

    }

    

    .instructions-box {

        padding: 15px;

    }

    

    .code-example {

        padding: 10px;

        font-size: 12px;

    }

    

    .summary-stats {

        flex-direction: column;

    }

    

    .stat-item {

        min-width: auto;

    }

}



/* WordPress Admin Compatibility */

.wrap .backlink-checker-container .button-primary {

    background: #0073aa;

    border-color: #0073aa;

}



.wrap .backlink-checker-container .button-primary:hover {

    background: #005a87;

    border-color: #005a87;

}