/*
 * WATCHHUNT – pretix (tickets.) im dunklen Cockpit-/Website-Stil: warmes Licht, Glas, Gold als einziger Akzent.
 * Von Caddy (Snippet theme_inject) in jede pretix-Seite eingefügt – Verwaltung (/control) und Ticketseiten.
 * pretix selbst bleibt unverändert (Lizenz: „ohne eigene Modifikationen“).
 * Geladen von Caddy (theme_inject_dunkel): brand.css + <app>-dunkel.css + diese Datei, parallel (kein @import).
 * Ebene 1: pretix-dunkel.css (automatisch aus pretix' CSS erzeugt, scripts/css-dunkel.py)
 * Ebene 2: diese Datei. pretix nutzt Bootstrap 3 + eigene Farbvariablen (--pretix-*).
 */

:root {
  color-scheme: dark;
  --k-bg: #0e0d0c; --k-text: #f3efe8; --k-muted: #b9b1a4; --k-faint: #8a8276;
  --k-gold: #e2b04a; --k-gold-2: #f0c873; --k-line: rgba(255,244,222,.14); --k-line-2: rgba(255,244,222,.08);
  --k-glass: linear-gradient(160deg, rgba(255,250,240,.10), rgba(255,250,240,.035) 50%, rgba(255,250,240,.06));
  --k-shadow: 0 30px 60px -32px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.12);
  --k-field: rgba(0,0,0,.3);
  /* pretix' eigene Variablen */
  --pretix-font-family-sans-serif: var(--wh-font) !important;
  --pretix-brand-primary: #e2b04a !important;
  --pretix-brand-success: #4fae73 !important;
  --pretix-brand-info: #c99a2e !important;
  --pretix-brand-danger: #e0675e !important;
  --pretix-link-contrast-color: #f0c873 !important;
  --pretix-link-hover-contrast-color: #fff3d6 !important;
  --pretix-body-bg: #0e0d0c !important;
  --pretix-border-radius-base: 12px !important;
  --pretix-border-radius-large: 18px !important;
  --pretix-border-radius-small: 8px !important;
}

/* ---------- Grundfläche ---------- */
html { background: var(--k-bg) !important; }
body { background: transparent !important; color: var(--k-text) !important; }
/* Warmes Licht als eigene feste Ebene: wird beim Scrollen nicht neu gezeichnet */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(38vw 38vw at 6% 18%, rgba(140,90,30,.40), transparent 70%),
    radial-gradient(26vw 26vw at 62% -6%, rgba(240,180,90,.20), transparent 70%),
    radial-gradient(34vw 34vw at 96% 92%, rgba(138,83,28,.38), transparent 70%),
    radial-gradient(20vw 20vw at 78% 34%, rgba(43,74,74,.26), transparent 70%);
}
body, input, select, textarea, button, h1, h2, h3, h4, h5, .btn, .form-control { font-family: var(--wh-font) !important; }
h1, h2, h3, h4, h5, legend, .page-header h1 { color: var(--k-text) !important; font-weight: 500 !important; letter-spacing: -.01em; }
a, a:link, a:visited { color: var(--k-gold-2); }
a:hover, a:focus { color: #fff3d6; }
.text-muted, .help-block, small, .small { color: var(--k-faint) !important; }
hr, .page-header, legend { border-color: var(--k-line) !important; }
code, pre { background: rgba(0,0,0,.35) !important; color: var(--k-gold-2) !important; border-color: var(--k-line) !important; }

/* ---------- Verwaltung: Kopfzeile und Seitenleiste ---------- */
nav.navbar.navbar-inverse, .navbar-inverse {
  background: rgba(14,13,12,.62) !important; backdrop-filter: blur(24px) saturate(150%); -webkit-backdrop-filter: blur(24px) saturate(150%);
  border: 0 !important; border-bottom: 1px solid var(--k-line-2) !important; box-shadow: none !important;
}
.navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav > li > a, .navbar-inverse .context-name { color: var(--k-text) !important; }
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > .open > a { background: rgba(255,255,255,.08) !important; color: #fff !important; border-radius: 999px; }
.navbar-default.sidebar {
  background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045) 50%, rgba(255,255,255,.08)) !important;
  border: 1px solid rgba(255,255,255,.16) !important; border-radius: 24px !important; margin: 14px 0 14px 14px !important;
  backdrop-filter: blur(28px) saturate(170%); -webkit-backdrop-filter: blur(28px) saturate(170%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 30px 60px -30px rgba(0,0,0,.9) !important; padding: .5em 0 !important;
}
.sidebar ul li, .sidebar ul li a, #side-menu > li, #side-menu li a { border: 0 !important; background: transparent !important; }
#side-menu li a { color: var(--k-muted) !important; border-radius: 12px !important; margin: 1px 8px !important; padding: 9px 14px !important; }
#side-menu li a:hover, #side-menu li a:focus { background: rgba(255,255,255,.08) !important; color: var(--k-text) !important; }
#side-menu li a.active, #side-menu > li.active > a, #side-menu li.active > a {
  color: #1a1205 !important; background: linear-gradient(180deg, var(--k-gold-2), var(--k-gold)) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
}
#side-menu .nav-second-level li a { padding-left: 34px !important; font-size: .92em; }
#side-menu .fa, #side-menu .fa-fw { color: inherit !important; opacity: .85; }
#page-wrapper { background: transparent !important; border: 0 !important; }

