/* ============================================================
   WATTBALKON BRUTAL — COMPLIANZ COOKIE-BANNER + COOKIE-POLICY
   Style des Cookie-Banners an das Brutal-Design angepasst:
   eckig, 3px schwarzer Rand, Beige/Weiß, orange Akzente.
   Stand: 22.08.2026 · Version 1.0.2
   ============================================================ */

/* ---------- Cookie-Policy-Seite (/cookies/, page-id-612) ----------
   Die Policy ist eine normale WP-Page OHNE .art-body — daher eigene
   Tabellen-/Listen-Styles, gescoped auf die Cookie-Page. */
body.page-id-612 .post-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  font-size: 14.5px;
  line-height: 1.55;
}
body.page-id-612 .post-content th {
  background: #121212 !important;
  color: #fff !important;
  padding: 12px 16px;
  text-align: left;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: 12.5px;
  border: 1px solid #121212;
}
body.page-id-612 .post-content td {
  padding: 12px 16px;
  border: 1px solid rgba(18, 18, 18, .25);
  background: #f2efe8;
  vertical-align: top;
}
body.page-id-612 .post-content tr:nth-child(even) td {
  background: #e8e4da;
}
body.page-id-612 .post-content tr:hover td {
  background: rgba(255, 77, 0, .06);
}
/* Mobile: Tabellen horizontal scrollbar statt zerdrückt */
@media (max-width: 640px) {
  body.page-id-612 .post-content table {
    display: block;
    overflow-x: auto;
    white-space: normal;
  }
}

/* Banner-Container */
.cmplz-cookiebanner {
  border: 3px solid #121212 !important;
  border-radius: 0 !important;
  background: #f2efe8 !important;
  box-shadow: 8px 8px 0 rgba(18, 18, 18, 0.25) !important;
  font-family: 'Archivo', 'Inter', system-ui, sans-serif !important;
  color: #121212 !important;
}

/* Header */
.cmplz-cookiebanner .cmplz-header {
  border-bottom: 2px solid #121212 !important;
  padding-bottom: 10px !important;
}
.cmplz-cookiebanner .cmplz-title {
  font-family: 'Archivo Black', 'Inter', sans-serif !important;
  font-size: 1.05rem !important;
  text-transform: uppercase !important;
  letter-spacing: .02em !important;
  color: #121212 !important;
  font-weight: 400 !important;
}
.cmplz-cookiebanner .cmplz-title::before {
  content: ''; display: inline-block;
  width: 12px; height: 12px; margin-right: 8px;
  background: #ff4d00; vertical-align: baseline;
}

/* Divider */
.cmplz-cookiebanner .cmplz-divider {
  background: #121212 !important;
  height: 2px !important;
}

/* Message/Beschreibung */
.cmplz-cookiebanner .cmplz-message,
.cmplz-cookiebanner .cmplz-description {
  color: #3d3d3d !important;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
}
.cmplz-cookiebanner .cmplz-message a,
.cmplz-cookiebanner .cmplz-documents a {
  color: #ff4d00 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  font-weight: 600 !important;
}

/* Kategorie-Toggles (Checkboxen) */
.cmplz-cookiebanner .cmplz-category {
  border-bottom: 1px dashed rgba(18, 18, 18, 0.25) !important;
  padding: 6px 0 !important;
}
.cmplz-cookiebanner .cmplz-category-title {
  font-family: 'Archivo Black', 'Inter', sans-serif !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  color: #121212 !important;
  font-weight: 400 !important;
}
.cmplz-cookiebanner .cmplz-category-toggle .cmplz-toggle,
.cmplz-cookiebanner .cmplz-category-toggle input[type="checkbox"] {
  accent-color: #ff4d00 !important;
}

/* Buttons — alle im Brutal-Stil */
.cmplz-cookiebanner .cmplz-btn {
  border-radius: 0 !important;
  border: 2px solid #121212 !important;
  font-family: 'Archivo', 'Inter', sans-serif !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  transition: transform .12s, box-shadow .12s !important;
}
.cmplz-cookiebanner .cmplz-btn:hover {
  transform: translate(-2px, -2px);
  box-shadow: 3px 3px 0 #121212 !important;
}

/* Primär: Alle akzeptieren (orange) */
.cmplz-cookiebanner .cmplz-accept {
  background: #ff4d00 !important;
  color: #121212 !important;
  border-color: #121212 !important;
}
.cmplz-cookiebanner .cmplz-accept:hover {
  background: #121212 !important;
  color: #ff4d00 !important;
  box-shadow: 3px 3px 0 #ff4d00 !important;
}

/* Sekundär: Ablehnen / Einstellungen (weiß, schwarz umrandet) */
.cmplz-cookiebanner .cmplz-deny,
.cmplz-cookiebanner .cmplz-view-preferences,
.cmplz-cookiebanner .cmplz-save-preferences,
.cmplz-cookiebanner .cmplz-manage-options {
  background: #ffffff !important;
  color: #121212 !important;
  border-color: #121212 !important;
}
.cmplz-cookiebanner .cmplz-deny:hover,
.cmplz-cookiebanner .cmplz-view-preferences:hover,
.cmplz-cookiebanner .cmplz-save-preferences:hover,
.cmplz-cookiebanner .cmplz-manage-options:hover {
  background: #121212 !important;
  color: #ffffff !important;
}

/* Footer-Buttons-Layout */
.cmplz-cookiebanner .cmplz-buttons {
  gap: 8px !important;
}

/* Dokumente-Links unten */
.cmplz-cookiebanner .cmplz-documents {
  border-top: 1px dashed rgba(18, 18, 18, 0.25) !important;
  padding-top: 8px !important;
}

/* Mobile: Buttons untereinander */
@media (max-width: 640px) {
  .cmplz-cookiebanner .cmplz-buttons {
    flex-direction: column !important;
  }
  .cmplz-cookiebanner .cmplz-btn {
    width: 100% !important;
    justify-content: center !important;
  }
}
/* Sehr schmale Screens (≤380px): Banner schmaler + kein Überlauf */
@media (max-width: 380px) {
  .cmplz-cookiebanner {
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    left: 10px !important;
    right: 10px !important;
    margin: 0 !important;
  }
}
