/*
Theme Name:     Twenty Twenty-Four Child
Theme URI:      https://example.com/
Description:    Child Theme für Twenty Twenty-Four mit individuellen Funktionen
Author:         Juanski
Author URI:     https://example.com/
Template:       twentytwentyfour
Version:        1.0
*/

/* =========================================================
   1. WOO – Bestellübersicht hervorheben
   ========================================================= */
.wc-block-components-order-summary {
    background-color: #a773cf94 !important;
    padding: 20px;
    border-radius: 5px;
}

/* Mini-Cart Titel */
.wp-block-woocommerce-mini-cart-title-block.wc-block-mini-cart__title {
    box-shadow: none !important;
    text-shadow: none !important;
    background: transparent !important;
}

/* =========================================================
   2. IBIB WIZARD – Layout
   ========================================================= */

#ibib-wizard {
    max-width: 650px;
    margin-bottom: 50px;
}

/* Fortschrittsanzeige */
#ibib-progress {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 25px;
}

/* ---------------------------------------------------------
   STEP-SICHTBARKEIT  (entscheidend!)
   --------------------------------------------------------- */

/* Standard: ALLE Steps verstecken */
#ibib-wizard .ibib-step {
    display: none !important;
    margin-bottom: 30px;
}

/* Nur aktiver Step sichtbar */
#ibib-wizard .ibib-step.ibib-step-active {
    display: block !important;
}

/* Step-Titel */
#ibib-wizard .ibib-step-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    margin-top: 10px;
    color: #f8cb6b;
}

/* Labels & Inputs */
#ibib-wizard label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
}

#ibib-wizard input[type="text"],
#ibib-wizard select {
    width: 100%;
    margin-bottom: 20px;
    padding: 10px 12px;
    border-radius: 6px;
    border: 1px solid #dcdcdc;
    background: #ffffff;
    font-size: 15px;
    box-sizing: border-box;
}

/* IBIB – Multiline Textfelder (Textarea für bessere Editierbarkeit) */
#ibib-wizard textarea.ibib-multiline {
    width: 100%;
    margin-bottom: 20px;
    padding: 10px 12px;
    border-radius: 6px;
    border: 1px solid #dcdcdc;
    background: #ffffff;
    font-size: 15px;
    box-sizing: border-box;
    line-height: 1.35;
    min-height: 84px;   /* ca. 3 Zeilen */
    resize: vertical;   /* Nutzer kann größer ziehen */
}

#ibib-wizard input[type="checkbox"] {
    margin-right: 8px;
}

/* Überschriften */

#ibib-samples__h3 {
	font-size: 35px;
}

#ibib-wizard h3 {
	font-size: 35px;
}

#ibib-wizard h4 {
    margin-top: 30px;
    margin-bottom: 10px;
    font-size: 28px;
    font-weight: 700;
    color: #f8cb6b;
}


/* =========================================================
   3. Navigation & Abstände zu Woo-Button
   ========================================================= */

/* Container für Zurück/Weiter */
#ibib-nav {
    display: flex;
    justify-content: space-between;
    gap: 40px;
    margin-top: 30px;
    margin-bottom: 20px;
}

/* Buttons im Wizard */
#ibib-nav button {
    min-width: 100px;
    font-size: 15px;
    padding: 10px 18px;
    border-radius: 25px;
}

/* Sicherheitsfallback */
#ibib-wizard {
    margin-bottom: 10px !important;
}

#ibib-wizard label {
    white-space: pre-line;   /* \n wird als Umbruch dargestellt */
}

/* =========================================================
   IBIB – FIX: Konsistente Abstände + volle Textarea-Breite in Flex-Wrap
   (ganz unten einfügen)
   ========================================================= */

/* 1) Konsistente Abstände: Buttons-Row wie Audio-Block */
.ibib-samples__audio {
  margin: 6px 0 14px;
}

/* WICHTIG: Hier muss margin (nicht margin-top mit 3 Werten) verwendet werden */
.ibib-samples__buttons {
  margin: 6px 0 14px;   /* exakt wie Audio */
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* optional: wenn du willst, dass Buttons optisch exakt unter der H3 beginnen */
.ibib-samples__h3 + .ibib-samples__buttons {
  margin-top: 6px;
}

/* 2) Wizard: Textarea in .ibib-voice-wrap muss flexen und volle Breite nehmen */
#ibib-wizard .ibib-voice-wrap {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
  box-sizing: border-box;
}

/* DAS ist der entscheidende Teil: textarea als Flex-Item */
#ibib-wizard .ibib-voice-wrap textarea.ibib-multiline {
  flex: 1 1 0% !important;
  min-width: 0 !important;      /* klassischer Flex-Fix */
  width: 100% !important;
  max-width: none !important;   /* falls Theme max-width setzt */
  display: block;
  box-sizing: border-box;
}

/* Button soll nicht schrumpfen */
#ibib-wizard .ibib-voice-wrap .ibib-suggest-btn,
#ibib-wizard .ibib-voice-wrap button {
  flex: 0 0 auto !important;
}