/* ===== هوية ALRt البصرية — أسود / أصفر #F9CB11 / أبيض فقط ===== */
:root{
    --alrt-yellow:#F9CB11;
    --alrt-yellow-dark:#E0B400;
    --alrt-black:#0A0A0A;
    --alrt-ink:#141414;
    --alrt-gray:#6b6b6b;
    --alrt-line:#ececec;
    --alrt-soft:#f6f6f6;
    --alrt-white:#ffffff;
}

*{ font-family:'Cairo',system-ui,'Segoe UI',sans-serif; }
body{ background:var(--alrt-soft); color:var(--alrt-ink); }

/* ---------- الشعار ---------- */
.alrt-logo{ text-decoration:none; display:inline-flex; align-items:center; }
/* اللوجو داخل بادج أبيض ليظهر واضحاً على الخلفيات الداكنة (كما في الهوية) */
.alrt-logo-badge{
    display:inline-flex; align-items:center; justify-content:center;
    background:#fff; border-radius:14px; padding:5px 12px;
    box-shadow:0 3px 10px rgba(0,0,0,.18);
}
.alrt-logo-svg{ height:46px; width:auto; display:block; }
.alrt-logo-img{ height:46px; width:auto; display:block; }
.alrt-wordmark{ display:inline-flex; flex-direction:column; line-height:1; }
.wm-main{ font-weight:900; font-size:30px; letter-spacing:-1px; color:var(--alrt-white); }
.wm-accent{ color:var(--alrt-yellow); }
.wm-sub{ font-weight:700; font-size:10px; letter-spacing:4px; color:var(--alrt-yellow); margin-top:3px; }

/* داخل الصفحات الفاتحة (لوحة التحكم) الشعار أسود */
.alrt-on-light .wm-main{ color:var(--alrt-black); }

