/* F5R — Malak (ملاك) light skin */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800&display=swap');

:root{
  --m-bg:#f5f5f7; --m-card:#ffffff; --m-border:#e9e9ee;
  --m-text:#231f1e; --m-muted:#7a7a85;
  --m-primary:#ffd700; --m-primary-dark:#d9b100; --m-primary-soft:#fff8d1;
}

html,body,#root{background:var(--m-bg)!important;color:var(--m-text)!important;
  font-family:'PingARLT','Tajawal',-apple-system,sans-serif!important}
#root *{font-family:inherit}
#root ::placeholder{color:#a5a5ae!important}

#root [class*="rounded"]{border-radius:8px!important}
#root .rounded-full{border-radius:9999px!important}

#root .f5r-workspace{background:var(--m-bg)!important;background-image:none!important;
  --background:240 9% 96%;--foreground:15 6% 13%;--card:0 0% 100%;--card-foreground:15 6% 13%;
  --muted:240 6% 95%;--muted-foreground:240 4% 50%;--border:240 10% 92%;--input:240 10% 92%;
  --popover:0 0% 100%;--popover-foreground:15 6% 13%;--accent:51 100% 95%;--accent-foreground:15 6% 13%;
  --secondary:240 6% 96%;--secondary-foreground:15 6% 13%}
#root .f5r-workspace header{background:#fff!important}

#root input,#root textarea,#root select{background:#fff!important;color:var(--m-text)!important;
  border:1px solid var(--m-border)!important;border-radius:8px!important}
#root input:focus,#root textarea:focus,#root select:focus{border-color:var(--m-primary)!important;
  box-shadow:0 0 0 3px var(--m-primary-soft)!important;outline:none!important}

#root aside,#root nav{background:#fff!important;border-color:var(--m-border)!important}
#root header{background:rgba(255,255,255,.92)!important;backdrop-filter:blur(8px);
  border-bottom:1px solid var(--m-border)!important}

.m-bd{border-color:var(--m-border)}
.m-card{background:var(--m-card)!important;box-shadow:0 2px 10px rgba(17,17,26,.04)!important;border-radius:8px!important;transition:box-shadow .3s}
.m-card:hover{box-shadow:0 6px 22px rgba(17,17,26,.08)!important}
.m-primary-btn{background:var(--m-primary)!important;color:#231f1e!important;border:1px solid var(--m-primary)!important;
  font-weight:700!important;border-radius:6px!important;transition:.2s}
.m-primary-btn:hover{background:var(--m-primary-dark)!important}
.m-outline-btn{background:#fff!important;color:var(--m-text)!important;border:1px solid var(--m-border)!important;border-radius:6px!important}
.m-outline-btn:hover{border-color:var(--m-primary)!important;color:var(--m-primary-dark)!important}

#root h1,#root h2{color:var(--m-text)!important;font-weight:800!important}
#root main h1::after,#root main h2::after{content:"";display:block;width:42px;height:3px;margin-top:6px;
  background:var(--m-primary);border-radius:3px}

#root ::-webkit-scrollbar{width:6px}
#root ::-webkit-scrollbar-thumb{background:var(--m-primary);border-radius:6px}