/*
 * V-NOVO LIGHT theme - the whole site is light (header, hero, bands, footer, admin).
 * Picked in WEB-INF/views/theme.jspf (one line switches the whole project between theme-dark / theme-light / theme-premium).
 * Loaded after styles.css, so everything here overrides the dark base.
 * Palette: page #F5F8FD, white cards, soft blue band #E8F1FC, deep navy text #0F1B2D, accent #007FFF.
 * The logo images are swapped for dark-ink versions (the white wordmark would disappear on light).
 */

/* ---------- palette ---------- */
:root{
  --bg:#F5F8FD;        /* page */
  --white:#FFFFFF;     /* cards, drawer, modals */
  --panel:#EAF0F8;     /* soft panels, inputs, qty buttons */
  --line:#D8E2EF;      /* borders */
  --ink:#0F1B2D;       /* main text */
  --slate:#4B5D76;     /* secondary text */
  --tint:#E8F1FC;      /* soft blue band */
  --shadow:0 10px 30px rgba(15,27,45,.08);
}
body{background:var(--bg);color:var(--ink)}

/* ---------- logo: dark-ink images on light backgrounds ---------- */
.wm-img{content:url('/assets/logo-wordmark-dark.png')}
.mark{content:url('/assets/logo-mark-dark.png')}
.hero-logo,.login-stack{content:url('/assets/logo-stacked-dark.png')}
.wm small,.card-sub,.login-tag{color:#5E6E86}

/* ---------- header ---------- */
.site-header{background:rgba(255,255,255,.92);border-bottom:1px solid #E1E9F4;box-shadow:0 2px 14px rgba(15,27,45,.05)}
.menu a:not(.btn){color:var(--slate)}
.menu a:not(.btn):hover,.menu a.active:not(.btn){color:var(--ink)}
.menu-btn span{background:var(--ink)}
.bag-btn svg{fill:var(--ink)}
.bag-btn:hover{background:rgba(0,127,255,.10)}
.acct-btn{color:var(--green);border-color:var(--green)}
.acct-btn:hover{background:var(--green);color:#fff}
.profile-drop{background:#fff;border-color:var(--line);box-shadow:0 18px 40px rgba(15,27,45,.18)}
@media (max-width:1060px){.menu{background:#fff;border-bottom-color:var(--line)}}

/* ---------- hero ---------- */
.hero{background:linear-gradient(165deg,#E6F0FD 0%,#F3F8FF 55%,#FFFFFF 100%)}
.orb{opacity:.20}
.chevron{opacity:.10}
.lead{color:var(--slate)}
.btn-ghost{color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}
.hero-card{background:#fff;border:1px solid #DCE6F3;box-shadow:0 30px 60px rgba(15,27,45,.14)}
.hero-card::after{background:linear-gradient(180deg,#FFFFFF,#F1F6FD)}
.chips span{background:#fff;border-color:var(--line);color:var(--slate)}

/* ---------- sections ---------- */
.section.alt{background:#fff}
.section .sub,.prose p,.panel p,.why p,.card p{color:var(--slate)}
.panel,.why article,.review{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
.section.alt .panel{background:var(--bg)}

/* "Who we serve" band: soft blue tint instead of dark navy */
.dark{background:var(--tint);color:var(--ink)}
.dark::before{opacity:.12}
.dark h2{color:var(--ink)}
.pills li{background:#fff;border-color:#BFD3EC;color:var(--ink)}
.pills li:hover{border-color:transparent;color:#fff}
.steps li{background:#fff;box-shadow:0 4px 14px rgba(15,27,45,.06)}
.steps b{color:var(--ink)}

/* ---------- product cards ---------- */
.card{background:#fff;border-color:var(--line);box-shadow:0 6px 18px rgba(15,27,45,.06)}
.card:hover{box-shadow:0 16px 36px rgba(15,27,45,.14)}
.card h3{color:var(--ink)}
.stage,.thumb{background:radial-gradient(circle at 50% 35%,#ffffff,#DCE8F7 85%);border-bottom-color:var(--line)}
.num{color:#C9D6E8}
.price-row b{color:var(--ink)}
.price-row s{color:#6B7C93}

/* ---------- footer ---------- */
.footer{background:#EAF1FB;color:var(--slate)}
.foot{border-bottom-color:#D2DEEE}
.foot nav a:hover{color:var(--green)}
.foot p,.copy{color:var(--slate)}

/* ---------- forms, cart, popups ---------- */
.form{background:#fff;border-color:var(--line)}
.form input,.form select,.form textarea{background:#fff;border-color:#C9D6E8;color:var(--ink)}
.drawer,.bag-page{background:#fff}
.line,.bag-line{border-color:var(--line)}
.summary{background:var(--bg)}
.modal-box{background:#fff;border-color:var(--line);box-shadow:0 30px 70px rgba(15,27,45,.35)}
.tabs{background:var(--panel)}
.tabs button{color:var(--slate)}
#authForm input,.pform input,.pform textarea{background:#fff;border-color:#C9D6E8;color:var(--ink)}
#authForm .extra{border-color:#C9D6E8}
.order-card{background:var(--bg)}
.acct-card{background:#fff;box-shadow:var(--shadow)}
.qty{border-color:var(--line)}
.qty button{background:var(--panel);color:var(--ink)}
.qty button:hover{background:#DCE6F4}

/* ---------- status colours darker for a light background ---------- */
.verified,.verified-line,.pf-ok{color:#12805A}
.form-err{color:#C62828}
.form-err:not(:empty){background:rgba(198,40,40,.08);border-color:rgba(198,40,40,.35)}
.ok-tick{background:rgba(18,128,90,.12);color:#12805A;border-color:#12805A}
.pill.off{background:rgba(15,27,45,.08);color:var(--slate)}
.dev-otp{background:rgba(0,127,255,.08)}

/* ============================ admin pages (login, dashboard, staff) ============================ */
body.is-login{background:radial-gradient(900px 520px at 85% 0,rgba(0,127,255,.16),transparent 60%),radial-gradient(800px 520px at 0 100%,rgba(0,127,255,.10),transparent 60%),#EAF1FB}
.login-card{background:#fff;box-shadow:0 30px 70px rgba(15,27,45,.18)}
.login-card h1{color:var(--ink)}
.lf-box{background:#fff;border-color:#C9D6E8}
.lf-box input{color:var(--ink)}
.lf-box input::placeholder{color:#8A99AE}
.login-foot{border-top-color:var(--line)}
.login-copy{color:var(--slate)}
.adm-head{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 18px;margin:16px 0 24px;box-shadow:var(--shadow)}
.panel-box{box-shadow:var(--shadow)}
.fld input,.fld select,.fld textarea{background:#fff;border-color:#C9D6E8;color:var(--ink)}
.tag{background:rgba(15,27,45,.08);color:var(--ink)}
.msg.ok{color:#12805A}
.msg.err{color:#C62828}
.abtn{background:#fff;border-color:#C9D6E8}
.who-chip{background:rgba(0,127,255,.12)}
.mini{background:var(--panel)}
tbody tr:hover td{background:rgba(0,127,255,.04)}

/* ---------- landing page only (body.landing): navy-tinted page to match the logo, near-white bands and cards ---------- */
.landing{background:#E9EDF3}
.landing .section.alt,.landing .section.alt .panel,
.landing .panel,.landing .why article,.landing .review,
.landing .pills li,.landing .steps li,.landing .card,
.landing .form,.landing .form input,.landing .form select,.landing .form textarea{background:#F3F8FE}
