/**
 * Frontend-styles til [fisketure-kalender] og enkelt-tur-siden.
 * Alle klasser er prefixet med "fisketure-booking-" for at undgå konflikt med temaet.
 *
 * --fisketure-booking-brand-color sættes via en inline <style>-blok
 * (Fisketure_Booking_Public::enqueue_styles() / Fisketure_Booking_Shortcodes::
 * enqueue_frontend_assets()) ud fra Indstillinger → Design → Brandfarve
 * (Fisketure_Booking_Mailer::get_brand_color()). #0073aa-fallbacken herunder
 * bruges kun hvis den inline-blok af en eller anden grund ikke er indlæst.
 *
 * ALLE selectors der styler en <button> er bevidst skrevet som "button.klasse"
 * (element + klasse), ikke bare ".klasse" (kundefund 2026-08-20: Elementors
 * globale reset, `[type=button],[type=submit],button { ... }`, matcher en
 * <button type="submit/button"> via en attribut-selector med SAMME
 * specificitet som en enkelt klasse-selector (0,1,0) – uafgjort specificitet
 * afgøres af KILDEORDEN, og Elementors kit-CSS indlæses typisk senere end
 * plugin-CSS, så den vandt. "button." lægger ét element-selector-niveau til
 * (0,1,1), som ubetinget slår Elementors (0,1,0) – uafhængigt af indlæsnings-
 * rækkefølge, og uden `!important` (ville gøre det unødigt besværligt at
 * override på andre WordPress-installationer). Gælder alle knap-relaterede
 * klasser i denne fil (kalenderens navigationsknapper og "Book"-knappen på
 * enkelt-tur-siden) – hold denne konvention ved evt. nye knap-klasser.
 *
 * VIGTIGT (kundefund, opfølgning samme dag): specificitet afgør kun kampen om
 * en EGENSKAB begge sider rent faktisk erklærer på den matchende selector –
 * cascade'en kører pr. egenskab, ikke pr. regel. Erklærer vi ikke selv
 * `color`/`background-color` et sted (fx en :hover-tilstand, eller en knaps
 * grundtilstand), er Elementors erklæring den ENESTE for den egenskab og
 * anvendes uændret, uanset vores ellers højere specificitet på selve
 * selectoren. Derfor erklærer ALLE knap-regler herunder eksplicit BÅDE
 * `color` og baggrund i BÅDE grundtilstand og :hover/:focus – selv hvor
 * værdien er triviel (fx nedarvet sort tekst) – for at lukke denne
 * "utilsigtet udeladt egenskab"-fælde helt. :focus er bevidst tilføjet
 * samme steder som :hover (Elementors reset rammer begge), så et tastatur-
 * eller museklik-fokuseret knap ikke pludselig viser Elementors farver.
 */

/* ---------------------------------------------------------------------------
 * Kalender – filtre
 * ------------------------------------------------------------------------ */

.fisketure-booking-kalender {
	max-width: 100%;
}

.fisketure-booking-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.fisketure-booking-filter {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	font-size: 0.9rem;
}

/* Overskriften ("Boat"/"Trip type") – hævet fra det arvede 0.9rem og gjort
 * fed (kundeønske) for at skille sig tydeligere ud fra selve dropdownen.
 * Rammer kun <span>'et, ikke <select>'et (som har sin egen stil nedenfor). */
.fisketure-booking-filter span {
	font-size: 1rem;
	font-weight: 600;
}

.fisketure-booking-filter select {
	padding: 0.5rem;
	min-width: 180px;
}

/* Når filtrene wrapper hver til sin egen række på mobil (.fisketure-booking-
 * filters er flex-wrap: wrap), skal de optage fuld bredde i stedet for kun
 * deres naturlige min-content-bredde (kundeønske) – samme breakpoint som
 * resten af kalenderens mobil-visning, se MOBILE_MEDIA_QUERY i
 * fisketure-booking-calendar.js. */
@media (max-width: 768px) {
	.fisketure-booking-filter {
		flex: 1 1 100%;
	}
}

/* ---------------------------------------------------------------------------
 * Kalender – måneds-navigation
 * ------------------------------------------------------------------------ */

/*
 * 3-kolonne-grid (v0.19.0, kundekrav): "Denne måned" i venstre kolonne (helt
 * ude til venstre), selve måneds-navigatoren (forrige/vælger/næste) centreret
 * i den midterste kolonne, og en tom, usynlig tredje kolonne som modvægt -
 * uden den ville den midterste gruppe kun være centreret over den plads der
 * er tilbage EFTER "Denne måned"-knappen, ikke over hele kalenderens bredde.
 * De to yderkolonner (1fr hver, lige store) forbliver reserverede - og
 * dermed lige store, og gruppen forbliver centreret - selv når "Denne
 * måned"-knappen skjules ≤768px (se mediequeriet nedenfor): CSS Grid's
 * EKSPLICITTE kolonner optager altid deres andel af pladsen, uafhængigt af
 * om noget indhold rent faktisk ligger i dem.
 */
.fisketure-booking-calendar-nav {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 1rem;
}

