/* ============================================================
   Nordish-Web Skin für FOSSBilling (Tide-Theme)
   Palette: Amber #E8A84E / Teal #6FB3AD / Rost #B45A30
   Basis:  #060810 (Body) / #0a0f1c / #0c1424 (Surfaces)
   ============================================================ */

:root[data-bs-theme="dark"],
:root {
  /* Brand */
  --tblr-primary: #E8A84E;
  --tblr-primary-rgb: 232, 168, 78;
  --tblr-primary-fg: #060810;
  --tblr-primary-darken: #cf9238;
  --tblr-primary-lt: #2a2114;
  --tblr-primary-lt-rgb: 42, 33, 20;
  --tblr-primary-text-emphasis: #f2c98b;
  --tblr-primary-border-subtle: rgba(232, 168, 78, .35);
  --tblr-primary-bg-subtle: rgba(232, 168, 78, .08);

  /* Sekundär / Teal */
  --tblr-secondary: #6FB3AD;
  --tblr-secondary-rgb: 111, 179, 173;
  --tblr-secondary-fg: #060810;
  --tblr-secondary-text-emphasis: #9fd0cb;
  --tblr-secondary-border-subtle: rgba(111, 179, 173, .35);
  --tblr-secondary-bg-subtle: rgba(111, 179, 173, .08);

  /* Grundflächen */
  --tblr-body-bg: #060810;
  --tblr-body-bg-rgb: 6, 8, 16;
  --tblr-bg-surface: #0c1424;
  --tblr-bg-surface-rgb: 12, 20, 36;
  --tblr-bg-surface-secondary: #0a0f1c;
  --tblr-bg-surface-tertiary: #0c1424;
  --tblr-bg-forms: #0a0f1c;

  /* Text */
  --tblr-body-color: #e9ebe5;
  --tblr-body-color-rgb: 233, 235, 229;
  --tblr-heading-color: #e9ebe5;
  --tblr-emphasis-color: #ffffff;
  --tblr-secondary-color: rgba(233, 235, 229, .6);
  --tblr-tertiary-color: rgba(233, 235, 229, .34);
  --tblr-muted: rgba(233, 235, 229, .6);
  --tblr-code-color: #6FB3AD;

  /* Linien */
  --tblr-border-color: rgba(233, 235, 229, .09);
  --tblr-border-color-translucent: rgba(233, 235, 229, .09);
  --tblr-dark-mode-border-color: rgba(233, 235, 229, .09);
  --tblr-dark-mode-border-color-translucent: rgba(233, 235, 229, .09);

  /* Links */
  --tblr-link-color: #6FB3AD;
  --tblr-link-color-rgb: 111, 179, 173;
  --tblr-link-hover-color: #8fc9c4;

  /* Navbar */
  --tblr-navbar-bg: rgba(6, 8, 16, .85);
  --tblr-navbar-border-color: rgba(233, 235, 229, .09);
  --tblr-navbar-active-color: #E8A84E;
  --tblr-navbar-active-bg: rgba(232, 168, 78, .08);
  --tblr-navbar-active-border-color: #E8A84E;

  /* Cards, Dropdowns, Modals */
  --tblr-card-border-color: rgba(233, 235, 229, .09);
  --tblr-dropdown-border-color: rgba(233, 235, 229, .09);
  --tblr-dropdown-bg: #0c1424;
  --tblr-dropdown-link-color: #e9ebe5;
  --tblr-dropdown-link-hover-bg: rgba(111, 179, 173, .08);
  --tblr-modal-border-color: rgba(233, 235, 229, .09);
  --tblr-modal-header-border-color: rgba(233, 235, 229, .09);
  --tblr-modal-footer-border-color: rgba(233, 235, 229, .09);

  /* Formulare */
  --tblr-border-color-translucent: rgba(233, 235, 229, .12);
  --tblr-form-valid-border-color: #6FB3AD;
  --tblr-form-invalid-border-color: #d9534f;
  --tblr-focus-ring-color: rgba(111, 179, 173, .25);
  --tblr-focus-ring-rgb: 111, 179, 173;
}

