/*
Theme Name: AK Autos Child
Theme URI: https://ak-autos.de
Description: Child Theme für AK Autos – neues Design
Author: AK Autos
Author URI: https://ak-autos.de
Template: astra
Version: 1.0
*/

/* ===== AK Autos Dark Design (aus Köhler-Template) ===== */
:root{
  --bg:#020617;
  --bg-soft:#050b1a;
  --section:#0b1120;
  --section-alt:#050816;
  --primary:#0f4c81;
  --primary-dark:#0b3779;
  --accent:#38bdf8;
  --text-light:#e5e7eb;
  --muted:#9ca3af;
  --radius-lg:1.2rem;
  --shadow-soft:0 20px 45px rgba(15,23,42,.65);
}

/* Grundlayout */
body{
  background:var(--bg);
  color:var(--text-light);
}
a{ color: inherit; }
a:hover{ color:#bfdbfe; }

/* Astra Bereiche dunkler */
.site, .site-content, .ast-container{
  background:transparent !important;
}
.ast-container{
  padding-top: 20px;
}

/* Header/Navigation Dark */
#masthead, .main-header-bar, .ast-primary-header-bar{
  background: rgba(15,23,42,.92) !important;
  border-bottom:1px solid rgba(148,163,184,.4);
  backdrop-filter: blur(12px);
}
.main-header-menu a, .ast-header-menu a{
  color: var(--text-light) !important;
}
.main-header-menu a:hover, .ast-header-menu a:hover{
  color:#bfdbfe !important;
}

/* Buttons */
.ast-button, button, .button, input[type="submit"]{
  border-radius:999px !important;
  font-weight:600 !important;
}
.ast-button, .button, input[type="submit"]{
  background: linear-gradient(135deg,var(--primary),var(--primary-dark)) !important;
  border: none !important;
  box-shadow:0 16px 35px rgba(15,23,42,.7);
}
.ast-button:hover, .button:hover, input[type="submit"]:hover{
  transform: translateY(-1px);
}

