/* Optikerinfo theme (design system rollout, 2026-11-06, theme1).
   Paper #FAFAF8, white surface cards, ink #1A1D21 / #4A5058 / #6B7280,
   line #E3E1DC, focus #B45309, radius 6/10/16/999, shadow-1 only.
   Accent #A82A15: the site's own brick red (style.css: top-nav current
   item and h2 link hover), accent ink #7F2110 is the darker readable form.
   The teal header band (images/bg.gif) is kept as the site's brand header. */
:root{
  --paper:#FAFAF8;
  --surface:#fff;
  --ink:#1A1D21;
  --ink-2:#4A5058;
  --ink-3:#6B7280;
  --line:#E3E1DC;
  --focus:#B45309;
  --accent:#A82A15;
  --accent-ink:#7F2110;
  --chip-green:#84dd8b;
  --radius-s:6px;
  --radius-m:10px;
  --radius-l:16px;
  --radius-full:999px;
  --shadow-1:0 1px 2px rgba(26,29,33,.08);
}
html,body{background:var(--paper) url(../images/bg.gif) repeat-x;}
body{color:var(--ink);font-family:"Inter",-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:15px;line-height:1.6;}
input,select,textarea,button{font-family:inherit;}
a{color:var(--accent-ink);}
a:hover{text-decoration:underline;}
:focus{outline:2px solid var(--focus);outline-offset:2px;}
h1,h2,h3,h4,h5{color:var(--ink);}
h5{color:#fff;}
small,.muted,.hint{color:var(--ink-3);}
hr{border-color:var(--line);color:var(--line);}
#content{max-width:1200px;}
/* Top navigation sits on the teal header band, so it stays light. */
#top li a{color:rgba(255,255,255,.88);}
#top li a.current{background:var(--accent);color:#fff;border-radius:var(--radius-s);}
#top li a:hover{background:rgba(255,255,255,.14);color:#fff;}
h2 a:hover{background:var(--accent);color:#fff;border-radius:var(--radius-s);}
/* Panels: the grey #eee boxes become white surface cards. */
div#intro,div#edit-add-box,div#info_kommentarform,div#info_presentation,div#info_adsense_block,div#index_i_fokus,div#kommentarsruta,div#navigering,div#topblock,div#kedja_info,div#ort_info,div#senaste_betygsatta,div#oppettider,div#oppettider2,div#taggar,div#snittbetyg,div#alternativ,div#samma_stad,div#humor,div#omrade,div#kedja_vikt,div#andra_och_lagg_till,div#index,div#kontakt,div#adress,div#lagg_till_ny,div#betyg,div#resultat,div#content2{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-l);box-shadow:var(--shadow-1);}
div#kommentarsruta_svar{background:#c4f2c8;border:1px solid var(--line);border-radius:var(--radius-l);box-shadow:var(--shadow-1);}
div#tipbox{background:var(--surface);border:1px dashed #7cd975;border-radius:var(--radius-m);}
/* Green search chips keep the site's green, as rounded chips. */
a.sok,span.tagg{background-color:var(--chip-green);color:var(--ink);border-radius:var(--radius-full);padding:2px 10px;}
a.sok:hover{background:var(--accent);color:#fff;}
span.tagg:hover{background-color:var(--chip-green);color:var(--ink);}
/* Lists: olive text becomes ink, hover becomes a warm paper tint. */
.lista li a,.lista li em,.list li a,.list li em,.toplist li a,.toplist li em,.list2 li a,.list2 li em{color:var(--ink-2);}
.lista li a:hover,.list li a:hover,.toplist li a:hover,.list2 li a:hover{background:#f6f3ec;color:var(--ink);}
#content ul.lista{border-top-color:var(--line);}
.lista li,.list li,.toplist li,.list2 li{border-bottom-color:var(--line);}
#footermenu ul.list{border-top-color:var(--line);}
#navigering a{color:var(--accent-ink);}
/* Footer. */
#footer,#footermenu{border-top:1px solid var(--line);}
#footer p,#footermenu p{color:var(--ink-2);}
#footer a,#footermenu a{color:var(--accent-ink);}
/* Forms. */
fieldset{border:1px solid var(--line);border-radius:var(--radius-m);}
#searchform div input,input.comment-field,textarea.required,input.no-required,textarea.no-required{border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface);}
input[type="submit"],input[type="button"],button{background:var(--accent);color:#fff;border:1px solid rgba(0,0,0,.12);border-radius:var(--radius-full);padding:8px 18px;font-weight:600;cursor:pointer;}
input[type="submit"]:hover,input[type="button"]:hover,button:hover{filter:brightness(1.06);}
/* Minor text. */
.sokrubrik{color:var(--ink-2);}
.sokexempel{color:var(--ink-3);}