/* COOKIEBANÉRET (R267, GDPR_COOKIE_DPA_CONTRACT.md §2). Bara app.css:s variabler, så ljust och
   mörkt läge (html[data-theme] och prefers-color-scheme) följer utan en egen färg här. Logiska
   egenskaper och radbrytning överallt: en text som är 40 % längre (tyska, finska) får plats, och
   knapparna bryts till nästa rad i stället för att klippas. */

.cookiebanner{
  position:fixed;inset-inline:0;inset-block-end:0;z-index:1100;
  background:var(--color-surface);color:var(--color-text);
  border-block-start:1px solid var(--color-border);
  box-shadow:0 -6px 24px var(--color-shadow,rgba(0,0,0,.12));
  max-block-size:85vh;max-block-size:85dvh;overflow-y:auto;
  font-family:var(--font-sans);font-size:14px;line-height:1.5;
}
.cookiebanner[hidden]{display:none}
.cookieinner{
  max-inline-size:1100px;margin-inline:auto;
  padding-block:16px 18px;padding-inline:22px;
}
.cookiebanner h2{
  font-family:var(--font-serif);font-size:17px;font-weight:600;line-height:1.3;
  margin-block:0 6px;margin-inline:0;color:var(--color-text);
}
.cookiebanner h2:focus{outline:none}
.cookiebanner h2:focus-visible{outline:2px solid var(--color-accent-text);outline-offset:2px;border-radius:4px}
.cookiebanner p{margin-block:0 10px;margin-inline:0;max-inline-size:80ch;overflow-wrap:break-word}
.cookiebanner .cookieactions{display:flex;flex-wrap:wrap;gap:10px;margin-block-start:4px}
/* De tre valen lika framträdande (§2.2): samma knapp, ingen förvald. */
.cookiebanner .cookieactions .btn{
  min-block-size:44px;min-inline-size:9em;max-inline-size:100%;
  white-space:normal;overflow-wrap:break-word;color:var(--color-text);
}
.cookiebanner .btn:focus-visible{outline:2px solid var(--color-accent-text);outline-offset:2px}
.cookiebanner .cookieactions .btn.primary{color:var(--color-accent-contrast)}

.cookiecats{display:grid;gap:12px;margin-block:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.cookiecat{
  border:1px solid var(--color-border);border-radius:10px;
  padding-block:12px;padding-inline:14px;margin:0;min-inline-size:0;
  background:var(--color-surface-2);
}
.cookiecat legend{
  font-weight:650;padding-inline:4px;color:var(--color-text);
  /* legend sitter i ramen: en bakgrund så att linjen inte går genom texten */
  background:var(--color-surface-2);border-radius:4px;
}
.cookiecat p{margin-block:0 8px}
.cookiecat .cookiemuted{color:var(--color-muted)}
.cookietoggle{display:flex;align-items:flex-start;gap:10px;cursor:pointer;min-block-size:28px}
.cookietoggle input{inline-size:18px;block-size:18px;margin:0;margin-block-start:2px;flex:0 0 auto;accent-color:var(--color-accent)}
.cookietoggle input:focus-visible{outline:2px solid var(--color-accent-text);outline-offset:2px}
.cookietoggle input[disabled]{cursor:not-allowed}
.cookietoggle input[disabled] + span{color:var(--color-muted)}
.cookietech{
  list-style:none;margin-block:0 8px;margin-inline:0;padding:0;
  display:flex;flex-wrap:wrap;gap:4px 8px;font-size:12px;color:var(--color-muted);
}
.cookietech code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow-wrap:anywhere}
.cookienote{color:var(--color-muted);font-size:13px}

/* "Ditt val är sparat." — kort, och utan att låsa något. */
.cookiesaved{
  position:fixed;inset-block-end:16px;inset-inline-start:50%;transform:translateX(-50%);z-index:1100;
  background:var(--color-surface);color:var(--color-text);
  border:1px solid var(--color-border);border-radius:10px;
  padding-block:10px;padding-inline:16px;box-shadow:0 6px 24px var(--color-shadow,rgba(0,0,0,.12));
  max-inline-size:calc(100vw - 32px);
}
.cookiesaved[hidden]{display:none}

/* Så länge banéret står öppet krymper sidan med dess höjd: inget av den (fältet att skriva i,
   knappen Logga in) hamnar bakom banéret, och inget låses. */
html.cookiebar-open .app,
html.cookiebar-open .auth,
html.cookiebar-open .consent{block-size:calc(100vh - var(--cookiebar-space,0px));block-size:calc(100dvh - var(--cookiebar-space,0px))}

/* SIDFOTEN (§2.4): länken Cookieinställningar, på inloggningssidan och i appens ram. */
.cookiefoot{
  flex:0 0 auto;display:flex;justify-content:flex-end;flex-wrap:wrap;
  border-block-start:1px solid var(--color-border);background:var(--color-surface);
  padding-block:0;padding-inline:16px;
}
.cookiefoot .linkbtn{min-block-size:30px;padding-block:4px;padding-inline:6px;font-size:12px}