/* ---------- Karten: Panels, Wells, Listen, Dialoge ---------- */
.panel, .well, .list-group-item, .modal-content, .main-box, .thumbnail, .jumbotron, .popover {
  background: var(--k-glass) !important; border: 1px solid var(--k-line) !important; border-radius: 20px !important;
  box-shadow: var(--k-shadow) !important; color: var(--k-text) !important;
}
.list-group-item { border-radius: 0 !important; box-shadow: none !important; }
.list-group-item:first-child { border-radius: 16px 16px 0 0 !important; }
.list-group-item:last-child { border-radius: 0 0 16px 16px !important; }
.panel > .panel-heading, .panel-default > .panel-heading, .modal-header, .modal-footer {
  background: rgba(0,0,0,.18) !important; color: var(--k-text) !important; border-color: var(--k-line) !important;
}
.panel > .panel-heading { border-radius: 20px 20px 0 0 !important; }
.panel-footer { background: rgba(0,0,0,.14) !important; border-color: var(--k-line) !important; border-radius: 0 0 20px 20px !important; }
.panel-body, .panel-title, .panel-title a { color: var(--k-text) !important; }
.dropdown-menu { background: rgba(28,25,21,.95) !important; border: 1px solid var(--k-line) !important; border-radius: 14px !important; box-shadow: var(--k-shadow) !important; }
.dropdown-menu > li > a { color: var(--k-text) !important; }
.dropdown-menu > li > a:hover, .dropdown-menu > .active > a { background: rgba(226,176,74,.16) !important; color: var(--k-gold-2) !important; }
.modal-backdrop.in { opacity: .7 !important; }

/* ---------- Tabellen ---------- */
.table, .table > thead > tr > th, .table > tbody > tr > td, .table > tfoot > tr > td { color: var(--k-text) !important; border-color: var(--k-line-2) !important; background: transparent !important; }
.table > thead > tr > th { color: var(--k-muted) !important; text-transform: uppercase; letter-spacing: .08em; font-size: .74rem; font-weight: 600; border-bottom: 1px solid var(--k-line) !important; }
.table-striped > tbody > tr:nth-of-type(odd) > td { background: rgba(255,255,255,.025) !important; }
.table-hover > tbody > tr:hover > td { background: rgba(226,176,74,.08) !important; }

