/* SlimWoo — Basisgestaltung.
 *
 * Zurueckhaltend, ohne !important, ueber Theme-CSS ueberschreibbar und per
 * Filter `slimwoo_enqueue_base_styles` ganz abschaltbar. Ein Theme, das die
 * Compliance-Bloecke selbst gestaltet, schaltet sie ab und verliert nichts.
 *
 * Uebernommen aus theme/assets/css/global.css des Konsumenten
 * (ketex-wp-26#63, Aufgabe 11) — dort lagen die Regeln, waehrend ihr Markup
 * mit den Aufgaben 4 bis 10 hierher gewandert ist.
 *
 * TOKENS: Die Regeln lasen bisher --ketex-*. Sie lesen jetzt --slimwoo-* mit
 * dem bisherigen Ketex-Wert als Fallback-Literal; das Konsumenten-Theme bildet
 * seine eigenen Tokens auf die slimwoo-Namen ab. So kennt das Paket nur seine
 * eigenen Namen, und die Darstellung bleibt zeichengleich.
 */

/* ── Compliance-Bloecke auf der Produktseite ─────────────────────── */
.slimwoo-compliance-origin,
.slimwoo-compliance-identifier,
.slimwoo-compliance-eprel { font-size: 14px; color: var(--slimwoo-text-muted, #6B6B6B); margin-top: 6px; }
.slimwoo-compliance-clp {
    border: 1px solid var(--slimwoo-border, #E8E0D8);
    border-radius: 8px; padding: 12px 14px; margin: 14px 0;
    background: var(--slimwoo-bg, #FCFAF8);
}
.slimwoo-compliance-clp__pictograms { display: flex; gap: 8px; margin-bottom: 8px; }
.slimwoo-compliance-clp__pictogram { width: 48px; height: 48px; }
.slimwoo-compliance-clp__signal { font-weight: 700; margin: 0 0 6px; }
.slimwoo-compliance-clp__statements { margin: 0; padding-left: 18px; }

.slimwoo-compliance-manufacturer,
.slimwoo-compliance-safety,
.slimwoo-compliance-textile { margin: 0 0 22px; }
.slimwoo-compliance-manufacturer__title,
.slimwoo-compliance-safety__title,
.slimwoo-compliance-textile__title { font-family: var(--slimwoo-font-title); font-size: var(--slimwoo-title-card); margin: 0 0 8px; }
.slimwoo-compliance-manufacturer p { margin: 0 0 2px; line-height: 1.55; }
.slimwoo-compliance-manufacturer__name { font-weight: 600; }
.slimwoo-compliance-manufacturer__rp { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--slimwoo-border, #E8E0D8); }
.slimwoo-compliance-manufacturer__rp-title { font-family: var(--slimwoo-font-title); font-size: 15px; font-weight: var(--slimwoo-title-weight); margin: 0 0 4px; }
.slimwoo-compliance-safety__list,
.slimwoo-compliance-textile__list { margin: 0; padding-left: 18px; }
.slimwoo-compliance-safety__list li,
.slimwoo-compliance-textile__list li { margin: 0 0 2px; line-height: 1.5; }
.slimwoo-compliance-eprel { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.slimwoo-compliance-eprel__link { color: var(--slimwoo-accent, #A3434B); text-decoration: none; }
.slimwoo-compliance-eprel__link:hover { text-decoration: underline; text-underline-offset: 3px; }
.slimwoo-compliance-fallback__row { font-size: 14px; }
.slimwoo-compliance-fallback__key { font-weight: 600; }

/* ══════════════════════════════════════════
   § 356a-WIDERRUFSSTRECKE — Formularstile
   Die Strecke ist KEINE WooCommerce-Seite: die Templates unter
   templates/withdrawal/ tragen zwar .woocommerce-form/.form-row/
   .input-text, aber WooCommerce stylt diese Klassen nur auf seinen
   eigenen Seiten. Deshalb eigene BEM-Klassen statt Fremdklassen-Kaperei.
   ══════════════════════════════════════════ */
.slimwoo-widerruf {
    max-width: 720px;
    font-family: var(--slimwoo-font-ui);
    color: var(--slimwoo-text);
}
.slimwoo-widerruf__intro {
    margin: 0 0 1.75rem;
    line-height: 1.7;
    color: var(--slimwoo-text-muted);
}
.slimwoo-widerruf__fehler {
    margin: 0 0 1.5rem;
    padding: 12px 16px;
    border: 1px solid var(--slimwoo-primary);
    border-left-width: 4px;
    border-radius: 8px;
    background: #FCF3F1;
    color: var(--slimwoo-primary);
    font-weight: 600;
}

/* Zweispaltiges Feldraster ab Tablet — form-row-first/-last kommen aus den
   Templates (WooCommerce-Konvention), die Spaltenlogik liegt hier. */
.slimwoo-widerruf .form-row {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 1.25rem;
}

.slimwoo-widerruf label {
    font-size: var(--slimwoo-label);
    font-weight: 600;
    color: var(--slimwoo-text);
}
.slimwoo-widerruf .input-text,
.slimwoo-widerruf input[type="text"],
.slimwoo-widerruf input[type="email"],
.slimwoo-widerruf input[type="number"],
.slimwoo-widerruf textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 11px 14px;
    border: 1px solid var(--slimwoo-border);
    border-radius: 8px;
    background: #fff;
    font-family: var(--slimwoo-font-ui);
    font-size: 15px;
    color: var(--slimwoo-text);
}
.slimwoo-widerruf .input-text:focus,
.slimwoo-widerruf textarea:focus {
    outline: none;
    border-color: var(--slimwoo-primary);
    box-shadow: 0 0 0 3px rgba(184, 69, 46, .15);
}
.slimwoo-widerruf textarea { resize: vertical; min-height: 120px; }

.slimwoo-widerruf__positionen {
    margin: 0 0 1.75rem;
    padding: 20px 24px 8px;
    border: 1px solid var(--slimwoo-border);
    border-radius: 12px;
    background: var(--slimwoo-bg-light);
}
.slimwoo-widerruf__positionen legend {
    padding: 0 8px;
    font-family: var(--slimwoo-font-title);
    font-size: var(--slimwoo-title-card);
    font-weight: var(--slimwoo-title-weight);
}
.slimwoo-widerruf__position {
    display: grid;
    grid-template-columns: 1fr 96px;
    align-items: center;
    gap: 16px;
}
.slimwoo-widerruf__position label { font-weight: 400; font-size: 15px; }

.slimwoo-widerruf .button {
    display: inline-block;
    padding: 13px 28px;
    border: 1px solid var(--slimwoo-primary);
    border-radius: 8px;
    background: var(--slimwoo-primary);
    font-family: var(--slimwoo-font-ui);
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}
.slimwoo-widerruf .button:hover {
    background: var(--slimwoo-secondary);
    border-color: var(--slimwoo-secondary);
}

/* --- LMIV-Pflichtangaben (compliance/food_info) --- */
.slimwoo-food-info__heading {
    font-size: var(--slimwoo-title-card);
    margin-block: 1.5rem 0.5rem;
}
.slimwoo-food-info__basis {
    font-weight: 400;
    color: var(--slimwoo-text-muted);
}

.slimwoo-food-info__table {
    width: 100%;
    max-width: 32rem;
    border-collapse: collapse;
}
.slimwoo-food-info__table th,
.slimwoo-food-info__table td {
    text-align: left;
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--slimwoo-border);
}
.slimwoo-food-info__table td {
    text-align: right;
}

/* Ab 720px wird das Widerrufsformular zweispaltig; alles, was ueber die
   volle Breite laufen muss, holt sich `grid-column: 1 / -1` zurueck.
   Die Regel stand als einzige der Widerrufsstrecke in einer @media-Klammer
   und blieb deshalb beim ersten Umzug im Theme des Konsumenten zurueck —
   ohne sie bekaeme ein fremder Shop das Formular einspaltig. */
@media (min-width: 720px) {
    .slimwoo-widerruf {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 24px;
    }
    .slimwoo-widerruf > .slimwoo-widerruf__intro,
    .slimwoo-widerruf > .slimwoo-widerruf__fehler,
    .slimwoo-widerruf > .slimwoo-widerruf__positionen,
    .slimwoo-widerruf > .form-row-full,
    .slimwoo-widerruf > .slimwoo-widerruf__honeypot { grid-column: 1 / -1; }
    .slimwoo-widerruf > .form-row:not(.form-row-first):not(.form-row-last) { grid-column: 1 / -1; }
}

/* Shared native price and legal-navigation output. */
.slimwoo-product-price-notes { display: block; font-size: 0.8em; font-weight: normal; }
.slimwoo-legal-navigation ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75em 1.25em; list-style: none; padding: 0; }