/* === Automaten Konfigurator — Product Page CSS v1.7.2 === */

/* ── Theme Content-Container Override ── */
.entry-content #ak-product-page,
.site-main #ak-product-page,
.page-content #ak-product-page,
main #ak-product-page,
article #ak-product-page {
    max-width: none !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}
/* Eltern-Elemente des Containers auch freigeben */
.entry-content:has(#ak-product-page),
.site-main:has(#ak-product-page),
main:has(#ak-product-page) article,
main:has(#ak-product-page) .entry-content {
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ── Theme-Wrapper Abstände nullen (vom Plugin selbst gerendert) ── */
body:has(#ak-product-page) #content,
body:has(#ak-product-page) #primary,
body:has(#ak-product-page) #main,
body:has(#ak-product-page) .site-content,
body:has(#ak-product-page) .content-area,
body:has(#ak-product-page) .site-main {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
/* Hello-Theme / GeneratePress / Astra spezifisch */
body:has(#ak-product-page) .hfb-header + #content,
body:has(#ak-product-page) .hfb-header + .site-content,
body:has(#ak-product-page) header + #content,
body:has(#ak-product-page) header + .site-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

#ak-product-page {
    --pp-accent:             #1a1a1a;
    --pp-accent-text:        #ffffff;
    --pp-text:               #1a1a1a;
    --pp-text-muted:         #666666;
    --pp-line:               #e8e8e8;
    --pp-spec-line:          #e8e8e8;
    --pp-btn-bg:             #1a1a1a;
    --pp-btn-text:           #ffffff;
    --pp-btn-hover-bg:       #444444;
    --pp-btn-hover-text:     #ffffff;
    --pp-col-img-bg:         #ffffff;
    --pp-col-info-bg:        #ffffff;
    --pp-col-specs-bg:       #ffffff;
    --pp-font:               'Segoe UI', Arial, sans-serif;
    --pp-font-size:          14px;
    --pp-radius:             2px;
    --pp-max-width:          1200px;
    --pp-desc-size:          14px;
    --pp-desc-lh:            1.8;
    --pp-desc-weight:        400;
    --pp-desc-align:         left;
    --pp-img-max-h:          70vh;
    --pp-img-fit:            contain;
    --pp-img-pos:            top center;
    --pp-specs-label-size:   11px;
    --pp-specs-value-size:   12px;
    --pp-specs-label-color:  #999999;
    --pp-specs-title-size:   11px;
    --pp-specs-line-weight:  1px;
    --pp-col-img:      minmax(200px, 1fr);
    --pp-col-info:     minmax(360px, 1.8fr);
    --pp-col-specs:    minmax(200px, 1fr);
    --pp-konfig-max-width:   100%;
}

#ak-product-page * { box-sizing: border-box; font-family: var(--pp-font); }

/* Theme-Container überschreiben — volle Breite erzwingen */
#ak-product-page {
    background: #fff;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: relative;
    left: 0 !important;
}

/* ── Wrap ── */
.ak-pp-wrap {
    max-width: var(--pp-max-width);
    margin: 0 auto;
    padding: 0 40px;
}

/* ── HERO: volle Breite für die Linien ── */
.ak-pp-hero-outer { display: block; }

/* ── HERO: 3 Spalten ── */
.ak-pp-hero {
    display: grid;
    grid-template-columns: var(--pp-col-img, minmax(180px, 1fr)) var(--pp-col-info, minmax(360px, 1.8fr)) var(--pp-col-specs, minmax(180px, 1fr));
    align-items: stretch;
    max-width: var(--pp-max-width);
    margin: 0 auto;
    padding: 0 24px;
    border-top: 1px solid var(--pp-line) !important;
    border-bottom: 1px solid var(--pp-line) !important;
}

.ak-pp-img-col {
    padding: 40px 28px 48px 0;
    border-right: 1px solid var(--pp-line);
    background: var(--pp-col-img-bg, #ffffff);
}
.ak-pp-info-col {
    padding: 40px 28px 48px;
    border-right: 1px solid var(--pp-line);
    display: flex; flex-direction: column; gap: 20px;
    background: var(--pp-col-info-bg, #ffffff);
    min-width: 0;
}
.ak-pp-description,
.ak-pp-extra-desc {
    font-size: var(--pp-desc-size, 14px);
    line-height: var(--pp-desc-lh, 1.8);
    color: var(--pp-text-muted);
    font-weight: var(--pp-desc-weight, 400);
    text-align: var(--pp-desc-align, left);
    word-break: normal;
    overflow-wrap: anywhere;
    hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
}
.ak-pp-specs-col {
    padding: 40px 0 48px 28px;
    background: var(--pp-col-specs-bg, #ffffff);
    min-width: 0;
}

/* ── Bild ── */
.ak-pp-img-col {
    display: flex;
    align-items: center;
    justify-content: center;
}
.ak-pp-img {
    width: 100%;
    height: 600px;
    object-fit: contain;
    object-position: center center;
    display: block;
    background: transparent;
    border: none;
}
.ak-pp-img-placeholder {
    width: 100%; aspect-ratio: 2/3;
    background: #f8f8f8; border: 1px dashed #ddd;
    display: flex; align-items: center; justify-content: center;
    color: #ccc; font-size: 13px;
}

/* ── Info-Spalte ── */
.ak-pp-brand-label {
    font-size: 11px; font-weight: 700;
    letter-spacing: .12em; text-transform: uppercase;
    color: var(--pp-text-muted);
}
.ak-pp-model-name {
    font-size: clamp(22px, 2.5vw, 32px);
    font-weight: 700; line-height: 1.15;
    color: var(--pp-text);
    margin: 0; padding: 0; border: none;
    letter-spacing: -.01em; text-transform: none;
}
.ak-pp-extra-desc {
    padding-top: 16px;
    border-top: 1px solid var(--pp-line);
}

/* ── Preis ── */
.ak-pp-price-block { display: flex; flex-direction: column; gap: 5px; }
.ak-pp-price-label-small {
    font-size: 10px; font-weight: 700;
    letter-spacing: .1em; text-transform: uppercase;
    color: var(--pp-text-muted);
}
.ak-pp-price-big {
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 700; color: var(--pp-text);
    letter-spacing: -.02em; line-height: 1;
    transition: color .2s;
}

/* ── Buttons ── */
.ak-pp-buttons { display: flex; flex-direction: column; gap: 8px; }
.ak-pp-btn {
    display: block; width: 100%;
    padding: 14px 24px;
    font-size: 12px; font-weight: 700;
    letter-spacing: .06em; text-transform: uppercase;
    text-decoration: none; text-align: center;
    border-radius: var(--pp-radius);
    cursor: pointer; transition: opacity .15s;
}
.ak-pp-btn:hover { text-decoration: none; }
.ak-pp-btn--primary  { background: var(--pp-btn-bg); color: var(--pp-btn-text); border: none; }
.ak-pp-btn--primary:hover { background: var(--pp-btn-hover-bg, #444); color: var(--pp-btn-hover-text, #fff); opacity: 1; }
.ak-pp-btn--secondary {
    background: transparent; color: var(--pp-text);
    border: 1.5px solid var(--pp-text);
}
.ak-pp-btn--secondary:hover { background: #f5f5f5; opacity: 1; }

/* ── Technische Daten ── */
.ak-pp-specs-title {
    font-size: var(--pp-specs-title-size, 11px);
    font-weight: 700; letter-spacing: .1em;
    text-transform: uppercase; color: var(--pp-text);
    margin-bottom: 12px; padding-bottom: 10px;
    border-bottom: 2px solid var(--pp-text);
}
.ak-pp-specs {
    width: 100%; border-collapse: collapse;
    border: none; background: transparent;
}
.ak-pp-specs tr { border-bottom: var(--pp-specs-line-weight, 1px) solid var(--pp-spec-line); }
.ak-pp-specs tr,
.ak-pp-specs tr:nth-child(odd),
.ak-pp-specs tr:nth-child(even),
.ak-pp-specs tr:hover { background: transparent !important; }
.ak-pp-specs tr:last-child { border-bottom: none; }
.ak-pp-spec-label, .ak-pp-spec-value { background: transparent !important; border: none; }
.ak-pp-spec-label {
    padding: 8px 12px 8px 0;
    color: var(--pp-specs-label-color, #999);
    font-weight: 700; font-size: var(--pp-specs-label-size, 11px);
    letter-spacing: .05em; text-transform: uppercase;
    vertical-align: middle; width: 48%;
}
.ak-pp-spec-value {
    padding: 8px 0;
    color: var(--pp-text); font-size: var(--pp-specs-value-size, 12px);
    font-weight: 500; vertical-align: middle; text-align: right;
}

/* ── Konfigurator-Abschnitt ── */
.ak-pp-konfig-section {
    border-top: 1px solid var(--pp-line);
    padding: 40px 40px 60px;
    width: 100%;
}
.ak-pp-konfig-section .ak-pp-section-title,
.ak-pp-konfig-section #ak-detail {
    max-width: var(--pp-konfig-max-width, 100%) !important;
    width: 100%; margin-left: auto; margin-right: auto;
}
.ak-pp-section-title {
    font-size: 11px; font-weight: 700;
    letter-spacing: .1em; text-transform: uppercase;
    color: #aaa; margin-bottom: 24px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--pp-line);
}

/* ── Optionen ── */
#ak-product-page #ak-detail .ak-options-list { display: flex; flex-direction: column; gap: 0; }
#ak-product-page #ak-detail .ak-option-row {
    display: flex; align-items: center; gap: 16px;
    border: none; border-bottom: 1px solid var(--pp-line);
    padding: 16px 0; background: transparent;
    transition: background .15s; cursor: pointer;
}
#ak-product-page #ak-detail .ak-option-row:first-child { border-top: 1px solid var(--pp-line); }
#ak-product-page #ak-detail .ak-option-row:hover { background: #fafafa; padding-left: 8px; }
#ak-product-page #ak-detail .ak-option-row.checked { background: #f8f8f8; padding-left: 8px; }
#ak-product-page #ak-detail .ak-opt-cb { width:16px; height:16px; accent-color:#1a1a1a; flex-shrink:0; cursor:pointer; }
#ak-product-page #ak-detail .ak-opt-img-btn { border:none; background:none; padding:0; cursor:pointer; position:relative; flex-shrink:0; }
#ak-product-page #ak-detail .ak-opt-img { width:56px; height:56px; object-fit:contain; display:block; border-radius:3px; border:1px solid #eee; }
#ak-product-page #ak-detail .ak-opt-zoom { position:absolute; bottom:2px; right:2px; font-size:11px; background:rgba(0,0,0,.4); border-radius:2px; padding:1px 3px; pointer-events:none; }
#ak-product-page #ak-detail .ak-opt-text { flex:1; cursor:pointer; }
#ak-product-page #ak-detail .ak-opt-name { font-weight:700; font-size:13px; color:#1a1a1a; }
#ak-product-page #ak-detail .ak-opt-desc { font-size:12px; color:#888; margin-top:3px; line-height:1.4; }
#ak-product-page #ak-detail .ak-opt-right { display:flex; flex-direction:column; align-items:flex-end; gap:6px; flex-shrink:0; }
#ak-product-page #ak-detail .ak-opt-price { font-size:14px; font-weight:700; color:#1a1a1a; white-space:nowrap; }
#ak-product-page #ak-detail .ak-opt-detail-btn { font-size:11px; padding:3px 10px; border:1px solid #ddd; border-radius:2px; background:#fff; cursor:pointer; color:#666; letter-spacing:.02em; }
#ak-product-page #ak-detail .ak-opt-detail-btn:hover { background:#f0f0f0; }
#ak-product-page #ak-detail .ak-step-label { font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#aaa; margin-bottom:0; }
#ak-product-page #ak-detail .ak-section { margin-bottom:32px; }

/* Zusammenfassung */
#ak-product-page #ak-detail .ak-summary-box { background:#fff; border:none; border-top:1px solid var(--pp-line); padding:20px 0 0; }
#ak-product-page #ak-detail .ak-sum-row { display:flex; justify-content:space-between; font-size:13px; color:#666; padding:6px 0; border-bottom:1px solid var(--pp-line); }
#ak-product-page #ak-detail .ak-detail-sum-total { display:flex; justify-content:space-between; font-size:22px; font-weight:700; margin-top:16px; padding-top:16px; border-top:2px solid #1a1a1a; color:#1a1a1a; }
#ak-product-page #ak-detail .ak-detail-sum-total span:last-child { color:#1a1a1a; }
#ak-product-page #ak-detail .ak-config-preview { background:#fafafa; border:none; border-top:1px solid var(--pp-line); padding:14px 0; font-size:13px; color:#555; line-height:1.7; white-space:pre-line; margin-bottom:16px; min-height:48px; }
#ak-product-page #ak-detail .ak-btn-anfrage { display:block; width:100%; padding:15px; background:#1a1a1a; color:#fff; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; border:none; border-radius:var(--pp-radius); cursor:pointer; transition:opacity .15s; text-align:center; }
#ak-product-page #ak-detail .ak-btn-anfrage:hover { opacity:.85; }
#ak-product-page #ak-detail .ak-btn-note { font-size:12px; color:#aaa; text-align:center; margin-top:8px; }
#ak-product-page #ak-detail .ak-form-wrap { margin-top:24px; border:1px solid var(--pp-line); border-radius:3px; overflow:hidden; }
#ak-product-page #ak-detail .ak-form-header { display:flex; justify-content:space-between; align-items:center; background:#f8f8f8; padding:12px 18px; border-bottom:1px solid var(--pp-line); font-weight:700; font-size:13px; }
#ak-product-page #ak-detail .ak-form-close { border:none; background:none; font-size:18px; cursor:pointer; color:#999; }
#ak-product-page #ak-detail .ak-form-close:hover { color:#1a1a1a; }
#ak-product-page #ak-detail .ak-form-body { padding:24px; background:#fff; }

/* ── Responsive ── */
@media (max-width: 860px) {
    .ak-pp-hero {
        grid-template-columns: 1fr 1.3fr;
        grid-template-areas: "img info" "specs specs";
        padding: 0 24px;
    }
    .ak-pp-img-col   { grid-area: img; padding-bottom: 36px; }
    .ak-pp-info-col  { grid-area: info; padding-right: 0; border-right: none; }
    .ak-pp-specs-col {
        grid-area: specs;
        padding: 28px 0 36px;
        border-top: 1px solid var(--pp-line);
        border-right: none;
    }
}
@media (max-width: 560px) {
    .ak-pp-hero {
        grid-template-columns: 1fr;
        grid-template-areas: "img" "info" "specs";
        padding: 0 20px;
    }
    .ak-pp-img-col  { border-right: none; border-bottom: 1px solid var(--pp-line); padding: 28px 0; }
    .ak-pp-img { height: 280px; }
    .ak-pp-info-col { border-right: none; padding: 28px 0; }
    .ak-pp-specs-col { padding: 28px 0 36px; }
    .ak-pp-konfig-section { padding: 28px 20px 48px; }
    .ak-pp-model-name { font-size: 22px; }
    .ak-pp-price-big  { font-size: 28px; }
    .ak-pp-btn        { width: 100%; }
    .ak-pp-description, .ak-pp-extra-desc { font-size: 14px !important; text-align: left !important; }
    #ak-product-page #ak-detail .ak-opt-img-btn { display: none; }
}

/* ── Dark Preset — helle Texte auf dunklem Hintergrund ── */
#ak-product-page.pp-preset-dark .ak-pp-specs-title { color: var(--pp-text); border-bottom-color: var(--pp-text); }
#ak-product-page.pp-preset-dark .ak-pp-spec-value  { color: var(--pp-text); }
#ak-product-page.pp-preset-dark .ak-pp-model-name  { color: var(--pp-text); }
#ak-product-page.pp-preset-dark .ak-pp-price-big   { color: var(--pp-btn-bg); }
#ak-product-page.pp-preset-dark .ak-pp-btn--secondary { color: var(--pp-text); border-color: var(--pp-text); }
#ak-product-page.pp-preset-dark .ak-pp-btn--secondary:hover { background: rgba(255,255,255,.1); }

/* ── Elementor Container Override ── */
#ak-product-page .ak-pp-info-col,
#ak-product-page .ak-pp-info-col *,
.elementor #ak-product-page .ak-pp-info-col {
    max-width: none !important;
    width: auto !important;
    box-sizing: border-box !important;
}
#ak-product-page .ak-pp-description,
#ak-product-page .ak-pp-extra-desc {
    max-width: none !important;
    width: 100% !important;
}

/* ── Text-Container explizit auf volle Spaltenbreite ── */
#ak-product-page .ak-pp-info-col > * {
    width: 100% !important;
    max-width: 100% !important;
}
#ak-product-page .ak-pp-description p,
#ak-product-page .ak-pp-description div,
#ak-product-page .ak-pp-description span {
    max-width: 100% !important;
    width: auto !important;
}

/* ── WPForms Konfigurationsfeld sichtbar machen ── */
#ak-form-wrap textarea#wpforms-0-field_3,
#ak-form-wrap textarea[name="wpforms[fields][3]"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    height: auto !important;
    min-height: 120px !important;
    width: 100% !important;
    clip: auto !important;
}
#ak-form-wrap .wpforms-field-textarea {
    display: block !important;
}

/* ── Turbo Header Abstand korrigieren ── */
body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
#tahefobu-header {
    position: relative !important;
    top: 0 !important;
    margin-bottom: 0 !important;
}
#tahefobu-header + * {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
#ak-product-page {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ── Mobile Admin-Bar + Abstand Fix ── */
@media screen and (max-width: 782px) {
    body:has(#ak-product-page) #content,
    body:has(#ak-product-page) #primary,
    body:has(#ak-product-page) #main {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    body:has(#ak-product-page).admin-bar #tahefobu-header {
        top: 46px !important;
    }
}

/* ── Elementor Header Post-4496 CSS Fallback ── */
/* Barlow Condensed für Nav-Menü auf Detailseiten */
.elementor-4496 .elementor-nav-menu--main .elementor-item,
.elementor-4496 .elementor-nav-menu--main .elementor-item:focus,
.elementor-4496 .elementor-nav-menu--main .elementor-item:hover,
.elementor-4496 .elementor-nav-menu--dropdown .elementor-item,
#tahefobu-header .elementor-nav-menu--main .elementor-item {
    font-family: "Barlow Condensed", Sans-serif !important;
    font-size: 1.05rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.01em;
}
#tahefobu-header .as-right-inner a,
#tahefobu-header .as-topbar p {
    font-family: "Barlow", Sans-serif !important;
}



/* ── Elementor Pro Header Logo Mobile Fix ── */
@media (max-width: 767px) {
    .elementor-location-header .elementor-widget-image img,
    .elementor-location-header .elementor-widget-html img {
        max-height: 40px !important;
        width: auto !important;
    }
}

/* ── Mobile: as-col-right auf Detailseite erzwingen ── */
@media (max-width: 1024px) {
    .elementor-location-header .as-col-right {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }
    .elementor-location-header .as-col-right .as-right-inner {
        display: flex !important;
    }
    /* Telefonnummer auf Mobile ausblenden */
    .elementor-location-header .as-col-right a[href^="tel"] {
        display: none !important;
    }
}