/* Det ekstra oven på stil.css (som er en kopi fra sorteringen): lyst tema og
   pristjekkerens egne elementer. Det mørke tema er standarden i stil.css. */
:root[data-theme="light"] {
  --bg: #f3f5f9; --side: #ffffff; --flade: #ffffff; --raekke: #eaeff7; --raekke-hover: #dfe6f2;
  --tekst: #1b1e2b; --daemp: #5d6679; --linje: #dde2eb;
  --blaa: #2563eb; --accent-svag: #e7efff; --ok: #1f8a4c; --advar: #a16207; --fejl: #c8102e; --gruppe: #eef1f6;
}
[data-theme="light"] #side { border-right: 1px solid var(--linje); }
[data-theme="light"] .logo img { filter: brightness(0); }
[data-theme="light"] #side nav a:hover { background: var(--raekke); }
[data-theme="light"] #side nav a.aktiv { background: var(--raekke); color: var(--tekst); }
[data-theme="light"] #top { background: #ffffff; }
[data-theme="light"] th { background: #f0f3f8; }
[data-theme="light"] button.graa { color: var(--tekst); }
[data-theme="light"] .infolinje { background: #e8f0ff; color: var(--tekst); }
[data-theme="light"] .advarselslinje { background: #fff4db; color: var(--tekst); }
[data-theme="light"] .rulle { background: #ffffff; }
[data-theme="light"] .maal.god { background: #e3f3e8; }
[data-theme="light"] .maal.skidt { background: #fde2e6; }
[data-theme="light"] .maal.lidt { background: #fdf0d2; color: #8a5a00; }
[data-theme="light"] td.billede img { border: 1px solid var(--linje); }
[data-theme="light"] .logbox { background: #f7f9fc; }

/* Slå op */
.opslagsform { max-width: 820px; }
.opslagsform textarea { width: 100%; min-height: 110px; font-family: ui-monospace, Menlo, monospace; font-size: 12.5px; }
.soegefelt { position: relative; }
.soegefelt input { width: 100%; }
.rulle .valgmulighed { align-items: center; }
.rulle .valgmulighed img { width: 28px; height: 37px; object-fit: cover; border-radius: 2px; background: #fff; }
.rulle .valgmulighed .titel { flex: 1; }
.rulle .valgmulighed.status-draft, .rulle .valgmulighed.status-archived { opacity: .6; }
.butikknapper { display: flex; gap: 6px; flex-wrap: wrap; }
.butikknapper button { background: var(--raekke); color: var(--tekst); padding: 5px 12px; }
.butikknapper button.aktiv { background: var(--groen); color: #fff; }

/* Resultattabel: ruller vandret på en smal skærm i stedet for at knække kolonnerne */
.tabelrulle { overflow-x: auto; }
table.resultat td.vare { min-width: 240px; }
table.resultat td.tal, table.resultat td.hos, table.resultat th { white-space: nowrap; }
table.resultat td.hos .daemp { white-space: normal; max-width: 180px; }
/* Resultattabel */
td.billede { width: 44px; padding: 4px 6px; }
td.billede img { width: 36px; height: 48px; object-fit: cover; border-radius: 3px; background: #fff; display: block; }
.maal.lidt { background: #4a3a1a; color: #f3d38a; }
.maal.neutral { background: var(--gruppe); color: var(--daemp); }
tr.detaljer td { background: var(--gruppe); padding: 10px 14px 14px; }
tr.detaljer table { border: 0; background: transparent; }
tr.detaljer th { background: transparent; }
.lagerstatus { font-size: 11.5px; padding: 1px 7px; border-radius: 10px; background: var(--gruppe); white-space: nowrap; }
.lagerstatus.inde { color: var(--ok); } .lagerstatus.ude { color: var(--fejl); } .lagerstatus.ukendt { color: var(--daemp); }
.strkendt { font-variant-numeric: tabular-nums; }
.logbox { font-family: ui-monospace, Menlo, monospace; font-size: 12px; background: #161923; border: 1px solid var(--linje); border-radius: 4px; padding: 8px 10px; max-height: 220px; overflow: auto; white-space: pre-wrap; }
.status.koerer { background: #5a4a1f; color: #f3d38a; }
.status.faerdig { background: var(--groen); color: #fff; }
.status.fejl { background: var(--roed); color: #fff; }
.hoved { display: flex; gap: 14px; align-items: baseline; flex-wrap: wrap; }
.hoved h1 { margin: 0; }
.pris-foer { text-decoration: line-through; color: var(--daemp); font-size: 12px; margin-left: 4px; }
.advarsel { color: var(--advar); }
#loginform a.knap { display: block; text-align: center; background: var(--groen); color: #fff; border-radius: 4px; padding: 9px 14px; font-weight: 600; text-decoration: none; }
#loginform a.knap:hover { background: var(--groen-moerk); }
.om p, .om li { max-width: 760px; }

/* Flere valg i søgeresultatet og regler */
.rulle { max-height: 420px; }
.rulle label.valgmulighed { cursor: pointer; }
.rulle .valgmulighed input[type=checkbox] { width: 16px; height: 16px; margin: 0; flex: none; }
.rulle .rullehoved { position: sticky; top: 0; background: var(--flade); border-bottom: 1px solid var(--linje); }
.billedplads { display: inline-block; width: 28px; height: 37px; flex: none; }
.valgtvare img { width: 28px; height: 37px; object-fit: cover; border-radius: 2px; background: #fff; flex: none; }
.valgtvare .titel { flex: 1; min-width: 0; }
.regler { margin-top: 10px; }
.regler summary { cursor: pointer; font-weight: 600; }
.regelgitter { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px 16px; margin: 10px 0; }
.regelfelt { display: flex; flex-direction: column; gap: 4px; }
.regelfelt > span:first-child { font-size: 11.5px; color: var(--daemp); text-transform: uppercase; letter-spacing: .05em; }
.regelfelt input[type=text], .regelfelt input[type=number] { width: 100%; }
.regelfelt.vandret { flex-direction: row; align-items: center; gap: 8px; align-self: end; }
.regelfelt.vandret > span { font-size: 13px; color: var(--tekst); text-transform: none; letter-spacing: 0; }
.regelliste { max-height: 320px; overflow: auto; border: 1px solid var(--linje); border-radius: 4px; padding: 4px 10px; margin-top: 8px; }