/* ===== SmartStudyDZ skin for the older inner pages (same look as the homepage) ===== */
html.sd-html{background:#F5F9FD!important}
html.sd-html body.sd-skin{
  --bg-dark:#F5F9FD; --bg-slate:#fff; --bg-card:#fff; --border-color:#E1EAF3;
  --primary:#1F5F96; --primary-gradient:linear-gradient(135deg,#2A7BC0 0%,#1F5F96 100%);
  --accent:#F7A233; --accent-gradient:linear-gradient(135deg,#FFB54D 0%,#F7A233 100%);
  --text-primary:#14304D; --text-secondary:#5B7089; --text-muted:#8499AF;
  --font-heading:'Cairo',system-ui,sans-serif; --font-body:'Cairo',system-ui,sans-serif;
  --shadow-sm:0 6px 18px -8px rgba(24,56,88,.18); --shadow-md:0 18px 40px -18px rgba(24,56,88,.28); --shadow-lg:0 18px 40px -18px rgba(24,56,88,.28);
  --glow-primary:0 12px 26px -12px rgba(31,95,150,.6); --glow-accent:0 12px 26px -12px rgba(247,162,51,.8);
  /* course-detail variables */
  --brand-primary:#183858; --brand-accent:#1F5F96; --brand-accent-hover:#2A7BC0; --brand-gold:#F7A233;
  --text-dark:#14304D; --text-medium:#5B7089; --text-light:#8499AF; --bg-page:transparent; --border-subtle:#E1EAF3;
  --shadow-card:0 6px 18px -8px rgba(24,56,88,.18);
  background:transparent!important; color:#14304D!important; padding-top:0!important; margin:0!important;
  font-family:'Cairo',system-ui,sans-serif!important; line-height:1.7;
}
.sd-skin .sd-dna{z-index:-1}
.sd-skin :is(h1,h2,h3,h4,h5,h6,p,a,span,label,input,button,select,textarea,li,td,th,div,small,strong,b):not([class*="fa-"]):not(.fas):not(.fab):not(.far):not(.fa){font-family:'Cairo',system-ui,sans-serif!important}
.sd-skin :is(p,ul,ol){margin-block:0 .6em}
.sd-skin :is(h1,h2,h3){margin-block:0 .5em}

/* hide the old navigation, mobile header, docks and footer: the shared ones replace them */
.sd-skin > :is(nav.navbar,.navbar,.mobile-app-header,.mobile-app-dock,.site-navbar,footer.footer,.footer):not(.hdr):not(.ft):not(.dock),
.sd-skin :is(.navbar.desktop-nav,.mobile-app-header,.mobile-app-dock,.site-navbar,.language-switcher,.mobile-lang-switcher,.lang-pill,.lang-switch,.language-selector){display:none!important}
.sd-skin footer.footer{display:none!important}

/* our header must win against old .logo / .btn / nav rules */
.sd-skin .hdr{position:sticky!important;top:0;z-index:1000!important}
.sd-skin .hdr .wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.sd-skin .hdr .logo{display:flex!important;align-items:center;gap:10px;font-size:21px!important;margin:0!important;padding:0!important;background:none!important;width:auto!important;height:auto!important}
.sd-skin .hdr .logo img{width:46px!important;height:46px!important;margin:0!important;border-radius:0}
.sd-skin .hdr .nav{position:static;background:none;box-shadow:none;width:auto;height:auto;padding:0;margin:0}
.sd-skin .hdr .btn,.sd-skin .ft .btn{text-transform:none;letter-spacing:0;width:auto;min-width:0}
.sd-skin .hdr .btn-primary{background:#F7A233!important;color:#3A2300!important;border:0}
.sd-skin .hdr .btn-ghost{background:#fff!important;color:#183858!important;border:1.5px solid #E1EAF3!important}
.sd-skin .ft{margin-top:60px}
.sd-skin .ft a,.sd-skin .hdr a{text-decoration:none}

/* ---------- generic components ---------- */
.sd-skin :is(.container,.main-content,.content,.page){background:transparent!important}
.sd-skin :is(h1,h2,h3):not(.hdr *):not(.ft *):not(.story *){color:#183858}
.sd-skin :is(.btn-primary,.btn-subscribe,.btn-login-submit,.btn-solid,.btn-login):not(.hdr *){background:linear-gradient(135deg,#FFB54D,#F7A233)!important;color:#3A2300!important;border:0!important;border-radius:12px!important;font-weight:800!important;box-shadow:0 12px 26px -12px rgba(247,162,51,.9)!important;transition:transform .18s,box-shadow .2s}
.sd-skin :is(.btn-primary,.btn-subscribe,.btn-login-submit,.btn-solid,.btn-login):not(.hdr *):hover{transform:translateY(-2px)}
.sd-skin :is(.btn-secondary,.btn-ghost,.ghost):not(.hdr *){background:#fff!important;color:#183858!important;border:1.5px solid #E1EAF3!important;border-radius:12px!important}
.sd-skin input:not([type=checkbox]):not([type=radio]),.sd-skin select,.sd-skin textarea{background:#fff!important;color:#14304D!important;border:1.5px solid #D6E3F0!important;border-radius:12px!important;box-shadow:none!important}
.sd-skin input:focus,.sd-skin select:focus,.sd-skin textarea:focus{border-color:#2A7BC0!important;box-shadow:0 0 0 4px rgba(42,123,192,.14)!important;outline:none}
.sd-skin ::placeholder{color:#94A7BC!important}

/* cards used across pages */
.sd-skin :is(.level-card,.course-card-public,.course-card,.pricing-card,.plan-card,.profile-card,.about-card,.card,.stat-card,.workspace-card,.info-card,.dashboard-card,.feature-card,.subject-card):not(.hdr *){
  background:#fff!important;border:1px solid #E1EAF3!important;border-radius:20px!important;box-shadow:0 6px 18px -8px rgba(24,56,88,.18)!important;color:#14304D!important;
  transition:transform .25s ease,box-shadow .25s ease!important;animation:sdSkinUp .6s cubic-bezier(.2,.9,.3,1.1) both}
.sd-skin :is(.level-card,.course-card-public,.course-card,.pricing-card,.plan-card,.about-card,.card,.stat-card,.dashboard-card,.feature-card,.subject-card):hover{transform:translateY(-6px);box-shadow:0 18px 40px -18px rgba(24,56,88,.35)!important}
.sd-skin :is(.level-card,.course-card-public,.course-card,.card,.stat-card):nth-child(2){animation-delay:.08s}
.sd-skin :is(.level-card,.course-card-public,.course-card,.card,.stat-card):nth-child(3){animation-delay:.16s}
.sd-skin :is(.level-card,.course-card-public,.course-card,.card,.stat-card):nth-child(4){animation-delay:.24s}
.sd-skin :is(.level-card,.course-card-public,.course-card,.card,.stat-card):nth-child(n+5){animation-delay:.3s}
@keyframes sdSkinUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.sd-skin :is(.level-icon,.course-icon,.profile-avatar){background:linear-gradient(135deg,#1F5F96,#2A7BC0)!important;color:#fff!important;box-shadow:0 10px 22px -10px rgba(31,95,150,.9)!important}
.sd-skin :is(.level-card,.course-card-public) :is(h2,h3,.level-title){color:#183858!important;font-weight:800!important}
.sd-skin :is(.subtitle,.course-description,.plan-desc,.course-info,.muted,.sub,.auth-subtitle){color:#5B7089!important}
.sd-skin :is(.hero,.levels-section,.pricing-section,.courses-showcase){background:transparent!important}
.sd-skin .hero :is(h1,h2){color:#183858!important;font-weight:800!important}
.sd-skin .hero p{color:#5B7089!important}
.sd-skin .popular-badge{background:linear-gradient(135deg,#FFB54D,#F7A233)!important;color:#3A2300!important}
.sd-skin :is(.current-price,.plan-price){color:#183858!important}
.sd-skin .old-price{color:#94A7BC!important}
.sd-skin .plan-features i,.sd-skin .fa-check-circle{color:#1FA971}
.sd-skin .pricing-tabs :is(button,a,.tab){border-radius:99px!important;border:1.5px solid #E1EAF3!important;background:#fff!important;color:#5B7089!important;font-weight:800!important}
.sd-skin .pricing-tabs :is(button,a,.tab).active{background:#183858!important;color:#fff!important;border-color:#183858!important}
.sd-skin .course-category{background:#FFF1DC!important;color:#B86A06!important;border-radius:99px!important;font-weight:800!important}

/* ---------- login ---------- */
.sd-skin .auth-container{background:transparent!important;min-height:calc(100vh - 74px)!important;display:flex;align-items:center;justify-content:center;padding:40px 16px 90px!important}
.sd-skin .auth-container::before,.sd-skin .auth-container::after{display:none!important}
.sd-skin .auth-wrapper{background:#fff!important;border:1px solid #E1EAF3!important;border-radius:26px!important;box-shadow:0 30px 60px -28px rgba(24,56,88,.45)!important;backdrop-filter:none!important;animation:sdSkinUp .6s ease both;max-width:440px;width:100%}
.sd-skin .auth-form :is(h1,h2){color:#183858!important;font-weight:800!important}
.sd-skin .auth-form label{color:#183858!important;font-weight:700!important}
.sd-skin .auth-form label i,.sd-skin .form-group i{color:#F7A233!important}
.sd-skin .logo-auth{width:96px!important;height:96px!important;object-fit:contain;filter:none!important}
.sd-skin .forgot-password,.sd-skin .auth-footer a{color:#1F5F96!important;font-weight:700}
.sd-skin .remember-me{color:#5B7089!important}
.sd-skin .sd-acc{margin-top:18px;padding-top:18px;border-top:1px dashed #E1EAF3;text-align:center}
.sd-skin .sd-acc b{display:block;color:#183858;font-weight:800;margin-bottom:10px;font-size:16px}
.sd-skin .sd-acc a{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1.5px solid #E1EAF3;color:#183858;font-weight:800;padding:12px 20px;border-radius:12px;text-decoration:none;transition:border-color .2s,transform .18s}
.sd-skin .sd-acc a:hover{border-color:#25D366;transform:translateY(-2px)}
.sd-skin .sd-acc a i{color:#25D366;font-size:20px}

/* ---------- dashboard / profile ---------- */
.sd-skin :is(.profile-header,.dashboard-header,.welcome-section,.welcome-card){background:linear-gradient(135deg,#183858,#1F5F96)!important;color:#fff!important;border-radius:24px!important}
.sd-skin :is(.profile-header,.dashboard-header,.welcome-section,.welcome-card) :is(h1,h2,h3,p,span){color:#fff!important}
.sd-skin .bg-video{display:none!important}

@media (max-width:860px){ .sd-skin{padding-bottom:70px!important} }
.sd-skin .hero :is(h1,h2),.sd-skin .hero :is(h1,h2) *{-webkit-text-fill-color:#183858!important;background:none!important;color:#183858!important}
.sd-skin .hero{padding:48px 16px 20px!important;min-height:0!important}

/* exam module pages (exams / results / leaderboard) for students */
.sd-skin:not(.sd-admin) .ssd-top{background:transparent!important;box-shadow:none!important;border:0!important;position:relative!important;z-index:1;padding:14px 0 0!important}
.sd-skin:not(.sd-admin) .ssd-top .ssd-brand{display:none!important}
.sd-skin:not(.sd-admin) .ssd-top nav{display:flex!important;flex-wrap:wrap;justify-content:center;gap:8px!important;background:#fff;border:1px solid #E1EAF3;border-radius:99px;padding:6px!important;width:max-content;max-width:100%;margin:0 auto;box-shadow:0 6px 18px -10px rgba(24,56,88,.25)}
.sd-skin:not(.sd-admin) .ssd-top nav a{color:#5B7089!important;font-weight:800!important;padding:8px 16px!important;border-radius:99px!important;background:transparent!important;text-decoration:none}
.sd-skin:not(.sd-admin) .ssd-top nav a:hover{color:#1F5F96!important;background:#EAF3FB!important}
.sd-skin:not(.sd-admin) .ssd-top nav a.on,.sd-skin:not(.sd-admin) .ssd-top nav a.active{color:#fff!important;background:linear-gradient(135deg,#1F5F96,#2A7BC0)!important}
.sd-skin .ssd-top + *{position:relative;z-index:1}
.sd-skin :is(.wrap,.page){position:relative;z-index:1}
.sd-skin .card:not(.hdr *){animation:sdSkinUp .5s ease both}
.sd-skin .pill.gold,.sd-skin .gold{background:#FFF1DC!important;color:#B86A06!important}
.sd-skin .pill.green,.sd-skin .green{background:#E3F6EE!important;color:#138A5B!important}
.sd-skin .btn.ghost:not(.hdr *){background:#fff!important;color:#183858!important;border:1.5px solid #E1EAF3!important}
.sd .logo-section-auth{text-align:center}.sd .logo-section-auth a{display:inline-block}.sd .logo-section-auth img,.sd img.logo-auth{display:block;margin-left:auto!important;margin-right:auto!important}
