﻿/**
 * Dashboard CSS for Elementor AI Translator
 * Styles for bulk translation interface
 */

/* Main Dashboard Wrapper
   IMPORTANT: Do NOT style core .wrap globally — scope to plugin wrappers only */
.aitrfoel-admin-wrapper, .aitrfoel-dashboard-wrapper {
    width: calc(100% - 36px);
    max-width: none;
    margin: 0px 36px 20px 0;
    position: relative;
}


/* Plugin Header - Full Width */
.aitrfoel-plugin-header {
    background: linear-gradient(135deg, #f8fafc 0%, #fff 100%);
    margin: -20px -36px 20px -20px;
    padding: 12px 24px;
    border-bottom: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    position: relative;
    z-index: 1;
}

.aitrfoel-plugin-title {
    font-size: 15px;
    font-weight: 600;
    color: #1e293b;
    margin: 0;
    line-height: 1.4;
    letter-spacing: -0.01em;
}

.aitrfoel-breadcrumb-separator {
    color: #94a3b8;
    margin: 0 6px;
    font-weight: 300;
    font-size: 14px;
}

.aitrfoel-current-page {
    color: #0073aa;
    font-weight: 500;
    font-size: 14px;
}

.aitrfoel-dashboard-wrapper .description {
    margin-bottom: 20px;
    color: #666;
    font-size: 14px;
}

/* Stats Grid in Dashboard */
.aitrfoel-dashboard-wrapper .aitrfoel-stats-grid {
    margin: 20px 0 30px 0;
}

/* Top bar stats grid styling */
.aitrfoel-stats-grid.aitrfoel-top-bar {
    background: #f8f9fa;
    border: 1px solid #e1e1e1;
    border-radius: 6px;
    padding: 15px;
    margin: 20px 0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

/* Compact Stats Bar */
.aitrfoel-dashboard-wrapper .aitrfoel-compact-stats-bar {
    background: #fff;
    color: #2271b1;
    width: 100%;
    padding: 16px 24px;
    margin: 0 0 20px -20px;
    border-radius: 0;
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: stretch;
    gap: 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
    border-bottom: 1px solid #e2e8f0;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Visual flash when stats are updated */
.aitrfoel-compact-stats-bar.aitrfoel-stats-updated {
    background: #f0f6fc;
    box-shadow: 0 2px 16px rgba(0,115,170,0.3);
}

@keyframes slideInFromTop {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.aitrfoel-dashboard-wrapper .aitrfoel-compact-stat {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 16px;
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    min-width: 0;
    grid-column: span 2;
}

.aitrfoel-dashboard-wrapper .aitrfoel-compact-stat.aitrfoel-usage-pool-stat {
    grid-column: span 2;
}

.aitrfoel-dashboard-wrapper .aitrfoel-compact-stat.aitrfoel-compact-license {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    grid-column: 7 / -1;
}

/* Keep the 3 primary cards on one balanced row: 2 / 4 / 6 columns */
.aitrfoel-dashboard-wrapper .aitrfoel-compact-stats-bar > .aitrfoel-compact-stat:first-child {
    grid-column: span 2;
}

@media (max-width: 1180px) {
    .aitrfoel-dashboard-wrapper .aitrfoel-compact-stats-bar {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .aitrfoel-dashboard-wrapper .aitrfoel-compact-stats-bar > .aitrfoel-compact-stat:first-child,
    .aitrfoel-dashboard-wrapper .aitrfoel-compact-stat.aitrfoel-usage-pool-stat {
        grid-column: span 3;
    }

    .aitrfoel-dashboard-wrapper .aitrfoel-compact-stat.aitrfoel-compact-license {
        grid-column: 1 / -1;
    }
}

.aitrfoel-compact-label {
    color: #64748b;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.aitrfoel-compact-value {
    color: #1e293b;
    font-weight: 700;
    font-size: 16px;
}

/* Words Left - Green background with yellow text */
.aitrfoel-words-left-stat {
    background: #28a745 !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
}

.aitrfoel-words-left-label {
    color: #ffeb3b !important;
    font-weight: 600 !important;
}

.aitrfoel-words-left-value {
    color: #ffeb3b !important;
    font-weight: 700 !important;
}

.aitrfoel-compact-buy-btn {
    background:#0073aa;
    color: white;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.2s;
    margin-left: 8px;
    border: 1px solid #0073aa;
}

.aitrfoel-compact-buy-btn:hover {
    border: 1px solid rgb(0 115 170);
    background: #e7f3ff;
    color: #0073aa;
}

.aitrfoel-compact-upgrade-btn {
    background: rgba(255, 193, 7, 0.9);
    color: #212529;
    text-decoration: none;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.2s;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.aitrfoel-compact-upgrade-btn:hover {
    background: #ffc107;
    color: #212529;
    text-decoration: none;
    border-color: #ffc107;
}

.aitrfoel-compact-license-info {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    flex: 1 1 50%;
    min-width: 0;
}

.aitrfoel-compact-addon-badge {
    display: inline-block;
    background: #e8f5e9;
    color: #2e7d32;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 4px;
    border: 1px solid #c8e6c9;
}

.aitrfoel-compact-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
    flex: 1 1 50%;
    min-width: 0;
}

.aitrfoel-compact-limit-reached {
    color: #ff6b6b !important;
    font-weight: 700 !important;
}

/* Tooltip Styling */
.aitrfoel-tooltip {
    position: relative;
    cursor: help;
}

.aitrfoel-tooltip:hover::after {
    content: attr(title);
    position: absolute;
    bottom: 125%;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.9);
    color: white;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: normal;
    line-height: 1.4;
    white-space: pre-line;
    z-index: 1000;
    min-width: 200px;
    max-width: 300px;
    text-align: left;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    animation: tooltipFadeIn 0.2s ease-out;
}

.aitrfoel-tooltip:hover::before {
    content: \"\";
    position: absolute;
    bottom: 115%;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: rgba(0, 0, 0, 0.9);
    z-index: 1001;
}

@keyframes tooltipFadeIn {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

/* Special positioning for action buttons */
.aitrfoel-compact-actions .aitrfoel-tooltip:hover::after {
    bottom: 125%;
    left: 0;
    transform: none;
}

.aitrfoel-compact-actions .aitrfoel-tooltip:hover::before {
    bottom: 115%;
    left: 20px;
    transform: none;
}

/* Custom tooltip overrides default browser tooltip */

/* Responsive adjustments */
@media (max-width: 768px) {
    .aitrfoel-admin-wrapper, .aitrfoel-dashboard-wrapper {
        width: calc(100% - 16px);
        margin: 0px 16px 20px 0;
    }
    
    .aitrfoel-stat-card.aitrfoel-stat-flex {
        flex-direction: column;
        text-align: center;
        gap: 8px;
    }
    
    .aitrfoel-stat-card.aitrfoel-stat-flex .aitrfoel-stat-label {
        margin-bottom: 5px;
    }
    
    .aitrfoel-buy-tokens-btn {
        margin-left: 0;
        margin-top: 8px;
    }
    
    /* Hide view buttons on mobile */
    .aitrfoel-dashboard-wrapper .column-actions .button-secondary {
        display: none;
    }
    
    /* Compact stats bar responsive */
    .aitrfoel-dashboard-wrapper .aitrfoel-compact-stats-bar {
        background: transparent;
        margin: 0px 0px 20px 0px;
        box-shadow: none;
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 8px 0;
        border-bottom: 1px solid #e1e1e1;
    }
    
    .aitrfoel-dashboard-wrapper .aitrfoel-compact-stat {
        grid-column: 1 / -1;
        padding: 4px 8px;
        border-bottom: none;
        font-size: 12px;
        min-width: auto;
        justify-content: flex-start;
        text-align: center;
    }

    .aitrfoel-dashboard-wrapper .aitrfoel-compact-stat.aitrfoel-compact-license {
        margin-left: 0;
        flex-direction: row;
        align-items: center;
        gap: 6px;
        min-width: 0;
        margin-top: 4px;
        border-top: 1px solid #e1e1e1;
        padding-top: 8px;
        grid-column: 1 / -1;
    }
    
    /* Mobile compact stat text adjustments */
    .aitrfoel-compact-stat .aitrfoel-compact-label {
        font-size: 11px;
        margin-bottom: 2px;
    }
    
    .aitrfoel-compact-stat .aitrfoel-compact-value {
        font-size: 13px;
        font-weight: 600;
    }
    
    /* Hide breadcrumb separator on mobile */
    .aitrfoel-breadcrumb-separator {
        display: none;
    }
    
    .aitrfoel-compact-license-info {
        justify-content: space-between;
    }
    
    .aitrfoel-compact-actions {
        justify-content: center;
        flex-wrap: wrap;
        gap: 6px;
    }
    
    .aitrfoel-compact-buy-btn,
    .aitrfoel-compact-upgrade-btn {
        flex: 1;
        text-align: center;
        min-width: 100px;
    }
}

@media (max-width: 1024px) {
    .aitrfoel-bulk-actions {
        margin-left: 0;
        justify-content: space-between;
    }
}

/* Notices */
.aitrfoel-dashboard-wrapper .notice {
    margin: 15px 0;
    animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Bulk Translation Bar - Sticky */
.aitrfoel-bulk-translation-bar {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 20px 24px;
    margin: 24px 0 20px 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.06);
    position: sticky;
    position: -webkit-sticky;
    top: 32px;
    z-index: 100;
    backdrop-filter: blur(12px);
    background: rgba(248, 250, 252, 0.97);
    transition: all 0.3s ease;
}

/* Enhanced styling when sticky is active */
.aitrfoel-bulk-translation-bar.is-sticky {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-color: #d1d5db;
    border-left: 4px solid #1447E6;
}

/* Add a subtle animation when becoming sticky */
.aitrfoel-bulk-translation-bar.is-sticky::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, #1447E6, #3d6aff);
    opacity: 0.7;
}

.aitrfoel-bulk-content {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
}

/* Compact inline error — replaces full-width WP .notice-error inside the bulk bar */
.aitrfoel-bulk-error-msg {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 6px 10px;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 4px;
    color: #b91c1c;
    font-size: 13px;
    line-height: 1.4;
}
.aitrfoel-bulk-error-msg .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.aitrfoel-bulk-selection {
    display: none; /* Hide the redundant selection count */
}

.aitrfoel-bulk-selection strong {
    color: #0073aa;
    font-weight: 600;
}

.aitrfoel-bulk-languages {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 5px 7px;
    flex-shrink: 0;
    min-width: 0;
}

.aitrfoel-bulk-languages label {
    font-weight: 500;
    color: #555;
    white-space: nowrap;
    font-size: 14px;
    flex-shrink: 0;
}

.aitrfoel-bulk-languages select {
    min-width: 120px;
}

.aitrfoel-target-languages,
.aitrfoel-source-languages {
    position: relative;
    flex-shrink: 0;
}

#aitrfoel-select-source-language,
#aitrfoel-select-languages {
    position: relative;
    width: auto;
    min-width: unset;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    font-size: 12px;
    padding: 3px 22px 3px 6px;
    white-space: nowrap;
    flex-shrink: 0;
}

#aitrfoel-select-source-language::after,
#aitrfoel-select-languages::after {
    content: '';
    position: absolute;
    right: 7px;
    top: 50%;
    transform: translateY(-50%);
    width: 7px;
    height: 7px;
    border-right: 2px solid #59657a;
    border-bottom: 2px solid #59657a;
    transform: translateY(-60%) rotate(45deg);
    pointer-events: none;
}

.aitrfoel-source-languages.disabled #aitrfoel-select-source-language::after,
.aitrfoel-target-languages.disabled #aitrfoel-select-languages::after {
    opacity: 0.5;
}

.aitrfoel-dropdown-content {
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    z-index: 50;
    min-width: 200px;
    max-height: 300px;
    overflow-y: auto;
}

.aitrfoel-bulk-stats {
    flex: 1 1 0;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #666;
    font-size: 13px;
}

.aitrfoel-bulk-actions {
    margin-left: auto;
    display: flex;
    gap: 10px;
}

.aitrfoel-bulk-actions .button {
    position: relative;
}

.aitrfoel-bulk-actions .button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ИСКЛЮЧЕНИЕ ДЛЯ КНОПКИ ПЕРЕВОДА - НЕ ЗАТРАГИВАТЬ! */
.aitrfoel-bulk-actions #aitrfoel-start-translation:disabled {
    opacity: 1 !important;
    cursor: default !important;
}



