/*
Theme Name: AutoSchlüssel24 Shop
Template: kadence
Version: 1.0.0
Description: Dark Child Theme für AutoSchlüssel24 Shop
*/

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=DM+Sans:wght@300;400;500;600;700&family=Space+Mono&display=swap');

:root {
  --as-black: #111010;
  --as-dark: #1a1919;
  --as-white: #f0ead8;
  --as-gold: #d4a843;
  --as-gold2: #e8c068;
  --as-border: rgba(240,234,216,0.08);
}

/* BASE */
body { background-color: var(--as-black) !important; color: var(--as-white) !important; font-family: 'DM Sans', sans-serif !important; }
h1,h2,h3,h4,h5,h6 { font-family: 'Bebas Neue', sans-serif !important; color: var(--as-white) !important; letter-spacing: 0.03em; }
p, li, td, th, label { color: rgba(240,234,216,0.8) !important; }
a { color: var(--as-gold) !important; }
a:hover { color: var(--as-gold2) !important; }

/* HEADER */
.site-header, #masthead { background: var(--as-black) !important; border-bottom: 1px solid rgba(212,168,67,0.2) !important; }
.site-branding .site-title a { color: var(--as-white) !important; font-family: 'Bebas Neue', sans-serif !important; font-size: 1.8rem !important; letter-spacing: 0.05em; }
.site-branding .site-title a span { color: var(--as-gold) !important; }

/* NAV */
.main-navigation a { color: rgba(240,234,216,0.75) !important; font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; }
.main-navigation a:hover { color: var(--as-gold) !important; }
.main-navigation ul ul { background: #1a1919 !important; border: 1px solid rgba(212,168,67,0.15) !important; border-radius: 8px !important; }

/* BUTTONS */
.wp-block-button__link,
.button, button, input[type="submit"],
.woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit {
  background: var(--as-gold) !important;
  border-color: var(--as-gold) !important;
  color: var(--as-black) !important;
  font-weight: 700 !important;
  border-radius: 4px !important;
  font-family: 'DM Sans', sans-serif !important;
  transition: background 0.2s !important;
}
.wp-block-button__link:hover,
.button:hover, button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover {
  background: var(--as-gold2) !important;
  border-color: var(--as-gold2) !important;
  color: var(--as-black) !important;
}

/* FORMS */
input[type="text"], input[type="email"], input[type="tel"],
input[type="password"], input[type="number"], textarea, select {
  background: rgba(240,234,216,0.05) !important;
  border: 1px solid rgba(240,234,216,0.1) !important;
  color: var(--as-white) !important;
  border-radius: 4px !important;
}
input::placeholder, textarea::placeholder { color: rgba(240,234,216,0.35) !important; }
input:focus, textarea:focus, select:focus {
  border-color: var(--as-gold) !important;
  box-shadow: 0 0 0 2px rgba(212,168,67,0.15) !important;
  outline: none !important;
}

/* WOOCOMMERCE PRODUCTS */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  background: var(--as-dark) !important;
  border: 1px solid var(--as-border) !important;
  border-radius: 10px !important;
  padding: 1rem !important;
  transition: border-color 0.3s, transform 0.3s, box-shadow 0.3s !important;
  overflow: hidden;
}
.woocommerce ul.products li.product:hover {
  border-color: rgba(212,168,67,0.3) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.4) !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 600 !important;
  color: var(--as-white) !important;
  font-size: 0.92rem !important;
}
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 1.5rem !important;
  color: var(--as-gold) !important;
}

