/* Lynges Lektiehjælp – tidsbooking (log ind + ugeskema). Bruger temaets --l-* farver. */
:root {
	--lb-oenske: var(--l-blaa, #3399C2);
	--lb-tildelt: var(--l-groen, #5E8A0E);
	--lb-snart: #F2B90F;
	--lb-optaget: #E58C8C;
	--lb-optaget-bg: #FBE3E3;
	--lb-spor: #F1F5F3;
}

/* ---------- Log ind / opret ---------- */
.lb-login { max-width: 560px; margin-inline: auto; }
.lb-faner { display: flex; gap: .3rem; background: var(--l-papir); border-radius: 999px; padding: .3rem; margin-bottom: 1.4rem; }
.lb-faner a { flex: 1; text-align: center; padding: .65rem .5rem; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .92rem; color: var(--l-graa); }
.lb-faner a[aria-current] { background: #fff; color: var(--l-petrol); box-shadow: 0 1px 3px rgba(20, 49, 61, .15); }
.lb-login form > label { display: block; margin-bottom: 1rem; }
.lb-login label small { font-weight: 400; color: var(--l-graa); }
.lb-intro { color: var(--l-graa); margin: 0 0 1.2rem; }
.lb-bred { width: 100%; }
.lb-flueben { display: flex !important; gap: .6rem; align-items: flex-start; font-weight: 500; }
.lb-flueben input { width: 1.15rem !important; height: 1.15rem; margin-top: .2rem; accent-color: var(--l-petrol); flex: none; }
.lb-flueben span { margin: 0 !important; font-weight: 500 !important; }
.lb-ok { background: var(--l-lime-lys, #EEF7DC); color: var(--l-blaek); padding: .8rem 1rem; border-radius: 12px; font-weight: 600; }
.lb-note { background: var(--l-himmel-lys); padding: 1rem 1.2rem; border-radius: 14px; }
.lb-venter { max-width: 620px; margin-inline: auto; text-align: center; }

/* ---------- Skemaet ---------- */
.lb-app { max-width: 880px; margin-inline: auto; color: var(--l-blaek); }
.lb-indlaeser { text-align: center; color: var(--l-graa); padding: 3rem 0; }
.lb-topbjaelke { display: flex; align-items: center; justify-content: flex-end; gap: .8rem; margin-bottom: 1rem; }
.lb-hej { color: var(--l-graa); font-size: 1.05rem; }
.lb-logud { font-weight: 600; color: var(--l-blaek); text-decoration: none; padding: .45rem .6rem; }
.lb-logud:hover { color: var(--l-petrol); }
.lb-ikonknap { width: 44px; height: 44px; display: inline-grid; place-items: center; border-radius: 12px; border: 1px solid var(--l-kant); background: #fff; color: var(--l-blaek); cursor: pointer; }
.lb-ikonknap:hover:not(:disabled) { border-color: var(--l-petrol); }
.lb-ikonknap:disabled { opacity: .4; cursor: not-allowed; }
.lb-ikonknap svg, .lb-pille svg, .lb-sms__ikon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lb-titel { font: 600 var(--wp--preset--font-size--xx-stor)/1.15 var(--l-overskrift); margin: 0 0 .4rem; }
.lb-undertekst { color: var(--l-graa); margin: 0 0 1.4rem; max-width: 60ch; }
.lb-besked { padding: .85rem 1.1rem; border-radius: 14px; font-weight: 600; margin: 0 0 1.2rem; }
.lb-besked--ok { background: var(--l-lime-lys, #EEF7DC); color: var(--l-blaek); }
.lb-besked--fejl { background: #FDECEC; color: #8A1C1C; }
.lb-kort { background: #fff; border: 1px solid var(--l-kant); border-radius: 18px; padding: 1.1rem 1.3rem; margin-bottom: 1rem; }
.lb-kort__titel { font-weight: 700; margin: 0 0 .6rem; }
.lb-valg .lb-kort__titel ~ .lb-kort__titel { margin-top: 1rem; }
.lb-piller { display: flex; flex-wrap: wrap; gap: .5rem; }
.lb-pille { display: inline-flex; align-items: center; gap: .5rem; min-height: 48px; padding: .55rem 1.1rem; border-radius: 12px; border: 1px solid var(--l-kant); background: #fff; color: var(--l-blaek); font: inherit; font-weight: 500; cursor: pointer; }
.lb-pille[aria-checked="true"] { background: var(--l-petrol); border-color: var(--l-petrol); color: #fff; }
.lb-pille:hover:not([aria-checked="true"]) { border-color: var(--l-petrol); }
.lb-pille--boern { margin-left: .5rem; font-weight: 600; }
.lb-lille { font-size: .88rem; color: var(--l-graa); margin: .8rem 0 0; }

.lb-uge { display: flex; align-items: center; gap: .8rem; margin: 1.6rem 0 1rem; }
.lb-uge__nr { background: var(--l-papir); border-radius: 10px; padding: .45rem .8rem; font-weight: 700; }
.lb-uge__datoer { color: var(--l-graa); }
.lb-uge__pile { margin-left: auto; display: flex; gap: .4rem; }

.lb-forklaring { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: .4rem 1.3rem; font-size: .9rem; color: var(--l-graa); }
.lb-forklaring li { display: flex; align-items: center; gap: .45rem; }
.lb-prik { width: 14px; height: 14px; border-radius: 4px; flex: none; display: inline-block; }
.lb-prik--oenske { background: var(--lb-oenske); }
.lb-prik--tildelt { background: var(--lb-tildelt); }
.lb-prik--snart { background: var(--lb-snart); }
.lb-prik--optaget { background: var(--lb-optaget-bg); border: 1.5px solid var(--lb-optaget); }
.lb-prik--afbud { background: repeating-linear-gradient(45deg, #C9D3CF 0 3px, #fff 3px 6px); border: 1px solid #C9D3CF; }

.lb-dag { padding-bottom: .8rem; }
.lb-dag--fortid { opacity: .6; }
.lb-dag__titel { font: 600 1.1rem/1.3 var(--l-overskrift); margin: 0 0 .7rem; display: flex; align-items: center; gap: .6rem; }
.lb-idag { font: 700 .7rem/1 var(--wp--preset--font-family--broed, inherit); letter-spacing: .06em; text-transform: uppercase; background: var(--l-himmel-lys); color: var(--l-petrol); padding: .35rem .5rem; border-radius: 6px; }
/* Tidslinjen: 64 kvarterer (--felter sættes af scriptet). touch-action: pan-y = vandret slide markerer, lodret scroller siden. */
.lb-spor { display: grid; grid-template-columns: repeat(var(--felter, 64), 1fr); height: 58px; border-radius: 12px; overflow: hidden; background: var(--lb-spor); touch-action: pan-y; user-select: none; -webkit-user-select: none; cursor: pointer; }
.lb-felt { border-left: 1px solid transparent; transition: background-color .08s; }
.lb-felt--hel { border-left-color: #DFE7E3; }
.lb-felt:first-child { border-left-color: transparent; }
.lb-felt--ledig:hover { background: #E2ECF0; }
.lb-felt--oenske { background: var(--lb-oenske); border-left-color: rgba(255, 255, 255, .25); }
.lb-felt--tildelt { background: var(--lb-tildelt); border-left-color: rgba(255, 255, 255, .2); }
.lb-felt--snart { background: var(--lb-snart); border-left-color: rgba(255, 255, 255, .25); }
.lb-felt--optaget { background: var(--lb-optaget-bg); border-left-color: #F3C9C9; cursor: not-allowed; }
.lb-felt--afbud { background: repeating-linear-gradient(45deg, #C9D3CF 0 4px, #EEF2F0 4px 8px); }
.lb-felt--fortid { background: #E9EEEC; cursor: default; }
/* Med kvarterer: kun streg ved hele timer – ellers bliver tiderne stribede. */
.lb-felt:not(.lb-felt--hel) { border-left-color: transparent; }
.lb-timer { display: flex; justify-content: space-between; font-size: .76rem; color: var(--l-graa); margin-top: .35rem; font-variant-numeric: tabular-nums; }
.lb-timer span { width: 0; display: flex; justify-content: center; }
.lb-timer span:first-child { justify-content: flex-start; }
.lb-timer span:last-child { justify-content: flex-end; }

.lb-besked-kort { margin-top: 1rem; }
.lb-besked-kort .lb-kort__titel { display: block; }
.lb-besked-felt { width: 100%; box-sizing: border-box; font: inherit; padding: .75rem 1rem; border-radius: 12px; border: 2px solid var(--l-kant); background: var(--l-papir); color: var(--l-blaek); resize: vertical; min-height: 3.2rem; }
.lb-besked-felt:focus { border-color: var(--l-blaa); background: #fff; outline: none; }
.lb-besked-kort .lb-lille { margin-top: .4rem; }
.lb-send { position: sticky; bottom: .75rem; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; background: rgba(255, 255, 255, .95); backdrop-filter: blur(6px); border: 1px solid var(--l-kant); border-radius: 16px; padding: .8rem 1rem; margin: 1rem 0; box-shadow: var(--l-skygge); }
.lb-send__antal { color: var(--l-graa); font-weight: 500; }
.lb-send__knap:disabled { background: #9DB6C0 !important; cursor: not-allowed; transform: none !important; }
.lb-sms { display: flex; align-items: center; gap: 1rem; text-decoration: none; color: var(--l-blaek); }
.lb-sms:hover { border-color: var(--l-petrol); }
.lb-sms__ikon { width: 48px; height: 48px; border-radius: 50%; background: var(--l-himmel-lys); color: var(--l-petrol); display: grid; place-items: center; flex: none; }
.lb-sms strong { display: block; font-weight: 600; }
.lb-sms span span { color: var(--l-graa); }

.lb-dine { margin-top: 2rem; }
.lb-dine h2 { font: 600 1.4rem/1.2 var(--l-overskrift); margin: 0 0 .8rem; }
.lb-dine h2 span { font: 400 1rem var(--wp--preset--font-family--broed, inherit); color: var(--l-graa); }
.lb-dine ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.lb-dine__tid { display: flex; align-items: center; gap: .8rem; background: #fff; border: 1px solid var(--l-kant); border-radius: 14px; padding: .75rem 1rem; }
.lb-dine__tid strong { display: block; font-weight: 600; }
.lb-dine__tid small { color: var(--l-graa); }
.lb-dine__tid .lb-link { margin-left: auto; }
.lb-link { background: none; border: 0; padding: .4rem; font: inherit; font-weight: 600; color: var(--l-petrol); text-decoration: underline; cursor: pointer; }

/* Dialoger */
.lb-dialog { border: 0; border-radius: 22px; padding: 1.5rem; width: min(460px, calc(100vw - 2rem)); box-shadow: 0 30px 80px rgba(20, 49, 61, .35); color: var(--l-blaek); }
.lb-dialog::backdrop { background: rgba(20, 49, 61, .45); }
.lb-dialog h2 { font: 600 1.4rem/1.2 var(--l-overskrift); margin: 0 0 1rem; }
.lb-dialog h3 { font: 600 1.05rem/1.2 var(--l-overskrift); margin: 1.2rem 0 .6rem; }
.lb-dialog__knapper { display: flex; justify-content: flex-end; align-items: center; gap: .8rem; margin-top: 1.2rem; flex-wrap: wrap; }
.lb-stor { font: 600 1.2rem/1.3 var(--l-overskrift); margin: 0 0 .3rem; }
.lb-knap--fare { background: #B3261E !important; }
.lb-knap--fare:hover { background: #8A1C1C !important; }
.lb-fejltekst { color: #8A1C1C; font-weight: 600; }
.lb-boernliste { margin: 0; padding-left: 1.2rem; }
.lb-formular-lille { box-shadow: none; padding: 0; background: none; }
.lb-formular-lille label { display: block; margin-bottom: .9rem; }

@media (max-width: 600px) {
	.lb-kort { padding: 1rem; border-radius: 16px; }
	.lb-spor { height: 52px; }
	.lb-timer span:nth-child(even) { visibility: hidden; }   /* kun hver anden time på små skærme */
	.lb-pille { padding: .5rem .8rem; }
	.lb-pille--boern { margin-left: 0; }
	.lb-send { bottom: calc(.75rem + 64px); }                 /* over temaets faste mobilbjælke */
	.lb-send__knap { width: 100%; }
	.lb-uge { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { .lb-felt { transition: none; } }

/* Erstatningstid (Kasper har aflyst og tilbyder nye tider) */
.lb-tilbud { border: 2px solid #8E6CC9; background: #F6F2FC; max-width: 640px; }
.lb-tilbud--ok { border-color: var(--l-groen, #5E8A0E); background: #F3F9EA; }
.lb-tilbud h2 { margin: 0 0 .4rem; font-size: 1.35rem; }
.lb-tilbud__besked { background: #fff; border-radius: 12px; padding: .6rem .9rem; }
.lb-tilbud__valg { display: flex; flex-direction: column; gap: .6rem; margin: 1rem 0 .4rem; }
.lb-tilbud__valg .formular__knap { text-align: left; }
.lb-tilbud__valg .formular__knap[disabled] { opacity: .45; cursor: not-allowed; }
.lb-tilbud__nej { background: none; border: 0; padding: .5rem 0; font: inherit; color: var(--l-blaek, #14313D); text-decoration: underline; cursor: pointer; align-self: flex-start; }