/* Disabled dropdown styles */
.aitrfoel-source-languages.disabled .button,
.aitrfoel-target-languages.disabled .button {
    opacity: 0.6;
    cursor: not-allowed;
    background: #f6f7f7 !important;
    color: #a0a5aa !important;
    border-color: #dcdcde !important;
}

.aitrfoel-source-languages.disabled .button:hover,
.aitrfoel-target-languages.disabled .button:hover {
    background: #f6f7f7 !important;
    color: #a0a5aa !important;
    border-color: #dcdcde !important;
}

.aitrfoel-bulk-actions .button-primary:disabled,
.aitrfoel-bulk-actions .button.button-disabled {
    background: #ccc !important;
    border-color: #ccc !important;
    color: #666 !important;
    opacity: 0.7;
    cursor: not-allowed;
}

/* ИСКЛЮЧЕНИЕ ДЛЯ КНОПКИ ПЕРЕВОДА - разрешаем анимацию загрузчика */
.aitrfoel-bulk-actions #aitrfoel-start-translation.loading:disabled,
.aitrfoel-bulk-actions #aitrfoel-start-translation.success:disabled {
    opacity: 1 !important;
    cursor: unset !important;
}



/* Tooltips handled by native title attribute — CSS tooltip removed */

/* Duplicate rule removed — see primary .aitrfoel-bulk-stats above */

/* Dashboard Table */
.aitrfoel-dashboard-table {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 0 0 8px 8px;
    margin-top: 0;
    /* visible so the row "⋯" action menu can overflow the table bounds */
    overflow: visible;
}

