/*
Theme Name: Prephouse 2026
Theme URI: https://www.prephouse.de
Description: Theme für Prephouse GmbH – Fulfillment und FBA-Prep aus Lemgo. Kindtheme von Twenty Twenty-Five im Prephouse-Design (Schwarz/Orange, Readex Pro).
Author: Prephouse GmbH
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: prephouse
*/

/* Kleine Ergänzungen, die theme.json nicht abdeckt */

:root { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { :root { scroll-behavior: auto; } }

/* Orangefarbener Unterstrich als Markenakzent (auf Dunkel: orange Schrift wie in der Präsentation) in Überschriften: <mark class="ph-accent"> */
.ph-accent { background: linear-gradient(transparent 62%, var(--wp--preset--color--accent) 62%); color: inherit; padding: 0 .08em; }

/* Karten für Leistungen, Referenzen, Schritte */
.ph-card { border: 1px solid var(--wp--preset--color--line); border-radius: 14px; transition: border-color .2s, transform .2s; height: 100%; }
/* Karte mit weiteren Blöcken darunter nicht auf Spaltenhöhe strecken (sonst rutschen die Blöcke darunter aus der Spalte) */
.wp-block-column > .ph-card:not(:only-child) { height: auto; }
.ph-card:hover { border-color: var(--wp--preset--color--contrast); }
@media (prefers-reduced-motion: no-preference) { .ph-card:hover { transform: translateY(-2px); } }

/* Nummerierte Schritte */
.ph-step-number { display: inline-grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--wp--preset--color--accent); color: var(--wp--preset--color--contrast); font-weight: 700; }

/* Referenzlogos einheitlich */
.ph-logos img { max-height: 44px; width: auto; filter: grayscale(1); opacity: .75; }
.ph-logos img:hover { filter: none; opacity: 1; }

