/* ==========================================================================
   SAS-CRM — ثيم احترافي حديث (فوق Bootstrap 5 RTL) — CSS خارجي ثابت، بدون build
   إعادة تصميم شاملة 2026-07-09
   ========================================================================== */

:root {
    --side-w: 264px;
    --topbar-h: 66px;

    --bg: #f5f7fb;
    --surface: #ffffff;
    --surface-2: #f8fafc;
    --ink: #0f172a;
    --ink-soft: #64748b;
    --ink-faint: #94a3b8;
    --line: #eceff4;
    --line-strong: #e2e8f0;

    --side-bg: #0f1629;
    --side-bg-2: #141d33;
    --side-ink: #93a1bd;
    --side-ink-hover: #eaf0fb;

    --brand: #4f46e5;
    --brand-2: #6366f1;

    --r-sm: 9px;
    --r: 12px;
    --r-lg: 16px;

    --shadow-xs: 0 1px 2px rgba(16,24,40,.05);
    --shadow-sm: 0 1px 3px rgba(16,24,40,.07), 0 1px 2px rgba(16,24,40,.05);
    --shadow: 0 8px 24px -8px rgba(16,24,40,.14);
    --shadow-lg: 0 24px 60px -20px rgba(16,24,40,.28);
}

/* اللون المحوري حسب الجارد */
[data-accent="primary"] { --accent:#4f46e5; --accent-2:#6366f1; --accent-soft:#eef2ff; --accent-ink:#4338ca; }
[data-accent="success"] { --accent:#0d9488; --accent-2:#14b8a6; --accent-soft:#effcf9; --accent-ink:#0f766e; }
[data-accent="danger"]  { --accent:#e11d48; --accent-2:#f43f5e; --accent-soft:#fff1f4; --accent-ink:#be123c; }

* { font-family: "Cairo", "Segoe UI", Tahoma, system-ui, sans-serif; }
html, body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body { letter-spacing: -.1px; color: var(--ink); }

/* ---------- عناصر Bootstrap الأساسية ---------- */
.btn { border-radius: var(--r-sm); font-weight: 600; --bs-btn-padding-y: .5rem; --bs-btn-padding-x: .95rem; transition: filter .15s, box-shadow .15s, background .15s; }
.btn:active { transform: translateY(.5px); }
.btn-primary { --bs-btn-bg: var(--accent, var(--brand)); --bs-btn-border-color: var(--accent, var(--brand)); --bs-btn-hover-bg: var(--accent-ink, #4338ca); --bs-btn-hover-border-color: var(--accent-ink, #4338ca); --bs-btn-active-bg: var(--accent-ink, #4338ca); box-shadow: 0 6px 16px -8px color-mix(in srgb, var(--accent, var(--brand)) 70%, transparent); }
.btn-success { --bs-btn-bg:#0d9488; --bs-btn-border-color:#0d9488; --bs-btn-hover-bg:#0f766e; --bs-btn-hover-border-color:#0f766e; }
.btn-danger  { --bs-btn-bg:#e11d48; --bs-btn-border-color:#e11d48; --bs-btn-hover-bg:#be123c; --bs-btn-hover-border-color:#be123c; }
.btn-light   { --bs-btn-bg:#fff; --bs-btn-border-color:var(--line-strong); --bs-btn-hover-bg:#f1f5f9; --bs-btn-color:var(--ink); }
.btn-outline-primary { --bs-btn-color: var(--accent-ink, var(--brand)); --bs-btn-border-color: color-mix(in srgb, var(--accent, var(--brand)) 42%, transparent); --bs-btn-hover-bg: var(--accent, var(--brand)); --bs-btn-hover-border-color: var(--accent, var(--brand)); }
.btn-outline-secondary { --bs-btn-color: var(--ink-soft); --bs-btn-border-color: var(--line-strong); --bs-btn-hover-bg:#f1f5f9; --bs-btn-hover-color: var(--ink); --bs-btn-hover-border-color: var(--line-strong); }
.btn-sm { --bs-btn-padding-y: .35rem; --bs-btn-padding-x: .6rem; --bs-btn-font-size: 13px; border-radius: 8px; }

.card { border-radius: var(--r-lg); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.card.border-0 { border: 1px solid var(--line) !important; }
.shadow-sm { box-shadow: var(--shadow-sm) !important; }

.form-control, .form-select { border-radius: var(--r-sm); padding: .58rem .8rem; border-color: var(--line-strong); color: var(--ink); font-size: 14.5px; }
.form-control::placeholder { color: var(--ink-faint); }
.form-control:focus, .form-select:focus { border-color: var(--accent, var(--brand)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, var(--brand)) 15%, transparent); }
.form-label { font-weight: 600; font-size: 13.5px; color: #374151; margin-bottom: .35rem; }
.input-group-text { border-radius: var(--r-sm); background: var(--surface-2); border-color: var(--line-strong); color: var(--ink-faint); }
.form-check-input:checked { background-color: var(--accent, var(--brand)); border-color: var(--accent, var(--brand)); }
.form-check-input:focus { border-color: var(--accent, var(--brand)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, var(--brand)) 15%, transparent); }
.badge { font-weight: 600; border-radius: 7px; padding: .38em .6em; }
.alert { border-radius: var(--r); border: 1px solid transparent; }
.alert-success { background:#effaf3; border-color:#c9efd8; color:#137a45; }
.alert-danger  { background:#fef2f3; border-color:#fbd0d5; color:#b42334; }
.alert-warning { background:#fff8ec; border-color:#fce4bd; color:#9a6a12; }
.alert-info    { background: var(--accent-soft,#eef2ff); border-color: color-mix(in srgb, var(--accent,#4f46e5) 22%, transparent); color: var(--accent-ink,#4338ca); }
hr { color: var(--line-strong); opacity: 1; }
a { color: var(--accent-ink, var(--brand)); }
.text-muted { color: var(--ink-soft) !important; }

/* =====================================================================
   شاشات الدخول (Auth) — تصميم مميّز حديث
   ===================================================================== */
.auth-shell { min-height: 100vh; display: flex; background: var(--bg); }

/* ---- اللوحة الجانبية (Brand) ---- */
.auth-aside {
    width: 46%; max-width: 660px; position: relative; color: #fff;
    padding: 54px 52px; display: flex; flex-direction: column; justify-content: space-between;
    overflow: hidden;
    background:
        radial-gradient(900px 520px at 85% -12%, rgba(255,255,255,.20), transparent 55%),
        radial-gradient(720px 520px at -12% 112%, rgba(0,0,0,.28), transparent 55%),
        linear-gradient(150deg, color-mix(in srgb, var(--accent, var(--brand)) 82%, #000) 0%, var(--accent, var(--brand)) 44%, #0b1120 138%);
}
/* شبكة نقطية خفيفة */
.auth-aside::before {
    content:""; position:absolute; inset:0; z-index:0;
    background-image: radial-gradient(rgba(255,255,255,.14) 1px, transparent 1.5px);
    background-size: 22px 22px; opacity:.5;
    -webkit-mask-image: linear-gradient(to bottom, #000, transparent 80%);
    mask-image: linear-gradient(to bottom, #000, transparent 80%);
}
.auth-aside::after { content:""; position:absolute; inset-inline-end:-130px; bottom:-150px; width:380px; height:380px; border-radius:50%; background:rgba(255,255,255,.06); z-index:0; }
.auth-aside > * { position:relative; z-index:1; }

.auth-aside .aside-top { display:flex; align-items:center; gap:13px; }
.auth-aside .aside-logo { width:54px; height:54px; border-radius:16px; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(8px); font-size:26px; box-shadow:0 10px 26px -12px rgba(0,0,0,.55); }
.auth-aside .aside-brand { font-weight:800; font-size:22px; letter-spacing:-.3px; }
.auth-aside .brand-img-auth { height:36px; width:auto; max-width:220px; object-fit:contain; display:block; filter:drop-shadow(0 4px 10px rgba(0,0,0,.25)); }

.auth-aside .aside-mid { margin:auto 0; }
.auth-aside .aside-mid h2 { font-size:33px; font-weight:800; line-height:1.36; margin:0 0 16px; letter-spacing:-.5px; }
.auth-aside .aside-mid p { color:rgba(255,255,255,.82); margin:0 0 30px; font-size:15.5px; line-height:1.85; max-width:44ch; }
.auth-features { list-style:none; padding:0; margin:0; display:grid; gap:12px; }
.auth-features li { display:flex; align-items:center; gap:14px; font-size:14.5px; font-weight:600; color:#fff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.13); padding:11px 15px; border-radius:14px; backdrop-filter:blur(4px); }
.auth-features i { width:38px; height:38px; border-radius:11px; background:rgba(255,255,255,.16); display:inline-flex; align-items:center; justify-content:center; font-size:18px; flex:none; }
.auth-aside .aside-foot { color:rgba(255,255,255,.6); font-size:12.5px; }

/* ---- منطقة الفورم ---- */
.auth-main {
    flex:1; display:flex; align-items:center; justify-content:center; padding:40px 24px; position:relative;
    background:
        radial-gradient(680px 480px at 100% 0%, color-mix(in srgb, var(--accent, var(--brand)) 7%, transparent), transparent 60%),
        var(--surface);
}
.auth-box {
    width:100%; max-width:436px; background:var(--surface); border:1px solid var(--line);
    border-radius:22px; padding:40px 38px;
}
@media (min-width:992px){ .auth-box { box-shadow:0 34px 76px -44px rgba(16,24,40,.4); } }
.auth-box .mobile-brand { display:none; text-align:center; margin-bottom:22px; }
.auth-box h1 { font-size:27px; font-weight:800; margin:0 0 7px; color:var(--ink); letter-spacing:-.4px; }
.auth-box .sub { color:var(--ink-soft); margin:0 0 26px; font-size:14.5px; }

/* الحقول — أيقونة مدمجة داخل حقل واحد */
.auth-box .form-label { font-weight:700; font-size:13.5px; color:#334155; margin-bottom:.4rem; }
.auth-box .input-group { border:1px solid var(--line-strong); border-radius:13px; overflow:hidden; background:var(--surface-2); transition:border-color .15s, box-shadow .15s, background .15s; }
.auth-box .input-group:focus-within { border-color:var(--accent, var(--brand)); background:#fff; box-shadow:0 0 0 4px color-mix(in srgb, var(--accent, var(--brand)) 14%, transparent); }
.auth-box .input-group-text { background:transparent; border:0; color:var(--ink-faint); padding-inline:14px; font-size:16px; }
.auth-box .input-group .form-control { border:0; background:transparent; padding:.82rem .4rem; font-size:15px; }
.auth-box .input-group .form-control:focus { box-shadow:none; background:transparent; }
.auth-box .auth-eye { cursor:pointer; transition:color .15s; }
.auth-box .auth-eye:hover { color:var(--ink); }
.auth-box .btn-lg { padding:.82rem 1rem; font-size:16px; border-radius:13px; border:0; background-image:linear-gradient(120deg, var(--accent, var(--brand)), var(--accent-2, var(--brand-2))); box-shadow:0 14px 30px -14px color-mix(in srgb, var(--accent, var(--brand)) 78%, transparent); }
.auth-box .btn-lg:hover { filter:brightness(1.06); }
.auth-box .form-check-label { color:var(--ink-soft); font-size:14px; }
.auth-box a { font-weight:600; }

/* شارة الأمان */
.auth-secure { display:flex; align-items:center; justify-content:center; gap:7px; margin-top:22px; color:var(--ink-faint); font-size:12.5px; }
.auth-secure i { color:#0d9488; }

/* مبدّل اللغة (Pills) */
.auth-lang { position:absolute; top:22px; inset-inline-end:28px; display:flex; gap:2px; align-items:center; z-index:5; background:var(--surface); border:1px solid var(--line-strong); border-radius:100px; padding:4px; box-shadow:var(--shadow-xs); }
.auth-lang a { text-decoration:none; font-size:13px; font-weight:700; padding:5px 13px; border-radius:100px; color:var(--ink-soft); transition:background .15s, color .15s; }
.auth-lang a:hover { color:var(--ink); }
.auth-lang a.active { background:var(--accent, var(--brand)); color:#fff; }

@media (max-width: 991.98px) {
    .auth-aside { display:none; }
    .auth-main { background:var(--bg); padding:26px 18px; }
    .auth-box { box-shadow:var(--shadow-lg); }
    .auth-box .mobile-brand { display:block; }
    .auth-box .mobile-brand .aside-logo { width:62px; height:62px; border-radius:18px; display:inline-flex; align-items:center; justify-content:center; font-size:29px; box-shadow: var(--shadow); }
}

/* =====================================================================
   تخطيط اللوحة
   ===================================================================== */
body.panel-body { margin:0; background:var(--bg); color:var(--ink); }
.app { display:flex; min-height:100vh; }

/* ---- Sidebar ---- */
.sidebar {
    width:var(--side-w); background:linear-gradient(190deg, var(--side-bg-2), var(--side-bg));
    color:var(--side-ink); position:fixed; top:0; inset-inline-start:0; bottom:0; z-index:1040;
    display:flex; flex-direction:column;
}
.sidebar-brand { height:var(--topbar-h); display:flex; align-items:center; gap:12px; padding:0 20px; border-bottom:1px solid rgba(255,255,255,.055); }
.sidebar-brand .brand-img { height:32px; width:auto; max-width:190px; object-fit:contain; display:block; }
.brand-logo { width:40px; height:40px; border-radius:11px; color:#fff; font-size:19px; display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(135deg, var(--accent, var(--brand)), var(--accent-2, var(--brand-2))); box-shadow:0 6px 16px -6px color-mix(in srgb, var(--accent, var(--brand)) 60%, transparent); }
.brand-text { font-weight:800; color:#fff; font-size:17px; letter-spacing:-.2px; }

.sidebar-nav { padding:14px 12px; flex:1; overflow-y:auto; overflow-x:hidden; }
.nav-section { font-size:10.5px; letter-spacing:.8px; text-transform:uppercase; color:#5a6889; margin:16px 12px 8px; font-weight:700; }
.nav-section:first-child { margin-top:2px; }
.nav-link-item {
    display:flex; align-items:center; gap:12px; padding:9.5px 13px; margin-bottom:2px;
    color:var(--side-ink); text-decoration:none; cursor:pointer; border-radius:10px;
    font-size:14.5px; font-weight:500; position:relative; transition:background .15s, color .15s;
}
.nav-link-item i { font-size:18px; width:22px; text-align:center; flex:none; opacity:.9; }
.nav-link-item span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nav-link-item:hover { background:rgba(255,255,255,.055); color:var(--side-ink-hover); }
.nav-link-item.active { background:color-mix(in srgb, var(--accent, var(--brand)) 26%, transparent); color:#fff; font-weight:600; }
.nav-link-item.active i { opacity:1; }
.nav-link-item.active::before { content:""; position:absolute; inset-inline-start:-12px; top:7px; bottom:7px; width:3px; border-radius:0 3px 3px 0; background:var(--accent-2, var(--brand-2)); }
[dir="ltr"] .nav-link-item.active::before { border-radius:3px 0 0 3px; }

.sidebar-foot { padding:12px; border-top:1px solid rgba(255,255,255,.055); }
.side-user { display:flex; align-items:center; gap:10px; padding:4px 6px 8px; }
.side-user .avatar { width:38px; height:38px; border-radius:11px; display:inline-flex; align-items:center; justify-content:center; font-weight:800; color:#fff; background:linear-gradient(135deg, var(--accent, var(--brand)), var(--accent-2, var(--brand-2))); flex:none; }
.side-user .meta { line-height:1.25; min-width:0; }
.side-user .meta .nm { color:#fff; font-weight:700; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.side-user .meta .em { color:#748099; font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* سكرول ناعم للسايد بار */
.sidebar-nav { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.14) transparent; }
.sidebar-nav::-webkit-scrollbar { width:7px; }
.sidebar-nav::-webkit-scrollbar-track { background:transparent; }
.sidebar-nav::-webkit-scrollbar-thumb { background:rgba(255,255,255,.12); border-radius:20px; border:2px solid transparent; background-clip:padding-box; }
.sidebar-nav:hover::-webkit-scrollbar-thumb { background:rgba(255,255,255,.22); background-clip:padding-box; }

/* ---- Main ---- */
.app-main { flex:1; margin-inline-start:var(--side-w); display:flex; flex-direction:column; min-width:0; }
.topbar {
    height:var(--topbar-h); background:rgba(255,255,255,.85); backdrop-filter:saturate(180%) blur(10px);
    border-bottom:1px solid var(--line); display:flex; align-items:center; gap:12px; padding:0 24px;
    position:sticky; top:0; z-index:1020;
}
.topbar .title-wrap { flex:1; min-width:0; }
.topbar .page-title { font-size:18px; font-weight:800; margin:0; color:var(--ink); letter-spacing:-.3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.topbar .page-sub { font-size:12px; color:var(--ink-soft); }
.icon-btn { width:40px; height:40px; border-radius:11px; border:1px solid var(--line-strong); background:#fff; color:var(--ink-soft); display:inline-flex; align-items:center; justify-content:center; font-size:18px; transition:background .15s, color .15s; }
.icon-btn:hover { background:var(--surface-2); color:var(--ink); }
.topbar-user { display:flex; align-items:center; gap:9px; border:1px solid var(--line-strong); background:#fff; border-radius:11px; padding:5px 11px 5px 6px; transition:background .15s; }
.topbar-user:hover { background:var(--surface-2); }
.topbar-user .avatar, .topbar .avatar { width:32px; height:32px; border-radius:9px; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:14px; background:linear-gradient(135deg, var(--accent, var(--brand)), var(--accent-2, var(--brand-2))); flex:none; }
.topbar .dropdown-menu { border:1px solid var(--line-strong); border-radius:var(--r); box-shadow:var(--shadow); padding:6px; margin-top:8px; }
.topbar .dropdown-item { border-radius:8px; padding:.5rem .7rem; font-size:14px; }
.topbar .dropdown-item.active { background: var(--accent-soft, #eef2ff); color: var(--accent-ink, var(--brand)); }

.app-content { padding:26px 24px 40px; flex:1; max-width:1500px; width:100%; margin:0 auto; }

/* ---- Page header ---- */
.page-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:20px; }
.page-head h1 { font-size:21px; font-weight:800; margin:0; letter-spacing:-.3px; }
.page-head .crumbs { font-size:13px; color:var(--ink-soft); }

/* ---- Welcome banner ---- */
.welcome {
    border-radius:var(--r-lg); padding:26px 28px; color:#fff; margin-bottom:22px; position:relative; overflow:hidden;
    background:radial-gradient(900px 400px at 88% -50%, rgba(255,255,255,.18), transparent 60%),
               linear-gradient(120deg, var(--accent, var(--brand)), var(--accent-2, var(--brand-2)));
    box-shadow:0 16px 40px -18px color-mix(in srgb, var(--accent, var(--brand)) 65%, transparent);
}
.welcome::after { content:""; position:absolute; inset-inline-start:-40px; bottom:-90px; width:230px; height:230px; border-radius:50%; background:rgba(255,255,255,.10); }
.welcome h2 { font-size:23px; font-weight:800; margin:0 0 6px; position:relative; }
.welcome p { margin:0; color:rgba(255,255,255,.9); position:relative; font-size:14.5px; }
.welcome .actions { margin-top:18px; position:relative; display:flex; gap:10px; flex-wrap:wrap; }
.welcome .btn-light { font-weight:700; color:var(--accent-ink, var(--brand)); border-color:transparent; }
.welcome .btn-glass { background:rgba(255,255,255,.16); color:#fff; border:1px solid rgba(255,255,255,.28); font-weight:600; }
.welcome .btn-glass:hover { background:rgba(255,255,255,.26); color:#fff; }

/* ---- Stat cards ---- */
.stat-card { background:var(--surface); border-radius:var(--r-lg); padding:20px; border:1px solid var(--line); box-shadow:var(--shadow-sm); height:100%; transition:transform .16s, box-shadow .16s; }
.stat-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); }
.stat-card .stat-top { display:flex; align-items:center; justify-content:space-between; }
.stat-card .stat-icon { width:48px; height:48px; border-radius:13px; display:inline-flex; align-items:center; justify-content:center; font-size:22px; color:#fff; }
.stat-card .stat-num { font-size:28px; font-weight:800; margin:14px 0 2px; letter-spacing:-.5px; }
.stat-card .stat-lbl { color:var(--ink-soft); font-size:13.5px; }
.ic-primary { background:linear-gradient(135deg,#6366f1,#818cf8); }
.ic-success { background:linear-gradient(135deg,#0d9488,#2dd4bf); }
.ic-info    { background:linear-gradient(135deg,#0891b2,#22d3ee); }
.ic-danger  { background:linear-gradient(135deg,#e11d48,#fb7185); }
.ic-warning { background:linear-gradient(135deg,#d97706,#fbbf24); }
.ic-secondary { background:linear-gradient(135deg,#475569,#94a3b8); }

/* ---- Cards / sections ---- */
.card-title-row { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--line); }
.card-title-row h3 { font-size:15px; font-weight:700; margin:0; }

/* =====================================================================
   الجداول — أنظف وأهدأ + أزرار إجراءات مدمجة
   ===================================================================== */
.table { margin:0; color:var(--ink); --bs-table-bg:transparent; }
.table > :not(caption) > * > * { padding:12px 16px; border-bottom-color:var(--line); }
.table thead th { background:var(--surface-2); color:var(--ink-soft); font-size:12px; font-weight:700; letter-spacing:.2px; border-bottom:1px solid var(--line-strong); border-top:0; white-space:nowrap; text-transform:none; }
.table tbody td { vertical-align:middle; font-size:14px; }
.table tbody tr:last-child > * { border-bottom:0; }
.table.table-hover tbody tr:hover > * { background:color-mix(in srgb, var(--accent,#4f46e5) 4%, #fff); }
.table a { font-weight:600; text-decoration:none; }
.table a:hover { text-decoration:underline; }

/* أزرار الإجراءات داخل الجداول — مدمجة وأنيقة (تناسب الأيقونة فقط أو أيقونة+نص) */
.table-actions { display:inline-flex; gap:6px; align-items:center; justify-content:flex-end; flex-wrap:wrap; }
.table-actions form { display:inline-flex; margin:0; }
.table-actions .btn {
    --bs-btn-padding-y:.4rem; --bs-btn-padding-x:.55rem; --bs-btn-font-size:13.5px;
    border-radius:9px; line-height:1; display:inline-flex; align-items:center; gap:5px; min-height:33px;
}
.table-actions .btn > i { font-size:15px; }

.empty-state { text-align:center; padding:44px 20px; color:var(--ink-soft); }
.empty-state i { font-size:38px; opacity:.35; display:block; margin-bottom:10px; }

/* ---- شريط الدخول الخفي ---- */
.impersonate-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; background:linear-gradient(120deg,#d97706,#f59e0b); color:#fff; border-radius:var(--r); padding:11px 18px; margin-bottom:18px; box-shadow:var(--shadow-sm); font-size:14.5px; }
.impersonate-bar strong { font-weight:800; }

/* =====================================================================
   DataTables 2.x + Bootstrap 5 + RTL — تخصيص هادئ
   ===================================================================== */
.dt-container { padding:16px 18px 10px; }
.dt-container .dt-layout-row { align-items:center; row-gap:12px; margin:0 0 14px; }
.dt-container .dt-length, .dt-container .dt-search { display:flex; align-items:center; gap:8px; }
.dt-container label { color:var(--ink-soft); font-size:13.5px; font-weight:600; margin:0; }
.dt-container select.dt-input, .dt-container .dt-length select { width:auto; min-width:74px; border-radius:9px; border:1px solid var(--line-strong); padding:.42rem 1.9rem .42rem .7rem; background-color:#fff; font-size:14px; color:var(--ink); }
.dt-container input.dt-input, .dt-container .dt-search input { width:auto; min-width:230px; border-radius:9px; border:1px solid var(--line-strong); padding:.5rem .85rem; font-size:14px; }
.dt-container input.dt-input:focus, .dt-container select.dt-input:focus { outline:none; border-color:var(--accent, var(--brand)); box-shadow:0 0 0 3px color-mix(in srgb, var(--accent, var(--brand)) 14%, transparent); }

table.dataTable { border-collapse:separate; border-spacing:0; margin:0 !important; width:100% !important; }
table.dataTable thead th { background:var(--surface-2); color:var(--ink-soft); font-size:12px; font-weight:700; border-top:1px solid var(--line); border-bottom:1px solid var(--line-strong); padding:12px 16px; white-space:nowrap; position:relative; }
table.dataTable tbody td { padding:12px 16px; border-bottom:1px solid var(--line); vertical-align:middle; font-size:14px; }
table.dataTable tbody tr:last-child td { border-bottom:0; }
table.dataTable tbody tr:hover > * { background:color-mix(in srgb, var(--accent,#4f46e5) 4%, #fff); }

/* المحاذاة: النص للبداية (يمين في RTL) والإجراءات للنهاية — أنظف من التوسيط القسري */
table.dataTable thead th, table.dataTable tbody td { text-align:start; }
table.dataTable thead th.text-end, table.dataTable td.text-end { text-align:end !important; }
table.dataTable td .table-actions { justify-content:flex-end; }

/* أيقونات الترتيب */
table.dataTable thead th.dt-orderable-asc, table.dataTable thead th.dt-orderable-desc { cursor:pointer; }
table.dataTable thead .dt-column-order::before, table.dataTable thead .dt-column-order::after { opacity:.3; }
table.dataTable thead th.dt-ordering-asc .dt-column-order::before, table.dataTable thead th.dt-ordering-desc .dt-column-order::after { opacity:1; color:var(--accent, var(--brand)); }

/* المعلومات + الترقيم */
.dt-container .dt-layout-row:last-child { margin-top:6px; }
.dt-container .dt-info { color:var(--ink-soft); font-size:13px; }
.dt-container .pagination { margin:0; justify-content:flex-end; gap:4px; }
.dt-container .page-link { border-radius:9px !important; border:1px solid var(--line-strong); color:var(--ink); padding:.38rem .75rem; font-size:14px; font-weight:600; }
.dt-container .page-item.active .page-link { background:var(--accent, var(--brand)); border-color:var(--accent, var(--brand)); color:#fff; box-shadow:none; }
.dt-container .page-item.disabled .page-link { color:#c2cbda; }
.dt-container .page-link:hover { background:var(--accent-soft,#eef2ff); border-color:var(--accent, var(--brand)); color:var(--accent-ink, var(--brand)); }
.dataTables_wrapper { padding:16px 18px 10px; }

/* ---- Mobile ---- */
.sidebar-backdrop { display:none; }
@media (max-width: 991.98px) {
    .sidebar { transform:translateX(100%); transition:transform .22s ease; box-shadow:var(--shadow-lg); }
    [dir="ltr"] .sidebar { transform:translateX(-100%); }
    .sidebar.open, [dir="ltr"] .sidebar.open { transform:translateX(0); }
    .app-main { margin-inline-start:0; }
    .app-content { padding:18px 16px 32px; }
    .sidebar-backdrop.show { display:block; position:fixed; inset:0; background:rgba(15,23,42,.5); z-index:1035; backdrop-filter:blur(2px); }
    .dt-container input.dt-input, .dt-container .dt-search input { min-width:150px; }
}

/* =====================================================================
   Select2 — مطابقة لثيم النماذج (RTL + accent)
   ===================================================================== */
.select2-container { width: 100% !important; }
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border: 1px solid var(--line-strong); border-radius: var(--r-sm);
    background: var(--surface); min-height: 40px; color: var(--ink);
}
.select2-container--default .select2-selection--single { display:flex; align-items:center; }
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--ink); line-height: 1.4; padding: .5rem .8rem; font-size: 14.5px; flex:1;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--ink-faint); }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 100%; top: 0; }
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow { left: 8px; right: auto; }

.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--multiple {
    border-color: var(--accent, var(--brand));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, var(--brand)) 15%, transparent);
}

.select2-container--default .select2-selection--multiple { padding: 3px 6px; }
.select2-container--default .select2-selection--multiple .select2-selection__rendered { padding: 0; display:flex; flex-wrap:wrap; gap:4px; }
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background: var(--accent-soft, #eef2ff);
    border: 1px solid color-mix(in srgb, var(--accent,#4f46e5) 25%, transparent);
    color: var(--accent-ink, var(--brand)); border-radius: 7px; padding: 3px 9px;
    font-size: 13px; font-weight: 600; margin: 2px 0; display:inline-flex; align-items:center; gap:4px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: var(--accent-ink, var(--brand)); border:0; background:transparent; font-size:16px; padding:0; order:2; margin:0;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { background:transparent; color: var(--accent-ink); }
.select2-container--default .select2-search--inline .select2-search__field { margin:0; font-size:14.5px; color: var(--ink); }

.select2-container--default .select2-selection__clear { color: var(--ink-faint); font-weight:700; margin:0 6px; }

.select2-dropdown { border:1px solid var(--line-strong); border-radius: var(--r); box-shadow: var(--shadow); overflow:hidden; }
.select2-container--default .select2-results__option { padding:8px 12px; font-size:14px; color: var(--ink); }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--accent, var(--brand)); color:#fff; }
.select2-container--default .select2-results__option[aria-selected=true] { background: var(--accent-soft, #eef2ff); color: var(--accent-ink, var(--brand)); }
.select2-search--dropdown { padding:8px; }
.select2-search--dropdown .select2-search__field { border:1px solid var(--line-strong); border-radius: var(--r-sm); padding:.5rem .7rem; font-size:14px; outline:none; }
.select2-search--dropdown .select2-search__field:focus { border-color: var(--accent, var(--brand)); }

/* ===== أزرار إجراءات ملوّنة ثابتة (تعديل / دومينات) ===== */
.btn-outline-edit {
    --bs-btn-bg: transparent; --bs-btn-color: #7c3aed;
    --bs-btn-border-color: color-mix(in srgb, #7c3aed 42%, transparent);
    --bs-btn-hover-bg: #7c3aed; --bs-btn-hover-border-color: #7c3aed; --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #7c3aed; --bs-btn-active-border-color: #7c3aed; --bs-btn-active-color: #fff;
}
.btn-outline-domain {
    --bs-btn-bg: transparent; --bs-btn-color: #0891b2;
    --bs-btn-border-color: color-mix(in srgb, #0891b2 42%, transparent);
    --bs-btn-hover-bg: #0891b2; --bs-btn-hover-border-color: #0891b2; --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #0891b2; --bs-btn-active-border-color: #0891b2; --bs-btn-active-color: #fff;
}