.aitrfoel-dashboard-table table {
    margin: 0;
    border: none;
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

.aitrfoel-dashboard-table tbody {
    border-spacing: 0;
}

.aitrfoel-dashboard-table tr {
    border-spacing: 0;
}

.aitrfoel-dashboard-table th {
    padding-bottom: 20px; /* Adjust for border-spacing */
}

/* Column Width Distribution - Best Practice */
.aitrfoel-dashboard-table .column-cb,
.aitrfoel-dashboard-table th.check-column,
.aitrfoel-dashboard-table td.check-column,
.aitrfoel-dashboard-table th.manage-column.column-cb {
    width: 40px;
    text-align: center;
    vertical-align: middle;
    padding: 12px 10px 12px 15px !important;
}

.aitrfoel-dashboard-table .column-cb input[type="checkbox"],
.aitrfoel-dashboard-table th.check-column input[type="checkbox"] {
    margin: 0 auto;
    display: block;
}

.aitrfoel-dashboard-table .column-title {
    width: 28%;
    min-width: 200px;
}

.aitrfoel-dashboard-table td.column-title,
.aitrfoel-dashboard-table th.column-title {
    padding-left: 8px !important;
}

.aitrfoel-dashboard-table .column-languages {
    width: 18%;
    text-align: center;
    padding: 8px 12px;
}

.aitrfoel-dashboard-table .column-status {
    width: 12%;
    text-align: center;
    padding: 8px 12px;
}

.aitrfoel-dashboard-table .column-page-type {
    width: 10%;
    text-align: center;
    padding: 8px 12px;
}

.aitrfoel-dashboard-table .column-actions {
    width: 14%;
    text-align: center;
    padding: 8px 12px;
}

.aitrfoel-dashboard-table .column-expand {
    width: 50px;
    text-align: center;
    padding: 8px 12px;
}

/* Table Header Styling */
.aitrfoel-dashboard-table th {
   
   
    font-weight: 600;
    color: #475569;
    padding: 14px 15px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

/* Table Cell Styling */
.aitrfoel-dashboard-table td {
    padding: 12px 15px;
    vertical-align: middle;
  
}

.aitrfoel-group-last .column-title, .expanded .column-title {
border-bottom: 0;}

/* Avoid double borders on child rows: remove default bottoms, we'll draw our own */
/* (v1 reset removed) */

/* Hover only on parent (clickable to expand), not on child rows */
.aitrfoel-dashboard-table tbody tr.aitrfoel-source-page:hover td,
.aitrfoel-dashboard-table tbody tr.aitrfoel-source-page:hover th {
    background-color: #eef5ff !important;
}

/* Universal hover for all rows in the main dashboard table */
.aitrfoel-dashboard-table tbody tr:hover td,
.aitrfoel-dashboard-table tbody tr:hover th,
.aitrfoel-translation-page:hover,
.aitrfoel-dashboard-table tbody tr.aitrfoel-translation-page:hover td,
.aitrfoel-dashboard-table tbody tr.aitrfoel-translation-page:hover th {
    background-color: #eef5ff !important;
}

/* Page Rows Styling */
.aitrfoel-source-page {
    background: #fff;
    position: relative;
}

/* Tiny separator + extra breathing room for source rows */
.aitrfoel-dashboard-table tbody tr.aitrfoel-source-page > td,
.aitrfoel-dashboard-table tbody tr.aitrfoel-source-page > th {
    box-shadow: inset 0 -1px 0 #e7ebf3;
    padding-top: 15px;
    padding-bottom: 15px;
}

.aitrfoel-source-page:hover {
    background: #fff;
}

/* Subtle hint: nudge chevron on parent-row hover to suggest expandability */
.aitrfoel-dashboard-table tbody tr.aitrfoel-source-page:hover .aitrfoel-expand-button .dashicons {
    transform: translateX(-1px);
    opacity: 0.9;
}

.aitrfoel-translation-page {
    background: #fff;
}

/* Disable WP zebra striping just for our table (defensive) */
.aitrfoel-dashboard-table .wp-list-table tbody > tr:nth-child(odd) > td,
.aitrfoel-dashboard-table .wp-list-table tbody > tr:nth-child(odd) > th {
    background: transparent;
    border-bottom: 0 !important;
}

.aitrfoel-translation-page:hover {
    background: #fff;
}

/* Remove body row separators for consistent row rendering */
.aitrfoel-dashboard-table .wp-list-table tbody td,
.aitrfoel-dashboard-table .wp-list-table tbody th,
.aitrfoel-dashboard-table tbody td,
.aitrfoel-dashboard-table tbody th {
    border-bottom: 0 !important;
}

/* Grouping styles for translation rows */
.aitrfoel-source-page.has-translations,
.aitrfoel-translation-page {
    position: relative;
}

/* Add margin using a pseudo-element on the row */
/* .aitrfoel-source-page.has-translations {
    box-shadow: 0 -1px 0 0 #e0e0e0, -1px 0 0 0 #e0e0e0, 1px 0 0 0 #e0e0e0;
   
}*/

.aitrfoel-source-page {
     margin-bottom: 10px; /* This won't work on TR, but let's try another way if needed */
}

/* Keep WordPress table semantics intact */
tr.aitrfoel-source-page {
    display: table-row;
    margin-bottom: 0; /* margins on tr don't apply; avoid layout hacks */
    border-radius: 0;
}

.aitrfoel-source-page.has-translations {
   
    margin-bottom: 0;
}


/* (v1 group frame shadows removed) */

/* Keep translation rows as proper table rows (visibility is controlled below) */
tr.aitrfoel-translation-page {
    display: table-row;
}

/* Accordion Table Functionality */
.aitrfoel-translation-collapsed,
tr.aitrfoel-translation-page.aitrfoel-translation-collapsed {
    display: none !important;
}

.aitrfoel-translation-expanded,
tr.aitrfoel-translation-page.aitrfoel-translation-expanded {
    display: table-row !important;
}

/* Force hide all translation rows by default */
tr.aitrfoel-translation-page {
    display: none !important;
}

tr.aitrfoel-translation-page.aitrfoel-translation-expanded {
    display: table-row !important;
}

.aitrfoel-expand-button {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    border-radius: 3px;
   
    color: #666;
}

.aitrfoel-expand-button:hover {
    background: #f0f0f0;
    color: #2271b1;
}

.aitrfoel-expand-button .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    transition: transform 0.15s ease, opacity 0.15s ease;
}






/* Keep default cursor on rows, but links must look clickable */
.aitrfoel-page-title-link {
    color: inherit;
    text-decoration: none;
}

.aitrfoel-title-post-type-icon {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 6px;
    vertical-align: -2px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.aitrfoel-title-post-type-icon.aitrfoel-title-icon-page {
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"%3E%3Cpath d="M3 11L12 4L21 11" stroke="%23555" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/%3E%3Cpath d="M5 10.5V20H19V10.5" stroke="%23555" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/%3E%3Cpath d="M10 20V14H14V20" stroke="%23555" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/%3E%3C/svg%3E');
}

.aitrfoel-title-post-type-icon.aitrfoel-title-icon-post {
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"%3E%3Crect x="4" y="4" width="16" height="16" rx="2" stroke="%23555" stroke-width="2"/%3E%3Cpath d="M8 9H16" stroke="%23555" stroke-width="2" stroke-linecap="round"/%3E%3Cpath d="M8 13H16" stroke="%23555" stroke-width="2" stroke-linecap="round"/%3E%3Cpath d="M8 17H13" stroke="%23555" stroke-width="2" stroke-linecap="round"/%3E%3C/svg%3E');
}

.aitrfoel-title-post-type-icon.aitrfoel-title-icon-product {
    background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"%3E%3Cpath d="M6 7H19L17.8 14H9.3L8.5 9.6H5.5" stroke="%23555" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/%3E%3Ccircle cx="10" cy="18" r="1.5" fill="%23555"/%3E%3Ccircle cx="16" cy="18" r="1.5" fill="%23555"/%3E%3C/svg%3E');
}

.aitrfoel-page-title-link:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}
.aitrfoel-page-title-link:hover .aitrfoel-page-lang {
    text-decoration: none;
}

/* Page Title Column */
.aitrfoel-dashboard-wrapper .column-title {
    position: relative;
}

.aitrfoel-page-lang {
    color: #999;
    font-size: 11px;
    font-weight: normal;
    margin-left: 8px;
    background: #f5f5f5;
    padding: 2px 6px;
    border-radius: 3px;
}

.aitrfoel-page-status {
    font-size: 11px;
    color: #666;
    margin-top: 6px;
    font-style: italic;
}

.aitrfoel-translation-indent {
    color: #666;
}

/* Child translation rows: show clear nested hierarchy like list items */
tr.aitrfoel-translation-page td.column-title .aitrfoel-translation-indent {
    display: inline-block;
    padding-left: 24px;
}

tr.aitrfoel-translation-page td.column-title .aitrfoel-page-status {
    display: block;
    padding-left: 24px;
}

/* (v1 ascii connector/dot rules removed) */

/* (v1 separators and title background lines removed) */

/* (v1 connectors removed; v2 handles connectors under .aitrfoel-tree-v2) */

/* Language Flags */
.aitrfoel-lang-flag {
    display: inline-block;
    padding: 3px 7px;
    margin: 1px 2px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1;
    transition: transform 0.15s ease;
}

.aitrfoel-lang-flag:hover {
    transform: scale(1.1);
}

.aitrfoel-lang-exists {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.aitrfoel-lang-missing {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

/* Page Type Styling */
.aitrfoel-page-type {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    cursor: help;
    text-align: center;
    min-width: 60px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    transition: box-shadow 0.2s ease;
}

.aitrfoel-page-type:hover {
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.aitrfoel-page-elementor {
    background: #dbeafe;
    color: #1d4ed8;
}

.aitrfoel-page-gutenberg {
    background: #ede9fe;
    color: #6d28d9;
}

.aitrfoel-page-classic {
    background: #fef3c7;
    color: #92400e;
}

.aitrfoel-page-unknown {
    background: #f3f4f6;
    color: #666;
}

.aitrfoel-page-standard {
    background: #f3f4f6;
    color: #666;
}

/* Translation Status */
.aitrfoel-translation-status {
    color: #0073aa;
    font-weight: 500;
    font-size: 12px;
}

.aitrfoel-status-complete {
    color: #28a745;
    font-weight: 500;
    font-size: 12px;
}

.aitrfoel-translation-note {
    color: #666;
    font-style: italic;
    font-size: 11px;
    line-height: 1.3;
}

/* Checkboxes */
.aitrfoel-page-checkbox:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Action Buttons */
.aitrfoel-dashboard-wrapper .column-actions {
    white-space: nowrap;
}

/* Compact row actions: icon buttons + a "⋯" overflow menu */
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-row-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* Icon-only action buttons (Edit / View / More) */
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-act-icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-act-icon svg {
    width: 17px;
    height: 17px;
    display: block;
    fill: currentColor;
    flex-shrink: 0;
}

/* Self-contained ⋯ dots for the More button — no Dashicons font needed */
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-dots::before {
    content: "\2022\2022\2022";
    font-family: sans-serif;
    font-size: 11px;
    letter-spacing: 2px;
    line-height: 1;
    display: block;
}

/* Overflow menu (<details>) */
.aitrfoel-dashboard-wrapper .column-actions details.aitrfoel-row-more {
    position: relative;
    display: inline-block;
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-row-more-toggle {
    display: inline-flex;
    list-style: none;
    cursor: pointer;
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-row-more-toggle::-webkit-details-marker,
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-row-more-toggle::marker {
    display: none;
    content: "";
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-row-more-menu {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    z-index: 60;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 210px;
    padding: 6px;
    background: #fff;
    border: 1px solid #dcdcde;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.12);
    text-align: left;
}
.aitrfoel-dashboard-wrapper .column-actions details.aitrfoel-row-more:not([open]) .aitrfoel-row-more-menu {
    display: none;
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-menu-item {
    display: flex !important;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin: 0 !important;
    padding: 7px 10px !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    color: #1d2327 !important;
    font-size: 12px;
    line-height: 1.4;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transform: none !important;
    box-shadow: none !important;
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-menu-item:hover {
    background: #f0f0f1 !important;
    transform: none !important;
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-menu-item .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-menu-danger {
    color: #b32d2e !important;
}
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-menu-danger:hover {
    background: #fcf0f1 !important;
    color: #8a2424 !important;
}

.aitrfoel-dashboard-wrapper .column-actions .button {
    margin: 0 2px;
    font-size: 11px;
    padding: 4px 12px;
    height: auto;
    line-height: 1.4;
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-row-primary,
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-row-more-menu .button {
    display: inline-flex !important;
    align-items: center;
}

/* Review button — subtle cobalt outline */
.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-review-btn {
    color: #1447e6;
    border-color: #c7d4fc;
    background: #eef2fe;
}

.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-review-btn:hover {
    background: #dde6fd;
    border-color: #1447e6;
    color: #0f35b8;
}

.aitrfoel-dashboard-wrapper .column-actions .button:first-child {
    margin-left: 0;
}

.aitrfoel-dashboard-wrapper .column-actions .button:last-child {
    margin-right: 0;
}

/* Enhanced button styles */
.aitrfoel-dashboard-wrapper .column-actions .button:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.non-clickable {
    pointer-events: none;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .aitrfoel-dashboard-table .column-languages {
        width: 18%;
    }
    
    .aitrfoel-dashboard-table .column-status {
        width: 12%;
    }
    
    .aitrfoel-dashboard-table .column-page-type {
        width: 10%;
    }
}

@media (max-width: 1024px) {
    .aitrfoel-bulk-content {
        flex-direction: column;
        align-items: stretch;
        gap: 15px;
    }
    
    .aitrfoel-bulk-actions {
        margin-left: 0;
        justify-content: space-between;
    }
    
    .aitrfoel-dashboard-table .column-title {
        width: 40%;
    }
    
    .aitrfoel-dashboard-table .column-languages {
        width: 25%;
    }
}

@media (max-width: 768px) {
    .aitrfoel-tab-btn {
        padding: 10px 14px;
        font-size: 13px;
    }

    .aitrfoel-bulk-translation-bar {
        padding: 15px;
        top: auto;
        margin: 15px 0 15px 0; /* Reduced margins on mobile */
        position: static;
    }
    
    .aitrfoel-bulk-translation-bar.is-sticky {
        box-shadow: 0 2px 8px rgba(0,0,0,0.12);
        border-radius: 10px;
        margin-left: 0;
        margin-right: 0;
        padding-left: 15px;
        padding-right: 15px;
        position: static;
        top: auto;
    }
    
    .aitrfoel-bulk-languages {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 6px 8px;
    }
    
    .aitrfoel-source-languages,
    .aitrfoel-target-languages {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    
    .aitrfoel-bulk-languages label {
        font-size: 13px;
        margin-bottom: 0;
    }
    
    .aitrfoel-bulk-languages select,
    .aitrfoel-bulk-languages .button {
        width: auto;
        font-size: 13px;
        white-space: nowrap;
    }
    
    .aitrfoel-dashboard-table table {
        font-size: 14px;
    }
    
    .aitrfoel-dashboard-table .column-languages,
    .aitrfoel-dashboard-table .column-status,
    .aitrfoel-dashboard-table .column-page-type {
        display: none;
    }
    
    .aitrfoel-dashboard-table .column-title {
        width: 60%;
    }
    
    .aitrfoel-dashboard-table .column-actions {
        width: 30%;
    }
    
    /* Keep all action buttons visible on mobile */
    .aitrfoel-dashboard-wrapper .column-actions .button {
        display: inline-block;
    }
}

/* УДАЛЁН СТАРЫЙ КОД - НЕ НУЖЕН */

/* ==============================================
   КНОПКА ПЕРЕВОДА - BEST PRACTICES АНИМАЦИЯ  
   ============================================== */

/* Базовая кнопка перевода */
#aitrfoel-start-translation {
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
    border-radius: 6px;
    font-weight: 600;
    padding: 10px 20px;
    font-size: 14px;
}

/* СОСТОЯНИЕ ЗАГРУЗКИ - Движущиеся полосы + пульсация */
#aitrfoel-start-translation.loading {
    background: #1447E6 !important;
    background-size: 100% !important;
    animation: 
        movingStripes 1s linear infinite,
        pulseGlow 2s ease-in-out infinite !important;
    color: white !important;
    border-color: #0f35b8 !important;
    cursor: wait !important;
    transform: scale(1.02) !important;
    box-shadow: 0 4px 15px rgba(20, 71, 230, 0.4) !important;
    position: relative !important;
}

/* Add shimmer overlay effect for loading state */
#aitrfoel-start-translation.loading::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.4) 50%,
        transparent 100%
    );
    animation: shimmer 2s infinite;
}

@keyframes shimmer {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* =============================
 *  Tree/Dividers v2 (CSS-only)
 *  Scope: .aitrfoel-dashboard-wrapper.aitrfoel-tree-v2
 * ============================= */
.aitrfoel-dashboard-wrapper.aitrfoel-tree-v2 .wp-list-table {
    border-collapse: separate; /* avoid implicit merging */
    border-spacing: 0;         /* keep tight grid */
}

/* 2) Group frame (top/bottom) — draw on all cells except title to not cross the vertical line */
.aitrfoel-dashboard-wrapper.aitrfoel-tree-v2 .aitrfoel-source-page.expanded + .aitrfoel-translation-page td:not(.column-title),
.aitrfoel-dashboard-wrapper.aitrfoel-tree-v2 .aitrfoel-source-page.expanded + .aitrfoel-translation-page th {
    border-top: 0;
}
.aitrfoel-dashboard-wrapper.aitrfoel-tree-v2 .aitrfoel-translation-page.aitrfoel-group-last td:not(.column-title),
.aitrfoel-dashboard-wrapper.aitrfoel-tree-v2 .aitrfoel-translation-page.aitrfoel-group-last th {
    border-bottom: 0;
}



/* 4) Vertical connector and elbow in title column */
.aitrfoel-dashboard-wrapper.aitrfoel-tree-v2 .aitrfoel-translation-page .column-title {
    position: relative;
    padding-left: 0 !important;
    background-image: none; /* neutralize prior non-v2 background lines, v2 rules below will override */
}
.aitrfoel-dashboard-wrapper.aitrfoel-tree-v2 .aitrfoel-translation-page .column-title::before {
    content: none;
    position: absolute;
    left: 14px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e2e7f0;
    border-radius: 1px;
}
.aitrfoel-dashboard-wrapper.aitrfoel-tree-v2 .aitrfoel-translation-page.aitrfoel-group-last .column-title::before {
    bottom: calc(50% - 1px);
}

/* Translation bulk action bar */
#aitrfoel-translation-bulk-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 14px;
    margin: 0 0 8px;
    background: #fff8e1;
    border: 1px solid #f0c040;
    border-radius: 4px;
    font-size: 13px;
}
#aitrfoel-translation-selected-count {
    font-weight: 600;
    color: #5a3e00;
}
#aitrfoel-delete-translations-btn {
    background: #d63638;
    border-color: #b22223;
    color: #fff;
    font-weight: 600;
}
#aitrfoel-delete-translations-btn:hover:not(:disabled) {
    background: #b22223;
    border-color: #8b1a1a;
    color: #fff;
}
#aitrfoel-delete-translations-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Checkbox in translation rows */
.aitrfoel-translation-page .check-column,
.aitrfoel-translation-page td.check-column,
.aitrfoel-translation-page th.check-column {
    padding: 12px 10px 12px 15px !important;
}
.aitrfoel-translation-page .check-column input[type="checkbox"] {
    margin: 0 auto;
    display: block;
    cursor: pointer;
}




/* СОСТОЯНИЕ УСПЕХА - Яркое свечение + bounce */
#aitrfoel-start-translation.success {
    background: linear-gradient(135deg, #28a745 0%, #20c997 50%, #28a745 100%) !important;
    background-size: 200% 200% !important;
    border-color: #1e7e34 !important;
    color: white !important;
    font-weight: bold !important;
    animation: 
        successShine 2s ease-in-out,
        successBounce 0.6s ease-out !important;
    box-shadow: 0 6px 25px rgba(40, 167, 69, 0.6) !important;
    transform: scale(1.05) !important;
}

/* Анимация движущихся полос */
@keyframes movingStripes {
    0% { 
        background-position: 0 0; 
    }
    100% { 
        background-position: 30px 30px; 
    }
}

/* Пульсация во время загрузки */
@keyframes pulseGlow {
    0% { 
        box-shadow: 0 4px 15px rgba(0, 115, 170, 0.4);
    }
    50% { 
        box-shadow: 0 6px 25px rgba(0, 115, 170, 0.7);
    }
    100% { 
        box-shadow: 0 4px 15px rgba(0, 115, 170, 0.4);
    }
}

/* Переливающееся свечение успеха */
@keyframes successShine {
    0% { 
        background-position: 0% 0%;
        box-shadow: 0 6px 25px rgba(40, 167, 69, 0.6);
    }
    50% { 
        background-position: 100% 100%;
        box-shadow: 0 8px 35px rgba(40, 167, 69, 0.8);
    }
    100% { 
        background-position: 0% 0%;
        box-shadow: 0 6px 25px rgba(40, 167, 69, 0.6);
    }
}

/* Подпрыгивание при успехе */
@keyframes successBounce {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1.05); }
}

/* ==============================================
   МОДАЛЬНОЕ ОКНО УСПЕХА  
   ============================================== */

@keyframes fadeInModal {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideInModal {
    from { 
        opacity: 0;
        transform: translateY(-50px) scale(0.8);
    }
    to { 
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Translation Status Animations */
.aitrfoel-bulk-bar.processing {
    border-left: 4px solid #ffc107;
    background: linear-gradient(135deg, #fff3cd 0%, #fffbf0 100%);
    animation: pulse-processing 2s infinite ease-in-out;
}

@keyframes pulse-processing {
    0%, 100% { box-shadow: 0 2px 4px rgba(255, 193, 7, 0.2); }
    50% { box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4); }
}

.aitrfoel-bulk-bar.completed {
    border-left: 4px solid #28a745;
    background: linear-gradient(135deg, #d4edda 0%, #e8f5e8 100%);
    animation: success-flash 0.6s ease-out;
}

@keyframes success-flash {
    0% { transform: scale(1); }
    50% { transform: scale(1.02); }
    100% { transform: scale(1); }
}

.aitrfoel-bulk-bar.error {
    border-left: 4px solid #dc3545;
    background: linear-gradient(135deg, #f8d7da 0%, #fde7e9 100%);
    animation: error-shake 0.6s ease-out;
}

@keyframes error-shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

/* Table Update Animations */
.aitrfoel-table-updating {
    position: relative;
    overflow: hidden;
}

.aitrfoel-table-updating::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(0, 115, 170, 0.1),
        transparent
    );
    animation: table-update 1.5s ease-in-out;
}

@keyframes table-update {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* Row Update Animation */
.aitrfoel-row-updated {
    animation: row-highlight 1s ease-out;
}

@keyframes row-highlight {
    0% { background-color: #e3f2fd; }
    100% { background-color: transparent; }
}

/* Highlight animation for completed translation */
tr.aitrfoel-translation.highlight,
tr.aitrfoel-translation-page.aitrfoel-translation-highlight {
    background-color: #d4edda !important;
    animation: highlightFade 3s ease-out forwards;
    border-left: 4px solid #28a745 !important;
}

@keyframes highlightFade {
    0% { 
        background-color: #d4edda !important; 
        border-left-color: #28a745 !important;
    }
    100% { 
        background-color: transparent; 
        border-left-color: transparent;
    }
}

/* Highlight animation for newly created translated pages */
tr.aitrfoel-translation-page.aitrfoel-newly-created-highlight {
    background: linear-gradient(45deg, #28a745, #20c997) !important;
    animation: newPageHighlight 4s ease-out forwards !important;
    border-left: 5px solid #ffc107 !important;
    box-shadow: 0 4px 15px rgba(40, 167, 69, 0.3) !important;
    transform: scale(1.02) !important;
}

@keyframes newPageHighlight {
    0% { 
        background: linear-gradient(45deg, #28a745, #20c997) !important;
        border-left-color: #ffc107 !important;
        box-shadow: 0 4px 15px rgba(40, 167, 69, 0.3) !important;
        transform: scale(1.02) !important;
    }
    50% {
        background: linear-gradient(45deg, #20c997, #17a2b8) !important;
        border-left-color: #fd7e14 !important;
        box-shadow: 0 6px 20px rgba(32, 201, 151, 0.4) !important;
        transform: scale(1.03) !important;
    }
    100% { 
        background: transparent !important;
        border-left-color: transparent !important;
        box-shadow: none !important;
        transform: scale(1) !important;
    }
}

/* Animated progress with text and dots */
/* Simple animated dots for estimated words */
#aitrfoel-estimated-words.translating {
    color: #1447E6 !important;
    font-weight: 500;
}

#aitrfoel-estimated-words .aitrfoel-dots {
    display: inline-block;
    margin-left: 4px;
}

#aitrfoel-estimated-words .aitrfoel-dots .dot {
    opacity: 0;
    animation: dotBlink 1.5s infinite;
}

#aitrfoel-estimated-words .aitrfoel-dots .dot:nth-child(1) {
    animation-delay: 0s;
}

#aitrfoel-estimated-words .aitrfoel-dots .dot:nth-child(2) {
    animation-delay: 0.5s;
}

#aitrfoel-estimated-words .aitrfoel-dots .dot:nth-child(3) {
    animation-delay: 1s;
}

@keyframes dotBlink {
    0%, 80%, 100% { 
        opacity: 0;
    }
    40% { 
        opacity: 1;
    }
}

/* Bulk Translation States */
.aitrfoel-bulk-bar.processing .aitrfoel-bulk-actions button:not(.cancel) {
    opacity: 0.6;
    pointer-events: none;
}

.aitrfoel-bulk-bar.processing {
    border-left: 4px solid #ffc107;
    background: #fff3cd;
}

.aitrfoel-bulk-bar.completed {
    border-left: 4px solid #28a745;
    background: #d4edda;
}

.aitrfoel-bulk-bar.error {
    border-left: 4px solid #dc3545;
    background: #f8d7da;
}

/* Tooltips */
.aitrfoel-dashboard-wrapper [title]:not(#aitrfoel-select-source-language):not(#aitrfoel-select-languages):hover:after {
    content: attr(title);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: white;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 50;
    pointer-events: none;
}

/* Status Icons */
.aitrfoel-status-icon {
    width: 16px;
    height: 16px;
    display: inline-block;
    margin-right: 5px;
}

.aitrfoel-status-pending { color: #ffc107; }
.aitrfoel-status-processing { color: #17a2b8; }
.aitrfoel-status-completed { color: #28a745; }
.aitrfoel-status-failed { color: #dc3545; }

/* Simple Translation Status */
.aitrfoel-translation-status-compact {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #666;
    margin-left: 15px;
}

.aitrfoel-translation-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid #f3f3f3;
    border-radius: 50%;
    border-top: 2px solid #0073aa;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Animation */
@keyframes pulse {
    0% { opacity: 1; }
    50% { opacity: 0.5; }
    100% { opacity: 1; }
}

.aitrfoel-processing {
    animation: pulse 1.5s infinite;
}

/* Delete Button Styles - Scoped to dashboard */
.aitrfoel-dashboard-wrapper .aitrfoel-delete-page {
    background: transparent !important;
    border-color: #dc3545 !important;
    color: #dc3545 !important;
    transition: all 0.2s ease;
    margin-left: 0px !important;
}

.aitrfoel-dashboard-wrapper .aitrfoel-delete-page:hover {
    background: #dc3545 !important;
    border-color: #dc3545 !important;
    color: white !important;
}

.aitrfoel-dashboard-wrapper .aitrfoel-delete-page:disabled {
    background: transparent !important;
    border-color: #6c757d !important;
    color: #6c757d !important;
    opacity: 0.6;
    cursor: not-allowed;
}

.aitrfoel-dashboard-wrapper .column-actions {
    white-space: nowrap;
}

.aitrfoel-dashboard-wrapper .column-actions .button {
    margin-right: 5px;
}

.aitrfoel-dashboard-wrapper .column-actions .aitrfoel-delete-page {
    margin-right: 0;
    margin-left: 10px;
}

/* ==========================================================================
   Translation Settings Modal
   ========================================================================== */

/* Modal Overlay */
.aitrfoel-settings-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 160000;
    display: none;
    animation: fadeIn 0.3s ease;
}

.aitrfoel-settings-modal-overlay.show {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 16px;
    box-sizing: border-box;
}

/* Modal Container */
.aitrfoel-settings-modal {
    background: #fff;
    border-radius: 8px;
    width: 90%;
    max-width: 600px;
    max-height: calc(100vh - 32px);
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
    animation: modalSlideIn 0.3s ease;
    display: flex;
    flex-direction: column;
}

/* Modal Header */
.aitrfoel-settings-modal-header {
    padding: 20px 24px;
    border-bottom: 1px solid #ddd;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f8f9fa;
}

.aitrfoel-settings-modal-title {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #333;
}

.aitrfoel-settings-modal-close {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #666;
    padding: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.aitrfoel-settings-modal-close:hover {
    background: #e9ecef;
    color: #333;
}

/* Modal Body */
.aitrfoel-settings-modal-body {
    padding: 18px 20px;
    max-height: none;
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto;
}

.aitrfoel-settings-section {
    margin-bottom: 16px;
}

.aitrfoel-settings-section:last-child {
    margin-bottom: 0;
}

.aitrfoel-settings-label {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
    color: #333;
    font-size: 14px;
}

.aitrfoel-settings-description {
    font-size: 13px;
    color: #666;
    margin-bottom: 8px;
    line-height: 1.4;
}

/* Exclude Words Input */
.aitrfoel-exclude-words-container {
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 8px;
    min-height: 80px;
    max-height: 200px;
    overflow-y: auto;
    background: #fff;
    cursor: text;
    transition: border-color 0.2s ease;
}

.aitrfoel-exclude-words-container:focus-within {
    border-color: #0073aa;
    box-shadow: 0 0 0 1px #0073aa;
}

.aitrfoel-exclude-words-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.aitrfoel-exclude-chip {
    background: #0073aa;
    color: white;
    padding: 4px 8px;
    border-radius: 16px;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 6px;
    max-width: 200px;
}

.aitrfoel-exclude-chip-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.aitrfoel-exclude-chip-remove {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
    padding: 0;
    font-size: 14px;
    width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background 0.2s ease;
}

.aitrfoel-exclude-chip-remove:hover {
    background: rgba(255, 255, 255, 0.2);
}

.aitrfoel-exclude-words-input {
    border: none;
    outline: none;
    font-size: 13px;
    padding: 4px 0;
    width: 100%;
    min-width: 100px;
}

/* Smart Suggestions */
.aitrfoel-smart-suggestions {
    margin-top: 16px;
}

.aitrfoel-suggestions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.aitrfoel-suggestion-category {
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    padding: 12px;
    background: #f9f9f9;
}

.aitrfoel-suggestion-category-title {
    font-weight: 600;
    font-size: 12px;
    color: #555;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.aitrfoel-suggestion-items {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.aitrfoel-suggestion-item {
    background: none;
    border: 1px solid #ccc;
    border-radius: 12px;
    padding: 2px 8px;
    font-size: 11px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #666;
}

.aitrfoel-suggestion-item:hover {
    border-color: #0073aa;
    color: #0073aa;
    background: #f0f8ff;
}

.aitrfoel-suggestion-item.selected {
    background: #0073aa;
    color: white;
    border-color: #0073aa;
}

/* Modal Footer */
.aitrfoel-settings-modal-footer {
    padding: 12px 16px;
    border-top: 1px solid #ddd;
    background: #f8f9fa;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.aitrfoel-settings-preview {
    font-size: 12px;
    color: #666;
    max-width: 60%;
    line-height: 1.3;
}

.aitrfoel-settings-actions {
    display: flex;
    gap: 12px;
}

.aitrfoel-settings-cancel {
    background: none;
    border: 1px solid #ddd;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s ease;
}

.aitrfoel-settings-cancel:hover {
    border-color: #999;
    background: #f5f5f5;
}

.aitrfoel-settings-save {
    background: #0073aa;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    transition: background 0.2s ease;
}

.aitrfoel-settings-save:hover {
    background: #005a87;
}

.aitrfoel-settings-save:disabled {
    background: #ccc;
    cursor: not-allowed;
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes modalSlideIn {
    from { 
        opacity: 0;
        transform: translateY(-20px) scale(0.95);
    }
    to { 
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Stage Progress Indicator */
.aitrfoel-stage-progress {
    background: #f8f9fa;
    border: 1px solid #e1e3e6;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 12px;
    font-size: 13px;
}

.aitrfoel-stage {
    margin-bottom: 16px;
}

.aitrfoel-stage:last-child {
    margin-bottom: 0;
}

.aitrfoel-stage-header {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    gap: 8px;
}

.aitrfoel-stage-icon {
    font-size: 16px;
    width: 20px;
    text-align: center;
}

.aitrfoel-stage-title {
    font-weight: 600;
    color: #1d1d1f;
    flex: 1;
}

.aitrfoel-stage-status {
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.aitrfoel-stage-status.pending {
    background: #f3f4f6;
    color: #6b7280;
}

.aitrfoel-stage-status.active {
    background: #dbeafe;
    color: #1d4ed8;
    animation: aitrfoel-pulse 2s infinite;
}

.aitrfoel-stage-status.completed {
    background: #dcfce7;
    color: #15803d;
}

.aitrfoel-stage-status.error {
    background: #fee2e2;
    color: #dc2626;
}

.aitrfoel-stage-progress-bar {
    background: #e5e7eb;
    height: 4px;
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 6px;
}

.aitrfoel-stage-progress-fill {
    height: 100%;
    width: 0%;
    border-radius: 2px;
    transition: width 0.3s ease;
}

.aitrfoel-stage-1 .aitrfoel-stage-progress-fill {
    background: linear-gradient(90deg, #3b82f6, #1d4ed8);
}

.aitrfoel-stage-2 .aitrfoel-stage-progress-fill {
    background: linear-gradient(90deg, #10b981, #059669);
}

.aitrfoel-stage-description {
    font-size: 11px;
    color: #6b7280;
    line-height: 1.4;
}

@keyframes aitrfoel-pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.6;
    }
}

/* Hide stage progress by default, show when active */
.aitrfoel-stage-progress.active {
    display: block;
}

/* Show one stage at a time - hide pending stages that aren't next */
.aitrfoel-stage-progress .aitrfoel-stage.aitrfoel-stage-2.pending {
    display: none;
}

.aitrfoel-stage-progress .aitrfoel-stage.aitrfoel-stage-2.active,
.aitrfoel-stage-progress .aitrfoel-stage.aitrfoel-stage-2.completed {
    display: block;
}

/* When stage 1 is completed, show stage 2 */
.aitrfoel-stage-progress .aitrfoel-stage-1 .aitrfoel-stage-status.completed ~ .aitrfoel-stage-2 {
    display: block;
}

/* Information Card in Dashboard */
.aitrfoel-dashboard-wrapper .aitrfoel-card {
    margin-top: 30px;
    margin-bottom: 20px;
}

/* Two-column Information & Review Layout */
.aitrfoel-info-review-card {
    padding: 0 !important;
}

.aitrfoel-info-review-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

.aitrfoel-info-column,
.aitrfoel-review-column {
    padding: 20px 25px;
}

.aitrfoel-info-column {
    border-right: 1px solid #e0e0e0;
}

.aitrfoel-info-column h3,
.aitrfoel-review-column h3 {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 16px;
    font-weight: 600;
}

/* Review Column Specific Styles */
.aitrfoel-review-column {
    text-align: left;
}

.aitrfoel-review-content p {
    margin-bottom: 15px;
    line-height: 1.6;
    color: #555;
}

@media (max-width: 768px) {
    .aitrfoel-info-review-grid {
        grid-template-columns: 1fr;
    }
    
    .aitrfoel-info-column {
        border-right: none;
        border-bottom: 1px solid #e0e0e0;
    }
}

.aitrfoel-info-content {
    padding: 0;
}

.aitrfoel-info-content p {
    margin-bottom: 15px;
    line-height: 1.6;
    color: #555;
}

.aitrfoel-info-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.aitrfoel-info-buttons .button {
    text-decoration: none;
    transition: all 0.2s ease;
}

.aitrfoel-info-buttons .button:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

@media (max-width: 480px) {
    .aitrfoel-info-buttons {
        flex-direction: column;
    }
    
    .aitrfoel-info-buttons .button {
        text-align: center;
    }
}

#footer-left {
    display:none;
}
/* Mobile display fixes */
@media screen and (max-width: 782px) {
    .wp-list-table tr:not(.inline-edit-row):not(.no-items) td:not(.column-primary)::before {
        width: 1%;}}
/* ==========================================================================
   Pre-Analysis & Error Modals - Phase 2
   ========================================================================== */

/* Modal Overlay */
.aitrfoel-modal-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.7) !important;
    z-index: 999999 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Modal Content */
.aitrfoel-modal-content {
    background: #fff !important;
    border-radius: 8px;
    width: 90% !important;
    max-width: 700px !important;
    max-height: 90vh !important;
    overflow-y: auto;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3) !important;
    animation: modalSlideIn 0.3s ease;
    position: relative !important;
    padding: 24px !important;
    z-index: 1000000 !important;
}

/* Close Button */
.aitrfoel-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    background: none;
    border: none;
    font-size: 28px;
    cursor: pointer;
    color: #666;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s ease;
    line-height: 1;
}

.aitrfoel-modal-close:hover {
    background: #f0f0f0;
    color: #333;
}

/* ============================================
   Setup Checklist Widget
   ============================================ */
.aitrfoel-setup-checklist {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    animation: eatChecklistFadeIn 0.3s ease-out;
}

@keyframes eatChecklistFadeIn {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.aitrfoel-setup-checklist-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px 10px;
}

.aitrfoel-setup-checklist-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
}

.aitrfoel-setup-checklist-title .dashicons {
    color: #2271b1;
    font-size: 20px;
    width: 20px;
    height: 20px;
}

.aitrfoel-setup-checklist-progress-text {
    font-weight: 400;
    font-size: 12px;
    color: #94a3b8;
    margin-left: 4px;
}

.aitrfoel-setup-checklist-dismiss {
    background: none;
    border: none;
    cursor: pointer;
    color: #94a3b8;
    padding: 4px;
    border-radius: 4px;
    line-height: 1;
    transition: color 0.15s, background 0.15s;
}

.aitrfoel-setup-checklist-dismiss:hover {
    color: #64748b;
    background: #f1f5f9;
}

.aitrfoel-setup-checklist-dismiss .dashicons {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

.aitrfoel-setup-checklist-progress {
    height: 4px;
    background: #e2e8f0;
    margin: 0 20px 8px;
    border-radius: 2px;
    overflow: hidden;
}

.aitrfoel-setup-checklist-progress-bar {
    height: 100%;
    background: linear-gradient(90deg, #2271b1, #00a32a);
    border-radius: 2px;
    transition: width 0.4s ease;
}

.aitrfoel-setup-checklist-items {
    list-style: none;
    margin: 0;
    padding: 0 20px 14px;
}

.aitrfoel-setup-checklist-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
}

.aitrfoel-setup-checklist-item:last-child {
    border-bottom: none;
}

.aitrfoel-setup-check-icon {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.aitrfoel-setup-check-icon .dashicons-yes {
    color: #fff;
    background: #00a32a;
    border-radius: 50%;
    font-size: 16px;
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
}

.aitrfoel-setup-check-empty {
    display: block;
    width: 22px;
    height: 22px;
    border: 2px solid #cbd5e1;
    border-radius: 50%;
    box-sizing: border-box;
}

.aitrfoel-setup-check-content {
    flex: 1;
    min-width: 0;
}

.aitrfoel-setup-check-content strong {
    display: block;
    font-size: 13px;
    color: #1e293b;
    line-height: 1.3;
}

.aitrfoel-setup-checklist-item.is-complete .aitrfoel-setup-check-content strong {
    color: #64748b;
    text-decoration: line-through;
    text-decoration-color: #94a3b8;
}

.aitrfoel-setup-check-content p {
    margin: 2px 0 0;
    font-size: 12px;
    color: #94a3b8;
    line-height: 1.4;
}

/* ----------------------------------------------------------------
   Usage Pool Widget (word counter reframe)
   ---------------------------------------------------------------- */
.aitrfoel-usage-pool-stat {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-width: 180px;
}

.aitrfoel-pool-text {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

.aitrfoel-pool-label {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
}

.aitrfoel-pool-meta {
    font-size: 12px;
    color: #64748b;
    font-weight: 400;
}

.aitrfoel-pool-reset {
    font-size: 12px;
    color: #0ea5e9;
    font-weight: 500;
}

.aitrfoel-pool-bar {
    width: 100%;
    height: 4px;
    background: #e2e8f0;
    border-radius: 2px;
    overflow: hidden;
    min-width: 120px;
}

.aitrfoel-pool-bar-fill {
    height: 100%;
    background: #1447E6;
    border-radius: 2px;
    transition: width 0.4s ease;
}

.aitrfoel-pool-warning .aitrfoel-pool-bar-fill {
    background: #f59e0b;
}

.aitrfoel-pool-warning .aitrfoel-pool-label {
    color: #92400e;
}

.aitrfoel-pool-cooldown .aitrfoel-pool-bar-fill {
    background: #ef4444;
    width: 100% !important;
}

.aitrfoel-pool-cooldown .aitrfoel-pool-label {
    color: #991b1b;
}

.aitrfoel-pool-cooldown .aitrfoel-pool-reset {
    color: #dc2626;
    font-weight: 600;
}

/* Upgrade nudge pill */
.aitrfoel-usage-nudge {
    background: #fef3c7 !important;
    border: 1px solid #fde68a !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
}

.aitrfoel-nudge-text {
    font-size: 12px;
    color: #92400e;
    font-weight: 500;
}

.aitrfoel-nudge-btn {
    background: #1447E6;
    color: #fff;
    text-decoration: none;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    transition: background 0.15s;
}

.aitrfoel-nudge-btn:hover {
    background: #0f3bc4;
    color: #fff;
    text-decoration: none;
}

/* ----------------------------------------------------------------
   Empty-state hero (zero translations)
   ---------------------------------------------------------------- */
.aitrfoel-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 48px 24px 40px;
    margin: 0 0 24px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}

.aitrfoel-empty-icon {
    width: 72px;
    height: 72px;
    background: #eef2fe;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.aitrfoel-empty-title {
    font-size: 20px;
    font-weight: 700;
    color: #0e1116;
    margin: 0 0 10px;
    line-height: 1.3;
}

.aitrfoel-empty-body {
    font-size: 14px;
    color: #6b7280;
    max-width: 420px;
    margin: 0 0 24px;
    line-height: 1.6;
}

.aitrfoel-empty-cta {
    display: inline-block;
    background: #1447E6;
    color: #fff;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    padding: 10px 24px;
    border-radius: 8px;
    transition: background 0.15s, transform 0.1s;
    margin-bottom: 14px;
}

.aitrfoel-empty-cta:hover {
    background: #0f3bc4;
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
}

.aitrfoel-empty-hint {
    font-size: 12px;
    color: #9ca3af;
    margin: 0;
}

/* Metabox upgrade nudge */
.aitrfoel-mb-nudge {
    margin-top: 10px;
    padding: 8px 12px;
    background: #fef3c7;
    border: 1px solid #fde68a;
    border-radius: 6px;
    font-size: 13px;
    color: #92400e;
}

.aitrfoel-mb-nudge a {
    color: #1447E6;
    font-weight: 600;
    text-decoration: none;
}

.aitrfoel-mb-nudge a:hover {
    text-decoration: underline;
}

.aitrfoel-setup-checklist-item .button-small {
    flex-shrink: 0;
    white-space: nowrap;
}

.aitrfoel-setup-skip-btn.button-link {
    color: #94a3b8 !important;
    text-decoration: none !important;
    font-size: 12px;
    padding: 0 6px !important;
    box-shadow: none !important;
}

.aitrfoel-setup-skip-btn.button-link:hover {
    color: #64748b !important;
}

/* Responsive checklist */
@media (max-width: 600px) {
    .aitrfoel-setup-checklist-item {
        flex-wrap: wrap;
    }
    .aitrfoel-setup-checklist-item .button-small {
        margin-left: 34px;
        margin-top: 4px;
    }
}

/* WP admin dashboard widget variant */
.aitrfoel-setup-checklist--wp-dashboard {
    border: none;
    box-shadow: none;
    margin: 0;
    border-radius: 0;
    animation: none;
}

.aitrfoel-setup-checklist--wp-dashboard .aitrfoel-setup-checklist-progress {
    margin: 0 0 8px;
}

/* Analysis Panel */
.aitrfoel-analysis-panel h3 {
    margin: 0 0 20px 0;
    font-size: 22px;
    color: #333;
}

.aitrfoel-analysis-summary {
    background: #f8f9fa;
    border: 1px solid #e1e1e1;
    border-radius: 6px;
    padding: 16px;
    margin-bottom: 16px;
}

.aitrfoel-analysis-summary p {
    margin: 8px 0;
    font-size: 14px;
    color: #555;
}

.aitrfoel-analysis-summary strong {
    color: #2271b1;
    font-weight: 600;
}

/* Analysis Status */
.aitrfoel-analysis-status {
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 16px;
    font-weight: 600;
    text-align: center;
}

.aitrfoel-analysis-status.success {
    background: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.aitrfoel-analysis-status.error {
    background: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

/* Breakdown Table */
.aitrfoel-breakdown-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

.aitrfoel-breakdown-table thead th {
    background: #f8f9fa;
    padding: 10px;
    text-align: left;
    font-weight: 600;
    border-bottom: 2px solid #dee2e6;
    font-size: 13px;
    color: #495057;
}

.aitrfoel-breakdown-table tbody td {
    padding: 10px;
    border-bottom: 1px solid #dee2e6;
    font-size: 14px;
    color: #555;
}

.aitrfoel-breakdown-table tbody tr:last-child td {
    border-bottom: none;
}

.aitrfoel-breakdown-table tbody tr:hover {
    background: #f8f9fa;
}

/* Error Modal */
.aitrfoel-error-modal h3 {
    margin: 0 0 20px 0;
    font-size: 22px;
    color: #721c24;
}

.aitrfoel-error-message {
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 6px;
    padding: 16px;
    margin-bottom: 16px;
    color: #721c24;
}

.aitrfoel-error-message p {
    margin: 0;
    font-size: 14px;
}

.aitrfoel-error-stats {
    background: #fff3cd;
    border: 1px solid #ffeaa7;
    border-radius: 6px;
    padding: 16px;
    margin-bottom: 16px;
}

.aitrfoel-error-stats p {
    margin: 8px 0;
    font-size: 14px;
    color: #856404;
}

.aitrfoel-error-stats strong {
    color: #533f03;
    font-weight: 600;
}

.aitrfoel-error-stats .aitrfoel-progress-bar {
    height: 8px;
    background: #e9ecef;
    border-radius: 4px;
    overflow: hidden;
    margin-top: 8px;
}

.aitrfoel-error-stats .aitrfoel-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #28a745, #20c997);
    transition: width 0.3s ease;
}

.aitrfoel-error-details {
    background: #e7f3ff;
    border: 1px solid #b8daff;
    border-radius: 6px;
    padding: 16px;
    margin-bottom: 16px;
    color: #004085;
}

.aitrfoel-error-details p {
    margin: 8px 0;
    font-size: 14px;
}

/* Modal Actions */
.aitrfoel-modal-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #e1e1e1;
}

.aitrfoel-modal-actions .button {
    padding: 8px 20px;
    font-size: 14px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.aitrfoel-modal-actions .button-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(34, 113, 177, 0.3);
}

/* Mobile Responsiveness */
@media (max-width: 600px) {
    .aitrfoel-modal-content {
        width: 95%;
        max-height: 95vh;
        padding: 20px;
    }
    
    .aitrfoel-breakdown-table {
        font-size: 12px;
    }
    
    .aitrfoel-breakdown-table thead th,
    .aitrfoel-breakdown-table tbody td {
        padding: 8px;
    }
    
    .aitrfoel-modal-actions {
        flex-direction: column;
    }
    
    .aitrfoel-modal-actions .button {
        width: 100%;
    }
}

/* Dropdown styles */
.aitrfoel-dropdown-item {
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
}

.aitrfoel-dropdown-item:last-child {
    border-bottom: none;
}

.aitrfoel-dropdown-item:hover {
    background: #f5f5f5;
}

.aitrfoel-dropdown-item label {
    cursor: pointer;
    margin: 0;
    display: block;
}

.aitrfoel-dropdown-divider {
    height: 1px;
    background: #ddd;
    margin: 4px 0;
}
/* ==============================================
   CONTENT TYPE TABS (Pages / Posts)
   ============================================== */

.aitrfoel-content-tabs {
    margin-top: 20px;
}

.aitrfoel-tab-nav {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #e5e7eb;
    margin-bottom: 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.aitrfoel-tab-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    border: none;
    background: transparent;
    color: #6b7280;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    position: relative;
    bottom: -2px;
    border-bottom: 2px solid transparent;
    transition: all 0.2s ease;
    border-radius: 6px 6px 0 0;
    flex: 0 0 auto;
}

.aitrfoel-tab-btn:hover {
    color: #374151;
    background: #f9fafb;
}

.aitrfoel-tab-btn.active {
    color: #0073aa;
    border-bottom-color: #0073aa;
    background: #fff;
    font-weight: 600;
}

.aitrfoel-tab-btn .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    line-height: 16px;
}

.aitrfoel-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 11px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

.aitrfoel-tab-btn .aitrfoel-tab-count {
    background: #e5e7eb;
    color: #6b7280;
}

.aitrfoel-tab-btn.active .aitrfoel-tab-count {
    background: #dbeafe;
    color: #0073aa;
}

.aitrfoel-tab-panel {
    animation: tabFadeIn 0.25s ease-out;
}

@keyframes tabFadeIn {
    from {
        opacity: 0;
        transform: translateY(4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tab panel empty state */
.aitrfoel-tab-panel .aitrfoel-dashboard-table table tbody tr td[colspan] {
    padding: 40px 20px;
    text-align: center;
    color: #9ca3af;
    font-size: 14px;
}

/* Responsive tabs */
@media (max-width: 768px) {
    .aitrfoel-tab-btn {
        padding: 10px 16px;
        font-size: 13px;
        gap: 6px;
    }
    
    .aitrfoel-tab-count {
        min-width: 20px;
        height: 20px;
        font-size: 10px;
    }
}

/* Bulk actions bar for selected translation rows */
.aitrfoel-translation-bulk-bar {
    position: sticky;
    top: 32px;
    z-index: 20;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 14px;
    padding: 10px 14px;
    background: #fff;
    border: 1px solid #dcdcde;
    border-left: 4px solid #2271b1;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(14, 17, 22, 0.06);
}
.aitrfoel-translation-bulk-bar .aitrfoel-tbulk-count {
    font-size: 13px;
    color: #1d2327;
}
.aitrfoel-translation-bulk-bar .aitrfoel-tbulk-msg {
    font-size: 13px;
    color: #555;
}