/* ==========================================
   Espelho Meu - Tema Customizado
   ========================================== */

:root {
    /* Paleta principal - Rosa/Vinho */
    --meu-50: #fff1f2;
    --meu-100: #ffe4e6;
    --meu-200: #fecdd3;
    --meu-300: #fda4af;
    --meu-400: #fb7185;
    --meu-500: #f43f5e;
    --meu-600: #e11d48;
    --meu-700: #be123c;
    --meu-800: #9f1239;
    --meu-900: #881337;
    --meu-950: #4c0519;

    /* Fundo e texto */
    --bg-dark: #1a0f15;
    --bg-card: rgba(76, 5, 25, 0.4);
    --text-primary: #f8f9fa;
    --text-secondary: #ced4da;
    --text-muted: #adb5bd;
}

/* ==========================================
   Utilitários
   ========================================== */

.bg-dark-rose {
    background: radial-gradient(
        circle at top right,
        #1a0f15 0%,
        #160e1a 50%,
        #0f0b13 100%
    );
}

.bg-card-rose {
    background: var(--bg-card);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.text-meu {
    color: var(--meu-500);
}

.text-middle {
    color: var(--meu-800);
}

.text-dark-rose {
    color: var(--meu-950);
}

.text-meu-light {
    color: var(--meu-300);
}

.btn-meu {
    background: linear-gradient(135deg, var(--meu-500), var(--meu-600));
    border: none;
    color: #fff !important;
    transition: all 0.3s ease;
}

.btn-meu:hover {
    background: linear-gradient(135deg, var(--meu-400), var(--meu-500));
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 15px rgba(244, 63, 94, 0.3);
}

.btn-outline-meu {
    border-color: var(--meu-500);
    color: var(--meu-500);
}

.btn-outline-meu:hover {
    background: var(--meu-500);
    color: #fff;
}

/* Cards com efeito glass */
.glass-card {
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: all 0.3s ease;
}

.glass-card:hover {
    background: rgba(255, 255, 255, 0.06);
}

/* Progress bar */
.progress-bar-meu {
    background: linear-gradient(90deg, var(--meu-500), var(--meu-600));
}

/* Background do booking (claro) */
.bg-booking {
    background: radial-gradient(
        circle at top right,
        #fda4af 0%,
        #fb7185 50%,
        #fda4af 100%
    );
}

/* Classes utilitárias do tema */
.border-meu {
    border-color: var(--meu-500) !important;
}

.bg-meu {
    background-color: var(--meu-500) !important;
}

.bg-meu-100 {
    background-color: var(--meu-100) !important;
}

.bg-meu-200 {
    background-color: var(--meu-200) !important;
}

.bg-meu-800 {
    background-color: var(--meu-800) !important;
}

.bg-meu-950 {
    background-color: var(--meu-950) !important;
}

/* Status badges */
.badge-waiting {
    background: rgba(13, 110, 253, 0.1);
    color: #0d6efd;
}

.badge-in-progress {
    background: rgba(25, 135, 84, 0.1);
    color: #198754;
}

.badge-scheduled {
    background: rgba(244, 63, 94, 0.1);
    color: var(--meu-500);
}

/* Scrollbar customizada */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.02);
}

::-webkit-scrollbar-thumb {
    background: rgba(244, 63, 94, 0.3);
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(244, 63, 94, 0.5);
}