/* ==========================================
   WINTERTHEATER SHOP â€“ CLEAN VERSION
   ========================================== */


/* Logo oben links etwas grÃ¶ÃŸer, aber nur im Header */
header .logo {
    width: 160px !important;
}

header .logo img {
    max-height: 90px !important;
    width: auto !important;
}


/* Weniger Abstand um den Hero-Bereich */
section.relative.mx-auto.my-10 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}


/* Globale Highlight-Farbe auf Unterseiten: Wintertheater-Rot */
.text-primary,
.text-primary-500,
.primary-text {
    color: #772e28 !important;
}


/* STARTSEITE: "Shop" gold statt rot */
h1.no-css-changes span.text-primary {
    color: #b4a459 !important;
}


@media (min-width: 640px) {
    section.relative.mx-auto.my-10 .mt-2.flex.justify-center button .min-h-\[40px\].text-sm,
    section.relative.mx-auto.my-10 .mt-2.flex.justify-center button .min-h-\[40px\].text-sm + div {
        font-size: 1.125rem !important;
    }
}


/* Tixu Branding im Footer ausblenden */
footer .flex.w-full.items-center.justify-center.text-sm {
    display: none !important;
}

/* Auswahl bestÃ¤tigen in Gold */
button.bg-gradient-to-r {
    background: #b4a459 !important;
    color: #000000 !important;
}

button.bg-gradient-to-r span,
button.bg-gradient-to-r div {
    color: #000000 !important;
}

/* Kreis mit Haken */
button.bg-gradient-to-r .bg-white {
    background: #000000 !important;
}

/* Haken gold */
button.bg-gradient-to-r .bg-white svg {
    color: #b4a459 !important;
}

/* Ticketbutton */
@media (min-width: 560px) {
    .sticky.bottom-2.mt-4.flex.w-full.justify-center.transition-all.sm\:w-auto > div > div > div > div {
        width: 250px !important;
    }
}

.sticky.bottom-2.mt-4 button .leading-snug {
    font-size: 0;
}

.sticky.bottom-2.mt-4 button .leading-snug::after {
    content: "Tickets";
    font-size: 18px;
}

/* Ticketbutton Edge/Ecosia Fix */
@media (min-width: 421px) and (max-width: 559px) {
    .sticky.bottom-2.mt-4 .no-css-changes.inline-flex {
        width: 100% !important;
    }
}

/* Merchandise */
@media (min-width: 640px) {
    .mt-2.flex.justify-center .sm\:w-\[399px\] {
        width: 250px !important;
    }
}

/* Button Mehr Laden wird zu Mehr anzeigen */

.mt-6.animate-\[showItem_0\.3s_ease-in-out_forwards\].text-center.\!delay-500 button .leading-snug {
    font-size: 0;
}

.mt-6.animate-\[showItem_0\.3s_ease-in-out_forwards\].text-center.\!delay-500 button .leading-snug::after {
    content: "Mehr anzeigen";
    font-size: 14px;
    line-height: inherit;
}



/* ==========================================
   STATUSMELDUNG: Hero-Buttons nach unten
   Greift nur, solange die Hero-Ãœberschrift ausgeblendet ist
   (Statusmeldung aktiv + â€žÃœberschrift im Banner ausblendenâ€œ).
   Buttons rutschen an den unteren Rand des Banners, damit sie den
   Text des temporÃ¤ren Banner-Bilds nicht verdecken.
   ========================================== */
.disablecss > .absolute.left-0.top-0.flex.size-full.items-center:not(:has(h1.no-css-changes)) {
    align-items: flex-end !important;
    padding-bottom: 1.5rem !important;
}

@media (max-width: 639px) {
    .disablecss > .absolute.left-0.top-0.flex.size-full.items-center:not(:has(h1.no-css-changes)) {
        padding-bottom: 1rem !important;
    }
}