/* Cards/Boxen (Astra Widgets / Elementor Boxen etc.) */
.elementor-widget-container,
.widget, .ast-single-post, .ast-article-single,
.entry-content > .wp-block-group,
.entry-content > .wp-block-columns{
  background: rgba(15,23,42,.92);
  border:1px solid rgba(148,163,184,.35);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

/* Überschriften */
h1,h2,h3,h4{ color:#f8fafc; }
p{ color:#cbd5f5; }

/* ===== FluentForms Dark Styling ===== */
.fluentform,
.fluentform .ff-el-group,
.fluentform .ff-el-form-control,
.fluentform textarea,
.fluentform select{
  color: var(--text-light) !important;
}
.fluentform .ff-el-form-control,
.fluentform textarea,
.fluentform select{
  background:#020617 !important;
  border:1px solid rgba(148,163,184,.7) !important;
  border-radius:10px !important;
  padding:10px 12px !important;
}
.fluentform .ff-el-form-control:focus,
.fluentform textarea:focus,
.fluentform select:focus{
  border-color:#38bdf8 !important;
  box-shadow:0 0 0 1px rgba(56,189,248,.3) !important;
}
.fluentform .ff-btn-submit{
  width:100%;
  border-radius:999px !important;
  background: linear-gradient(135deg,var(--primary),var(--primary-dark)) !important;
  box-shadow:0 16px 35px rgba(15,23,42,.7);
}
.fluentform .ff-el-input--label label{
  color:#cbd5f5 !important;
}
.fluentform .ff-el-help-message,
.fluentform .ff-el-form-check label{
  color: var(--muted) !important;
}

/* ===== Fix: weiße Blöcke + Lesbarkeit (Astra/Elementor/Gutenberg) ===== */

/* Hintergrund der Seite */
body, #page, .site, .site-content, .ast-container {
  background: #020617 !important;
}

/* Standard-Text überall gut lesbar */
body, p, li, td, th, .entry-content, .site-content {
  color: #cbd5f5 !important;
}

/* Überschriften */
h1, h2, h3, h4, h5, h6 {
  color: #f8fafc !important;
}

/* Links */
a { color: #38bdf8 !important; }
a:hover { color: #bfdbfe !important; }

/* --- Karten/Boxen überall dunkel machen --- */
.ast-article-single,
.ast-single-post,
.widget,
.sidebar-main,
.ast-related-posts-container,
.entry-content > .wp-block-group,
.entry-content > .wp-block-columns,
.wp-block-cover__inner-container,
.wp-block-media-text,
.wp-block-column,
.wp-block-table,
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-widget-container,
.elementor-element,
.uagb-section,
.uagb-container,
.uagb-column {
  background: rgba(15,23,42,.92) !important;
  border: 1px solid rgba(148,163,184,.25) !important;
  border-radius: 18px !important;
}

/* Innenabstände, damit es „cardig“ wirkt */
.entry-content > .wp-block-group,
.entry-content > .wp-block-columns,
.elementor-widget-container,
.elementor-element {
  padding: 18px !important;
}

/* Falls einzelne Elemente noch weiß bleiben */
.has-background,
.has-white-background-color,
.has-background-color {
  background-color: rgba(15,23,42,.92) !important;
}

/* Formulareingaben dunkel + lesbar */
input, select, textarea {
  background: #020617 !important;
  color: #e5e7eb !important;
  border: 1px solid rgba(148,163,184,.55) !important;
}

/* Listenpunkte/Bullets sichtbar */
ul li::marker, ol li::marker {
  color: #93c5fd !important;
}

/* ===== Fix für helle Karten / Blöcke (Astra + Gutenberg) ===== */

/* Karten / Boxen dunkel */
.wp-block-group,
.wp-block-columns,
.wp-block-column,
.ast-container .wp-block-group,
.ast-container .wp-block-columns {
  background: #020617 !important;
  border-radius: 18px;
  padding: 20px;
  border: 1px solid rgba(148,163,184,.25);
}

/* Falls Astra eigene Card-Klassen nutzt */
.ast-card,
.ast-box,
.ast-related-posts-container {
  background: #020617 !important;
  color: #cbd5f5 !important;
}

/* Text in Karten klar lesbar */
.wp-block-group p,
.wp-block-columns p,
.wp-block-column p,
.wp-block-group li,
.wp-block-column li {
  color: #cbd5f5 !important;
}

/* Überschriften in Karten */
.wp-block-group h1,
.wp-block-group h2,
.wp-block-group h3,
.wp-block-column h3,
.wp-block-column h4 {
  color: #f8fafc !important;
}

/* Nummern-Kreise (1–6) besser sichtbar */
.wp-block-group .step-number,
.wp-block-column .step-number {
  background: #0f4c81 !important;
  color: #ffffff !important;
}

/* Buttons auf hellen Cards */
.wp-block-group a.button,
.wp-block-group .wp-block-button__link {
  background: linear-gradient(135deg,#0f4c81,#0b3779) !important;
  color: #ffffff !important;
  border-radius: 999px;
}

/* ===== Globaler Dark-Text-Fix für normalen Seiteninhalt ===== */

/* Grundtext */
.ast-container p,
.ast-container li,
.ast-container span,
.ast-container div {
  color: #cbd5f5;
}

/* Listenpunkte */
.ast-container ul li::marker {
  color: #93c5fd;
}

/* Überschriften im Content */
.ast-container h1,
.ast-container h2,
.ast-container h3,
.ast-container h4,
.ast-container h5 {
  color: #f8fafc;
}

/* Links im Text */
.ast-container a {
  color: #38bdf8;
}
.ast-container a:hover {
  color: #7dd3fc;
}

/* Falls Absätze auf hellem Block liegen */
.wp-block-paragraph,
.wp-block-list {
  background: transparent !important;
}

/* ===== AK AUTOS – Container/Boxen dunkel + Umrandungen soften ===== */

/* 1) Standard Gutenberg-Container (Gruppen/Columns/Cover/MediaText) */
.entry-content .wp-block-group,
.entry-content .wp-block-columns,
.entry-content .wp-block-column,
.entry-content .wp-block-cover,
.entry-content .wp-block-media-text,
.entry-content .wp-block-table,
.entry-content .wp-block-quote {
  background: rgba(2, 6, 23, 0.92) !important;
  color: #e5e7eb !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-radius: 16px !important;
  box-shadow: 0 18px 40px rgba(0,0,0,0.35) !important;
}

/* Abstand innen, damit Text nicht am Rand klebt */
.entry-content .wp-block-group__inner-container,
.entry-content .wp-block-column > *,
.entry-content .wp-block-group {
  padding: 18px !important;
}

/* 2) Astra-„Box“ Optik / helle Flächen in Content */
.ast-container .entry-content,
.ast-container .site-content,
.ast-container .content-area {
  background: transparent !important;
}

/* 3) Diese harten „Container-Umrandungen“ entschärfen */
.entry-content * {
  border-color: rgba(148, 163, 184, 0.22) !important;
}

/* 4) Falls Astra irgendwo weiße Cards macht */
.ast-container .ast-article-single,
.ast-container .ast-article-post,
.ast-container .ast-separate-container .ast-article-single,
.ast-container .ast-separate-container .ast-article-post {
  background: transparent !important;
  box-shadow: none !important;
}

/* 5) Listen/Paragraphs: keine weißen Hintergründe */
.entry-content p,
.entry-content ul,
.entry-content ol {
  background: transparent !important;
}

/* === ASTRA CONTENT WRAPPER DARK FIX === */

/* Haupt-Content-Hintergrund */
.ast-container,
.ast-container #primary,
.ast-container .site-content,
.ast-container .content-area {
  background: #020617 !important;
}

/* Einzelne Artikel / Seiten */
.ast-article-single,
.ast-article-post,
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article-post {
  background: #020617 !important;
  box-shadow: none !important;
  border: none !important;
}

/* Entry Content (der weiße Kasten!) */
.entry-content,
.entry-content > *,
.entry-content p,
.entry-content li {
  background: transparent !important;
  color: #e5e7eb !important;
}

/* Cards / Boxen (z. B. Ablauf-Schritte) */
.entry-content .card,
.entry-content .step,
.entry-content .faq-item,
.entry-content .review {
  background: #020617 !important;
  border: 1px solid rgba(148,163,184,.25) !important;
  color: #e5e7eb !important;
}

/* Überschriften */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
  color: #f8fafc !important;
}

/* =========================================
   AK AUTOS – DARK DESIGN (Elementor Seite)
   Page-ID: 45783
========================================= */

/* Grundhintergrund */
body.page-id-45783,
body.page-id-45783 .site,
body.page-id-45783 .site-content{
  background:#020617 !important;
  color:#e5e7eb !important;
}

/* ALLE Elementor Sections */
body.page-id-45783 .elementor-section,
body.page-id-45783 .elementor-section-wrap{
  background:transparent !important;
}

/* Elementor Container */
body.page-id-45783 .elementor-container{
  background:transparent !important;
}

/* Elementor Widgets (Cards / Boxen) */
body.page-id-45783 .elementor-widget,
body.page-id-45783 .elementor-widget-wrap{
  background:rgba(15,23,42,.92) !important;
  border:1px solid rgba(148,163,184,.35) !important;
  border-radius:16px;
  box-shadow:0 18px 45px rgba(15,23,42,.7);
}

/* Texte */
body.page-id-45783 h1,
body.page-id-45783 h2,
body.page-id-45783 h3{
  color:#f8fafc !important;
}

body.page-id-45783 p,
body.page-id-45783 li,
body.page-id-45783 span{
  color:#cbd5f5 !important;
}

/* Links */
body.page-id-45783 a{
  color:#38bdf8 !important;
}

/* Weiße Borders entfernen */
body.page-id-45783 *{
  border-color:rgba(148,163,184,.25) !important;
}

/* Header/Topbar */
body.page-id-45783 header,
body.page-id-45783 nav{
  background:rgba(15,23,42,.9) !important;
}

/* Buttons */
body.page-id-45783 .elementor-button{
  background:linear-gradient(135deg,#0f4c81,#0b3779) !important;
  color:#fff !important;
  border-radius:999px;
}

/* FluentForms (falls vorhanden) */
body.page-id-45783 .fluentform input,
body.page-id-45783 .fluentform textarea,
body.page-id-45783 .fluentform select{
  background:#020617 !important;
  color:#e5e7eb !important;
  border:1px solid rgba(148,163,184,.45) !important;
}

/* ===== AK AUTOS: FIX WEISSE BOXEN + LINEN + MOBILE ===== */

/* Grundlayout */
body { background:#020617; color:#e5e7eb; }
body a { color:#93c5fd; }

/* Astra / WP Container */
.ast-container, .site-content, .content-area, .site-main {
  background: transparent !important;
}

/* Elementor: alle Box-Rahmen/Outlines weg */
.elementor *, .e-con, .e-con-inner, .elementor-section, .elementor-column,
.elementor-widget, .elementor-widget-container {
  outline: none !important;
  box-shadow: none !important;
}

/* „Container-Linien“ sind fast immer Borders */
.elementor * {
  border: 0 !important;
}

/* Weiße Cards / Boxen dunkel + Text hell */
.elementor-widget-container,
.e-con,
.e-con-inner {
  background: rgba(15,23,42,.92) !important;
  color: #e5e7eb !important;
  border-radius: 16px !important;
}

/* Texte überall lesbar */
.elementor h1, .elementor h2, .elementor h3,
.elementor p, .elementor li, .elementor span {
  color:#e5e7eb !important;
}

/* Mobile: weniger „gedrungen“ */
@media (max-width: 768px){
  .ast-container { padding-left: 16px !important; padding-right: 16px !important; }
  .elementor-section, .e-con { padding: 18px 14px !important; margin-bottom: 14px !important; }
  .elementor-widget-container { padding: 16px !important; }
  .elementor h1 { font-size: 1.7rem !important; line-height: 1.2 !important; }
  .elementor p, .elementor li { font-size: 1rem !important; line-height: 1.55 !important; }
}

/* ========= FORCE DARK ELEMENTOR CONTAINERS ========= */

/* Alle weißen Elementor-Container überschreiben */
.e-con,
.e-con-inner,
.elementor-section,
.elementor-column,
.elementor-widget-wrap,
.elementor-widget-container {
  background-color: rgba(15, 23, 42, 0.96) !important;
}

/* Falls Elementor direkt inline #fff setzt */
[class*="elementor-element"] {
  background-color: transparent !important;
}

/* Texte klar lesbar */
.e-con *, 
.elementor-widget-container * {
  color: #e5e7eb !important;
}

/* Links */
.e-con a {
  color: #93c5fd !important;
}

/* ===== MOBILE: NICHT MEHR GEDRUNGEN ===== */
@media (max-width: 768px) {

  /* Seitenabstand */
  body {
    background: #020617 !important;
  }

  .ast-container {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  /* Container Luft */
  .e-con,
  .elementor-section {
    padding: 22px 18px !important;
    margin-bottom: 20px !important;
  }

  /* Texte größer & entspannter */
  h1 { font-size: 1.7rem !important; line-height: 1.25 !important; }
  h2 { font-size: 1.4rem !important; }
  p, li {
    font-size: 1.02rem !important;
    line-height: 1.6 !important;
  }
}