/*
 * Prev/måneds-vælger/next samlet i én visuel gruppe (v0.19.0, se
 * calendar.php) - placeret i nav-baren's midterste grid-kolonne (se ovenfor)
 * og centreret DÉR via justify-self, uafhængigt af "Denne måned"-knappens
 * bredde/synlighed.
 */
.fisketure-booking-calendar-nav-group {
	grid-column: 2;
	justify-self: center;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

/*
 * "Denne måned"-knappen (v0.19.0, kundekrav) - EGEN, selvstændig klasse i
 * stedet for at genbruge .fisketure-booking-nav-button: den delte klasse har
 * en fast kvadratisk `width`/`height` (til pil-ikonerne), og fordi
 * .fisketure-booking-nav-button står SENERE i denne fil ville dens `width`
 * altid vinde kapløbet om lige specificitet uanset hvilken bredde et forsøgt
 * override her selv satte - deraf den for smalle knap med ombrudt tekst, som
 * blev fundet ved live-test. En helt separat klasse undgår dette kapløb for
 * evigt, i stedet for blot at flytte determineringen om i kildeordenen.
 * `height`/flex-centrering (endnu et live-test-fund - knappen matchede ikke
 * pilenes højde) sat til NØJAGTIGT samme værdi som .fisketure-booking-nav-
 * button. `grid-column: 1` + `justify-self: start` placerer den i nav-barens
 * venstre kolonne, helt ude til venstre (kundekrav).
 */
button.fisketure-booking-current-month-button {
	grid-column: 1;
	justify-self: start;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 2.25rem;
	background: #fff;
	color: #333;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0 0.9rem;
	font-size: 0.85rem;
	line-height: 1;
	cursor: pointer;
	white-space: nowrap;
}

button.fisketure-booking-current-month-button:hover,
button.fisketure-booking-current-month-button:focus {
	background: #f0f0f0;
	color: #333;
}

/* Slået fra når kalenderen allerede viser den aktuelle måned (v0.19.0, se
 * fisketure-booking-calendar.js's loadAndRenderMonth()) - :hover eksplicit
 * overstyret, da browsere stadig matcher :hover på disabled-knapper. */
button.fisketure-booking-current-month-button:disabled {
	opacity: 0.5;
	color: #333;
	cursor: default;
}

button.fisketure-booking-current-month-button:disabled:hover {
	background: #fff;
	color: #333;
}

/*
 * Wrapper omkring hele måneds-vælgeren (v0.19.0, kundekrav om en dropdown i
 * stedet for kun at klikke sig fremad/tilbage) - position:relative, så
 * .fisketure-booking-month-picker-dropdown nedenfor kan positioneres absolut
 * relativt til DENNE, ikke hele nav-baren.
 */
.fisketure-booking-month-picker {
	position: relative;
}

.fisketure-booking-calendar-title {
	margin: 0;
	min-width: 220px;
	text-align: center;
	font-size: 1.3rem;
	text-transform: capitalize;
}

/*
 * Selve knappen der åbner/lukker dropdownen - nulstiller knap-browser-
 * standarder og arver skrifttype/transform fra sit <h2>-forældreelement
 * (.fisketure-booking-calendar-title ovenfor), så den visuelt er identisk
 * med den tidligere rene tekst-titel, blot med en tilføjet pil-indikator.
 */
button.fisketure-booking-month-picker-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	width: 100%;
	background: none;
	border: none;
	font: inherit;
	text-transform: inherit;
	color: inherit;
	cursor: pointer;
	padding: 0.25rem 0.5rem;
	border-radius: 4px;
}

button.fisketure-booking-month-picker-toggle:hover,
button.fisketure-booking-month-picker-toggle:focus {
	background: #f0f0f0;
	color: inherit;
}

.fisketure-booking-month-picker-caret {
	display: inline-block;
	font-size: 0.7rem;
	transition: transform 0.15s ease;
}

.fisketure-booking-month-picker-caret::before {
	content: "\25BC";
}

/* Peger opad i stedet for at bytte tegn når dropdownen er åben - samme
 * "rotér i stedet for at swappe ikon"-mønster som admin-CSS'ens ▶-detalje-
 * pil (undgår at skulle holde flere ikon-varianter synkroniseret). */
button.fisketure-booking-month-picker-toggle[aria-expanded="true"] .fisketure-booking-month-picker-caret {
	transform: rotate( 180deg );
}

/*
 * Selve dropdownen (v0.19.0) - år-navigation + 4x3-grid af forkortede
 * månedsnavne, bygget/genbygget af fisketure-booking-calendar.js's
 * renderMonthPickerDropdown(). Centreret under titlen, hævet over resten af
 * kalenderen (z-index) så den ikke klippes af dag-gridet.
 */
.fisketure-booking-month-picker-dropdown {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX( -50% );
	margin-top: 0.5rem;
	z-index: 20;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
	box-shadow: 0 4px 12px rgba( 0, 0, 0, 0.12 );
	padding: 0.75rem;
	min-width: 260px;
}