/* ---------- Formulare ---------- */
.form-control, .input-group-addon, select, textarea, input[type=text], input[type=email], input[type=number], input[type=password], input[type=search], input[type=url], input[type=tel], input[type=date], input[type=datetime-local] {
  background: var(--k-field) !important; color: var(--k-text) !important; border: 1px solid var(--k-line) !important; border-radius: 12px !important; box-shadow: none !important;
}
.input-group .form-control:not(:last-child), .input-group-addon:first-child { border-radius: 12px 0 0 12px !important; }
.input-group .form-control:last-child, .input-group-addon:last-child { border-radius: 0 12px 12px 0 !important; }
.form-control:focus { border-color: var(--k-gold) !important; box-shadow: 0 0 0 3px rgba(226,176,74,.22) !important; }
.form-control[disabled], .form-control[readonly] { background: rgba(255,255,255,.03) !important; color: var(--k-muted) !important; }
select option { background: #1a1815; color: var(--k-text); }
.control-label, label { color: var(--k-text) !important; }
input[type=checkbox], input[type=radio] { accent-color: var(--k-gold); }

/* ---------- Knöpfe ---------- */
.btn { border-radius: 999px !important; padding-left: 1.1em; padding-right: 1.1em; font-weight: 500; }
.btn-primary, .btn-primary:focus, .btn-success, .btn-checkout {
  background: linear-gradient(180deg, var(--k-gold-2), var(--k-gold)) !important; border-color: transparent !important; color: #1a1205 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45) !important; font-weight: 600 !important;
}
.btn-primary:hover, .btn-success:hover { filter: brightness(1.06); color: #1a1205 !important; }
.btn-default, .btn-default:focus {
  background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.05)) !important; border: 1px solid rgba(255,255,255,.16) !important;
  color: var(--k-text) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.22) !important;
}
.btn-default:hover { background: rgba(255,255,255,.14) !important; color: #fff !important; }
.btn-danger { background: rgba(224,103,94,.18) !important; border: 1px solid rgba(224,103,94,.5) !important; color: #ffb3ad !important; }
.btn-link { color: var(--k-gold-2) !important; }

/* ---------- Reiter, Navigation, Hinweise ---------- */
.nav-tabs { border-color: var(--k-line) !important; }
.nav-tabs > li > a { color: var(--k-muted) !important; border: 0 !important; border-radius: 999px !important; }
.nav-tabs > li > a:hover { background: rgba(255,255,255,.08) !important; }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus, .nav-pills > li.active > a {
  background: linear-gradient(180deg, var(--k-gold-2), var(--k-gold)) !important; color: #1a1205 !important; border: 0 !important;
}
.pagination > li > a, .pagination > li > span { background: rgba(255,255,255,.05) !important; border-color: var(--k-line) !important; color: var(--k-text) !important; }
.pagination > .active > a, .pagination > .active > span { background: var(--k-gold) !important; color: #1a1205 !important; border-color: var(--k-gold) !important; }
.breadcrumb { background: transparent !important; }
.alert { border-radius: 16px !important; background: rgba(255,255,255,.05) !important; color: var(--k-text) !important; border: 1px solid var(--k-line) !important; }
.alert-info, .alert-warning { border-color: rgba(226,176,74,.45) !important; }
.alert-success { border-color: rgba(79,174,115,.5) !important; }
.alert-danger { border-color: rgba(224,103,94,.55) !important; }
.alert a { color: var(--k-gold-2) !important; }
.label, .badge { border-radius: 999px !important; }
.label-default, .badge { background: rgba(255,255,255,.12) !important; color: var(--k-text) !important; }
.progress { background: rgba(255,255,255,.08) !important; border-radius: 999px !important; }
.progress-bar { background: var(--k-gold) !important; }

/* ---------- Ticketseiten (öffentlich) ---------- */
.container.main-box { margin-top: 28px !important; margin-bottom: 28px !important; padding: 28px 32px !important; border-radius: 28px !important; }
.page-header { border: 0 !important; }
.page-header h1 { font-size: clamp(1.8rem, 3vw, 2.4rem) !important; }
.product-row, .item-category, .event-list .row { border-color: var(--k-line-2) !important; }
.price, .product-row .price { color: var(--k-gold-2) !important; font-weight: 600; }
footer, .footer, footer a { color: var(--k-faint) !important; }

/* ---------- Anmeldeseite der Verwaltung: WATCHHUNT-Logo (Hinweis „…Software von pretix“ bleibt, Lizenz) ---------- */
img.logo[src*="pretix-logo"] { content: url("/_brand/logo-dark.svg"); width: min(300px, 70vw) !important; height: auto !important; margin: 1.5em auto 1em; }

/* ---------- Korrekturen nach erstem Test ---------- */
/* Übersichts- und Veranstaltungskacheln (pretix: weiße 5px-Ränder als Abstand) */
.dashboard .widget-container {
  background: var(--k-glass) !important; border: 1px solid var(--k-line) !important; border-radius: 20px !important;
  margin: 6px !important; box-shadow: var(--k-shadow) !important;
}
.dashboard .widget-container, .dashboard .widget-container * { color: var(--k-text) !important; }
.dashboard .widget-container a:hover { background: rgba(255,255,255,.04) !important; }
.dashboard .widget-container .fa { color: var(--k-gold-2) !important; }
/* Leiste mit „Speichern/Fortfahren“ */
.submit-group {
  background: rgba(20,18,15,.72) !important; border: 1px solid var(--k-line) !important; border-radius: 18px !important;
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
/* Auswahlfelder (select2) */
.select2-container .select2-selection, .select2-container--bootstrap .select2-selection, .select2-container--default .select2-selection {
  background: var(--k-field) !important; border: 1px solid var(--k-line) !important; border-radius: 12px !important; color: var(--k-text) !important; box-shadow: none !important;
}
.select2-selection__rendered, .select2-selection__placeholder { color: var(--k-text) !important; }
.select2-container--open .select2-selection, .select2-container--focus .select2-selection { border-color: var(--k-gold) !important; }
.select2-dropdown { background: rgba(28,25,21,.97) !important; border: 1px solid var(--k-line) !important; border-radius: 14px !important; overflow: hidden; }
.select2-results__option { color: var(--k-text) !important; }
.select2-results__option--highlighted, .select2-results__option[aria-selected=true] { background: rgba(226,176,74,.18) !important; color: var(--k-gold-2) !important; }
.select2-search__field { background: var(--k-field) !important; color: var(--k-text) !important; border-color: var(--k-line) !important; }
.select2-selection__choice { background: rgba(226,176,74,.16) !important; border-color: rgba(226,176,74,.4) !important; color: var(--k-text) !important; }
/* Nur-Admin-Bereiche (pretix: hell gestreift) */
.admin-only, .panel-default > .panel-heading.admin-only { background: rgba(226,176,74,.06) repeating-linear-gradient(135deg, rgba(226,176,74,.08) 0 10px, transparent 12px 22px) !important; }
/* Kopfzeile: Mini-Logo von pretix entfernt, Name bleibt */
.navbar-brand img { display: none !important; }
.navbar-brand { color: var(--k-text) !important; letter-spacing: .12em; font-weight: 500; }
/* Ticketseiten: „Mehr anzeigen“-Verlauf dunkel, ruhigere Trennlinien */
.sneak-peek-trigger { background: linear-gradient(0deg, rgba(20,18,15,.96) 44%, rgba(20,18,15,0)) !important; }
.product-row, .cart-row, .item-category .product-row + .product-row, #content hr { border-color: var(--k-line-2) !important; }

/* ---------- Verwaltung: schmale Icon-Leiste links mittig (brand/pretix.js), ab Tablet-Breite ---------- */
@media (min-width: 768px) {
  body.wh-rail .navbar-default.sidebar {
    position: fixed !important; left: 18px; top: 50%; transform: translateY(-50%); z-index: 1030;
    width: 72px !important; margin: 0 !important; padding: 10px !important; overflow: visible !important; border-radius: 36px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.05) 50%, rgba(255,255,255,.09)) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -1px 0 rgba(255,255,255,.06), 0 30px 60px -28px rgba(0,0,0,.9) !important;
  }
  /* Unschärfe der Kopfzeile würde sie zum Bezugsrahmen der festen Leiste machen -> hier ohne */
  body.wh-rail nav.navbar, body.wh-rail .navbar-inverse { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: rgba(14,13,12,.55) !important; }
  body.wh-rail .navbar-header { margin-left: 92px !important; }
  body.wh-rail #page-wrapper { margin-left: 108px !important; }
  body.wh-rail .sidebar .sidebar-nav { padding: 0 !important; }
  body.wh-rail #side-menu { display: flex !important; flex-direction: column; align-items: center; gap: 6px; }
  body.wh-rail #side-menu > li { width: 52px; position: relative; border: 0 !important; }
  body.wh-rail #side-menu > li > a:not(.arrow), body.wh-rail .context-selector > a {
    width: 52px; height: 52px; padding: 0 !important; margin: 0 !important; display: grid !important; place-items: center;
    border-radius: 50% !important; font-size: 0 !important; color: rgba(255,250,240,.82) !important; background: transparent !important; box-shadow: none !important;
  }
  body.wh-rail #side-menu > li > a .fa, body.wh-rail #side-menu > li > a .fa-fw { font-size: 19px !important; width: auto !important; color: inherit !important; opacity: 1; }
  body.wh-rail #side-menu > li > a svg { width: 20px; height: 20px; top: 0 !important; }
  body.wh-rail #side-menu > li > a svg path { fill: currentColor !important; }
  body.wh-rail #side-menu > li > a:not(.arrow):hover, body.wh-rail .context-selector > a:hover { background: rgba(255,255,255,.10) !important; color: #fff !important; }
  body.wh-rail #side-menu > li > a.active, body.wh-rail #side-menu > li.wh-auf > a:not(.arrow) {
    background: linear-gradient(180deg, rgba(255,255,255,.30), rgba(255,255,255,.14)) !important; color: #fff !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.5), 0 6px 16px -8px rgba(0,0,0,.6) !important;
  }
  body.wh-rail #side-menu > li.testmode > a { color: var(--k-gold) !important; }
  body.wh-rail #side-menu > li > a.arrow, body.wh-rail #side-menu .nav-second-level { display: none !important; }
  /* Bereichswähler oben in der Leiste */
  body.wh-rail .context-selector { width: 52px; margin: 0 auto 8px !important; border: 0 !important; position: relative; }
  body.wh-rail .context-selector > a .context-name, body.wh-rail .context-selector > a .context-meta,
  body.wh-rail .context-selector > a .caret { display: none !important; }
  body.wh-rail .context-selector > a { border: 1px solid rgba(226,176,74,.55) !important; }
  body.wh-rail .context-selector > a .fa-stack { width: auto; height: auto; line-height: 1; font-size: 19px; }
  body.wh-rail .context-selector > a .fa-stack .fa-circle { display: none !important; }
  body.wh-rail .context-selector > a .fa-stack .fa-stack-1x { position: static; font-size: 19px; color: var(--k-gold-2) !important; }
  body.wh-rail .context-selector .dropdown-menu { left: 66px !important; top: 0 !important; min-width: 320px; }
  /* Namensschilder */
  body.wh-rail .wh-tip {
    position: absolute; left: 66px; top: 50%; transform: translate(-6px, -50%); white-space: nowrap; pointer-events: none;
    opacity: 0; transition: opacity .18s, transform .18s; font-size: 13.5px !important; color: var(--k-text) !important;
    padding: .35em .8em; border-radius: 999px; background: rgba(28,25,21,.92); border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 12px 28px -14px rgba(0,0,0,.9); z-index: 5;
  }
  body.wh-rail #side-menu > li:hover .wh-tip, body.wh-rail .context-selector:hover .wh-tip { opacity: 1; transform: translate(0, -50%); }
  body.wh-rail #side-menu > li.wh-auf .wh-tip { opacity: 0 !important; }
}
/* Glaskarte mit Unterpunkten */
.wh-flyout {
  position: fixed; z-index: 1040; width: 290px; font-size: 15px; max-height: calc(100vh - 24px); overflow-y: auto; padding: .7em;
  background: linear-gradient(180deg, rgba(44,39,32,.92), rgba(22,20,17,.95)); color: var(--k-text);
  border: 1px solid rgba(255,255,255,.15); border-radius: 24px;
  backdrop-filter: blur(28px) saturate(170%); -webkit-backdrop-filter: blur(28px) saturate(170%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 40px 80px -30px rgba(0,0,0,.95); animation: wh-auf .18s ease-out;
}
@keyframes wh-auf { from { opacity: 0; transform: translateX(-6px); } }
.wh-flyout[hidden] { display: none !important; }
.wh-flyout a.wh-fly-titel { display: block; font-size: 18px; font-weight: 500; padding: .3em .7em .5em; color: var(--k-text) !important; text-decoration: none !important; }
.wh-flyout a.wh-fly-link { display: block; padding: .5em .8em; border-radius: 12px; color: var(--k-text) !important; font-size: 15px; text-decoration: none !important; }
.wh-flyout a.wh-fly-link:hover, .wh-flyout a.wh-fly-link.aktiv { background: rgba(226,176,74,.16); color: var(--k-gold-2) !important; }
