/* ITQAN base layout */
[lang="ar"], [lang="ar"] * { font-family: 'Tajawal', 'Segoe UI', Tahoma, sans-serif; }
[lang="en"], [lang="en"] * { font-family: 'Inter', 'Segoe UI', system-ui, sans-serif; }

:root { --itqan-primary: #0b3d91; --itqan-primary-d: #092f70; --itqan-brand-graphite: #202124; --itqan-brand-copper: #b78642; --sidebar-w: 260px; --topbar-h: 56px; }
html { min-height: 100%; }
body { min-height: 100%; padding-top: var(--topbar-h); background: #f4f6fb; color: #1f2937; }
.itqan-navbar { background: var(--itqan-primary) !important; min-height: var(--topbar-h); }
.itqan-topbar { position: relative; min-height: var(--topbar-h); }
.itqan-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 128px;
    height: 48px;
    padding: .1rem 0;
}
.itqan-brand-logo {
    display: block;
    max-width: 100%;
    object-fit: contain;
}
.itqan-brand-logo--navbar {
    width: 128px;
    height: 44px;
}
.itqan-brand-logo--offcanvas {
    width: 118px;
    height: 54px;
}
[dir="rtl"] .itqan-topbar-brand { position: absolute; right: 1.25rem; top: 50%; transform: translateY(-50%); margin-left: 0 !important; }
[dir="rtl"] .itqan-topbar-actions { position: absolute; left: 1.25rem; top: 50%; transform: translateY(-50%); flex-direction: row-reverse; }
[dir="ltr"] .itqan-topbar-brand { margin-left: auto !important; }
.company-switch-form { display: inline-flex; align-items: center; gap: .4rem; min-width: 14rem; height: 32px; padding: 0 .55rem; border: 1px solid rgba(255,255,255,.5); border-radius: 6px; background: rgba(255,255,255,.06); color: #f8fafc; }
.company-switch-icon { font-size: .9rem; flex-shrink: 0; }
.company-switch-select { min-width: 0; width: 100%; color: #f8fafc; background: transparent; border: 0; font-size: .83rem; font-weight: 600; outline: 0; }
.company-switch-select option { color: #111827; background: #fff; }
.company-switch-form:focus-within { box-shadow: 0 0 0 3px rgba(219,234,254,.28); border-color: #dbeafe; }
.itqan-shell { display: flex; min-height: calc(100vh - var(--topbar-h)); }
.itqan-sidebar { position: fixed; top: var(--topbar-h); bottom: 0; width: var(--sidebar-w); overflow-y: auto; overflow-x: hidden; background: #fff; border-inline-end: 1px solid #e2e8f0; z-index: 200; }
[dir="ltr"] .itqan-sidebar { left: 0; }
[dir="rtl"] .itqan-sidebar { right: 0; }
body.sidebar-collapsed .itqan-sidebar { display: none !important; }
body.sidebar-collapsed .itqan-content { margin-inline-start: 0 !important; }
.active-toggle { background: rgba(255,255,255,.15) !important; }
.itqan-offcanvas { width: var(--sidebar-w) !important; }
.itqan-content { flex: 1; min-width: 0; padding: 1.5rem; margin-inline-start: var(--sidebar-w); }
@media (max-width: 991.98px) { .itqan-content { margin-inline-start: 0; padding: 1rem; } }
.itqan-content > .alert.alert-dismissible,
.gl-page > .alert.alert-dismissible {
  position: relative;
  display: block;
  padding-inline-start: .75rem;
  padding-inline-end: 2.75rem;
}
.itqan-content > .alert.alert-dismissible .btn-close,
.gl-page > .alert.alert-dismissible .btn-close {
  position: absolute;
  top: 50%;
  inset-inline-end: .75rem;
  width: .9rem;
  height: .9rem;
  padding: .35rem;
  transform: translateY(-50%);
}

.itqan-sidenav { padding: .5rem 0 2rem; }
.sidenav-item { display: flex; align-items: center; gap: .6rem; padding: .45rem 1rem; color: #374151; text-decoration: none; font-size: .875rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidenav-item:hover { background: #eff6ff; color: var(--itqan-primary); }
.sidenav-item.active { background: #dbeafe; color: var(--itqan-primary); font-weight: 700; border-inline-start: 3px solid var(--itqan-primary); }
.sidenav-icon { font-size: 1rem; flex-shrink: 0; color: #6b7280; }
.sidenav-icon--compact { width: 1rem; font-size: .86rem; flex-shrink: 0; color: #6b7280; text-align: center; }
.sidenav-item:hover .sidenav-icon, .sidenav-item.active .sidenav-icon { color: var(--itqan-primary); }
.sidenav-item:hover .sidenav-icon--compact, .sidenav-item.active .sidenav-icon--compact { color: var(--itqan-primary); }
.sidenav-group-header { display: flex; align-items: center; gap: .6rem; width: 100%; padding: .55rem 1rem; margin-top: .5rem; background: transparent; border: 0; text-align: start; color: #6b7280; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.sidenav-group-header:hover { color: var(--itqan-primary); }
.sidenav-group-header .sidenav-chevron { margin-inline-start: auto; color: #9ca3af; font-size: .7rem; transition: transform .08s ease-out; }
.sidenav-group-header:not(.collapsed) .sidenav-chevron { transform: rotate(180deg); }
.itqan-sidebar .collapsing,
.itqan-offcanvas .collapsing { transition-duration: .01s !important; }
.sidenav-sub { padding-inline-start: .75rem; }
.sidenav-sub .sidenav-item { font-size: .84rem; font-weight: 400; padding-block: .38rem; }

.page-header { display: flex; align-items: center; justify-content: space-between; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: 1px solid #e2e8f0; }
.page-header h1 { margin: 0; font-size: 1.35rem; font-weight: 700; color: #111827; }
.stat-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; padding: 1.25rem 1.5rem; box-shadow: 0 1px 4px rgba(0,0,0,.05); }
.stat-card .stat-label { font-size: .75rem; font-weight: 700; color: #6b7280; text-transform: uppercase; letter-spacing: .05em; }
.stat-card .stat-value { font-size: 1.6rem; font-weight: 700; color: #111827; margin-top: .3rem; }
.stat-card .stat-icon { font-size: 2rem; color: var(--itqan-primary); opacity: .8; }

.itqan-table { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.04); }
.itqan-table table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.itqan-table th, table.grid th, table.table thead th { background: #f8fafc; padding: .6rem .9rem; color: #374151; font-weight: 600; border-bottom: 2px solid #e2e8f0; text-align: start; white-space: nowrap; }
.itqan-table td, table.grid td { padding: .55rem .9rem; border-bottom: 1px solid #f1f5f9; color: #1f2937; vertical-align: middle; }
table.grid { width: 100%; border-collapse: collapse; background: #fff; font-size: .875rem; }
table.grid th, table.grid td { text-align: start; }
.itqan-table tbody tr:nth-child(odd) td, .itqan-table tbody tr:nth-child(odd) th, table.grid tbody tr:nth-child(odd) td, table.grid tbody tr:nth-child(odd) th, table.table tbody tr:nth-child(odd) td, table.table tbody tr:nth-child(odd) th { background-color: #ffffff; }
.itqan-table tbody tr:nth-child(even) td, .itqan-table tbody tr:nth-child(even) th, table.grid tbody tr:nth-child(even) td, table.grid tbody tr:nth-child(even) th, table.table tbody tr:nth-child(even) td, table.table tbody tr:nth-child(even) th { background-color: #eaf7ff; }
.itqan-table tbody tr:hover td, .itqan-table tbody tr:hover th, table.grid tbody tr:hover td, table.grid tbody tr:hover th, table.table tbody tr:hover td, table.table tbody tr:hover th { background-color: #dff1ff !important; }
.itqan-table tbody tr:focus, table.grid tbody tr:focus, table.table tbody tr:focus, .gl-grid-row:focus, .gl-acct-row:focus { outline: 2px solid var(--itqan-primary); outline-offset: -2px; }

.field { display: flex; flex-direction: column; gap: .3rem; margin-bottom: 1rem; max-width: 500px; }
.field label { font-size: .875rem; font-weight: 600; color: #374151; }
.field input, .field select, .field textarea { padding: .45rem .75rem; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; font-size: .9rem; }
.field input:focus, .field select:focus, .field textarea:focus { outline: 0; border-color: var(--itqan-primary); box-shadow: 0 0 0 3px rgba(11,61,145,.12); }
button[type=submit]:not(.btn):not(.sidenav-group-header):not(.navbar-toggler), a.btn:not([class*="btn-"]), .btn-action { display: inline-flex; align-items: center; gap: .3rem; padding: .45rem 1rem; background: var(--itqan-primary); color: #fff; border: 1px solid transparent; border-radius: 6px; font-size: .875rem; font-weight: 500; text-decoration: none; }
button[type=submit]:not(.btn):not(.sidenav-group-header):not(.navbar-toggler):hover, a.btn:not([class*="btn-"]):hover, .btn-action:hover { background: var(--itqan-primary-d); color: #fff; }
.badge-posted, .badge-active { display:inline-block; background:#dbeafe; color:#1e40af; padding:2px 8px; border-radius:99px; font-size:.75rem; font-weight:600; }
.badge-draft { display:inline-block; background:#fef9c3; color:#854d0e; padding:2px 8px; border-radius:99px; font-size:.75rem; font-weight:600; }
.badge-inactive { display:inline-block; background:#f3f4f6; color:#6b7280; padding:2px 8px; border-radius:99px; font-size:.75rem; font-weight:600; }
.msg { padding: .75rem 1rem; background: #d1fae5; color: #065f46; border-radius: 6px; margin-bottom: 1rem; }
.error { color: #b91c1c; font-size: .875rem; }
form.inline { display: inline; }
.text-check { color: #059669; }
.text-dash { color: #d1d5db; }
.login-language-switch {
    position: fixed;
    z-index: 1040;
    top: 0;
    left: 1.75rem;
    height: var(--topbar-h);
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    color: #fff;
}
.login-language-link {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: rgba(255,255,255,.86);
    text-decoration: none;
    font-size: .95rem;
    font-weight: 700;
}
.login-language-link:hover,
.login-language-link.active { color: #fff; }
.login-language-divider { width: 1px; height: 24px; background: rgba(255,255,255,.28); }
.login-language-chevron { font-size: .8rem; }

.login-experience {
    position: relative;
    isolation: isolate;
    min-height: calc(100vh - var(--topbar-h) - 70px);
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr);
    align-items: center;
    gap: clamp(2rem, 6vw, 6rem);
    padding: clamp(2rem, 5vw, 4.75rem) clamp(1.25rem, 6vw, 6.5rem);
    overflow: hidden;
    background:
        radial-gradient(circle at 14% 82%, rgba(15, 87, 184, .16), transparent 28%),
        radial-gradient(circle at 70% 10%, rgba(214, 166, 64, .13), transparent 23%),
        linear-gradient(115deg, #f7fbff 0%, #eef5fc 43%, #fbfdff 100%);
}
.login-blueprint {
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .8;
    background-image:
        linear-gradient(rgba(22, 77, 139, .08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(22, 77, 139, .08) 1px, transparent 1px),
        linear-gradient(135deg, transparent 0 42%, rgba(22, 77, 139, .08) 42% 42.2%, transparent 42.2% 100%);
    background-size: 96px 96px, 96px 96px, 360px 360px;
}
.login-blueprint::before,
.login-blueprint::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(37, 99, 170, .13);
    border-radius: 999px;
}
.login-blueprint::before {
    width: 170px;
    height: 170px;
    right: 40%;
    top: 33%;
    box-shadow: 0 0 0 18px rgba(37, 99, 170, .04), 0 0 0 40px rgba(37, 99, 170, .025);
}
.login-blueprint::after {
    width: 118px;
    height: 118px;
    left: 7%;
    bottom: 13%;
    box-shadow: 0 0 0 14px rgba(37, 99, 170, .05), 0 0 0 28px rgba(37, 99, 170, .025);
}
.login-showcase {
    display: grid;
    justify-items: center;
    gap: 2rem;
    text-align: center;
}
.login-mark {
    display: inline-grid;
    justify-items: center;
    gap: .6rem;
    color: #0b3d91;
}
.login-brand-logo {
    display: block;
    object-fit: contain;
    filter: drop-shadow(0 14px 26px rgba(15, 55, 105, .08));
}
.login-brand-logo--showcase {
    width: clamp(170px, 18vw, 230px);
    height: clamp(228px, 24vw, 308px);
}
.login-brand-logo--card {
    width: 112px;
    height: 150px;
}
.login-mark-icon {
    display: grid;
    place-items: center;
    width: 70px;
    height: 70px;
    border: 3px solid #0b3d91;
    border-radius: 14px;
    background: rgba(255,255,255,.62);
    box-shadow: 0 12px 28px rgba(11,61,145,.08);
}
.login-mark-icon i { font-size: 2.15rem; line-height: 1; }
.login-mark-text {
    color: #0b3d91;
    font-family: 'Inter', 'Tajawal', sans-serif;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: .48rem;
    padding-inline-start: .48rem;
}
.login-showcase-copy h1 {
    margin: 0;
    color: #111827;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
}
.login-showcase-copy p {
    max-width: 460px;
    margin: 1.1rem auto 0;
    color: #617085;
    font-size: 1.12rem;
    font-weight: 700;
    line-height: 1.8;
}
.login-gold-rule {
    position: relative;
    display: block;
    width: 210px;
    height: 1px;
    margin: 1.15rem auto 0;
    background: linear-gradient(90deg, transparent, #d9a735 18%, #d9a735 82%, transparent);
}
.login-gold-rule::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #d9a735;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 0 8px rgba(217,167,53,.16);
}
.login-dashboard-visual {
    width: min(100%, 560px);
    display: grid;
    grid-template-columns: repeat(5, minmax(72px, 1fr));
    gap: .75rem;
    align-items: end;
    padding: 1.35rem;
    border: 1px solid rgba(176, 196, 219, .72);
    border-radius: 22px;
    background: rgba(255,255,255,.68);
    box-shadow: 0 24px 70px rgba(21, 74, 130, .16);
    backdrop-filter: blur(12px);
}
.login-chart-card,
.login-module-tile {
    border: 1px solid rgba(196, 211, 229, .86);
    background: rgba(255,255,255,.86);
    box-shadow: 0 14px 26px rgba(24, 63, 110, .1);
}
.login-chart-card {
    min-height: 106px;
    border-radius: 12px;
}
.login-chart-card--bars {
    grid-column: span 2;
    display: flex;
    align-items: end;
    justify-content: center;
    gap: .45rem;
    padding: 1rem;
}
.login-chart-card--bars span {
    width: 13px;
    border-radius: 6px 6px 2px 2px;
    background: linear-gradient(180deg, #6aa7ee, #0f57b8);
}
.login-chart-card--bars span:nth-child(1) { height: 34px; }
.login-chart-card--bars span:nth-child(2) { height: 48px; }
.login-chart-card--bars span:nth-child(3) { height: 68px; }
.login-chart-card--bars span:nth-child(4) { height: 56px; }
.login-chart-card--bars span:nth-child(5) { height: 78px; }
.login-chart-card--bars span:nth-child(6) { height: 46px; }
.login-chart-card--donut {
    display: grid;
    place-items: center;
}
.login-chart-card--donut div {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: conic-gradient(#0f57b8 0 38%, #3bbda4 38% 76%, #d9a735 76% 100%);
    position: relative;
}
.login-chart-card--donut div::after {
    content: "";
    position: absolute;
    inset: 15px;
    border-radius: 50%;
    background: #fff;
}
.login-chart-card--list {
    grid-column: span 2;
    display: grid;
    align-content: center;
    gap: .75rem;
    padding: 1rem;
}
.login-chart-card--list span {
    height: 10px;
    border-radius: 99px;
    background: linear-gradient(90deg, rgba(15,87,184,.72), rgba(15,87,184,.08));
}
.login-chart-card--list span:nth-child(2) { width: 74%; }
.login-chart-card--list span:nth-child(3) { width: 58%; }
.login-module-tile {
    display: grid;
    justify-items: center;
    gap: .45rem;
    min-height: 90px;
    padding: .75rem .55rem;
    border-radius: 10px;
    color: #17498f;
    font-size: .76rem;
    font-weight: 800;
    line-height: 1.35;
}
.login-module-tile i { font-size: 1.5rem; color: #0f57b8; }

.login-panel-wrap {
    display: flex;
    justify-content: center;
}
.login-card {
    width: min(100%, 470px);
    padding: clamp(1.75rem, 3vw, 2.75rem);
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(206, 216, 229, .95);
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(15, 55, 105, .18);
    backdrop-filter: blur(18px);
}
.login-card-mark .login-mark-icon {
    width: 58px;
    height: 58px;
    border-radius: 12px;
}
.login-card-mark .login-mark-icon i { font-size: 1.8rem; }
.login-card-mark .login-mark-text { font-size: .82rem; letter-spacing: .38rem; padding-inline-start: .38rem; }
.login-card-heading {
    margin-top: 1.25rem;
    text-align: center;
}
.login-card-heading h2 {
    margin: 0;
    color: #111827;
    font-size: 1.55rem;
    font-weight: 800;
}
.login-card-heading p {
    margin: .65rem 0 0;
    color: #6b7280;
    font-size: .95rem;
    font-weight: 600;
}
.login-card-heading .login-gold-rule {
    width: 250px;
    margin-top: 1.35rem;
}
.login-form {
    display: grid;
    gap: 1rem;
    margin-top: 1.75rem;
}
.login-field {
    display: grid;
    gap: .45rem;
}
.login-field label {
    margin: 0;
    color: #263548;
    font-size: .92rem;
    font-weight: 800;
}
.login-input-shell {
    position: relative;
}
.login-input-shell .form-control {
    height: 48px;
    padding-inline-start: 2.75rem;
    padding-inline-end: 2.75rem;
    border: 1px solid #cfd9e7;
    border-radius: 7px;
    background: rgba(255,255,255,.95);
    color: #172033;
    font-size: .96rem;
    font-weight: 600;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}
.login-input-shell .form-control::placeholder { color: #9aa8ba; }
.login-input-shell .form-control:focus {
    border-color: #0f57b8;
    box-shadow: 0 0 0 4px rgba(15,87,184,.13);
}
.login-input-icon {
    position: absolute;
    top: 50%;
    inset-inline-start: .95rem;
    z-index: 2;
    color: #697789;
    transform: translateY(-50%);
}
.login-password-toggle {
    position: absolute;
    top: 50%;
    inset-inline-end: .55rem;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #607086;
    transform: translateY(-50%);
}
.login-password-toggle:hover,
.login-password-toggle:focus-visible {
    background: #eef5ff;
    color: #0f57b8;
}
.login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: .15rem;
    color: #475569;
    font-size: .9rem;
    font-weight: 700;
}
.login-options .form-check {
    display: flex;
    align-items: center;
    gap: .45rem;
    min-height: 0;
    padding-inline-start: 0;
}
.login-options .form-check-input {
    float: none;
    width: 1.15rem;
    height: 1.15rem;
    margin: 0;
    border-radius: 4px;
    border-color: #b8c5d6;
}
.login-options .form-check-input:checked {
    background-color: #0f57d6;
    border-color: #0f57d6;
}
.login-muted-link {
    color: #0f57d6;
    text-decoration: none;
}
.login-muted-link:hover { text-decoration: underline; }
.login-submit,
.login-sso {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    width: 100%;
    min-height: 50px;
    border-radius: 7px;
    font-size: 1rem;
    font-weight: 800;
}
.login-submit {
    margin-top: .45rem;
    color: #fff;
    border: 1px solid #0c54cc;
    background: linear-gradient(180deg, #0f66df, #0b4fc7);
    box-shadow: 0 14px 24px rgba(15,87,216,.22);
}
.login-submit:hover,
.login-submit:focus-visible {
    color: #fff;
    background: linear-gradient(180deg, #115fd0, #0b46af);
}
.login-submit i { font-size: 1.35rem; }
.login-sso-separator {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #7a8798;
    font-size: .86rem;
    font-weight: 700;
}
.login-sso-separator::before,
.login-sso-separator::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #d8e0eb;
}
.login-sso {
    color: #1956b3;
    border: 1px solid #d4deeb;
    background: rgba(255,255,255,.72);
    opacity: 1;
}
.login-sso:disabled {
    color: #1956b3;
    border-color: #d4deeb;
    background: rgba(255,255,255,.72);
}
.login-footer {
    min-height: 70px;
    display: grid;
    grid-template-columns: 1.2fr auto 1.1fr auto;
    align-items: center;
    gap: 1.4rem;
    padding: .75rem 2.25rem;
    border-top: 1px solid #dbe4ef;
    background: rgba(248, 251, 255, .96);
    color: #66758a;
    font-size: .88rem;
    font-weight: 700;
}
.login-footer a {
    color: #66758a;
    text-decoration: none;
}
.login-footer a:hover { color: #0f57b8; }
.login-footer-links {
    display: flex;
    align-items: center;
    gap: clamp(.75rem, 3vw, 2rem);
}
.login-footer-links a,
.login-version,
.login-trust {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
}
.login-copyright { text-align: end; }
.login-trust {
    justify-content: center;
    width: 32px;
    height: 32px;
    color: #fff;
    border-radius: 50%;
    background: #3f7bd8;
}

@media (max-width: 1100px) {
    .login-experience {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }
    .login-showcase {
        gap: 1.25rem;
    }
    .login-dashboard-visual {
        max-width: 500px;
    }
}
@media (max-width: 767.98px) {
    .login-language-switch {
        left: 1rem;
        gap: .75rem;
    }
    .login-language-link {
        font-size: .86rem;
    }
    .login-experience {
        min-height: auto;
        padding: 1.5rem 1rem 2rem;
    }
    .login-showcase-mark,
    .login-dashboard-visual {
        display: none;
    }
    .login-showcase-copy h1 {
        font-size: 1.85rem;
    }
    .login-showcase-copy p {
        font-size: 1rem;
    }
    .login-card {
        border-radius: 12px;
    }
    .login-brand-logo--card {
        width: 92px;
        height: 124px;
    }
    .login-options {
        align-items: flex-start;
        flex-direction: column;
        gap: .65rem;
    }
    .login-footer {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
        gap: .65rem;
        padding: 1rem;
    }
    .login-footer-links {
        justify-content: center;
        flex-wrap: wrap;
    }
    .login-copyright { text-align: center; }
}
.company-choice-wrapper { min-height: calc(100vh - var(--topbar-h) - 3rem); display: flex; align-items: center; justify-content: center; }
.company-choice { width: min(100%, 640px); padding: 2rem; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; box-shadow: 0 4px 24px rgba(0,0,0,.08); }
.company-choice-header { margin-bottom: 1.5rem; }
.company-choice-kicker { display: block; margin-bottom: .35rem; color: #6b7280; font-size: .72rem; font-weight: 700; }
.company-choice-header h1 { margin: 0 0 .45rem; color: #111827; font-size: 1.35rem; font-weight: 700; }
.company-choice-header p { margin: 0; color: #6b7280; font-size: .875rem; }
.company-choice-list { display: flex; flex-direction: column; gap: .65rem; }
.company-choice-row { display: flex; align-items: center; gap: 1rem; padding: .9rem 1rem; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; }
.company-choice-row.is-current { background: #eff6ff; border-color: #bfdbfe; }
.company-choice-details { flex: 1; min-width: 0; display: grid; gap: .15rem; }
.company-choice-code { color: #6b7280; font-size: .72rem; font-weight: 700; }
.company-choice-details strong { color: #111827; font-size: .95rem; font-weight: 700; }
.company-choice-secondary { color: #6b7280; font-size: .8rem; text-align: right; }
.company-choice-current { display: inline-flex; align-items: center; gap: .3rem; color: #1e40af; font-size: .8rem; font-weight: 600; white-space: nowrap; }
@media (max-width: 575.98px) {
    :root { --topbar-h: 104px; }
    .itqan-navbar { padding-block: .25rem; }
    .itqan-topbar {
        display: grid;
        grid-template-rows: 44px 48px;
        gap: .25rem;
        width: 100%;
    }
    [dir="rtl"] .itqan-topbar-brand,
    [dir="rtl"] .itqan-topbar-actions,
    [dir="ltr"] .itqan-topbar-brand,
    [dir="ltr"] .itqan-topbar-actions {
        position: static;
        width: 100%;
        transform: none;
        margin: 0 !important;
    }
    .itqan-topbar-brand {
        grid-row: 1;
        justify-content: space-between;
    }
    .itqan-topbar-actions {
        grid-row: 2;
        gap: .35rem !important;
        justify-content: space-between;
    }
    .itqan-brand { min-width: 104px; height: 40px; }
    .itqan-brand-logo--navbar { width: 104px; height: 36px; }
    .company-switch-form {
        flex: 1 1 auto;
        min-width: 0;
        max-width: none;
    }
    .itqan-topbar-actions .btn { white-space: nowrap; }
    .company-choice { padding: 1.25rem; }
    .company-choice-row { align-items: stretch; flex-direction: column; }
    .company-choice-row .btn { width: 100%; }
}

/* ── صفحة هبوط الرخصة غير الفعالة + شارة عدّاد انتهاء الرخصة ── */
.lic-blocked-wrap  { min-height: 60vh; }
.lic-blocked-card  { max-width: 560px; width: 100%; }
.lic-blocked-icon  { font-size: 3.5rem; }

.lic-expiry-badge {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .2rem .65rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    background: rgba(255, 193, 7, .18);
    color: #b58900;
    border: 1px solid rgba(255, 193, 7, .45);
    white-space: nowrap;
}
.lic-expiry-badge--danger {
    background: rgba(220, 53, 69, .15);
    color: #ff6b6b;
    border-color: rgba(220, 53, 69, .5);
}