/*
 * ZYNORA HR — Legacy Page Compatibility
 * Core shell rules now live in nexora-brand.css.
 * Existing page classes remain temporarily supported during phased migration.
 */
/* Shared ZYNORA page system - legacy class compatibility */
.nxr-page,
.nx-page,
.page-shell,
.hr-final-page {
    direction: rtl !important;
    color: var(--nx-text) !important;
}

.nxr-page {
    max-width: 100% !important;
}

.nxr-topline,
.nxr-profile-pro-topline,
.nxr-emp-hero {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 16px !important;
    padding: 18px !important;
    margin-bottom: 16px !important;
    border-radius: var(--nx-radius-lg) !important;
    border: 1px solid var(--nx-border-soft) !important;
    background:
        radial-gradient(circle at top right, rgba(25,211,224,.08), transparent 34%),
        rgba(9,27,47,.74) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.16) !important;
}

.nxr-title h1,
.nxr-profile-pro-topline h1,
.nxr-page h1 {
    margin: 0 !important;
    color: var(--nx-text) !important;
    font-size: 24px !important;
    font-weight: 1000 !important;
    line-height: 1.35 !important;
}

.nxr-title p,
.nxr-profile-pro-topline p,
.nxr-page p {
    color: var(--nx-muted) !important;
}

.nxr-brand-mini {
    color: var(--nx-gold) !important;
    font-size: 11px !important;
    letter-spacing: .05em !important;
    font-weight: 1000 !important;
    margin-bottom: 6px !important;
}

.nxr-actions {
    display: flex !important;
    gap: 9px !important;
    flex-wrap: wrap !important;
    align-items: center !important;
}

.nxr-btn,
.btn,
button.nxr-btn,
a.nxr-btn {
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 9px 14px !important;
    border-radius: 13px !important;
    border: 1px solid var(--nx-border) !important;
    background: rgba(12,34,58,.80) !important;
    color: var(--nx-text) !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.nxr-btn:hover,
.btn:hover {
    border-color: rgba(25,211,224,.42) !important;
    background: rgba(25,211,224,.10) !important;
    color: var(--nx-text) !important;
}

.nxr-btn.primary,
.btn-primary,
button[type="submit"].nxr-btn,
.nxr-btn.gold {
    color: #04141F !important;
    background: linear-gradient(135deg, var(--nx-teal), var(--nx-teal-2)) !important;
    border-color: transparent !important;
}

.nxr-btn.danger,
.btn-danger {
    background: rgba(255,107,107,.12) !important;
    border-color: rgba(255,107,107,.32) !important;
    color: #FFD8D8 !important;
}

.nxr-card,
.nxr-panel,
.nxr-kpi,
.nxr-score-card,
.nxr-table-wrap,
.nxr-emp-kpi,
.nxr-emp-filter-card,
.nxr-profile-hero,
.nxr-profile-pro-hero,
.card,
.table-card {
    border-radius: var(--nx-radius-lg) !important;
    border: 1px solid var(--nx-border-soft) !important;
    background:
        linear-gradient(180deg, rgba(12,34,58,.80), rgba(8,24,39,.82)) !important;
    color: var(--nx-text) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.16) !important;
}

.nxr-card,
.nxr-panel {
    padding: 16px !important;
}

.nxr-chip,
.badge,
.nxr-status {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 26px !important;
    padding: 5px 10px !important;
    border-radius: 999px !important;
    background: rgba(25,211,224,.10) !important;
    border: 1px solid rgba(25,211,224,.24) !important;
    color: var(--nx-teal-2) !important;
    font-size: 11px !important;
    font-weight: 950 !important;
}

.nxr-chip.gold,
.badge.gold {
    background: rgba(215,178,109,.12) !important;
    border-color: rgba(215,178,109,.28) !important;
    color: var(--nx-gold) !important;
}

.nxr-status.ok,
.badge.ok {
    background: rgba(85,217,138,.11) !important;
    border-color: rgba(85,217,138,.28) !important;
    color: #B6FFD1 !important;
}

.nxr-status.warn,
.badge.warn {
    background: rgba(247,185,85,.12) !important;
    border-color: rgba(247,185,85,.28) !important;
    color: #FFE3A6 !important;
}

.nxr-status.danger,
.badge.danger {
    background: rgba(255,107,107,.12) !important;
    border-color: rgba(255,107,107,.28) !important;
    color: #FFD2D2 !important;
}

