/* The site's look (version E, 11 Nov 2026) on the public pages that are not the home page: "Créer ma carte",
   sign-in and sign-up, legal pages. Dark navy, Geist, light blue for details, one orange for the actions. */
body.site, body.auth, body.legal {
  --e-bg: #060A14; --e-card: #0E1628; --e-text: #D6DDEC; --e-head: #F2F5FB; --e-muted: #8C97B0; --e-line: rgba(255, 255, 255, .09);
  --e-blue: #7FA2FF; --e-orange: #FF7A2E;
  font-family: "Geist", "DM Sans", system-ui, sans-serif;
}
/* Créer ma carte (site.css) */
body.site { --night: var(--e-bg); --body: "Geist", system-ui, sans-serif; --display: "Geist", system-ui, sans-serif; --blue-hi: var(--e-blue); }
body.site .btn-primary { background: var(--e-orange); color: #160A02; box-shadow: 0 10px 30px -12px rgba(255, 122, 46, .7), inset 0 1px 0 rgba(255, 255, 255, .45); }
body.site .btn-primary:hover { background: #FF8F4D; }

/* sign-in, sign-up, password pages */
body.auth { background: var(--e-bg); color: var(--e-text); }
body.auth .auth-side { background: radial-gradient(120% 80% at 80% 10%, rgba(79, 112, 255, .28), transparent 60%), #0A1020; border-right: 1px solid var(--e-line); }
body.auth .auth-quote { font-family: "Geist", sans-serif; font-weight: 600; letter-spacing: -.035em; color: var(--e-head); }
body.auth .auth-card { width: 100%; max-width: 300px; height: auto; border-radius: 16px; box-shadow: 0 30px 60px -30px #000; display: block; }
body.auth h1 { font-family: "Geist", sans-serif; font-weight: 600; letter-spacing: -.03em; color: var(--e-head); }
body.auth .muted, body.auth .fine { color: var(--e-muted); }
body.auth a { color: var(--e-blue); }
body.auth label { color: var(--e-head); }
body.auth label.check { color: var(--e-muted); }
body.auth input:not([type="checkbox"]) { background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .14); color: var(--e-head); }
body.auth input:focus-visible { outline-color: var(--e-blue); }
body.auth .btn { background: var(--e-orange); color: #160A02; font-weight: 600; box-shadow: 0 10px 30px -12px rgba(255, 122, 46, .7), inset 0 1px 0 rgba(255, 255, 255, .45); }
body.auth .btn:hover { background: #FF8F4D; }
body.auth .error { background: rgba(198, 42, 42, .15); color: #FF9C9C; }
body.auth .flash { background: rgba(15, 123, 79, .18); color: #7EE2B4; }

@media (max-width: 860px) { body.auth .auth-card { display: none; } }

/* legal pages */
body.legal { background: var(--e-bg); color: var(--e-text); }
body.legal h1, body.legal h2 { font-family: "Geist", sans-serif; font-weight: 600; letter-spacing: -.02em; color: var(--e-head); }
body.legal a { color: var(--e-blue); }
body.legal .muted { color: var(--e-muted); }
body.legal .legal-nav { border-top-color: var(--e-line); }
body.legal mark { background: rgba(255, 218, 26, .2); color: var(--e-head); }

/* contact page (on the legal layout) */
body.legal .contact-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 40px; margin-top: 28px; align-items: start; }
body.legal .contact-info p { margin: 0 0 18px; } body.legal .contact-info b { display: block; color: var(--e-head); font-weight: 600; }
body.legal .contact-form { display: grid; gap: 14px; padding: 24px; border-radius: 16px; border: 1px solid var(--e-line); background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .02)); }
body.legal .contact-form label { display: grid; gap: 6px; font-size: 14px; color: var(--e-head); } body.legal .contact-form label small { color: var(--e-muted); }
body.legal .contact-form input, body.legal .contact-form select, body.legal .contact-form textarea { font: inherit; font-size: 15px; padding: 11px 12px; border-radius: 10px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .14); color: var(--e-head); }
body.legal .contact-form select option { color: #111; }
body.legal .contact-form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
body.legal .contact-form .btn { justify-self: start; padding: 12px 22px; border: 0; border-radius: 10px; background: var(--e-orange); color: #160A02; font: 600 15px "Geist", sans-serif; cursor: pointer; }
body.legal .contact-form .btn:hover { background: #FF8F4D; }
body.legal .contact-form .fine { font-size: 13px; color: var(--e-muted); margin: 0; }
body.legal .contact-form .error { background: rgba(198, 42, 42, .15); color: #FF9C9C; padding: 10px 12px; border-radius: 10px; margin: 0; }
body.legal .contact-ok { padding: 24px; border-radius: 16px; border: 1px solid rgba(74, 222, 128, .3); background: rgba(74, 222, 128, .06); }
@media (max-width: 760px) { body.legal .contact-grid { grid-template-columns: 1fr; gap: 20px; } }
