/*
 Theme Name:   Beauty with Class
 Theme URI:    https://bwc.eagleforge.de
 Description:  Child Theme für Beauty with Class — Kosmetikstudio Darmstadt. Basiert auf Hello Elementor.
 Author:       Eagleforge
 Author URI:   https://eagleforge.de
 Template:     hello-elementor
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  bwc
*/

/* ═══════════════════════════════════════════════════════════════
   BWC Design System — CSS Custom Properties
   
   WICHTIG: Diese Variablen setzen NUR Defaults.
   Elementor-Inline-Styles haben immer Vorrang.
   Text-Widgets bleiben frei einstellbar (Farbe, Größe, Font).
   ═══════════════════════════════════════════════════════════════ */

:root {
    /* ─── Hintergründe ─── */
    --bwc-bg-primary:    #F7F5F2;
    --bwc-bg-secondary:  #EFECE8;
    --bwc-bg-card:       #FFFFFF;
    --bwc-bg-muted:      #E8E3DE;

    /* ─── Lavender (Primärakzent) ─── */
    --bwc-lavender:       #C4AEDB;
    --bwc-lavender-dark:  #A88CC5;
    --bwc-lavender-light: #EDE6F4;

    /* ─── Soft Peach (Sekundärakzent) ─── */
    --bwc-peach:       #CDA692;
    --bwc-peach-dark:  #B88C77;
    --bwc-peach-light: #E8D5CC;

    /* ─── Rosé (Tertiärakzent) ─── */
    --bwc-rose:       #D4B8B3;
    --bwc-rose-light: #EDE0DD;

    /* ─── Text ─── */
    --bwc-text-primary:   #3A3545;
    --bwc-text-secondary: #6B6578;
    --bwc-text-muted:     #9E97A8;

    /* ─── Borders ─── */
    --bwc-border:      #E5E0DB;
    --bwc-border-dark: #D1CBC4;
}

/* ─── Basis-Defaults (niedrige Spezifität) ─── */
body {
    background-color: var(--bwc-bg-primary);
    color: var(--bwc-text-primary);
}

/* ─── Smooth Scrolling ─── */
html {
    scroll-behavior: smooth;
}

/* ─── Selection ─── */
::selection {
    background-color: var(--bwc-lavender-light);
    color: var(--bwc-text-primary);
}

/* ─── Links (nur Defaults, Elementor überschreibt) ─── */
a {
    color: var(--bwc-lavender-dark);
    transition: color 0.2s ease;
}
a:hover {
    color: var(--bwc-lavender);
}

/* ─── Scrollbar (Webkit) ─── */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--bwc-bg-secondary);
}
::-webkit-scrollbar-thumb {
    background: var(--bwc-border-dark);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--bwc-lavender);
}

/* ═══ AMELIA CATALOG — BWC Styling (Farben via Amelia Customize) ═══ */

/* Container transparent */
.amelia-v2-booking .am-fc__wrapper {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* Karten Radius + Hover */
.amelia-v2-booking .am-fc1__item-inner {
    border-radius: 14px !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.amelia-v2-booking .am-fc1__item-inner:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 24px rgba(58, 53, 69, 0.06) !important;
}

/* Service-Name in Playfair */
.amelia-v2-booking .am-fc1__item-heading {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: 17px !important;
    font-weight: 500 !important;
}

/* Badge Pill-Shape */
.amelia-v2-booking .am-fc1__item-badge {
    border-radius: 100px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
}

/* Button Pill-Shape */
.amelia-v2-booking .am-button {
    border-radius: 100px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

/* Suchfeld + Header nuclear hide */
#amelia-v2-booking .am-cat__header .am-fc1__filter,
#amelia-v2-booking [role="search"],
#amelia-v2-booking .am-fc1__filter,
.am-fc1__filter,
div[class*="am-fc1__filter"]:not([class*="button"]) {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    position: absolute !important;
    pointer-events: none !important;
}

#amelia-v2-booking .am-fc1__heading,
#amelia-v2-booking .am-cat__heading,
.am-fc1__heading {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    position: absolute !important;
}