/* Häkchenliste */
.ph-checks { list-style: none; padding-left: 0; }
.ph-checks li { position: relative; padding-left: 1.8em; margin-bottom: .5em; }
.ph-checks li::before { content: ""; position: absolute; left: 0; top: .35em; width: 1.05em; height: 1.05em; border-radius: 50%; background: var(--wp--preset--color--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5 10.5 3 3 7-7' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat; }

/* FAQ als aufklappbare Fragen */
.wp-block-details { border-bottom: 1px solid var(--wp--preset--color--line); padding: 1rem 0; }
.wp-block-details summary { font-weight: 600; cursor: pointer; }

/* Fokus gut sichtbar (Tastatur) */
:where(a, button, input, textarea, select, summary):focus-visible { outline: 3px solid var(--wp--preset--color--accent); outline-offset: 2px; }

.ph-header-cta .wp-block-button__link { white-space: nowrap; }
@media (max-width: 600px) { header .wp-block-buttons > .wp-block-button.ph-header-cta { display: none; } }

/* Logos der Referenzen in Kacheln (PIKOSCH-Logo ist für dunklen Grund gemacht) */
.ph-logo-tile { align-items: center; justify-content: center; height: 110px; border-radius: 12px; background: var(--wp--preset--color--surface); padding: 14px 24px; margin-bottom: 1.2rem; overflow: hidden; }
.ph-logo-tile.is-dark { background: var(--wp--preset--color--night); }
.ph-logo-tile figure { margin: 0; min-width: 0; max-width: 100%; flex: 0 1 auto; }
.ph-logo-tile a { display: block; }
.ph-logo-tile img { display: block; width: auto; height: auto; max-height: 72px; max-width: 100%; object-fit: contain; }
.ph-logo-bar { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-top: .6rem; }
.ph-logo-tile.is-small { height: 84px; margin: 0; padding: 12px 12px; }
.ph-logo-tile.is-small img { max-height: 46px; }

/* Umrandeter Button auf dunklem Grund */
.has-night-background-color .is-style-outline .wp-block-button__link { color: var(--wp--preset--color--base); border-color: var(--wp--preset--color--base); }
.has-night-background-color .is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }

/* deliverO-Block im Corporate Design von deliverO: Schwarz, Gelb #FDB813, Montserrat */
.dlv-block { background: #141414; color: #fff; font-family: var(--wp--preset--font-family--montserrat); }
.dlv-block :where(h1, h2, h3, p, li, a) { font-family: inherit; }
.dlv-block h2 { font-weight: 800; letter-spacing: -.01em; }
.dlv-block .dlv-text { color: #c9c9c4; }
.dlv-block .dlv-eyebrow { color: var(--wp--preset--color--delivero); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; font-size: var(--wp--preset--font-size--small); }
.dlv-block .dlv-logo { margin-bottom: .4rem; }
.dlv-block .ph-checks li::before { background-color: var(--wp--preset--color--delivero); }
.dlv-block .dlv-button .wp-block-button__link { background: var(--wp--preset--color--delivero); color: #000; border-radius: 999px; font-weight: 700; font-family: var(--wp--preset--font-family--montserrat); }
.dlv-block .dlv-button .wp-block-button__link:hover { background: #fff; color: #000; }
.dlv-block a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--delivero); }

/* Kontaktformular */
.ph-form { display: grid; gap: .2rem; }
.ph-form-reihe { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
@media (max-width: 600px) { .ph-form-reihe { grid-template-columns: 1fr; } }
.ph-form label { display: block; font-weight: 600; font-size: .95rem; margin-bottom: .35rem; }
.ph-form input[type=text], .ph-form input[type=email], .ph-form input[type=tel], .ph-form textarea { width: 100%; box-sizing: border-box; font: inherit; padding: .75rem .9rem; border: 1px solid var(--wp--preset--color--line); border-radius: 10px; background: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }
.ph-form input:focus, .ph-form textarea:focus { border-color: var(--wp--preset--color--contrast); }
.ph-form-check label { font-weight: 400; display: flex; gap: .6rem; align-items: flex-start; }
.ph-form-check input { margin-top: .3rem; width: 1.1rem; height: 1.1rem; flex: none; accent-color: var(--wp--preset--color--contrast); }
.ph-form button { border: 0; cursor: pointer; }
.ph-form-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ph-form-fehler { background: #fdecea; color: #8a1c13; border-radius: 10px; padding: 1rem 1.2rem; }
.ph-form-ok { background: var(--wp--preset--color--surface); border-left: 4px solid var(--wp--preset--color--accent); border-radius: 10px; padding: 1.2rem 1.4rem; }
.ph-breadcrumb a { color: var(--wp--preset--color--muted); text-decoration: none; }
.ph-breadcrumb a:hover { color: var(--wp--preset--color--contrast); }

/* Sprachumschalter im Kopf */
.ph-lang a { font-weight: 600; font-size: .85em; letter-spacing: .04em; border: 1px solid var(--wp--preset--color--line); border-radius: 6px; padding: .15em .45em; }

/* Dunkle Bereiche (Kopf, Hero, Fuß) im Prephouse-Stil */
.ph-dark { background: #000; color: #fff; }
.ph-dark :where(p, li) { color: #d6d6d6; }
.ph-dark a:where(:not(.wp-element-button)) { color: #fff; }
.ph-dark .is-style-outline .wp-block-button__link { color: #fff; border-color: #fff; background: transparent; }
.ph-dark .is-style-outline .wp-block-button__link:hover { background: #fff; color: #000; }
header.ph-dark .wp-block-navigation a { color: #fff; }
header.ph-dark .wp-block-navigation__responsive-container.is-menu-open { background: #000; }
/* Orangefarbener Pinselstrich-Akzent wie in der Präsentation (ohne Bild, nur Unterstrich) */
.ph-dark .ph-accent { background: none; color: var(--wp--preset--color--accent); padding: 0; }
/* Zwei-Wege-Karten (FBA-Prep / Fulfillment) */
.ph-weg { border: 2px solid var(--wp--preset--color--line); border-radius: 14px; height: 100%; transition: border-color .2s; }
.ph-weg:hover { border-color: var(--wp--preset--color--accent); }
/* Preistabellen */
.ph-preise table { width: 100%; border-collapse: collapse; }
.ph-preise td, .ph-preise th { padding: .8rem .6rem; border-bottom: 1px solid var(--wp--preset--color--line); text-align: left; vertical-align: top; }
.ph-preise td:last-child, .ph-preise th:last-child { text-align: right; white-space: nowrap; font-weight: 600; }
.ph-preise thead th { font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; color: var(--wp--preset--color--muted); }
/* Partnerlogos: zwei Viererreihen, auf dem Handy zwei Spalten */
.ph-logo-bar { display: flex; flex-wrap: wrap; justify-content: center; }
.ph-logo-bar > .ph-logo-tile { flex: 0 0 calc((100% - 48px) / 5); }
@media (max-width: 900px) { .ph-logo-bar > .ph-logo-tile { flex-basis: calc((100% - 24px) / 3); } }
@media (max-width: 600px) { .ph-logo-bar > .ph-logo-tile { flex-basis: calc((100% - 12px) / 2); } }
.ph-logo-bar .ph-logo-tile.is-small { height: 104px; }
.ph-logo-bar .ph-logo-tile.is-small img { max-height: 64px; }
/* Illustrationen im dunklen Hero mit runden Ecken */
.ph-dark .wp-block-image img { border-radius: 16px; }
.ph-dark .ph-logo img, footer.ph-dark .wp-block-image img { border-radius: 0; }
@media (max-width: 600px) { .ph-preise td:last-child, .ph-preise th:last-child { white-space: normal; } }
.ph-preise table, .ph-preise td, .ph-preise th { border-left: 0; border-right: 0; border-top: 0; }
.ph-preise thead { border-bottom: 2px solid var(--wp--preset--color--contrast); }

/* Preisrechner */
.ph-rechner { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; border: 2px solid var(--wp--preset--color--line); border-radius: 14px; padding: 1.8rem; background: var(--wp--preset--color--base); }
@media (max-width: 760px) { .ph-rechner { grid-template-columns: 1fr; } }
.ph-rechner-feld { margin: 0 0 1rem; }
.ph-rechner-feld label { display: block; font-weight: 600; font-size: .95rem; margin-bottom: .35rem; }
.ph-rechner-feld input { width: 100%; box-sizing: border-box; font: inherit; padding: .7rem .9rem; border: 1px solid var(--wp--preset--color--line); border-radius: 10px; }
.ph-rechner-feld input:focus { border-color: var(--wp--preset--color--contrast); }
.ph-rechner-feld small { display: block; color: var(--wp--preset--color--muted); margin-top: .25rem; }
.ph-rechner-ergebnis { background: #000; color: #fff; border-radius: 12px; padding: 1.5rem; display: flex; flex-direction: column; gap: .6rem; }
.ph-rechner-posten { list-style: none; margin: 0; padding: 0; font-size: .92rem; color: #d6d6d6; }
.ph-rechner-posten li { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem 0; border-bottom: 1px solid #2b2b2b; }
.ph-rechner-posten li span:last-child { white-space: nowrap; color: #fff; }
.ph-rechner-summe { display: flex; justify-content: space-between; align-items: baseline; margin: .4rem 0 0; }
.ph-rechner-summe strong { font-size: 1.8rem; color: var(--wp--preset--color--accent); }
.ph-rechner-proeinheit, .ph-rechner-hinweis { margin: 0; font-size: .85rem; color: #bdbdbd; }
.ph-rechner .wp-block-button { margin-top: .6rem; }
.ph-rechner-summe strong { text-align: right; line-height: 1.1; }
/* Echte Lagerfotos: gleich hoch zugeschnitten, runde Ecken */
.ph-foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 14px; display: block; }
/* Bilder im dunklen Hero einheitlich im Querformat zuschneiden (auch Hochformat-Fotos) */
main .ph-dark .wp-block-column .wp-block-image img { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; }
.ph-sterne { color: var(--wp--preset--color--accent); letter-spacing: .12em; font-size: 1.1rem; }