/*
 * "Denne måned" SOM DEN VISES INDE I DROPDOWNEN (v0.19.0) - altid til stede i
 * markup'et (se renderMonthPickerDropdown()), men skjult som standard. Vises
 * i stedet for den statiske nav-bar-knap ≤768px (se mediequeriet nedenfor).
 * Placeret NEDERST i dropdownen (kundekrav, 4. designrunde) - `margin-top`
 * (ikke `-bottom`) skaber derfor luft op til måneds-gridet ovenfor i stedet;
 * dropdownens egen `padding` giver allerede luft i bunden, under knappen.
 */
button.fisketure-booking-month-picker-current-month {
	display: none;
	width: 100%;
	background: #fff;
	color: #333;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0.4rem 0.75rem;
	margin-top: 0.5rem;
	font-size: 0.85rem;
	cursor: pointer;
}

button.fisketure-booking-month-picker-current-month:hover,
button.fisketure-booking-month-picker-current-month:focus {
	background: #f0f0f0;
	color: #333;
}

/* Slået fra når kalenderen allerede viser den aktuelle måned - samme
 * greyed-out-behandling som den statiske nav-bar-knap (v0.19.0, kundeønske
 * efter live-test af denne kopi) - se renderMonthPickerDropdown()'s
 * isCurrentMonth-tjek, og .fisketure-booking-current-month-button:disabled
 * ovenfor for samme mønster. */
button.fisketure-booking-month-picker-current-month:disabled {
	opacity: 0.5;
	color: #333;
	cursor: default;
}

button.fisketure-booking-month-picker-current-month:disabled:hover {
	background: #fff;
	color: #333;
}

.fisketure-booking-month-picker-year {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	margin-bottom: 0.5rem;
}

.fisketure-booking-month-picker-year-label {
	min-width: 3.5rem;
	text-align: center;
	font-weight: 600;
}

.fisketure-booking-month-picker-grid {
	display: grid;
	grid-template-columns: repeat( 4, 1fr );
	gap: 0.4rem;
}

button.fisketure-booking-month-picker-month {
	background: #fff;
	color: #333;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0.4rem 0.25rem;
	font-size: 0.85rem;
	cursor: pointer;
	text-transform: capitalize;
}

button.fisketure-booking-month-picker-month:hover,
button.fisketure-booking-month-picker-month:focus {
	background: #f0f0f0;
	color: #333;
}

/* Den måned kalenderen PT. rent faktisk viser (ikke bare et browset år inde
 * i selve dropdownen, se buildMonthPickerMonthButton()) - samme brandfarve-
 * mønster som "i dag"-highlighten i selve dag-gridet nedenfor. */