.nxr-input,
input,
select,
textarea {
    min-height: 42px !important;
    border-radius: 13px !important;
    border: 1px solid var(--nx-border) !important;
    background: rgba(5,15,28,.58) !important;
    color: var(--nx-text) !important;
    padding: 9px 12px !important;
    font-family: var(--nx-font) !important;
    outline: none !important;
}

input::placeholder,
textarea::placeholder {
    color: rgba(167,183,200,.72) !important;
}

input:focus,
select:focus,
textarea:focus,
.nxr-input:focus {
    border-color: rgba(25,211,224,.58) !important;
    box-shadow: 0 0 0 4px rgba(25,211,224,.10) !important;
}

table {
    width: 100%;
    border-collapse: collapse;
    color: var(--nx-text) !important;
}

thead th,
.table thead th,
.nxr-table thead th {
    background: rgba(4,14,25,.72) !important;
    color: var(--nx-muted) !important;
    border-bottom: 1px solid var(--nx-border-soft) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
}

tbody td,
.table tbody td,
.nxr-table tbody td {
    border-bottom: 1px solid rgba(73,111,151,.16) !important;
    color: var(--nx-text) !important;
}

.text-danger,
.field-validation-error {
    color: #FFB4B4 !important;
    font-weight: 850 !important;
    font-size: 12px !important;
}

.nxr-success,
.alert-success {
    border-radius: 16px !important;
    border: 1px solid rgba(85,217,138,.30) !important;
    background: rgba(85,217,138,.10) !important;
    color: #D9FFE8 !important;
    padding: 12px 14px !important;
    margin-bottom: 14px !important;
    font-weight: 900 !important;
}

.nxr-error,
.alert-danger {
    border-radius: 16px !important;
    border: 1px solid rgba(255,107,107,.30) !important;
    background: rgba(255,107,107,.10) !important;
    color: #FFD2D2 !important;
    padding: 12px 14px !important;
    margin-bottom: 14px !important;
    font-weight: 900 !important;
}

/* Keep technical English readable without changing page direction */
.nexora-wordmark,
.nexora-tagline,
.nxr-code,
input[type="email"],
input[type="url"] {
    direction: ltr !important;
    unicode-bidi: isolate !important;
}

/* Stop old patch leftovers if any page still loads them */
.nxr-progress-card,
.nxr-readiness-hero,
.nxr-readiness-body {
    display: none !important;
}

.nxr-tabs,
.employee360v2-tabs {
    display: flex !important;
}

/* Mobile */
@media (max-width: 980px) {
    .nexora-shell {
        display: block !important;
    }

    .nexora-sidebar {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        min-height: auto !important;
        border-left: 0 !important;
        border-bottom: 1px solid var(--nx-border-soft) !important;
    }

    .nexora-topbar {
        position: relative !important;
        align-items: flex-start !important;
        flex-direction: column !important;
    }

    .nexora-content {
        padding: 14px !important;
    }

    .nxr-topline,
    .nxr-profile-pro-topline,
    .nxr-emp-hero {
        flex-direction: column !important;
    }

    .nxr-actions {
        width: 100% !important;
    }

    .nxr-btn {
        flex: 1 1 auto !important;
    }
}

/* ==========================================================================
   NEXORA_LIGHT_THEME_COMPAT — نسخة الثيم الفاتح (2026-07)
   كل قواعد هذا الملف كانت خلفيات دارك ثابتة بـ!important فتكسر
   data-theme="light" بكل الشاشات. هذا البلوك يقلبها للفاتح بنفس القوة.
   ========================================================================== */

html[data-theme="light"] .nxr-topline,
html[data-theme="light"] .nxr-profile-pro-topline,
html[data-theme="light"] .nxr-emp-hero {
    background: #ffffff !important;
    box-shadow: 0 10px 26px rgba(15, 40, 70, .08) !important;
}

html[data-theme="light"] .nxr-btn,
html[data-theme="light"] .btn,
html[data-theme="light"] button.nxr-btn,
html[data-theme="light"] a.nxr-btn {
    background: #ffffff !important;
    color: #0b2239 !important;
    border-color: rgba(15, 60, 100, .22) !important;
}

html[data-theme="light"] .nxr-btn:hover,
html[data-theme="light"] .btn:hover {
    background: rgba(13, 148, 158, .08) !important;
    color: #0b2239 !important;
}

