/* El Chiki Barber · light version (light.html). Loaded after styles.css and only changes colors:
   an off-white background, near-black text and a darker gold so it reads on white. */
:root{
  --black:#FAFAF7; --charcoal:#F1F0EC; --graphite:#E6E4DF; --black-rgb:250,250,247;
  --line:rgba(154,101,7,.22);
  --text:#1B1B1F; --muted:#5F5C56;
  /* on white, the text gold has to be deeper to keep enough contrast */
  --gold:#A26A07; --gold-light:#8A5A04; --gold-dark:#6E4703; --gold-soft:#C88A14; --gold-bright:#E3A72A;
  --gold-rgb:162,106,7; --gold-ink:#1A1206;
  --gold-gradient:linear-gradient(115deg,#9A6507 0%,#DB9B21 22%,#FFD66E 42%,#F2B93E 58%,#DB9B21 78%,#F2B93E 100%);
  --gold-metal:linear-gradient(180deg,#D4951C 0%,#B97C0C 35%,#946006 62%,#B07510 85%,#C98B15 100%);
}

/* The hero stays a dark island in the light themes. These values copy the styles.css :root block */
.hero{--hero-scrim-rgb:20,20,23;--hero-fade:transparent;
  --text:#F4F1EA;--muted:#A9A398;--line:rgba(219,155,33,.22);
  --gold-bright:#FFE9A8;--gold-light:#FFD66E;--gold-soft:#F2B93E;--gold:#DB9B21;--gold-dark:#9A6507;--gold-rgb:219,155,33;--gold-ink:#1A1206;
  --gold-gradient:linear-gradient(115deg,#9A6507 0%,#DB9B21 22%,#FFD66E 42%,#F2B93E 58%,#DB9B21 78%,#F2B93E 100%)}

/* Soft shadows instead of the black ones of the dark mode */
.header.has-bg{box-shadow:0 8px 30px -18px rgba(40,30,10,.35)}
.button-gold{box-shadow:0 8px 24px -10px rgba(162,106,7,.55)}
.button-gold:hover{box-shadow:0 14px 32px -10px rgba(162,106,7,.7)}
.button-outline:hover{color:var(--gold-ink)}

/* Forms and calendar */
input,select,textarea{background:#fff;border-color:rgba(27,27,31,.14)}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 4px rgba(162,106,7,.14)}
form{background:#fff;box-shadow:0 20px 50px -30px rgba(40,30,10,.3)}
.cal-days button{background:var(--charcoal)}
.cal-days button:disabled{color:#b3afa7}
.credits{color:#6B675F}

/* 3D labels */
.label-3d{background:rgba(255,255,255,.94);box-shadow:0 6px 18px -8px rgba(0,0,0,.35)}
.compass{background:rgba(255,255,255,.9)}
.view-3d-canvas::after{box-shadow:inset 0 0 60px 0 rgba(250,250,247,.5)}
.clipper-box .clipper{box-shadow:0 30px 60px -30px rgba(40,30,10,.45),0 0 0 1px var(--line)}

/* Round logo (it is black): a gold ring so it does not look like a hole on white */
.brand img,.panel-header img{box-shadow:0 0 0 2px rgba(219,155,33,.55),0 6px 18px -6px rgba(40,30,10,.35)}

/* Footer signature: a stronger outline on white */
.signature-outline{stroke:rgba(162,106,7,.6)}

/* Fixed mobile bar */
.mobile-bar{box-shadow:0 -10px 30px -20px rgba(40,30,10,.35)}