button.fisketure-booking-month-picker-month--current {
	border-color: var( --fisketure-booking-brand-color, #0073aa );
	background: var( --fisketure-booking-brand-color, #0073aa );
	color: #fff;
}

button.fisketure-booking-nav-button {
	background: #fff;
	color: #333;
	border: 1px solid #ccc;
	border-radius: 4px;
	width: 2.25rem;
	height: 2.25rem;
	/* Eksplicit 0 (samme "manglende egenskab"-fælde som color/background – se
	 * filens toppkommentar) – uden denne vandt Elementors `padding: .5rem 1rem`
	 * for netop denne egenskab, hvilket på temaer med global `box-sizing:
	 * border-box` æder sig ind i den faste width/height ovenfor og skubber
	 * pil-glyffen ud af centrum (kundefund). Ingen af de øvrige knap-klasser i
	 * denne fil rammes, da de alle allerede erklærer deres egen padding. */
	padding: 0;
	font-size: 1.3rem;
	line-height: 1;
	cursor: pointer;
}

button.fisketure-booking-nav-button:hover,
button.fisketure-booking-nav-button:focus {
	background: #f0f0f0;
	color: #333;
}

/* Mindre variant til år-pilene INDE i måneds-vælger-dropdownen (v0.19.0) -
 * samme udseende som de almindelige måned-pile, blot lidt mindre, da de
 * sidder i en tættere, sekundær kontekst. */
button.fisketure-booking-nav-button--small {
	width: 1.75rem;
	height: 1.75rem;
	font-size: 1rem;
}

/*
 * "Denne måned" flyttes IND i selve måneds-vælger-dropdownen ≤768px (v0.19.0,
 * kundekrav, 3. designrunde) - den statiske nav-bar-knap (grid-kolonne 1,
 * se ovenfor) skjules, og den ANDEN kopi af samme knap, som JS'en (se
 * renderMonthPickerDropdown()) ALTID rendererer inde i dropdownen, vises i
 * stedet (se .fisketure-booking-month-picker-current-month ovenfor). Sparer
 * plads i nav-baren på mindre skærme uden at fjerne selve funktionen - den
 * er blot flyttet ét klik dybere (åbn dropdownen for at finde den).
 *
 * Grid-template'en reduceres samtidig til KUN 1 kolonne (4. designrunde,
 * kundefund) - de 2 øvrige kolonner er tomme her (ingen "Denne måned"-knap
 * længere), men et 3-kolonne-grid reserverer STADIG plads til de 2 `gap`'er
 * MELLEM kolonnerne (kolonne 1↔2 og 2↔3), uafhængigt af om kolonnerne rent
 * faktisk har noget indhold - denne "usynlige" gap-plads omkring den
 * centrerede gruppe er reelt unødvendig, når der intet er i sidekolonnerne
 * at holde afstand til. Med kun 1 kolonne findes der ingen gap'er at
 * reservere. `.fisketure-booking-calendar-nav-group` flyttes til kolonne 1
 * (den eneste) - dens eksisterende `justify-self: center` (uændret, sat
 * ubetinget i grundreglen) centrerer den fortsat fint i den nu enkelte,
 * fulde-bredde kolonne.
 */
@media (max-width: 768px) {
	button.fisketure-booking-current-month-button {
		display: none;
	}

	button.fisketure-booking-month-picker-current-month {
		display: block;
	}

	.fisketure-booking-calendar-nav {
		grid-template-columns: 1fr;
	}

	.fisketure-booking-calendar-nav-group {
		grid-column: 1;
	}
}

/*
 * Meget smalle skærme (≤350px, v0.11.0, sænket fra 400px og forenklet i
 * v0.19.0's 3. designrunde efter kundefeedback): skjuler NU KUN de
 * almindelige forrige/næste-pile omkring selve måneds-vælgeren (kundekrav) -
 * månedsnavigation er stadig fuldt muligt via dropdownen (år-pile +
 * måneds-grid + "Denne måned", alle ≤768px allerede flyttet ind der, se
 * ovenfor). `>` (direkte-barn-selector) sikrer at KUN disse to pile skjules,
 * IKKE år-navigationens tilsvarende (men mindre, se .fisketure-booking-nav-
 * button--small) pile INDE i selve dropdownen - de er nestet dybere og er
 * derfor ikke direkte børn af .fisketure-booking-calendar-nav-group.
 */
@media (max-width: 350px) {
	.fisketure-booking-calendar-nav-group > button.fisketure-booking-nav-button {
		display: none;
	}
}

/* ---------------------------------------------------------------------------
 * Kalender – måneds-grid
 * ------------------------------------------------------------------------ */

.fisketure-booking-calendar-weekdays {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
	margin-bottom: 4px;
	font-weight: 600;
	font-size: 0.8rem;
	text-align: center;
	text-transform: uppercase;
	color: #666;
}

/*
 * Gridet er en LODRET stak af uge-rækker (v0.30.0), ikke længere ét fladt
 * 42-celle-grid – hver uge er sit eget 7-kolonne-grid (.fisketure-booking-week
 * nedenfor), fordi en flerdags-turs "chip" skal kunne strække sig visuelt hen
 * over flere dag-celler i træk INDEN FOR én uge (se .fisketure-booking-week-
 * events), noget et enkelt fladt grid ikke kan udtrykke pr. uge for sig.
 */
.fisketure-booking-calendar-grid {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

/*
 * Én uge-række. `position: relative` gør den til positioneringskontekst for
 * .fisketure-booking-week-events (flerdags-bjælkerne) nedenfor.
 * --fisketure-multiday-rows sættes inline pr. uge af fisketure-booking-
 * calendar.js's renderWeek() til antallet af flerdags-baner DENNE uge reelt
 * bruger (0 hvis ingen) – arves ned til .fisketure-booking-day-trips'
 * margin-top nedenfor, så dag-cellernes egne (enkelt-dags) chips altid
 * rykkes tilstrækkeligt ned til at undgå bjælkerne ovenover, uden at hver
 * uge skal bruge unødig plads når den ingen flerdags-ture har.
 */
.fisketure-booking-week {
	position: relative;
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 4px;
	--fisketure-multiday-rows: 0;
}

/* overflow: hidden (kun her, IKKE på .fisketure-booking-day-trips – se dens
 * kommentar nedenfor) er reelt ikke om at klippe INDHOLD (cellens højde er
 * altid ubegrænset/auto, så der er intet at klippe lodret), men om CSS
 * Grid's "automatiske minimumsstørrelse"-regel: uden dette regnes cellens
 * min-bredde ud fra dens INDHOLDS min-content-bredde (en lang, ubrudt
 * tur-titel i en chip), hvilket tvinger HELE kolonnen (og dermed hele
 * uge-rækken) bredere end sin 1fr-andel. `overflow` ≠ `visible` nulstiller
 * denne automatiske minimumsbredde til 0, så gridets 7 kolonner altid deler
 * bredden ligeligt, og chippens EGEN `overflow:hidden`/`text-overflow` kan
 * ellipsere den lange titel i stedet (v0.14.1-fix, opdaget ved live-test af
 * v0.14.0 – "vokser i bredden" var en utilsigtet bivirkning af at fjerne
 * denne regel for at lade cellen vokse i HØJDEN). */
.fisketure-booking-day {
	min-height: 96px;
	border: 1px solid #e2e2e2;
	border-radius: 4px;
	padding: 0.35rem;
	background: #fff;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.fisketure-booking-day--muted {
	background: #fafafa;
	border-color: #eee;
}

.fisketure-booking-day--today {
	border-color: var(--fisketure-booking-brand-color, #0073aa);
	box-shadow: inset 0 0 0 1px var(--fisketure-booking-brand-color, #0073aa);
}

.fisketure-booking-day-number {
	font-size: 1rem; /* Hævet fra 0.8rem (kundefeedback v0.30.0) – nemmere at læse. */
	color: #666;
	/* Hævet fra 0.25rem (kundefeedback v0.30.0) – der var ikke reel luft under
	 * tallet før ugens flerdags-bjælke-overlay begyndte (se .fisketure-booking-
	 * week-events' `top`, som er afstemt til at matche denne værdi). */
	margin-bottom: 0.5rem;
}

/* Intet loft på antal ture længere (v0.14.0) – ingen overflow-y: auto/
 * scrollbar. Cellen (og dermed hele uge-rækken i grid'et) vokser i stedet i
 * højden efter behov, se fisketure-booking-calendar.js's renderMonthGrid().
 * Ingen overflow her (heller ikke overflow-y) – .fisketure-booking-day
 * ovenfor har fortsat kun `overflow: hidden` for BREDDEN (grid-minimumsstørrelse-
 * fix, se dens kommentar), aldrig en fast/maks. højde, så der er intet at
 * klippe eller scrolle lodret uanset denne regel. */
.fisketure-booking-day-trips {
	display: flex;
	flex-direction: column;
	gap: 2px;
	/* Rykker enkelt-dags-chipsene ned under ugens flerdags-bjælke-overlay,
	 * hvis der er nogen (v0.30.0) – --fisketure-multiday-rows arves fra
	 * .fisketure-booking-week (0 i almindelige uger, se dens kommentar).
	 * 26px ≈ én bjælkes højde + mellemrum, matcher .fisketure-booking-week-
	 * events' grid-auto-rows(22px)+gap(4px) nedenfor. */
	margin-top: calc(var(--fisketure-multiday-rows, 0) * 26px);
}

/*
 * Overlay pr. uge med flerdags-turenes bjælker (v0.30.0) – position:absolute
 * hen over hele uge-rækken (se .fisketure-booking-week), MEN selve
 * containeren har pointer-events:none så et klik der ikke rammer en faktisk
 * bjælke falder igennem til dag-cellen bagved (kun relevant på mobil, hvor
 * hele dette overlay i øvrigt er skjult, se mediequeriet nedenfor – ren
 * defensiv fremtidssikring). Egne 7 kolonner der matcher dag-cellernes,
 * så en bjælke kan positioneres pr. kolonne med grid-column (se
 * fisketure-booking-calendar.js's buildMultiDayChip()).
 */
.fisketure-booking-week-events {
	position: absolute;
	left: 0;
	right: 0;
	/* Under dag-tallet – se .fisketure-booking-day-number, hvis margin-bottom
	 * netop blev hævet for at give samme luft. Justeret trinvist efter
	 * kundefeedback: 20px (0.8rem-tal) → 24px (1rem-tal) → nu 32px, da
	 * bjælken stadig sad helt op ad tallet uden reel luft imellem. */
	top: 32px;
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	/* Hævet fra 18px (kundefeedback: teksten i bjælken virkede klemt) – på
	 * temaer med global `box-sizing: border-box` (kendt scenarie, se
	 * button.fisketure-booking-nav-button's kommentar øverst i filen) tæller
	 * chippens egen padding (2px 5px, se .fisketure-booking-chip) MED i denne
	 * højde, så 18px reelt kun efterlod ~14px til selve teksten – for lidt til
	 * en 0.75rem-skrifttype med normal linjehøjde. 22px giver ~18px tilbage. */
	grid-auto-rows: 22px;
	gap: 4px;
	pointer-events: none;
}

.fisketure-booking-week-events .fisketure-booking-chip {
	pointer-events: auto;
}

/*
 * "a.klasse" + ".fisketure-booking-kalender"-forælderen (i stedet for bare
 * ".klasse") – samme "manglende/for lav specificitet"-problematik som knap-
 * reglerne øverst i filen, men her fra en ANDEN kilde: temaer/page builders
 * (fundet med Elementor, kundefund 2026-08-20) sætter ofte en global
 * linkstyling, typisk som ".et-eller-andet-wrapper-klasse a { text-decoration:
 * underline; }" – en ANKER-klasse + selve <a>-elementet, specificitet (0,1,1),
 * som slår en almindelig enkelt klasse-selector (0,1,0) ubetinget (ikke bare
 * ved uafgjort kildeorden – den er reelt mere specifik). At tilføje selve
 * <a>-elementet til VORES egen selector ville kun opnå samme (0,1,1) – stadig
 * uafgjort. I stedet bruges den allerede eksisterende ægte DOM-forælder
 * ".fisketure-booking-kalender" (kalenderens rod-wrapper, se calendar.php) som
 * ekstra klasse-niveau: (0,2,1), som ubetinget slår ETHVERT enkelt-anker-
 * klasse-plus-element-mønster, uanset hvilket klassenavn et givent tema/
 * page builder bruger til sin wrapper – uden `!important`.
 */
.fisketure-booking-kalender a.fisketure-booking-chip {
	display: block;
	background: #e6f4ea;
	color: #1e6b3a;
	border-radius: 3px;
	padding: 2px 5px;
	font-size: 0.75rem;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/*
 * ".fisketure-booking-chip--hover-linked" (v0.30.0) er en JS-styret
 * "søsterhøvring": en flerdags-tur strækker sig over ét <a>-segment PR. UGE
 * den optræder i (se buildMultiDayChip()), så ren CSS :hover ville kun
 * fremhæve det ene segment musen faktisk peger på – kundefeedback om at det
 * gør det svært at se hele turens udstrækning når den fortsætter i en anden
 * uge-række. `fisketure-booking-calendar.js`s delegerede mouseover/mouseout
 * (setMultiDayHover()) sætter i stedet denne klasse på ALLE segmenter af
 * samme tur samtidig, uanset hvilket af dem musen er over.
 */
.fisketure-booking-kalender a.fisketure-booking-chip:hover,
.fisketure-booking-kalender a.fisketure-booking-chip--hover-linked {
	background: #d3ecdb;
}

.fisketure-booking-kalender a.fisketure-booking-chip--full {
	background: #f4e6e6;
	color: #8a2c2c;
}

/* Samme specificitet som .fisketure-booking-chip:hover (klasse + pseudo-klasse
 * begge steder) – uden denne regel vandt den grønne hover-farve altid, uanset
 * --full/--cancelled-modifieren, fordi den kom senere i kilden med lige høj
 * specificitet. Mørkere rød, samme "lidt mørkere"-forhold som den grønne
 * standard-chip får ved hover. */
.fisketure-booking-kalender a.fisketure-booking-chip--full:hover,
.fisketure-booking-kalender a.fisketure-booking-chip--full.fisketure-booking-chip--hover-linked {
	background: #ecd5d5;
}

/*
 * Flerdags-tur-bjælken (v0.30.0, se .fisketure-booking-week-events ovenfor) –
 * samme grund-/hover-/--full-/--cancelled-farver som en almindelig chip
 * (arvet fra .fisketure-booking-chip ovenfor), blot fyldt ud i sin fulde
 * grid-celle-højde i stedet for at krympe om teksten, så den reelt ligner én
 * sammenhængende bjælke hen over dagene den dækker.
 */
.fisketure-booking-kalender a.fisketure-booking-chip--multiday {
	display: flex;
	align-items: center;
	height: 100%;
	font-weight: 600;
	/* Tydeligt afrundede ender (kundefeedback v0.30.0 – skal kunne SES at det
	 * er der turen reelt starter/slutter) – mere udpræget end den almindelige
	 * chips 3px, ca. halvdelen af bjælkens højde (grid-auto-rows: 18px
	 * ovenfor) for et "pille-agtigt" udseende i begge ender. Den ende der
	 * fortsætter til/fra en nabo-uge mister denne runding igen, se
	 * --continues-before/-after nedenfor. */
	border-radius: 9px;
	/* Luft fra dagcellernes yderkant i begge ender (kundefeedback v0.36.0) –
	 * bjælken ligger i .fisketure-booking-week-events' EGET grid, som dækker
	 * hele uge-rækkens bredde uden den padding .fisketure-booking-day selv har
	 * (0.35rem, se ovenfor), så den ellers støder direkte op mod dagcellernes
	 * kant i stedet for at have samme luft som en almindelig enkelt-dags-chip.
	 * Fjernes igen i den ende der reelt fortsætter til/fra en nabo-uge (se
	 * --continues-before/-after nedenfor) – der skal bjælken forblive helt ude
	 * i kanten, samme sted som rundingen også fjernes. */
	margin: 0 0.35rem;
}

/*
 * En bjælke der fortsætter fra/ind i en nabo-uge mister rundingen i den
 * retning – visuelt fingerpeg om at turen ikke starter/slutter der (kun de
 * ender uden denne modifier er reelt afrundede, se ovenfor). Mister af samme
 * grund også v0.36.0's margin i den retning igen (se ovenfor) – kun de reelt
 * afrundede ender skal have luft til dagcellens kant.
 *
 * MÅ være mindst lige så specifik som .fisketure-booking-kalender a.
 * fisketure-booking-chip--multiday ovenfor (som selv sætter border-radius) –
 * en tidligere version af denne regel var en simpel enkelt-klasse-selector
 * ((0,1,0)) og blev derfor ALDRIG anvendt, uanset kildeorden, da CSS'ens
 * cascade altid lader højere specificitet vinde over kildeorden.
 */
.fisketure-booking-kalender a.fisketure-booking-chip--continues-before {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
	margin-left: 0;
}

.fisketure-booking-kalender a.fisketure-booking-chip--continues-after {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin-right: 0;
}

.fisketure-booking-kalender a.fisketure-booking-chip--cancelled {
	background: #eee;
	color: #666;
	text-decoration: line-through;
}

/* Samme årsag som --full:hover ovenfor – uden denne blev en aflyst tur også
 * fejlagtigt grøn ved hover. */
.fisketure-booking-kalender a.fisketure-booking-chip--cancelled:hover,
.fisketure-booking-kalender a.fisketure-booking-chip--cancelled.fisketure-booking-chip--hover-linked {
	background: #e2e2e2;
}

.fisketure-booking-loading,
.fisketure-booking-empty {
	text-align: center;
	padding: 2rem 0;
	color: #666;
}

/* ---------------------------------------------------------------------------
 * Kalender – mobil/lodret tablet (≤768px, v0.11.0)
 *
 * Under 768px erstattes dag-cellernes chip-liste af små farvede prikker (én
 * pr. tur, grøn/rød efter om turen kan modtage tilmeldinger) for at holde
 * cellerne kompakte nok til en telefonskærm. Et klik på en dag med ture
 * viser i stedet dagens ture som en liste af kort UNDER hele kalenderen (se
 * .fisketure-booking-day-trips-panel), i stedet for at proppe detaljer ind i
 * en meget lille celle – se fisketure-booking-calendar.js's selectDay().
 * ------------------------------------------------------------------------ */

.fisketure-booking-day-dots {
	display: none;
	flex-wrap: wrap;
	gap: 3px;
	margin-top: 2px;
}

.fisketure-booking-day-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #1e6b3a;
	flex: 0 0 auto;
}

.fisketure-booking-day-dot--unavailable {
	background: #8a2c2c;
}

.fisketure-booking-day-trips-panel {
	display: none;
}

@media (max-width: 768px) {
	.fisketure-booking-day-trips {
		display: none;
	}

	/* Flerdags-bjælkerne (v0.30.0) er et rent desktop-koncept – på mobil
	 * repræsenteres en flerdags-tur i stedet af almindelige prikker/kort, én
	 * pr. dag den dækker, ligesom enhver anden tur (se groupTripsByDate() i
	 * fisketure-booking-calendar.js). Uden denne regel ville overlayet stå
	 * og optage plads hen over en dag-celle der reelt kun viser prikker. */
	.fisketure-booking-week-events {
		display: none;
	}

	.fisketure-booking-day-dots {
		display: flex;
	}

	/* Cellerne skal kun rumme dagstal + et par prikker på mobil, ikke chips'
	 * fulde tekstlinjer som på desktop. */
	.fisketure-booking-day {
		min-height: 44px;
		padding: 0.25rem;
	}

	.fisketure-booking-day-number {
		margin-bottom: 0;
	}

	.fisketure-booking-day--has-trips {
		cursor: pointer;
	}

	.fisketure-booking-day--selected {
		border-color: var(--fisketure-booking-brand-color, #0073aa);
		box-shadow: inset 0 0 0 1px var(--fisketure-booking-brand-color, #0073aa);
	}

	.fisketure-booking-day-trips-panel.is-visible {
		display: block;
		margin-top: 1.5rem;
		scroll-margin-top: 1rem;
	}
}

.fisketure-booking-day-trips-heading {
	margin: 0 0 0.75rem;
	font-size: 1.1rem;
}

/* Samme ".fisketure-booking-kalender a.klasse"-mønster og samme grund som
 * .fisketure-booking-chip ovenfor (Elementor-konflikt, se kommentaren der) –
 * disse mobil-kort er også et <a>-element. */
.fisketure-booking-kalender a.fisketure-booking-trip-card {
	display: block;
	background: #fff;
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	padding: 0.85rem 1rem;
	margin-bottom: 0.75rem;
	text-decoration: none;
	color: inherit;
}

.fisketure-booking-kalender a.fisketure-booking-trip-card:hover {
	border-color: var(--fisketure-booking-brand-color, #0073aa);
}

.fisketure-booking-trip-card--unavailable {
	opacity: 0.75;
}

.fisketure-booking-trip-card-title {
	font-weight: 600;
	margin-bottom: 0.25rem;
}

.fisketure-booking-trip-card-time {
	font-size: 0.85rem;
	color: #666;
	margin-bottom: 0.5rem;
}

/* Badges genbruger BEVIDST .fisketure-booking-badge(--full/--cancelled), samme
 * klasser som enkelt-tur-sidens badges nedenfor – se buildTripCard() i
 * fisketure-booking-calendar.js. Kun selve wrapperens layout er nyt her. */
.fisketure-booking-trip-card-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}

.fisketure-booking-trip-card-price {
	margin-top: 0.6rem;
	font-weight: 700;
}

/* ---------------------------------------------------------------------------
 * Enkelt-tur-side
 * ------------------------------------------------------------------------ */

.fisketure-booking-single-trip {
	max-width: 950px;
	margin: 0 auto;
	padding: 1rem;
}

.fisketure-booking-trip-hero {
	margin: 0 0 1.5rem;
	max-height: 600px;
	border-radius: 8px;
	overflow: hidden;
}

/* width: 100% + height: auto skalerer billedet til fuld bredde i sit naturlige
 * højde/bredde-forhold ("fuld størrelse billede", ikke en beskåret WP-
 * billedstørrelse) – er det resulterende billede højere end wrapperens
 * max-height: 600px ovenfor, beskærer overflow: hidden simpelthen resten. */
.fisketure-booking-trip-hero img {
	width: 100%;
	height: auto;
	display: block;
}

.fisketure-booking-trip-title {
	margin: 0 0 0.75rem;
}

.fisketure-booking-trip-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1.5rem;
}

.fisketure-booking-badge {
	display: inline-block;
	padding: 0.3rem 0.75rem;
	border-radius: 999px;
	background: #e6f4ea;
	color: #1e6b3a;
	font-size: 0.85rem;
}

.fisketure-booking-badge--full {
	background: #f4e6e6;
	color: #8a2c2c;
}

.fisketure-booking-badge--cancelled {
	background: #eee;
	color: #666;
}

.fisketure-booking-trip-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1rem;
	margin: 0 0 2rem;
	padding: 1rem;
	background: #f7f7f7;
	border-radius: 8px;
}

.fisketure-booking-trip-facts dt {
	font-size: 0.8rem;
	color: #666;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.fisketure-booking-trip-facts dd {
	margin: 0.15rem 0 0;
	font-size: 1.05rem;
	font-weight: 600;
}

/* "Se på Google Maps"-linket ved siden af afgangssted (v0.33.0). Egen linje
 * under adressen (block) i stedet for inline, så det ikke klemmes op ad en
 * lang adressetekst i en smal grid-kolonne. */
.fisketure-booking-map-link {
	display: block;
	margin-top: 0.2rem;
	font-size: 0.85rem;
	font-weight: 400;
	color: var(--fisketure-booking-brand-color, #0073aa);
}

.fisketure-booking-trip-description {
	line-height: 1.7;
	margin-bottom: 2rem;
}

.fisketure-booking-boat-section,
.fisketure-booking-trip-info-section {
	margin-bottom: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid #e2e2e2;
}

.fisketure-booking-trip-booking {
	padding-top: 1.5rem;
	border-top: 1px solid #e2e2e2;
}

.fisketure-booking-notice {
	padding: 1rem;
	border-radius: 6px;
	background: #f4e6e6;
	color: #8a2c2c;
}

.fisketure-booking-notice--error {
	background: #f4e6e6;
	color: #8a2c2c;
}

/* ---------------------------------------------------------------------------
 * Booking-formular (delt mellem enkelt-tur-siden)
 * ------------------------------------------------------------------------ */

.fisketure-booking-form {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
	max-width: 100%;
}

/* Mobil: alle felter i 1 kolonne (samme 768px-breakpoint som kalenderens
 * mobil/lodret-tablet-visning, se fisketure-booking-public.css's kalender-
 * sektion, for konsistens på tværs af pluginnet). */
@media (max-width: 768px) {
	.fisketure-booking-form {
		grid-template-columns: 1fr;
	}
}

.fisketure-booking-field {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	font-size: 0.9rem;
}

/* Adresse og Besked får bevidst deres EGEN fulde bredde-række i stedet for at
 * dele en kolonne med et andet felt, uanset hvor mange kolonner grid'et
 * ovenfor har på det pågældende skærmbillede – se single-trip.php. */
.fisketure-booking-field--full {
	grid-column: 1 / -1;
}

.fisketure-booking-field input,
.fisketure-booking-field select,
.fisketure-booking-field textarea {
	padding: 0.6rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	font: inherit;
}

.fisketure-booking-field textarea {
	resize: vertical;
	min-height: 4.5rem;
}

/* Ligger som søskende til (ikke børn af) .fisketure-booking-form – se
 * single-trip.php og fisketure-booking-trip.js for hvorfor. */
.fisketure-booking-form-error {
	margin-top: 1rem;
	color: #a00;
	font-size: 0.9rem;
}

.fisketure-booking-form-success {
	margin-top: 1rem;
	padding: 1rem;
	background: #e6f4ea;
	color: #1e6b3a;
	border-radius: 6px;
}

button.fisketure-booking-button {
	grid-column: 1 / -1;
	display: block;
	width: 100%;
	padding: 0.7rem 1.4rem;
	background: var(--fisketure-booking-brand-color, #0073aa);
	color: #fff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 0.95rem;
	text-align: center;
}

button.fisketure-booking-button:hover,
button.fisketure-booking-button:focus {
	/* background/color gentaget eksplicit (samme værdi som grundtilstanden) –
	 * uden dem ville Elementors :hover/:focus-regel (som SÆTTER begge) vinde
	 * kampen om netop disse to egenskaber, uanset vores højere specificitet
	 * på selve selectoren (cascade'en afgøres pr. egenskab, ikke pr. regel).
	 * Mørkere udgave af brandfarven uden at skulle regne en fast hex-værdi ud
	 * af en admin-valgt farve – virker for enhver valgt brandfarve. */
	background: var(--fisketure-booking-brand-color, #0073aa);
	color: #fff;
	filter: brightness(85%);
}

button.fisketure-booking-button:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}