/* الأزرار الرئيسية (تيل متدرج) تبقى كما هي — مقروءة على الثيمين */
html[data-theme="light"] .nxr-btn.primary,
html[data-theme="light"] .btn-primary,
html[data-theme="light"] button[type="submit"].nxr-btn,
html[data-theme="light"] .nxr-btn.gold {
    color: #04141F !important;
    background: linear-gradient(135deg, var(--nx-teal), var(--nx-teal-2)) !important;
}

html[data-theme="light"] .nxr-btn.danger,
html[data-theme="light"] .btn-danger {
    background: rgba(185, 28, 28, .08) !important;
    border-color: rgba(185, 28, 28, .3) !important;
    color: #b91c1c !important;
}

html[data-theme="light"] .nxr-card,
html[data-theme="light"] .nxr-panel,
html[data-theme="light"] .nxr-kpi,
html[data-theme="light"] .nxr-score-card,
html[data-theme="light"] .nxr-table-wrap,
html[data-theme="light"] .nxr-emp-kpi,
html[data-theme="light"] .nxr-emp-filter-card,
html[data-theme="light"] .nxr-profile-hero,
html[data-theme="light"] .nxr-profile-pro-hero,
html[data-theme="light"] .card,
html[data-theme="light"] .table-card {
    background: #ffffff !important;
    color: #0b2239 !important;
    box-shadow: 0 10px 26px rgba(15, 40, 70, .08) !important;
}

/* الشارات: درجات أغمق مقروءة على الأبيض */
html[data-theme="light"] .nxr-chip,
html[data-theme="light"] .badge,
html[data-theme="light"] .nxr-status {
    background: rgba(14, 116, 144, .1) !important;
    border-color: rgba(14, 116, 144, .25) !important;
    color: #0e7490 !important;
}
html[data-theme="light"] .nxr-chip.gold,
html[data-theme="light"] .badge.gold {
    background: rgba(161, 98, 7, .1) !important;
    border-color: rgba(161, 98, 7, .25) !important;
    color: #a16207 !important;
}
html[data-theme="light"] .nxr-status.ok,
html[data-theme="light"] .badge.ok {
    background: rgba(21, 128, 61, .1) !important;
    border-color: rgba(21, 128, 61, .25) !important;
    color: #15803d !important;
}
html[data-theme="light"] .nxr-status.warn,
html[data-theme="light"] .badge.warn {
    background: rgba(161, 98, 7, .1) !important;
    border-color: rgba(161, 98, 7, .25) !important;
    color: #a16207 !important;
}
html[data-theme="light"] .nxr-status.danger,
html[data-theme="light"] .badge.danger {
    background: rgba(185, 28, 28, .1) !important;
    border-color: rgba(185, 28, 28, .25) !important;
    color: #b91c1c !important;
}

/* الحقول: بيضاء بنص غامق — القاعدة الأهم (كانت تضرب كل التطبيق) */
html[data-theme="light"] .nxr-input,
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea {
    background: #ffffff !important;
    color: #0b2239 !important;
    border-color: rgba(15, 60, 100, .22) !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder {
    color: rgba(70, 95, 120, .6) !important;
}
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] .nxr-input:focus {
    border-color: rgba(13, 148, 158, .6) !important;
    box-shadow: 0 0 0 4px rgba(13, 148, 158, .1) !important;
}

/* رؤوس وخلايا الجداول العامة بالفاتح (كانت rgba(4,14,25,.72) ثابتة) */
html[data-theme="light"] thead th,
html[data-theme="light"] .table thead th,
html[data-theme="light"] .nxr-table thead th {
    background: #f3f7fa !important;
    color: #45607a !important;
    border-bottom-color: rgba(15, 60, 100, .14) !important;
}
html[data-theme="light"] tbody td,
html[data-theme="light"] .table tbody td,
html[data-theme="light"] .nxr-table tbody td {
    border-bottom-color: rgba(15, 60, 100, .1) !important;
}
html[data-theme="light"] .text-danger,
html[data-theme="light"] .field-validation-error { color: #b91c1c !important; }
html[data-theme="light"] .nxr-success,
html[data-theme="light"] .alert-success {
    border-color: rgba(21, 128, 61, .3) !important;
    background: rgba(21, 128, 61, .08) !important;
    color: #15803d !important;
}
html[data-theme="light"] .nxr-error,
html[data-theme="light"] .alert-danger {
    border-color: rgba(185, 28, 28, .3) !important;
    background: rgba(185, 28, 28, .08) !important;
    color: #b91c1c !important;
}