/* =========================================================
   TM24 ANKAUF – PERMANENT FIXES & PROFESSIONALISIERUNG
   
   Diese Datei wird NACH ankauf.css geladen.
   JTL kann diese Datei NICHT ueberschreiben!
   Alle Overrides mit !important gesichert.
   
   Letzte Aktualisierung: 21.02.2026
   ========================================================= */


/* ============================================
   A. LAYOUT FIXES
   ============================================ */

/* Hero: Gleiche Hoehe wie Verkaufsseite */
.ankauf-hero {
    min-height: 480px !important;
}

/* Steps-Bar: Ausblenden */
.steps-bar {
    display: none !important;
}

/* Kategorie-Bar */
.kategorie-bar {
    position: relative !important;
    z-index: 5 !important;
}


/* ============================================
   B. HEADER
   ============================================ */

/* Konto & Warenkorb Icons */
.ankauf-header .fa-user,
.ankauf-header .fa-shopping-bag {
    font-size: 20px !important;
}

.ankauf-header a.text-dark {
    font-size: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* Nav-Links */
.nav-link-top {
    font-size: 15px !important;
    font-weight: 600 !important;
}


/* ============================================
   C. MARKEN-KARTEN
   ============================================ */

/* Markenname unter Logo */
.brand-card h5 {
    font-weight: 700 !important;
    font-size: 16px !important;
    color: #333 !important;
    letter-spacing: 0.5px !important;
    margin-top: 6px !important;
}

.brand-text-fallback {
    font-weight: 800 !important;
    font-size: 16px !important;
    color: #333 !important;
}

/* Kategorie-Anzahl */
.kat-count {
    font-size: 12px !important;
}


/* ============================================
   D. MODELL-LISTE & ACCORDION
   ============================================ */

/* Modellname */
.model-name {
    font-weight: 700 !important;
    font-size: 16px !important;
    color: #111 !important;
}

/* Modell-Details */
.model-sub {
    font-size: 13px !important;
    color: #555 !important;
}

/* Modell-Preis */
.model-price {
    font-weight: 800 !important;
    font-size: 18px !important;
    color: var(--tm-blue) !important;
}

.model-price small {
    font-size: 12px !important;
    color: #777 !important;
}

/* Modellreihen Accordion */
.model-series-name {
    font-weight: 800 !important;
    font-size: 18px !important;
    color: #111 !important;
}

.model-series-meta {
    font-size: 13px !important;
    color: #666 !important;
}

.model-series-price {
    font-weight: 700 !important;
    font-size: 16px !important;
    color: var(--tm-blue) !important;
}

.model-variant-label {
    font-weight: 700 !important;
    font-size: 14px !important;
    color: #333 !important;
}

/* Modell-Icon Farbe */
.model-icon-sm {
    color: #555 !important;
}


/* ============================================
   E. BUTTONS
   ============================================ */

.btn-ankauf-small {
    color: #fff !important;
    font-size: 15px !important;
    padding: 12px 28px !important;
}

.btn-ankauf-small:hover {
    color: #fff !important;
}

.btn-whatsapp-small {
    font-size: 15px !important;
}


/* ============================================
   F. SECTION TITLES
   ============================================ */

.section-title h2 {
    font-weight: 900 !important;
    font-size: 28px !important;
    color: #111 !important;
}

.section-title p {
    font-size: 16px !important;
    color: #555 !important;
}


/* ============================================
   G. SUCHBOX & ERGEBNISSE
   ============================================ */

.suche-input {
    font-size: 17px !important;
}

.suche-item-modell {
    font-weight: 700 !important;
    font-size: 15px !important;
    color: #111 !important;
}

.suche-item-speicher {
    font-size: 13px !important;
}

.suche-item-details {
    font-size: 13px !important;
    color: #555 !important;
}

.suche-item-preis {
    font-weight: 800 !important;
    font-size: 16px !important;
}

.suche-leer {
    font-size: 15px !important;
    color: #666 !important;
}


/* ============================================
   H. GERAET NICHT GEFUNDEN
   ============================================ */

.geraet-nicht-gefunden strong {
    font-size: 18px !important;
    color: #111 !important;
}

.geraet-nicht-gefunden p {
    font-size: 15px !important;
    color: #555 !important;
}


/* ============================================
   I. STEP ITEMS (auch wenn hidden)
   ============================================ */

.step-item {
    font-size: 14px !important;
    color: #666 !important;
}

.step-item.active {
    color: var(--tm-blue) !important;
}


/* ============================================
   J. GLOBALE TEXT-MINDESTSTANDARDS
   ============================================ */

/* Alle p-Tags mindestens lesbar */
.ankauf-hero p,
.section-title p,
.geraet-nicht-gefunden p {
    line-height: 1.6 !important;
}

/* Placeholder lesbar */
.suche-input::placeholder {
    color: #999 !important;
    font-size: 16px !important;
}


/* ============================================
   K. TOPBAR
   ============================================ */

.ankauf-topbar {
    font-size: 13px !important;
}

@media (max-width: 768px) {
    .ankauf-topbar {
        font-size: 12px !important;
    }
}


/* ============================================
   L. CHECKOUT / FORMULAR BEREICHE
   ============================================ */

/* Labels in Formularen */
.form-label,
.zustand-label,
.checkout-label {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #333 !important;
}

/* Input-Felder */
input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
select {
    font-size: 15px !important;
}


/* ============================================
   M. MOBILE RESPONSIVE ANPASSUNGEN
   ============================================ */

@media (max-width: 768px) {
    .model-series-name {
        font-size: 15px !important;
    }

    .model-series-meta {
        font-size: 12px !important;
    }

    .model-series-price {
        font-size: 14px !important;
    }

    .brand-card h5 {
        font-size: 13px !important;
    }

    .section-title h2 {
        font-size: 24px !important;
    }
}

/* ============================================
   N. HEADER SUCHFELD
   ============================================ */

.tm24-header-search {
    position: relative;
    flex: 1;
    max-width: 420px;
    margin: 0 24px;
    align-items: center;
}

.tm24-header-search-icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
    font-size: 14px;
    z-index: 2;
    pointer-events: none;
}

.tm24-header-search-input {
    width: 100%;
    padding: 10px 16px 10px 40px;
    border: 1px solid #e0e0e0;
    border-radius: 30px;
    font-size: 14px;
    font-family: 'Figtree', sans-serif;
    background: #f8f8f8;
    color: #333;
    outline: none;
    transition: all 0.2s;
}

.tm24-header-search-input:focus {
    border-color: #2E2BCB;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(46, 43, 203, 0.08);
}

.tm24-header-search-input::placeholder {
    color: #aaa;
    font-size: 13px;
}

.tm24-header-search .suche-ergebnisse {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    margin-top: 6px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    z-index: 9999;
    max-height: 400px;
    overflow-y: auto;
}