/* =================================================================
   RSH Værelser – temaer og komponenter
   Temaet vælges pr. bruger (data-theme på <html>); lys/mørk er separat (data-bs-theme).
   ================================================================= */

:root, [data-theme="klassisk"] {
  --app-accent: #1f4e6b; --app-accent-rgb: 31, 78, 107; --app-accent-hover: #173b51;
  --app-nav-bg: #1f4e6b; --app-nav-fg: #ffffff; --app-nav-hover: rgba(255,255,255,.14);
  --app-bg: #f3f4f6; --app-radius: .5rem; --app-shadow: none; --app-card-border: var(--bs-border-color);
  --app-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --app-head-font: var(--app-font); --app-sand: #fbf3dc;
}
[data-theme="fjord"] {
  --app-accent: #0f766e; --app-accent-rgb: 15, 118, 110; --app-accent-hover: #0b5d57;
  --app-nav-bg: #ffffff; --app-nav-fg: #12302d; --app-nav-hover: rgba(15,118,110,.10);
  --app-bg: #eef4f3; --app-radius: .9rem; --app-card-border: transparent;
  --app-shadow: 0 1px 2px rgba(16,42,40,.05), 0 6px 18px rgba(16,42,40,.06);
  --app-sand: #e3f1ee;
}
[data-theme="sand"] {
  --app-accent: #b4532a; --app-accent-rgb: 180, 83, 42; --app-accent-hover: #8f4121;
  --app-nav-bg: #2f2a24; --app-nav-fg: #f6efe5; --app-nav-hover: rgba(246,239,229,.12);
  --app-bg: #f6f1e9; --app-radius: .75rem; --app-card-border: #e7dccb;
  --app-shadow: 0 1px 3px rgba(60,40,20,.06);
  --app-head-font: Georgia, "Times New Roman", serif; --app-sand: #f3e6cf;
}
[data-theme="skov"] {
  --app-accent: #3f6b3a; --app-accent-rgb: 63, 107, 58; --app-accent-hover: #30532c;
  --app-nav-bg: #24382a; --app-nav-fg: #eef5ec; --app-nav-hover: rgba(238,245,236,.12);
  --app-bg: #f1f4ef; --app-radius: .6rem; --app-card-border: #dfe6da; --app-shadow: none;
  --app-sand: #e8efe2;
}
[data-theme="lavendel"] {
  --app-accent: #5b4bb7; --app-accent-rgb: 91, 75, 183; --app-accent-hover: #47399a;
  --app-nav-bg: linear-gradient(90deg, #3f37a8, #6d4fc4); --app-nav-fg: #ffffff; --app-nav-hover: rgba(255,255,255,.16);
  --app-bg: #f4f3fa; --app-radius: 1rem; --app-card-border: transparent;
  --app-shadow: 0 2px 10px rgba(60,50,140,.08);
  --app-sand: #ece9fb;
}
/* Mørk tilstand – fælles for alle temaer */
[data-bs-theme="dark"] {
  --app-bg: #15181b; --app-card-border: var(--bs-border-color); --app-shadow: none; --app-sand: #33302a;
}
[data-bs-theme="dark"][data-theme="fjord"] { --app-nav-bg: #0d2422; --app-nav-fg: #e3f1ee; --app-sand: #12302d; }
[data-bs-theme="dark"][data-theme="sand"] { --app-sand: #3a3124; }
[data-bs-theme="dark"][data-theme="skov"] { --app-sand: #26352a; }
[data-bs-theme="dark"][data-theme="lavendel"] { --app-sand: #2b2645; }

body { background: var(--app-bg); font-family: var(--app-font); font-size: .925rem;
  --bs-link-color-rgb: var(--app-accent-rgb); --bs-link-hover-color-rgb: var(--app-accent-rgb); }
h1, h2, h3, .h4, .h5 { font-family: var(--app-head-font); }
[data-bs-theme="dark"] body { --bs-link-color-rgb: 140, 190, 230; }

.btn-primary { --bs-btn-bg: var(--app-accent); --bs-btn-border-color: var(--app-accent); --bs-btn-hover-bg: var(--app-accent-hover); --bs-btn-hover-border-color: var(--app-accent-hover);
  --bs-btn-active-bg: var(--app-accent-hover); --bs-btn-active-border-color: var(--app-accent-hover); --bs-btn-disabled-bg: var(--app-accent); --bs-btn-disabled-border-color: var(--app-accent); }
.btn-outline-primary { --bs-btn-color: var(--app-accent); --bs-btn-border-color: var(--app-accent); --bs-btn-hover-bg: var(--app-accent); --bs-btn-hover-border-color: var(--app-accent); --bs-btn-active-bg: var(--app-accent); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--app-accent); }
.nav-pills .nav-link:not(.active) { color: var(--bs-body-color); }
.form-control:focus, .form-select:focus { border-color: rgba(var(--app-accent-rgb), .55); box-shadow: 0 0 0 .2rem rgba(var(--app-accent-rgb), .18); }
.form-check-input:checked { background-color: var(--app-accent); border-color: var(--app-accent); }
.dropdown-item.active, .dropdown-item:active { background-color: var(--app-accent); }
.page-item.active .page-link { background-color: var(--app-accent); border-color: var(--app-accent); }

.app-nav { background: var(--app-nav-bg); box-shadow: 0 1px 0 rgba(0,0,0,.06); }
.app-nav .navbar-brand, .app-nav .nav-link { color: var(--app-nav-fg); }
.app-nav .nav-link { border-radius: .4rem; }
.app-nav .nav-link:hover, .app-nav .nav-link.active, .app-nav .nav-link.show { color: var(--app-nav-fg); background: var(--app-nav-hover); }
.app-nav .btn-outline-secondary { color: var(--app-nav-fg); border-color: color-mix(in srgb, var(--app-nav-fg) 35%, transparent); }
.app-nav .btn-outline-secondary:hover { background: var(--app-nav-hover); }
.app-nav .navbar-toggler { border-color: color-mix(in srgb, var(--app-nav-fg) 50%, transparent); }
[data-theme="klassisk"] .app-nav .navbar-toggler-icon, [data-theme="sand"] .app-nav .navbar-toggler-icon,
[data-theme="skov"] .app-nav .navbar-toggler-icon, [data-theme="lavendel"] .app-nav .navbar-toggler-icon { filter: invert(1); }
.theme-swatch { width: 14px; height: 14px; border-radius: 50%; display: inline-block; border: 2px solid rgba(255,255,255,.7); box-shadow: 0 0 0 1px rgba(0,0,0,.15); }

.login-wrap { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.login-card { width: 100%; max-width: 400px; }
.code-input { letter-spacing: .4em; font-variant-numeric: tabular-nums; }

/* Kort og nøgletal */
.card { border-color: var(--app-card-border); border-radius: var(--app-radius); box-shadow: var(--app-shadow); }
.card-header { background: var(--bs-body-bg); font-weight: 600; border-top-left-radius: var(--app-radius) !important; border-top-right-radius: var(--app-radius) !important; }
.kpi { background: var(--bs-body-bg); border: 1px solid var(--app-card-border); border-radius: var(--app-radius); box-shadow: var(--app-shadow); padding: .75rem 1rem; height: 100%; color: inherit; }
.kpi .kpi-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--bs-secondary-color); }
.kpi .kpi-value { font-size: 1.7rem; font-weight: 650; line-height: 1.2; font-variant-numeric: tabular-nums; }
.kpi .kpi-sub { font-size: .8rem; color: var(--bs-secondary-color); }
.kpi-btn { text-align: left; cursor: pointer; transition: border-color .15s, transform .1s; }
.kpi-btn:hover { border-color: rgba(var(--app-accent-rgb), .6); }
.kpi-btn:active { transform: scale(.99); }
.kpi-btn.active { outline: 2px solid var(--app-accent); outline-offset: -1px; }

/* Tabeller */
.table-num td.num, .table-num th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table-overview th { position: sticky; top: 56px; background: var(--bs-body-bg); z-index: 2; font-size: .8rem; }
.neg { color: var(--bs-danger); font-weight: 600; }
.pos { color: var(--bs-success); }
.komit-input { width: 70px; text-align: right; padding: .1rem .3rem; }
.bar { height: 6px; background: var(--bs-secondary-bg); border-radius: 3px; overflow: hidden; min-width: 60px; }
.bar > span { display: block; height: 100%; background: var(--app-accent); }
.bar > span.full { background: var(--bs-success); }
.bar > span.over { background: var(--bs-danger); }

/* Værelsesplan */
:root { --st-free: #1f9d55; --st-partial: #d97706; --st-booked: #c0392b; --st-block: #2b7bb9; --st-other: #8a8f98; }
.roomplan td, .roomplan th { padding: .3rem .5rem; vertical-align: middle; }
.roomplan tr.cat-row td { background: var(--app-sand); font-weight: 600; font-size: .82rem; padding-top: .4rem; padding-bottom: .4rem; }
.roomplan tr.room-start td { border-top: 2px solid var(--bs-border-color); }
.roomplan tr.bed > td:first-child { box-shadow: inset 5px 0 0 var(--stripe, transparent); }
.roomplan tr.bed-free { --stripe: var(--st-free); }
.roomplan tr.bed-booked { --stripe: var(--st-booked); }
.roomplan tr.bed-block { --stripe: var(--st-block); }
.roomplan tr.bed-other { --stripe: var(--st-other); }
.roomplan tr.bed-free td { background: rgba(31,157,85,.07); }
.roomplan tr.bed-block td { background: rgba(43,123,185,.08); }
.roomplan tr.bed-other td { background: var(--bs-tertiary-bg); }
.roomplan tr.free { cursor: pointer; }
.roomplan tr.free:hover td { background: rgba(31,157,85,.16); }
.room-cell { width: 78px; padding-left: .75rem !important; }
.room-no { display: inline-flex; align-items: center; justify-content: center; min-width: 3.4rem; padding: .2rem .5rem; border-radius: .5rem;
  font-size: 1.15rem; font-weight: 750; color: #fff; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.room-free { background: var(--st-free); } .room-partial { background: var(--st-partial); } .room-booked { background: var(--st-booked); }
.room-block { background: var(--st-block); } .room-other { background: var(--st-other); }
.room-cell.follow .room-no { visibility: hidden; }
.room-cell.follow.show-no .room-no { visibility: visible; }
.roomplan .bedno { color: var(--bs-secondary-color); width: 22px; font-size: .75rem; }
.roomplan .pname { font-weight: 600; color: var(--bs-body-color); }
.roomplan .actions { white-space: nowrap; text-align: right; width: 1%; }
.roomplan .actions form:not(.dropdown-menu) { display: none; }
.roomplan .note, .note { font-size: .82rem; color: var(--bs-secondary-color); }
.legend span { margin-left: .6rem; white-space: nowrap; color: var(--bs-secondary-color); }
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: .25rem; vertical-align: -1px; }
.dot-free { background: var(--st-free); } .dot-partial { background: var(--st-partial); } .dot-booked { background: var(--st-booked); }
.dot-block { background: var(--st-block); } .dot-other { background: var(--st-other); }
.badge-m { background: #2a6f97; }
.chip { display: inline-block; padding: .1rem .5rem; border-radius: 1rem; font-size: .72rem; background: var(--bs-secondary-bg); }

/* Paneler/widgets der kan flyttes og klappes sammen */
.panel-head { display: flex; align-items: center; gap: .4rem; user-select: none; }
.panel-handle { cursor: grab; color: var(--bs-secondary-color); padding: .1rem; }
.panel-handle:active { cursor: grabbing; }
.panel-toggle { flex-grow: 1; cursor: pointer; display: flex; align-items: center; gap: .4rem; }
.panel-toggle .chev { margin-left: auto; transition: transform .15s; color: var(--bs-secondary-color); }
.is-collapsed .panel-body { display: none !important; }
.is-collapsed .chev { transform: rotate(-90deg); }
.is-collapsed .card-header { border-bottom: 0; border-radius: var(--app-radius) !important; }
.panel-ghost { opacity: .4; }
.flash-panel { animation: flashp 1.2s; }
@keyframes flashp { 0% { box-shadow: 0 0 0 3px rgba(var(--app-accent-rgb), .6); } 100% { box-shadow: var(--app-shadow); } }
.wl-no { flex: 0 0 auto; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--app-accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 700; }
.min-w-0 { min-width: 0; }
.manchet { white-space: pre-wrap; font-size: .9rem; max-height: 360px; overflow: auto; }

/* Dashboard */
.dash-grid .panel-handle { opacity: .35; }
.dash-grid .vb-panel:hover .panel-handle { opacity: 1; }

.search-hit { cursor: pointer; }
.copied { animation: flash 1s; }
@keyframes flash { from { background: var(--bs-success-bg-subtle); } to { background: transparent; } }
.testdata-banner { background: repeating-linear-gradient(45deg, #ffe08a, #ffe08a 12px, #ffd45c 12px, #ffd45c 24px); color: #3d2e00; }
.testdata-banner a { color: #3d2e00; font-weight: 600; }
.season-pills .nav-link { border: 1px solid var(--bs-border-color); margin-right: .35rem; }

@media print {
  .app-nav, .no-print, .btn, form.d-flex, .testdata-banner, .kpi-row { display: none !important; }
  body { background: #fff; }
  .col-lg-8 { width: 100% !important; }
  .room-no { color: #000; background: none !important; border: 1px solid #000; }
}

/* Popup-vinduer */
.vb-frame-dialog { max-width: none; width: auto; display: flex; justify-content: center; }
.vb-frame-content { width: min(980px, 94vw); height: 82vh; min-width: 360px; min-height: 280px; max-width: 98vw; max-height: 96vh; resize: both; overflow: hidden; border-radius: var(--app-radius); }
#vbFrame { border: 0; width: 100%; flex: 1 1 auto; background: var(--app-bg); }
.modal-mode main { padding: .75rem !important; }
.modal-mode .hide-in-modal { display: none !important; }
#bookModal .modal-dialog { max-width: 560px; }
#bookModal .modal-content { resize: both; overflow: auto; }

/* Klæbende værktøjslinje i planen */
.plan-toolbar { position: sticky; top: var(--nav-h, 56px); z-index: 5; background: var(--bs-body-bg); }
.table-overview th { top: var(--nav-h, 56px); }

/* Hold (A/B/C) og grupper */
.hold { display: inline-flex; align-items: center; justify-content: center; min-width: 1.4rem; height: 1.4rem; padding: 0 .3rem; border-radius: .35rem; font-size: .75rem; font-weight: 700; color: #fff; background: #6b7280; vertical-align: 1px; }
.hold-solo { background: transparent; color: var(--bs-secondary-color); font-size: .45rem; border: 1.5px solid var(--bs-border-color); }
.hold-A { background: #2a78d6; } .hold-B { background: #b4532a; } .hold-C { background: #1b8f6a; } .hold-D { background: #7c4dbd; }
.grp { display: inline-block; padding: .05rem .45rem; border-radius: 1rem; font-size: .72rem; background: rgba(var(--app-accent-rgb), .12); color: var(--bs-body-color); border: 1px solid rgba(var(--app-accent-rgb), .25); }
.group-row { cursor: pointer; }
.group-row.active { background: rgba(var(--app-accent-rgb), .1); }
.week-row td { background: var(--app-sand) !important; font-weight: 600; }
.hold-row td:nth-child(2) { padding-left: 1.4rem; }
/* v2.1: sticky kolonneoverskrifter i oversigten virker kun uden overflow-container */
@media (min-width: 1200px) { .overview-wrap { overflow: visible; } }
@media (max-width: 1199.98px) { .table-overview th { position: static; } }
.table-overview td .pct, .table-overview td small { white-space: nowrap; }
/* v2.4: klikbart hold-mærke (flyt til andet hold) */
button.hold-btn { border: 0; cursor: pointer; line-height: inherit; }
button.hold-btn:hover { filter: brightness(1.15); outline: 2px solid var(--bs-focus-ring-color, rgba(13,110,253,.25)); }
/* v2.5: bjælke til at flytte flere */
.bulk-bar { position: fixed; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 1040; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: .75rem; padding: .5rem .9rem; max-width: calc(100vw - 2rem); }
.pcell .js-sel { vertical-align: -2px; }
.backup-alert { background: #b42318; color: #fff; text-align: center; padding: .35rem 1rem; font-size: .875rem; }
.backup-alert a { color: #fff; font-weight: 600; }
/* v2.6: flyt / giv plads-vinduet */
.room-grid { display: flex; flex-wrap: wrap; gap: .4rem; }
.room-pick { display: flex; flex-direction: column; align-items: center; min-width: 5.2rem; padding: .35rem .5rem; border-radius: .5rem; cursor: pointer;
  border: 2px solid #1f9d55; background: rgba(31,157,85,.08); line-height: 1.15; }
.room-pick .no { font-size: 1.25rem; font-weight: 800; color: #17803f; }
.room-pick .sub { font-size: .68rem; color: var(--bs-secondary-color); text-align: center; max-width: 7.5rem; }
.btn-check:checked + .room-pick { background: #1f9d55; border-color: #1f9d55; }
.btn-check:checked + .room-pick .no, .btn-check:checked + .room-pick .sub { color: #fff; }
.room-pick:hover { box-shadow: 0 0 0 3px rgba(31,157,85,.25); }
.deadline-alert { background: #fff3cd; color: #664d03; text-align: center; padding: .35rem 1rem; font-size: .875rem; border-bottom: 1px solid #ffe69c; }
[data-bs-theme=dark] .deadline-alert { background: #332701; color: #ffda6a; border-color: #664d03; }
/* v2.9: noter til højre for navnet på brede skærme */
@media (min-width: 1200px) {
  .roomplan .pwrap { display: flex; gap: .15rem 1.25rem; align-items: baseline; }
  .roomplan .pwrap .pmain { flex: 0 0 auto; min-width: 15rem; }
  .roomplan .pwrap .note { flex: 1 1 auto; margin: 0; }
}
.room-cell .sea { color: #1c7ed6; margin-left: .3rem; font-size: 1rem; vertical-align: middle; }
/* Markering af det, man lige har rettet */
@keyframes vbFlash { 0%, 15% { background-color: rgba(255, 193, 7, .55); } 100% { background-color: transparent; } }
tr.hl-flash > td, .hl-flash { animation: vbFlash 5s ease-out 1; }
tr.hl-flash > td:first-child { box-shadow: inset 4px 0 0 #f59f00; }
:target, [id^="b"], [id^="r"] { scroll-margin-top: calc(var(--nav-h, 56px) + 70px); }
/* v2.9: Ledige pladser */
.ledige th { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--bs-secondary-color); white-space: nowrap; }
.ledige th.dim, .ledige td.dim { opacity: .35; }
.ledige tr.full td { opacity: .55; }
.ledige .chips { display: flex; flex-wrap: wrap; gap: .25rem; max-width: 26rem; }
.rchip { display: inline-flex; align-items: center; gap: .15rem; padding: .1rem .45rem; border-radius: .4rem; font-weight: 700; font-size: .9rem; text-decoration: none;
  color: #17803f; background: rgba(31,157,85,.10); border: 1.5px solid rgba(31,157,85,.55); }
.rchip:hover { background: #1f9d55; color: #fff; }
.rchip.sea { border-color: #1c7ed6; box-shadow: inset 0 -3px 0 rgba(28,126,214,.35); }
.rchip .bi-water { color: #1c7ed6; font-size: .8rem; }
.rchip:hover .bi { color: #fff !important; }
.caller-chip { background: #1b7a4b; color: #fff; border-radius: .6rem; padding: .4rem .8rem; }
.caller-chip a { color: #fff; }