/* PRODUCT DETAIL */
.woocommerce div.product .product_title {
  font-family: 'Bebas Neue', sans-serif !important;
  color: var(--as-white) !important;
  font-size: clamp(1.8rem, 4vw, 3rem) !important;
}
.woocommerce div.product div.summary { color: rgba(240,234,216,0.75) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs { border-bottom: 1px solid var(--as-border) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { background: transparent !important; border-color: var(--as-border) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--as-gold) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: rgba(240,234,216,0.5) !important; }
.woocommerce div.product .woocommerce-tabs .panel { background: var(--as-dark) !important; border: 1px solid var(--as-border) !important; border-radius: 8px !important; padding: 1.5rem !important; }

/* CART */
.woocommerce-cart .cart-collaterals, 
.woocommerce table.shop_table {
  background: var(--as-dark) !important;
  border: 1px solid var(--as-border) !important;
  border-radius: 8px !important;
}
.woocommerce table.shop_table th { color: var(--as-gold) !important; font-family: 'Bebas Neue', sans-serif !important; border-color: var(--as-border) !important; }
.woocommerce table.shop_table td { border-color: var(--as-border) !important; color: var(--as-white) !important; }
.woocommerce .cart-subtotal, .woocommerce .order-total { color: var(--as-gold) !important; }

/* CHECKOUT */
.woocommerce-checkout #payment { background: var(--as-dark) !important; border: 1px solid var(--as-border) !important; border-radius: 8px !important; }
.woocommerce-checkout #payment div.payment_box { background: rgba(240,234,216,0.03) !important; color: rgba(240,234,216,0.7) !important; }

/* SIDEBAR / WIDGETS */
.widget { background: var(--as-dark) !important; border: 1px solid var(--as-border) !important; border-radius: 8px !important; padding: 1.5rem !important; margin-bottom: 1.5rem !important; }
.widget-title { font-family: 'Bebas Neue', sans-serif !important; color: var(--as-gold) !important; font-size: 1.1rem !important; border-bottom: 1px solid var(--as-border) !important; padding-bottom: 0.5rem !important; margin-bottom: 1rem !important; }

/* BREADCRUMB */
.woocommerce-breadcrumb { color: rgba(240,234,216,0.4) !important; font-size: 0.82rem; }
.woocommerce-breadcrumb a { color: rgba(240,234,216,0.4) !important; }
.woocommerce-breadcrumb a:hover { color: var(--as-gold) !important; }

/* NOTICES */
.woocommerce-message, .woocommerce-info { background: var(--as-dark) !important; border-top-color: var(--as-gold) !important; color: var(--as-white) !important; }

/* FOOTER */
.site-footer, #colophon { background: var(--as-black) !important; border-top: 1px solid var(--as-border) !important; color: rgba(240,234,216,0.4) !important; }
.site-footer a { color: rgba(240,234,216,0.4) !important; }
.site-footer a:hover { color: var(--as-gold) !important; }
.footer-widget-area .widget-title { color: var(--as-white) !important; }

/* FIX WHITE BACKGROUNDS */
.woocommerce-cart table.cart,
.woocommerce-cart .cart-collaterals .cart_totals,
.woocommerce-cart .cart-collaterals,
.woocommerce .cart-empty,
.woocommerce-page .cart-empty,
.entry-content, .entry-header,
.page-header, .woocommerce-account,
.woocommerce-checkout,
.woocommerce-order-details,
.woocommerce-customer-details,
.site-main, main, .content-area,
.wp-block-group, .wp-block-cover,
.wc-block-cart, .wc-block-checkout,
.wc-block-components-panel,
.wc-block-components-panel__content,
.woocommerce-notices-wrapper,
.woocommerce ul.products,
.woocommerce-page ul.products,
.storefront-product-section,
.kadence-woo-notice,
.wp-site-blocks { background: var(--as-black) !important; }

.woocommerce-cart .cart-empty { color: var(--as-white) !important; }
.woocommerce-cart .return-to-shop .button { background: var(--as-gold) !important; color: var(--as-black) !important; }

/* Fix any remaining white cards */
.wc-block-cart__main,
.wc-block-cart__sidebar { background: var(--as-dark) !important; border: 1px solid var(--as-border) !important; border-radius: 8px !important; }

/* SCROLLBAR */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--as-black); }
::-webkit-scrollbar-thumb { background: rgba(212,168,67,0.3); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--as-gold); }

/* PROGRAMMIERUNG HINWEIS BOX */
.programmierung-hinweis {
  background: var(--as-dark);
  border: 1px solid rgba(212,168,67,0.2);
  border-radius: 10px;
  padding: 1.5rem 2rem;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin: 2rem 0;
}
.programmierung-hinweis .icon { font-size: 2rem; flex-shrink: 0; }
.programmierung-hinweis p { color: rgba(240,234,216,0.6) !important; margin: 0 !important; font-size: 0.88rem; line-height: 1.7; }
.programmierung-hinweis strong { color: var(--as-white) !important; }

/* ── EXTRA FIX: Kadence outer wrappers & light blue sidebars ── */
html, body, #page, .site, #content,
.wp-site-blocks, .site-main, #main,
.content-area, .page-content,
.woocommerce-page, .archive, .single-product,
.hentry, article { background: var(--as-black) !important; }

.kadence-inner-column-inner,
.kadence-column, .kadence-row,
.kb-row-layout-wrap, .kb-inner-column-inner,
.kb-section { background: transparent !important; }

/* Remove Kadence content area padding/bg that causes side strips */
.site-content { background: var(--as-black) !important; }
.singular .entry-content-wrap,
.page .entry-content-wrap { background: var(--as-black) !important; }

/* Kadence specific content background */
.content-bg { background-color: var(--as-black) !important; }
.has-global-padding { background: var(--as-black) !important; }
.wp-block-group__inner-container { background: transparent !important; }

/* ── FIX: Seitenstreifen links/rechts ── */
body.woocommerce-cart,
body.woocommerce-page,
body.woocommerce,
body.archive,
body.single-product,
body.page {
  background: var(--as-black) !important;
}

/* Kadence setzt oft einen hellen bg auf diese Wrapper */
.site-wrapper,
.content-wrap,
#wrapper,
.page-wrap,
.kadence-page,
.kb-hero-section,
.entry,
.post,
.page { background: var(--as-black) !important; }

/* Der eigentliche Übeltäter bei Kadence – Content Hintergrund */
:root { --global-palette9: #111010 !important; }
.kadence-blocks-pro, 
.kadence-theme,
[class*="kadence"] { --global-palette9: #111010 !important; }

/* ── FIX: hero-section-overlay Seitenstreifen ── */
.hero-section-overlay,
.hero-section-overlay + *,
.hero-section { background: var(--as-black) !important; }

/* ── Logo Styling ─────────────────────────────────────────── */
.site-branding a,
.site-title a,
.custom-logo-link,
header .site-title {
    text-decoration: none !important;
}

.site-title {
    font-size: 0 !important; /* Hide default text */
}

/* Inject SVG logo via CSS on the header */
.site-branding .site-title a::before,
.site-title a::before {
    content: '';
    display: inline-block;
}