/*
 * Tema especial: Dia de la Madre
 * Para volver al tema normal, cambia este archivo por `theme.css`
 * en `resources/views/layout/app.blade.php`.
 */

:root,
.theme-default,
body.theme-mothers-day {
    --color-brand: #d63384;
    --color-brand-strong: #b6256d;
    --color-brand-soft: #fff0f7;
    --color-brand-rgb: 214, 51, 132;

    --color-accent: #f48fb1;
    --color-accent-strong: #ec4899;
    --color-accent-rgb: 244, 143, 177;

    --color-highlight: #f9a8d4;
    --color-highlight-rgb: 249, 168, 212;

    --color-dark: #1e1e1e;
    --color-dark-alt: #151515;
    --color-text-dark: #222222;
    --color-text-muted: #555555;
    --color-text-soft: #c4c4c4;
    --color-surface: #ffffff;
    --color-surface-muted: #f2f2f2;
    --color-surface-soft: #f8f8f8;

    --color-whatsapp: #0dc152;
    --color-facebook: #1877f2;
    --color-instagram: #e1306c;

    --overlay-dark-30: rgba(0, 0, 0, 0.3);
    --overlay-dark-40: rgba(0, 0, 0, 0.4);
    --overlay-dark-50: rgba(0, 0, 0, 0.5);
    --overlay-dark-60: rgba(0, 0, 0, 0.6);
    --overlay-dark-70: rgba(0, 0, 0, 0.7);
    --overlay-light-80: rgba(255, 255, 255, 0.8);
    --overlay-light-90: rgba(255, 255, 255, 0.9);
    --overlay-light-98: rgba(255, 255, 255, 0.98);
}

.text-brand,
.text-naranja {
    color: var(--color-brand) !important;
}

.bg-brand,
.bg-naranja,
.bg-orangetext {
    background-color: var(--color-brand) !important;
}

.text-verde {
    color: var(--color-accent-strong) !important;
}

.bg-verde,
.bg-teal-custom {
    background-color: var(--color-accent) !important;
}

.borde-amarillo {
    border: 1px solid var(--color-highlight) !important;
}

.border-b {
    border-bottom: 4px solid var(--color-highlight) !important;
}

.btn-buscar,
.btn-opaco {
    background: rgba(var(--color-highlight-rgb), 0.18);
    box-shadow: 0 2px 6px rgba(40, 40, 40, 0.15);
}

.footer-surface {
    background: var(--color-dark);
}

.footer-subsurface {
    background: var(--color-dark-alt);
}

.social-facebook:hover {
    background: var(--color-facebook) !important;
}

.social-instagram:hover {
    background: var(--color-instagram) !important;
}

.lds-grid div,
.carousel-control-next div,
.carousel-control-prev div,
.custom-prev-button-tienda:hover,
.custom-next-button-tienda:hover,
.book-button,
.nav-link.active,
.menu,
.menuabierto {
    background: var(--color-brand) !important;
}

.custom-prev-button-tienda:hover i,
.custom-next-button-tienda:hover i {
    color: var(--color-surface) !important;
}

.custom-prev-button-tienda i,
.custom-next-button-tienda i {
    color: var(--color-text-muted);
}

.custom-prev-button-tienda,
.custom-next-button-tienda {
    border-color: var(--color-text-muted) !important;
}

.book-button:hover,
.hover\:bg-orange-600:hover {
    background: var(--color-brand-strong) !important;
}

.dot-indicator.active,
.category-badge {
    background-color: var(--color-highlight) !important;
}

.header-chat,
a.blantershow-chat {
    background: var(--color-whatsapp);
}

a.blantershow-chat:hover {
    background: var(--color-surface);
    color: var(--color-whatsapp) !important;
}

a.blantershow-chat:hover span,
a.blantershow-chat:hover svg {
    color: var(--color-whatsapp) !important;
}

.prel {
    background-color: var(--color-surface);
}