/* FIRSTCODE 1.13.0 — Awwal Hatif Daylight Experience
 * Light-only operational shell. Brand green + gold, no theme switcher.
 */
:root{
  color-scheme:light;
  --day-bg:#F5F8F4;
  --day-surface:#FFFFFF;
  --day-surface-soft:#F8FAF7;
  --day-green:#054515;
  --day-green-2:#0B6B2C;
  --day-green-3:#118442;
  --day-green-soft:#EDF7EF;
  --day-gold:#CB982D;
  --day-gold-2:#E2B64A;
  --day-gold-soft:#FFF8E7;
  --day-text:#17231A;
  --day-muted:#66756B;
  --day-border:#E2E9E3;
  --day-shadow:0 14px 40px rgba(5,69,21,.07);
  --day-shadow-soft:0 5px 18px rgba(20,42,26,.055);
}
html[data-theme="light"],body{color-scheme:light}
body:not(.auth-app-page){background:var(--day-bg);color:var(--day-text)}

/* Admin navigation */
.sidebar{
  background:
    radial-gradient(circle at 75% 2%,rgba(226,182,74,.16),transparent 12rem),
    linear-gradient(180deg,#043B13 0%,#032D10 58%,#02240C 100%);
  box-shadow:-12px 0 38px rgba(2,36,12,.16);
}
.sidebar-brand{padding:1.15rem 1.1rem;border-bottom-color:rgba(255,255,255,.08)}
.sidebar-brand-logo{width:44px!important;height:44px!important;padding:4px!important;background:#fff;border:1px solid rgba(226,182,74,.38);box-shadow:0 7px 22px rgba(0,0,0,.14)}
.sidebar-brand-name{font-size:1rem;letter-spacing:-.015em}.sidebar-brand-sub{color:rgba(255,255,255,.48)!important}
.nav-section-label{color:rgba(255,255,255,.38);letter-spacing:.06em}
.nav-item{border-radius:10px 0 0 10px;margin:.08rem .55rem .08rem 0;padding:.68rem .82rem;border-right:2px solid transparent}
.nav-item:hover{background:rgba(255,255,255,.07);border-right-color:rgba(226,182,74,.72)}
.nav-item.active{background:linear-gradient(90deg,rgba(203,152,45,.14),rgba(255,255,255,.075));border-right-color:var(--day-gold);box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.nav-item.active .nav-icon,.nav-item:hover .nav-icon{color:#F2C85F}
.sidebar-user-avatar{background:rgba(203,152,45,.14);border-color:rgba(226,182,74,.35);color:#F2C85F}

/* Admin daylight topbar */
.admin-main{background:
  radial-gradient(circle at 4% 0%,rgba(203,152,45,.055),transparent 20rem),
  linear-gradient(180deg,#F9FBF8 0%,var(--day-bg) 20rem)}
.admin-topbar{
  height:72px;padding:0 1.5rem;background:rgba(255,255,255,.94);
  border-bottom:1px solid var(--day-border);box-shadow:0 8px 26px rgba(29,49,35,.045);
  backdrop-filter:blur(14px) saturate(140%);
}
.admin-topbar::after{content:"";position:absolute;right:0;left:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(203,152,45,.55),rgba(5,69,21,.35),transparent);pointer-events:none}
.topbar-right,.topbar-left{gap:.65rem}.topbar-right{min-width:0}
.topbar-page-context{display:flex;flex-direction:column;gap:.05rem;min-width:0;line-height:1.25}
.topbar-page-context strong{color:var(--day-green);font-size:.98rem;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:36vw}
.topbar-kicker{display:flex;align-items:center;gap:.35rem;color:var(--day-muted);font-size:.7rem;font-weight:600}
.topbar-kicker i{color:var(--day-gold)}
.hamburger-btn{border-color:var(--day-border);background:#fff;color:var(--day-green);border-radius:11px}
.hamburger-btn:hover{background:var(--day-green);border-color:var(--day-green)}
.topbar-site-link{display:inline-flex;align-items:center;gap:.45rem;min-height:39px;padding:.48rem .78rem;border:1px solid var(--day-border);border-radius:11px;background:#fff;color:var(--day-green);font-size:.78rem;font-weight:700;box-shadow:0 2px 8px rgba(20,42,26,.025)}
.topbar-site-link:hover{color:var(--day-green);border-color:#C9D8CB;background:var(--day-green-soft);transform:translateY(-1px)}
.topbar-user-pill{padding:.32rem .45rem .32rem .72rem;border-radius:13px;background:#fff;border:1px solid var(--day-border);color:var(--day-text);box-shadow:0 2px 8px rgba(20,42,26,.025)}
.topbar-avatar{width:34px;height:34px;background:linear-gradient(145deg,var(--day-green),var(--day-green-2));box-shadow:0 5px 13px rgba(5,69,21,.16)}
.topbar-user-copy{display:flex;flex-direction:column;line-height:1.18;min-width:0}.topbar-user-copy strong{font-size:.78rem;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-user-copy small{font-size:.63rem;color:var(--day-muted);margin-top:2px}
.topbar-logout-btn{height:39px;border-radius:11px;background:#FFF8F7;border-color:#F4D3D0;color:#A93C34}.topbar-logout-btn:hover{background:#FFF0EE}
.page-header{padding-top:1.4rem}.page-title{color:var(--day-text);font-size:clamp(1.35rem,1.15rem + .55vw,1.75rem);letter-spacing:-.02em}
.admin-content{padding-top:.9rem}

/* Dashboard hierarchy */
.dashboard-intro{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.35rem 1.45rem;margin-bottom:1rem;border:1px solid var(--day-border);border-radius:18px;background:linear-gradient(120deg,#fff 0%,#FBFDF9 72%,#FFF9EB 100%);box-shadow:var(--day-shadow-soft);position:relative;overflow:hidden}
.dashboard-intro::before{content:"";position:absolute;top:0;right:0;width:4px;height:100%;background:linear-gradient(var(--day-green),var(--day-gold))}
.dashboard-intro h2{margin:.28rem 0 .18rem;font-size:1.2rem;color:var(--day-green);font-weight:800}.dashboard-intro p{margin:0;color:var(--day-muted);font-size:.82rem}.dashboard-intro-kicker{display:inline-flex;align-items:center;gap:.4rem;color:var(--day-gold);font-size:.72rem;font-weight:700}.dashboard-intro-status{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .72rem;border-radius:999px;background:var(--day-green-soft);border:1px solid #D5E8D8;color:var(--day-green);font-size:.72rem;font-weight:700;white-space:nowrap}.dashboard-intro-status span{width:8px;height:8px;border-radius:50%;background:#19A45B;box-shadow:0 0 0 5px rgba(25,164,91,.1)}
.dash-grid{gap:1rem}.dash-card{border:1px solid var(--day-border);box-shadow:var(--day-shadow-soft);min-height:132px;overflow:hidden;isolation:isolate}
.dash-card::after{content:"";position:absolute;inset:auto -25px -42px auto;width:100px;height:100px;border-radius:50%;background:color-mix(in srgb,var(--metric-accent) 7%,transparent);z-index:-1}
.dash-card:hover{transform:translateY(-3px);box-shadow:var(--day-shadow)}
.dash-card-icon{background:color-mix(in srgb,var(--metric-accent) 10%,#fff);border:1px solid color-mix(in srgb,var(--metric-accent) 16%,transparent)}
.card,.client-section{border-color:var(--day-border);box-shadow:var(--day-shadow-soft)}
.mini-stat,.dash-small-stat{background:#FAFCFA;border-color:var(--day-border)}

/* Client daylight topbar */
.client-topbar{
  min-height:72px;height:auto;padding:.62rem max(1.15rem,env(safe-area-inset-right));
  background:rgba(255,255,255,.96);border-bottom:1px solid var(--day-border);
  box-shadow:0 8px 30px rgba(15,50,24,.055);backdrop-filter:blur(16px) saturate(145%);
}
.client-topbar-brand{color:var(--day-text);gap:.65rem}.client-topbar-brand:hover{color:var(--day-green)}
.client-brand-mark{width:44px;height:44px;display:grid;place-items:center;border:1px solid #E6D8AF;border-radius:13px;background:linear-gradient(145deg,#fff,#FFF9EA);box-shadow:0 5px 16px rgba(76,58,13,.07);flex:0 0 auto}.client-brand-mark img{width:36px!important;height:36px!important;object-fit:contain;filter:none!important}
.client-brand-copy{display:flex;flex-direction:column;min-width:0;line-height:1.12}.client-brand-copy strong{color:var(--day-green);font-size:.9rem;font-weight:800}.client-brand-copy small{color:var(--day-muted);font-size:.63rem;letter-spacing:.045em;margin-top:3px}
.client-topbar-links{gap:.2rem}.client-topbar-links>a{color:#526158;border-radius:10px;padding:.5rem .75rem;font-weight:650}.client-topbar-links>a:hover{color:var(--day-green);background:var(--day-green-soft);border-color:#D9E9DC}.client-topbar-links>a.active{color:var(--day-green);background:linear-gradient(180deg,#F2F8F3,#EAF5EC);border-color:#D2E5D5;box-shadow:inset 0 -2px 0 var(--day-gold)}
.client-topbar-links .btn-nav-logout{background:#FFF8F7!important;border-color:#F2D7D4!important;color:#A3483F!important}
.client-topbar-actions{gap:.5rem}.client-topbar-icon{color:var(--day-green);background:#fff;border:1px solid var(--day-border);box-shadow:0 2px 8px rgba(20,42,26,.025)}.client-topbar-icon:hover{color:var(--day-green);background:var(--day-green-soft);border-color:#D2E5D5}
.client-topbar-profile{display:flex;align-items:center;gap:.5rem;width:auto;height:42px;padding:.28rem .42rem .28rem .72rem;border:1px solid var(--day-border);background:#fff;color:var(--day-text);border-radius:12px}.client-topbar-profile:hover{background:#FAFCFA;color:var(--day-green)}
.client-profile-avatar{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--day-green);color:#fff}.client-profile-copy{display:flex;flex-direction:column;line-height:1.12;min-width:0}.client-profile-copy strong{font-size:.72rem;max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.client-profile-copy small{font-size:.6rem;color:var(--day-muted);margin-top:2px}
.client-notif-badge{box-shadow:0 0 0 2px #fff}
.client-nav-wrapper{padding-top:2rem}
.client-page-header--welcome{padding:1.15rem 1.2rem;border:1px solid var(--day-border);border-radius:18px;background:linear-gradient(120deg,#fff,#F8FCF8 72%,#FFF9EB);box-shadow:var(--day-shadow-soft)}
.client-page-eyebrow{display:inline-flex;align-items:center;gap:.4rem;color:var(--day-gold)!important}.client-page-title{color:var(--day-green)!important;margin-top:.2rem}
.client-summary-card{box-shadow:var(--day-shadow-soft);border-color:var(--day-border)}
.client-summary-card--balance{background:linear-gradient(135deg,#043B13 0%,#07531C 68%,#0A6828 100%);box-shadow:0 18px 40px rgba(5,69,21,.15)}
.client-summary-card--balance::after{content:"";position:absolute;width:110px;height:110px;left:-30px;top:-40px;border-radius:50%;border:18px solid rgba(226,182,74,.14)}
.client-quick-action{box-shadow:var(--day-shadow-soft);border-color:var(--day-border)}
.client-quick-action:hover{border-color:#CFE0D1;box-shadow:var(--day-shadow)}
.client-bottom-nav{background:rgba(255,255,255,.97);border-top-color:var(--day-border);box-shadow:0 -8px 24px rgba(20,42,26,.06)}
.client-bottom-nav a.active{color:var(--day-green);background:var(--day-green-soft)}

/* Subtle motion, never distracting. */
@media (prefers-reduced-motion:no-preference){
  .admin-content>*,.client-nav-wrapper>*{animation:fc-day-rise .38s cubic-bezier(.2,.75,.25,1) both}
  .admin-content>*:nth-child(2),.client-nav-wrapper>*:nth-child(2){animation-delay:.035s}
  .admin-content>*:nth-child(3),.client-nav-wrapper>*:nth-child(3){animation-delay:.07s}
  .dash-card,.client-summary-card,.client-quick-action{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
  @keyframes fc-day-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}

@media(max-width:900px){
  .topbar-site-link span,.client-profile-copy{display:none}.client-topbar-profile{width:42px;padding:.25rem;justify-content:center}.client-profile-avatar{width:32px}
}
@media(max-width:767px){
  .admin-topbar{height:62px;padding-inline:.8rem}.topbar-page-context strong{font-size:.86rem;max-width:45vw}.topbar-kicker{font-size:.62rem}.topbar-user-copy{display:none}.topbar-user-pill{padding:.26rem}.topbar-avatar{width:34px;height:34px}.topbar-site-link{width:38px;padding:0;justify-content:center}.dashboard-intro{align-items:flex-start;flex-direction:column;padding:1rem}.dashboard-intro-status{font-size:.68rem}
  .client-topbar{min-height:64px;padding:.48rem .8rem}.client-brand-mark{width:40px;height:40px}.client-brand-mark img{width:33px!important;height:33px!important}.client-brand-copy small{display:none}.client-topbar-links{display:none}.client-topbar-profile{display:none}.client-nav-wrapper{padding-top:1.15rem}.client-page-header--welcome{padding:1rem}
}
@media(max-width:420px){.topbar-site-link{display:none}.topbar-left{gap:.3rem}.client-brand-copy strong{font-size:.82rem}.client-topbar-icon{width:40px;height:40px}.page-header{padding-top:1rem}}
@media print{.admin-topbar,.client-topbar,.dashboard-intro{display:none!important}}