/* ---------- النافبار ---------- */
.alrt-nav{ background:var(--alrt-black); border-bottom:3px solid var(--alrt-yellow); }
.alrt-nav-tag{ color:#c9c9c9; font-size:13px; font-weight:600; }

/* ---------- البطاقات ---------- */
.alrt-card{
    background:var(--alrt-white); border:1px solid var(--alrt-line);
    border-radius:18px; box-shadow:0 6px 24px rgba(0,0,0,.05);
}
.alrt-card-head{
    background:var(--alrt-black); color:var(--alrt-white);
    border-radius:18px 18px 0 0; padding:22px 26px;
    border-bottom:3px solid var(--alrt-yellow);
}
.alrt-card-head h1,.alrt-card-head h2{ margin:0; font-weight:800; }

/* ---------- الأزرار ---------- */
.btn-alrt{
    background:var(--alrt-yellow); color:var(--alrt-black); font-weight:800;
    border:none; border-radius:12px; padding:12px 26px; transition:.15s;
}
.btn-alrt:hover{ background:var(--alrt-yellow-dark); color:var(--alrt-black); transform:translateY(-1px); }
.btn-dark-alrt{
    background:var(--alrt-black); color:#fff; font-weight:700;
    border:none; border-radius:12px; padding:10px 22px;
}
.btn-dark-alrt:hover{ background:#000; color:var(--alrt-yellow); }
.btn-ghost{
    background:transparent; border:1.5px solid var(--alrt-line); color:var(--alrt-ink);
    border-radius:10px; font-weight:700; padding:7px 16px;
}
.btn-ghost:hover{ border-color:var(--alrt-black); }

/* ---------- الحقول ---------- */
.form-label{ font-weight:700; font-size:14px; margin-bottom:6px; }
.form-label .req{ color:#d9480f; }
.form-control,.form-select{
    border-radius:11px; border:1.5px solid var(--alrt-line); padding:11px 14px; font-size:15px;
}
.form-control:focus,.form-select:focus{
    border-color:var(--alrt-yellow); box-shadow:0 0 0 .2rem rgba(249,203,17,.28);
}

/* اختيار البطاقات (راديو مصمّم) */
.choice-grid{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
.choice{ position:relative; }
.choice input{ position:absolute; opacity:0; inset:0; cursor:pointer; }
.choice span{
    display:block; text-align:center; padding:12px 8px; border-radius:12px;
    border:1.5px solid var(--alrt-line); background:#fff; font-weight:700; font-size:14px;
    cursor:pointer; transition:.12s;
}
.choice input:checked + span{
    border-color:var(--alrt-yellow); background:var(--alrt-yellow);
    color:var(--alrt-black); box-shadow:0 4px 14px rgba(249,203,17,.35);
}
.choice input:focus-visible + span{ box-shadow:0 0 0 .2rem rgba(249,203,17,.4); }

/* ---------- شارات ---------- */
.badge-alrt{ background:var(--alrt-yellow); color:#000; font-weight:800; border-radius:20px; padding:5px 12px; }
.badge-off{ background:#eee; color:#666; font-weight:700; border-radius:20px; padding:5px 12px; }

/* ---------- بطاقة دورة ---------- */
.course-card{ height:100%; display:flex; flex-direction:column; transition:.15s; }
.course-card:hover{ transform:translateY(-4px); box-shadow:0 14px 34px rgba(0,0,0,.10); }
.course-strip{ height:8px; background:var(--alrt-yellow); border-radius:18px 18px 0 0; }

/* دورة مغلقة (تظهر لكن غير متاحة) */
.course-card.is-closed{ opacity:.72; filter:grayscale(.35); }
.course-card.is-closed:hover{ transform:none; }
.course-card.is-closed .course-strip{ background:#c9c9c9; }
.badge-closed{ background:#3a3a3a; color:#fff; font-weight:800; border-radius:20px; padding:5px 12px; font-size:12px; white-space:nowrap; }
.btn-closed{ background:#e4e4e4; color:#8a8a8a; font-weight:800; border:none; border-radius:12px; padding:12px 22px; cursor:not-allowed; }

/* ---------- الفوتر ---------- */
.alrt-footer{ background:var(--alrt-black); color:#bcbcbc; margin-top:40px; border-top:3px solid var(--alrt-yellow); }

/* ---------- لوحة التحكم ---------- */
.alrt-admin{ background:#f2f2f3; }
.alrt-sidebar{
    background:var(--alrt-black); color:#e8e8e8; min-height:100vh; width:250px; position:fixed; inset-inline-start:0; top:0;
    padding:18px 14px; border-inline-end:3px solid var(--alrt-yellow);
}
.alrt-sidebar a{
    display:flex; align-items:center; gap:10px; color:#cfcfcf; text-decoration:none;
    padding:11px 14px; border-radius:10px; font-weight:700; margin-bottom:4px; font-size:15px;
}
.alrt-sidebar a:hover{ background:#1c1c1c; color:#fff; }
.alrt-sidebar a.active{ background:var(--alrt-yellow); color:#000; }
.alrt-content{ margin-inline-start:250px; padding:26px; }
.alrt-topbar{
    background:#fff; border:1px solid var(--alrt-line); border-radius:14px;
    padding:14px 20px; display:flex; align-items:center; justify-content:space-between; margin-bottom:22px;
}
.stat-card{ background:#fff; border:1px solid var(--alrt-line); border-radius:16px; padding:20px; position:relative; overflow:hidden; }
.stat-card .n{ font-size:34px; font-weight:900; }
.stat-card .l{ color:var(--alrt-gray); font-weight:700; font-size:14px; }
.stat-card::after{ content:''; position:absolute; inset-block-start:0; inset-inline-end:0; width:6px; height:100%; background:var(--alrt-yellow); }

.table-alrt thead th{ background:var(--alrt-black); color:#fff; font-weight:700; font-size:13px; border:none; white-space:nowrap; }
.table-alrt td{ vertical-align:middle; font-size:14px; }
.table-alrt tbody tr:hover{ background:#fffbe8; }

/* ===== الإطار المعدني (Frame) — مستوحى من الهوية ===== */
.alrt-frame{
    position:relative;
    padding:16px;
    border-radius:26px;
    background:linear-gradient(135deg,#ededf0 0%,#b9bbc0 20%,#f8f8fa 42%,#a6a8ad 62%,#e6e6e9 82%,#bcbec3 100%);
    box-shadow:0 18px 50px rgba(0,0,0,.20), inset 0 2px 3px rgba(255,255,255,.75), inset 0 -2px 3px rgba(0,0,0,.20);
}
/* خط أصفر داخلي رفيع */
.alrt-frame::before{
    content:''; position:absolute; inset:9px; border-radius:20px;
    border:2px solid var(--alrt-yellow); pointer-events:none; z-index:2;
}
.alrt-frame-inner{
    position:relative; z-index:1;
    background:var(--alrt-white); border-radius:18px; overflow:hidden;
}
/* زوايا صفراء على شكل حرف L */
.alrt-frame .corner{
    position:absolute; width:52px; height:52px; z-index:3;
    border:6px solid var(--alrt-yellow);
}
.alrt-frame .corner.tl{ top:5px;  left:5px;  border-right:none; border-bottom:none; border-radius:20px 0 0 0; }
.alrt-frame .corner.tr{ top:5px;  right:5px; border-left:none;  border-bottom:none; border-radius:0 20px 0 0; }
.alrt-frame .corner.bl{ bottom:5px; left:5px;  border-right:none; border-top:none;    border-radius:0 0 0 20px; }
.alrt-frame .corner.br{ bottom:5px; right:5px; border-left:none;  border-top:none;    border-radius:0 0 20px 0; }

/* ===== الاستجابة الكاملة (Responsive) ===== */
.hero-title{ font-weight:900; font-size:clamp(1.5rem, 5vw, 2.6rem); }

@media (max-width:768px){
    .alrt-sidebar{ position:static; width:100%; min-height:auto; }
    .alrt-content{ margin-inline-start:0; padding:16px; }
    .alrt-nav .container{ flex-direction:column; gap:8px; text-align:center; }
    .alrt-nav-tag{ font-size:11px; }
    .alrt-card-head{ padding:18px 18px; }
    .alrt-frame{ padding:11px; border-radius:20px; }
    .alrt-frame::before{ inset:7px; border-radius:15px; }
    .alrt-frame .corner{ width:38px; height:38px; border-width:5px; }
    .btn-alrt,.btn-dark-alrt{ padding:11px 20px; }
    .choice-grid{ grid-template-columns:repeat(auto-fit,minmax(104px,1fr)); }
    .stat-card .n{ font-size:27px; }
    .alrt-topbar{ flex-direction:column; align-items:flex-start; gap:4px; }
}
@media (max-width:420px){
    .alrt-logo-svg,.alrt-logo-img{ height:38px; }
    .choice-grid{ grid-template-columns:1fr 1fr; }
    .alrt-frame .corner{ width:30px; height:30px; border-width:4px; }
    .p-md-5{ padding:1rem !important; }
}