/* ==========================================================
   Kalima Phase 2 — Course, Learner Dashboard, Certificates
   تطوير المرحلة الثانية: تفاصيل الدورة، لوحة المتدرب، الشهادات
   ========================================================== */
:root{
    --kalima-black:#070707;
    --kalima-charcoal:#111111;
    --kalima-gold:#d8c47c;
    --kalima-gold-2:#b89845;
    --kalima-cream:#f7f0df;
    --kalima-muted:#786d55;
    --kalima-card:#ffffff;
    --kalima-border:rgba(216,196,124,.28);
    --kalima-shadow:0 24px 70px rgba(7,7,7,.13);
}

/* ========== Public course details ========== */
.kalima-course-hero{
    position:relative;
    min-height:430px;
    display:flex;
    align-items:center;
    overflow:hidden;
    background:
        radial-gradient(circle at 18% 25%, rgba(216,196,124,.20), transparent 28%),
        linear-gradient(135deg, rgba(0,0,0,.94), rgba(17,17,17,.86)),
        url('../images/hero-slider/kalima-training-certificate.webp') center/cover no-repeat !important;
}
.kalima-course-hero:before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.50), rgba(0,0,0,.22));
    z-index:0;
}
.kalima-course-hero:after{
    content:"";
    position:absolute;
    inset:auto 0 0 0;
    height:120px;
    background:linear-gradient(180deg, transparent, #fff);
    z-index:0;
}
.kalima-course-hero .container{position:relative;z-index:2}
.kalima-course-hero h1{
    color:#fff;
    font-weight:900;
    letter-spacing:-.04em;
    line-height:1.25;
    text-shadow:0 12px 34px rgba(0,0,0,.38);
}
.kalima-course-hero .breadcrumb a,
.kalima-course-hero .breadcrumb-item,
.kalima-course-hero .text-white-75{color:rgba(255,255,255,.78)!important}
.kalima-course-hero .badge{
    border:1px solid rgba(255,255,255,.18);
    box-shadow:0 10px 24px rgba(0,0,0,.16);
}
.kalima-course-phase2{background:linear-gradient(180deg,#fff 0%,#fbf8ef 45%,#fff 100%)}
.course-phase2-overview{
    margin-top:-72px;
    position:relative;
    z-index:5;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    margin-bottom:30px;
}
.course-phase2-stat{
    background:rgba(255,255,255,.92);
    border:1px solid rgba(216,196,124,.30);
    border-radius:24px;
    box-shadow:0 22px 55px rgba(7,7,7,.10);
    padding:20px;
    display:flex;
    align-items:center;
    gap:14px;
    backdrop-filter:blur(12px);
}
.course-phase2-stat i{
    width:46px;height:46px;border-radius:16px;
    display:inline-flex;align-items:center;justify-content:center;
    color:var(--kalima-black);
    background:linear-gradient(135deg,var(--kalima-gold),#fff3c8);
    box-shadow:0 12px 26px rgba(184,152,69,.24);
    flex:0 0 auto;
}
.course-phase2-stat strong{display:block;font-size:1.15rem;color:#111;font-weight:900;line-height:1.1}
.course-phase2-stat span{display:block;color:#64748b;font-size:.85rem;margin-top:4px}
.kalima-course-phase2 .card{
    border:1px solid rgba(17,17,17,.08);
    border-radius:26px;
    box-shadow:0 18px 48px rgba(15,23,42,.06);
    overflow:hidden;
}
.kalima-course-phase2 .card-body{position:relative}
.kalima-course-phase2 .card h4,
.kalima-course-phase2 .card h5,
.kalima-course-phase2 .card h6{letter-spacing:-.02em}
.pre-enroll-item,
.outcome-card{
    border-color:rgba(216,196,124,.30)!important;
    background:linear-gradient(135deg,#fff,#fffbf1)!important;
    box-shadow:0 10px 24px rgba(7,7,7,.04)!important;
}
.pre-enroll-item .icon,
.outcome-card .badge{
    background:linear-gradient(135deg,var(--kalima-gold),#fff4c5)!important;
    color:#111!important;
}
.course-content-accordion .accordion-item{
    border-radius:20px!important;
    overflow:hidden;
    border:1px solid rgba(15,23,42,.06)!important;
    box-shadow:0 10px 28px rgba(15,23,42,.05);
}
.course-content-accordion .accordion-button{
    background:#fff;
    color:#111;
}
.course-content-accordion .accordion-button:not(.collapsed){
    background:linear-gradient(135deg,#111,#2a2413)!important;
    color:#fff!important;
}
.course-content-accordion .accordion-button:not(.collapsed) i{color:var(--kalima-gold)!important}
.course-content-accordion .lesson-row{
    background:#fff;
    border-bottom:1px solid rgba(15,23,42,.06)!important;
}
.course-content-accordion .lesson-row:hover{
    background:#fff9e8;
    transform:translateX(-4px);
}
.phase2-enroll-card{
    border:0!important;
    background:linear-gradient(180deg,#111,#211b0d)!important;
    color:#fff;
    box-shadow:0 30px 80px rgba(0,0,0,.25)!important;
    overflow:hidden;
}
.phase2-enroll-card:before{
    content:"";
    position:absolute;
    width:200px;height:200px;border-radius:999px;
    background:rgba(216,196,124,.18);
    top:-80px;left:-70px;
}
.phase2-enroll-card .card-body{z-index:2}
.phase2-enroll-card .text-muted{color:rgba(255,255,255,.72)!important}
.phase2-enroll-card .fs-2.text-primary,
.phase2-enroll-card .fs-2.text-success{color:var(--kalima-gold)!important}
.phase2-enroll-card .btn-primary,
.phase2-enroll-card .btn-success{
    background:linear-gradient(135deg,var(--kalima-gold),var(--kalima-gold-2));
    border:0;color:#111;font-weight:900;border-radius:999px;
    box-shadow:0 16px 36px rgba(216,196,124,.25);
}
.phase2-enroll-card hr{border-color:rgba(255,255,255,.16)}
.phase2-enroll-card li{color:rgba(255,255,255,.86);text-align:right}
.phase2-enroll-card li i{color:var(--kalima-gold)!important}
.phase2-instructor-card .card-body{background:linear-gradient(135deg,#fff,#fff9ea)}
.phase2-delivery-card{text-align:center;background:#fff}
.phase2-delivery-card .delivery-badge{border-radius:999px;padding:9px 14px;background:rgba(216,196,124,.16);color:#111;border:1px solid rgba(216,196,124,.25)}

/* ========== Learner dashboard ========== */
.student-shell{
    --student-primary:#111111;
    --student-secondary:#d8c47c;
    --student-soft:#fff8e4;
    --student-border:rgba(17,17,17,.08);
    background:
        radial-gradient(circle at top right, rgba(216,196,124,.22), transparent 34%),
        radial-gradient(circle at bottom left, rgba(17,17,17,.07), transparent 35%),
        #f7f3e8 !important;
}
.student-hero{
    background:
        linear-gradient(135deg,rgba(7,7,7,.94),rgba(31,26,14,.90)),
        url('../images/hero-slider/kalima-training-growth.webp') center/cover no-repeat !important;
    box-shadow:0 28px 70px rgba(7,7,7,.25)!important;
    border:1px solid rgba(216,196,124,.25)!important;
}
.student-kicker{background:rgba(216,196,124,.16)!important;border-color:rgba(216,196,124,.32)!important;color:#fff}
.student-stat-icon,
.student-action i{
    background:linear-gradient(135deg,var(--kalima-gold),#fff3c2)!important;
    color:#111!important;
}
.student-progress-bar{background:linear-gradient(90deg,#111,var(--kalima-gold))!important}
.student-badge-soft{background:#fff5d9;color:#5f4712;border:1px solid rgba(216,196,124,.26)}
.student-badge-success{background:#ecfdf5;color:#047857;border-color:rgba(4,120,87,.15)}
.student-badge-warning{background:#fff7ed;color:#b45309;border-color:rgba(180,83,9,.15)}
.student-badge-danger{background:#fef2f2;color:#b91c1c;border-color:rgba(185,28,28,.15)}
.student-card,.student-filter-bar,.student-course-card,.student-action,.student-empty{
    border-color:rgba(17,17,17,.08)!important;
    box-shadow:0 18px 48px rgba(7,7,7,.08)!important;
}
.phase2-next-action{
    background:linear-gradient(135deg,#111,#2a2312);
    border:1px solid rgba(216,196,124,.28);
    color:#fff;
    border-radius:28px;
    padding:22px;
    box-shadow:0 24px 60px rgba(7,7,7,.18);
}
.phase2-next-action .mini-label{color:rgba(216,196,124,.92);font-weight:800;font-size:.82rem;margin-bottom:5px}
.phase2-next-action .btn{border-radius:999px;font-weight:900;background:linear-gradient(135deg,var(--kalima-gold),var(--kalima-gold-2));border:0;color:#111}
.phase2-journey-strip{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:12px;
}
.phase2-journey-step{
    background:#fff;
    border:1px solid rgba(17,17,17,.08);
    border-radius:20px;
    padding:16px;
    position:relative;
    min-height:116px;
    box-shadow:0 14px 35px rgba(7,7,7,.05);
}
.phase2-journey-step .step-num{
    width:36px;height:36px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;
    background:#111;color:var(--kalima-gold);font-weight:900;margin-bottom:10px;
}
.phase2-journey-step.done .step-num{background:linear-gradient(135deg,#10b981,#047857);color:#fff}
.phase2-journey-step.active{border-color:rgba(216,196,124,.68);background:linear-gradient(135deg,#fff,#fff8e5)}
.phase2-journey-step strong{display:block;font-size:.95rem;color:#111}
.phase2-journey-step small{color:#64748b}

/* ========== Learning player ========== */
.kalima-learning-player .topbar,
.phase2-player-topbar{
    position:sticky;top:0;z-index:30;
    background:rgba(255,255,255,.90)!important;
    backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(17,17,17,.08);
    box-shadow:0 10px 30px rgba(7,7,7,.06);
}
.kalima-learning-player .container-fluid{padding:26px!important}
.kalima-learning-player .card{
    border:1px solid rgba(17,17,17,.08);
    border-radius:26px;
    box-shadow:0 18px 50px rgba(7,7,7,.08);
    overflow:hidden;
}
.kalima-learning-player .player-container{border-radius:24px;background:#050505;box-shadow:0 28px 70px rgba(0,0,0,.22)}
.kalima-learning-player .lesson-sidebar-item{
    border-bottom:1px solid rgba(17,17,17,.06);
    padding:14px 16px;
}
.kalima-learning-player .lesson-sidebar-item.active{
    background:linear-gradient(90deg,#fff8e6,#fff)!important;
    border-right:4px solid var(--kalima-gold)!important;
    color:#111!important;
}
.kalima-learning-player .lesson-sidebar-item.completed .lesson-num{background:linear-gradient(135deg,#10b981,#047857)!important}
.kalima-learning-player .lesson-sidebar-item .lesson-num{background:#f3ead0;color:#111}
.kalima-learning-player .card-header-gradient,
.phase2-lessons-panel .card-header{
    background:linear-gradient(135deg,#111,#2a2413)!important;
    color:#fff!important;
}
.kalima-learning-player .lesson-nav-btn:hover{background:#111!important;border-color:#111!important;color:var(--kalima-gold)!important}
.kalima-learning-player textarea.form-control{border-radius:18px;border-color:rgba(17,17,17,.10);box-shadow:none}
.kalima-learning-player textarea.form-control:focus{border-color:var(--kalima-gold);box-shadow:0 0 0 .25rem rgba(216,196,124,.18)}

/* ========== Certificates ========== */
.phase2-cert-card{
    background:
        linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,249,234,.94));
    border:1px solid rgba(216,196,124,.40)!important;
}
.phase2-cert-ribbon{
    background:linear-gradient(90deg,#111,var(--kalima-gold),#111)!important;
}
.phase2-cert-actions .btn{border-radius:999px;font-weight:800}
.phase2-verify-page{
    min-height:calc(100vh - 160px);
    background:
        radial-gradient(circle at 85% 15%, rgba(216,196,124,.20), transparent 35%),
        linear-gradient(180deg,#fff,#fbf7ea);
}
.phase2-verify-hero{
    background:
        linear-gradient(135deg,rgba(7,7,7,.92),rgba(31,26,14,.88)),
        url('../images/hero-slider/kalima-training-certificate.webp') center/cover no-repeat;
    border-radius:34px;
    color:#fff;
    border:1px solid rgba(216,196,124,.25);
    box-shadow:0 32px 90px rgba(7,7,7,.22);
    overflow:hidden;
    position:relative;
}
.phase2-verify-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 25%,rgba(216,196,124,.18),transparent 30%)}
.phase2-verify-hero>*{position:relative;z-index:2}
.phase2-verify-badge{width:112px;height:112px;border-radius:32px;display:flex;align-items:center;justify-content:center;margin:auto;background:linear-gradient(135deg,#10b981,#047857);color:#fff;font-size:48px;box-shadow:0 22px 48px rgba(16,185,129,.25)}
.phase2-verify-badge.invalid{background:linear-gradient(135deg,#ef4444,#991b1b)}
.phase2-verify-result{border:1px solid rgba(216,196,124,.32);border-radius:28px;background:#fff;box-shadow:0 18px 50px rgba(7,7,7,.08)}
.phase2-verify-search .form-control{border-radius:999px 0 0 999px;padding:15px 18px;border-color:rgba(216,196,124,.35)}
.phase2-verify-search .btn{border-radius:0 999px 999px 0;background:#111;border-color:#111;color:var(--kalima-gold);font-weight:900;padding-inline:28px}

/* ========== Responsive ========== */
@media (max-width:1199.98px){
    .course-phase2-overview{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:-46px}
    .phase2-journey-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:991.98px){
    .kalima-course-hero{min-height:auto;padding:42px 0 92px!important}
    .kalima-course-phase2 .sticky-top{position:static!important}
    .kalima-learning-player .container-fluid{padding:16px!important}
}
@media (max-width:767.98px){
    .course-phase2-overview{grid-template-columns:1fr;margin-top:-38px}
    .course-phase2-stat{padding:16px}
    .phase2-journey-strip{grid-template-columns:1fr}
    .student-main{padding:14px!important}
    .student-hero{border-radius:24px!important;padding:22px!important}
    .phase2-next-action{border-radius:22px;padding:18px}
    .phase2-verify-hero{border-radius:24px;padding:24px!important}
    .phase2-verify-search .input-group{display:block}
    .phase2-verify-search .form-control,.phase2-verify-search .btn{width:100%;border-radius:999px!important;margin-top:8px}
}