@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@300;400;500;600;700;800&display=swap');

:root{
 --dt-primary:#1C1C4F; --dt-primary-2:#29296b; --dt-secondary:#F16222;
 --dt-bg:#f7f8fc; --dt-card:#fff; --dt-text:#17172f; --dt-muted:#6f7185;
 --dt-border:#e8e9f1; --dt-shadow:0 12px 35px rgba(28,28,79,.08);
 --dt-radius:18px;
}
html{font-size:16px}
body{font-family:'Noto Sans Arabic',system-ui,sans-serif;background:var(--dt-bg);color:var(--dt-text);min-height:100vh}
a{color:var(--dt-primary);font-weight:500}
a:hover{color:var(--dt-secondary)}
.navbar.dt-navbar{background:var(--dt-primary)!important;box-shadow:0 8px 24px rgba(28,28,79,.16);padding:.8rem 0}
.dt-brand{font-weight:800;letter-spacing:-.4px;color:#fff!important}
.dt-brand-mark{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;border-radius:12px;background:var(--dt-secondary);margin-inline-end:.55rem;color:#fff}
.dt-navbar .nav-link{color:rgba(255,255,255,.82)!important;border-radius:10px;padding:.55rem .8rem}
.dt-navbar .nav-link:hover,.dt-navbar .nav-link.active{color:#fff!important;background:rgba(255,255,255,.1)}
main#main-content{max-width:1320px}
.btn{border-radius:12px;font-weight:700;padding:.65rem 1rem;border-width:1px;transition:.2s ease}
.btn-primary{background:var(--dt-secondary);border-color:var(--dt-secondary)}
.btn-primary:hover,.btn-primary:focus{background:#d95117;border-color:#d95117;transform:translateY(-1px)}
.btn-outline-primary{color:var(--dt-primary);border-color:var(--dt-primary)}
.btn-outline-primary:hover{background:var(--dt-primary);border-color:var(--dt-primary)}
.btn-outline-light{border-radius:11px}
.card{border:1px solid var(--dt-border)!important;border-radius:var(--dt-radius)!important;box-shadow:var(--dt-shadow)!important;background:var(--dt-card)}
.form-control,.form-select{border:1px solid #dfe1eb;border-radius:12px;padding:.72rem .9rem;background:#fff}
.form-control:focus,.form-select:focus{border-color:var(--dt-secondary);box-shadow:0 0 0 .2rem rgba(241,98,34,.12)}
.badge{border-radius:999px;padding:.42rem .7rem;font-weight:700}
.text-bg-light{background:#f0f0f8!important;color:var(--dt-primary)!important}
.hero{position:relative;overflow:hidden;border-radius:28px;padding:clamp(3rem,8vw,6.5rem) 1.5rem;background:linear-gradient(135deg,var(--dt-primary),#303071);color:#fff;box-shadow:0 22px 55px rgba(28,28,79,.2)}
.hero:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:var(--dt-secondary);opacity:.16;right:-80px;top:-100px}
.hero h1,.hero p,.hero .btn{position:relative;z-index:1}
.hero .btn-outline-secondary{color:#fff;border-color:rgba(255,255,255,.5)}
.hero .btn-outline-secondary:hover{background:#fff;color:var(--dt-primary)}
.auth-card{max-width:560px;margin:2rem auto}
.page-title{font-weight:800;letter-spacing:-.6px}
.course-card{overflow:hidden;height:100%;transition:transform .2s ease,box-shadow .2s ease}
.course-card:hover{transform:translateY(-4px);box-shadow:0 18px 42px rgba(28,28,79,.13)!important}
.course-cover{height:145px;background:linear-gradient(135deg,var(--dt-primary),var(--dt-primary-2));display:flex;align-items:flex-end;padding:1.25rem;color:#fff}
.course-cover .level{background:rgba(255,255,255,.15);backdrop-filter:blur(5px)}
.rating{color:var(--dt-secondary);font-weight:700}
.section-heading{font-weight:800}
.alert{border:0;border-radius:14px}
footer.dt-footer{margin-top:4rem;background:var(--dt-primary);color:rgba(255,255,255,.75);padding:2rem 0}
@media(max-width:767.98px){
 main#main-content{padding-top:1.5rem!important}
 .hero{border-radius:20px;padding:3.5rem 1.1rem}
 .navbar.dt-navbar{padding:.6rem 0}
 .dt-navbar .navbar-collapse{padding-top:.75rem}
}