/* ---------- Basis ---------- */
body {
  background:
    radial-gradient(50% 40% at 85% -5%, rgba(111, 179, 173, .06), transparent 70%),
    radial-gradient(45% 35% at 5% 100%, rgba(232, 168, 78, .04), transparent 70%),
    #060810;
  background-attachment: fixed;
  letter-spacing: 0;
}
::selection { background: #E8A84E; color: #060810; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #060810; }
::-webkit-scrollbar-thumb { background: #1c2940; border-radius: 999px; border: 2px solid #060810; }
::-webkit-scrollbar-thumb:hover { background: #2a3a58; }

/* ---------- Buttons ---------- */
.btn-primary {
  --tblr-btn-bg: linear-gradient(92deg, #E8A84E, #6FB3AD);
  --tblr-btn-color: #060810;
  --tblr-btn-border-color: transparent;
  --tblr-btn-hover-bg: linear-gradient(92deg, #f0b968, #83c4bf);
  --tblr-btn-hover-color: #060810;
  --tblr-btn-hover-border-color: transparent;
  --tblr-btn-active-bg: linear-gradient(92deg, #d9993e, #5fa39d);
  --tblr-btn-active-color: #060810;
  --tblr-btn-active-border-color: transparent;
  background-image: linear-gradient(92deg, #E8A84E, #6FB3AD);
  border: none;
  font-weight: 600;
  box-shadow: 0 2px 14px rgba(232, 168, 78, .18);
}
.btn-primary:hover { box-shadow: 0 6px 26px rgba(232, 168, 78, .3); }
.btn-outline-secondary {
  --tblr-btn-color: #e9ebe5;
  --tblr-btn-border-color: rgba(233, 235, 229, .18);
  --tblr-btn-hover-bg: rgba(111, 179, 173, .08);
  --tblr-btn-hover-color: #6FB3AD;
  --tblr-btn-hover-border-color: rgba(111, 179, 173, .45);
  --tblr-btn-active-bg: rgba(111, 179, 173, .12);
  --tblr-btn-active-color: #6FB3AD;
  --tblr-btn-active-border-color: rgba(111, 179, 173, .45);
}
.btn-link {
  --tblr-btn-color: #6FB3AD;
  --tblr-btn-hover-color: #8fc9c4;
  --tblr-btn-active-color: #8fc9c4;
  color: #6FB3AD;
}
.btn-link:hover, .btn-link:focus { color: #8fc9c4; }

/* ---------- Navbar ---------- */
/* Blur/Glas-Effekt über ein Pseudo-Element: die Navbar selbst bekommt
   KEIN backdrop-filter und KEinen Stacking-Context, damit Dropdowns
   (z-index der Bootstrap-Menüs) ungehindert über dem Seiteninhalt liegen
   und Popper die Positionierung nicht verändert. */
.navbar:not([class*="bg-"]) {
  position: relative;
  border-bottom: 1px solid rgba(233, 235, 229, .09);
}
.navbar:not([class*="bg-"])::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: rgba(6, 8, 16, .85);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.navbar .dropdown-menu {
  z-index: 1035;
}
.navbar .nav-link {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.navbar .nav-link:hover { color: #E8A84E; }

/* Marken-Logo (Monogramm + Schriftzug) */
.nordish-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  font-size: 19px;
  letter-spacing: -.02em;
  color: #e9ebe5;
}
.nordish-brand:hover { color: #e9ebe5; }
.nordish-brand img { height: 32px; width: auto; border-radius: 7px; }
.nordish-brand .brand-accent {
  background: linear-gradient(92deg, #E8A84E, #6FB3AD);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@media (max-width: 576px) {
  .nordish-brand { font-size: 17px; }
  .nordish-brand img { height: 26px; }
}

/* ---------- Cards & Flächen ---------- */
.card {
  border-radius: 14px;
  background: #0c1424;
}
.card-header { background: transparent; }
.list-group-item { background: transparent; }

/* ---------- Tabellen ---------- */
.table thead th {
  color: rgba(233, 235, 229, .45);
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 600;
}

/* ---------- Badges / Status ---------- */
.badge { font-weight: 600; letter-spacing: .02em; }

/* ---------- Formulare ---------- */
.form-control:focus, .form-select:focus {
  border-color: rgba(111, 179, 173, .5);
  box-shadow: 0 0 0 .25rem rgba(111, 179, 173, .12);
}

/* ---------- Footer ---------- */
.footer { color: rgba(233, 235, 229, .45); }

/* ---------- Cookie-Consent Offcanvas ---------- */
#cookie-consent-block {
  background: #0c1424;
  border-top: 1px solid rgba(233, 235, 229, .09);
}

/* ---------- Ankündigungsleiste ---------- */
.navbar[class*="bg-"] { border-bottom: none; }