/* Cookie consent dialog. Its own file, linked from the dialog markup itself
   (api/consent.py), so it is styled on every page: the home page never
   loaded styles.css and showed the dialog unstyled (Gal, 2026-10-20). */
.consent { --accent: #C6F24E; --ink: #E8EAED; --on-accent: #08090B; color: #E8EAED; font-family: Archivo, system-ui, sans-serif; }
.consent { position: fixed; inset: auto 0 0 0; z-index: 60; display: flex;
           justify-content: center; padding: 24px;
           background: linear-gradient(180deg, transparent, rgba(4,5,6,.55)); }
.cbox { max-width: 560px; width: 100%; border: 1px solid #2A3037;
        border-radius: 20px; background: #0B0C0F; padding: 24px 26px;
        box-shadow: 0 30px 80px rgba(0,0,0,.6); }
.chead2 { display: flex; align-items: center; gap: 10px; }
.cmark { width: 52px; display: block; flex: none; }
.ck2 { font-family: "JetBrains Mono", monospace; font-size: 10.5px;
       letter-spacing: .18em; color: #7C848C; }
.ct1b { font-weight: 700; font-size: 18px; margin-top: 14px; }
.cbody { font-size: 14px; color: #9BA3AB; line-height: 1.65; margin: 8px 0 0; }
.crow { display: flex; align-items: center; justify-content: space-between;
        gap: 12px; padding: 10px 0; border-bottom: 1px solid #0F1216;
        cursor: pointer; }
.crow > div { min-width: 0; }
.crow b { display: block; font-size: 13.5px; }
.crow span:not(.sw) { font-size: 12px; color: #737B83; }
.crow input { position: absolute; opacity: 0; pointer-events: none; }
.sw { flex: none; width: 36px; height: 20px; border-radius: 999px; padding: 2px;
      background: #20262C; transition: .15s; }
.sw i { display: block; width: 16px; height: 16px; border-radius: 50%;
        background: #737B83; transition: .15s; }
.sw.locked, .crow input:checked ~ .sw { background: var(--accent); }
.sw.locked i, .crow input:checked ~ .sw i { background: #08090B;
        transform: translateX(16px); }
.sw.locked { opacity: .55; }
.crow input:focus-visible ~ .sw { outline: 2px solid var(--accent); outline-offset: 2px; }
.cbtns { margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap; }
/* One class for both answers: "Essential only" is as big and as bold as
   "Accept selection", so neither reads as the expected choice (legal review
   2026-10-16, A11: EU regulators fine the ghost-button pattern). */
.cb { flex: 1; border-radius: 10px; padding: 11px; font: inherit;
      font-size: 14px; font-weight: 700; cursor: pointer; border: 0;
      background: var(--accent); color: var(--on-accent); }
.cb:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
/* the same box inline on the /consent page (Cookie settings in the footer) */
.consent.inline { position: static; inset: auto; padding: 0; background: none;
                  display: block; margin: 8px 0 24px; }
.consent.inline .cbox { box-shadow: none; max-width: 640px; }
@media (max-width: 560px) { .consent { padding: 10px; } .consent.inline { padding: 0; } }

/* phone: the consent sheet covered 780 of 812px, the whole first screen; it
   is a strip now, the same choices, a third of the height */
@media (max-width: 640px) {
  .consent { padding: 8px; }
  .cbox { padding: 14px 16px 12px; border-radius: 14px; }
  .chead2 { display: none; }
  .ct1b { font-size: 15px; margin-top: 0; }
  .cbody { font-size: 13px; line-height: 1.45; margin-top: 4px; }
  .crow { padding: 6px 0; }
  .crow b { font-size: 13px; }
  .crow span:not(.sw) { font-size: 11.5px; }
  .cbtns { margin-top: 10px; gap: 8px; }
  .cb { padding: 9px; font-size: 13.5px; }
}

/* the logo and the link inherit nothing on pages without styles.css (home) */
.consent .cmark img { width: 100%; height: auto; display: block; }
.consent .cbody a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.consent .cbody a:hover { color: #E4FFA1; }