@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@400;500;700&family=Heebo:wght@300;400;500;600;700&display=swap');

:root {
    /* Brand Colors (Hex) */
    --brand-burgundy: #660033;
    --brand-gold: #C5A56B;
    --brand-charcoal: #291602;
    --brand-cream: #FDF1DB;
    --brand-sand: #DDC8B0;
    --brand-rose: #DCAE96;
    
    /* Minor Colors (Hex) */
    --brand-dark-burgundy: #3D0018;
    --brand-light-cream: #FEFAF4;

    /* Brand Colors (RGB) for opacity usage */
    --brand-burgundy-rgb: 102, 0, 51;
    --brand-gold-rgb: 197, 165, 107;
    --brand-charcoal-rgb: 41, 22, 2;
    --brand-cream-rgb: 253, 241, 219;
    --brand-sand-rgb: 221, 200, 176;

    /* Fonts */
    --font-sans: 'Heebo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    --font-serif: 'Frank Ruhl Libre', Georgia, Cambria, 'Times New Roman', Times, serif;
}

* { 
    font-family: var(--font-sans); 
    box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6, .font-serif {
    font-family: var(--font-serif);
}

html { 
    scroll-behavior: smooth; 
}

body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

#root {
    flex: 1;
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--brand-cream); }
::-webkit-scrollbar-thumb { background: var(--brand-gold); border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: var(--brand-burgundy); }

/* Loading Output */
#loading {
    position: fixed;
    inset: 0;
    background: linear-gradient(135deg, var(--brand-cream) 0%, #f5e8d0 50%, var(--brand-cream) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.loader {
    width: 48px;
    height: 48px;
    border: 4px solid var(--brand-sand);
    border-top-color: var(--brand-burgundy);
    border-radius: 50%;
    animation: l 0.8s linear infinite;
}

@keyframes l { 100% { transform: rotate(1turn); } }

/* Fix for RTL select dropdown arrow position */
select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M10.293 3.293L6 7.586 1.707 3.293A1 1 0 00.293 4.707l5 5a1 1 0 001.414 0l5-5a1 1 0 10-1.414-1.414z'/%3E%3C/svg%3E");
    background-repeat: no-repeat !important;
    background-position: left 12px center !important;
    padding-right: 12px !important;
    padding-left: 36px !important;
}

/* Base custom classes (glassmorphism/Landing design) */
.glass-panel {
    background: rgba(255,255,255,0.6);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.4);
    box-shadow: 0 8px 32px 0 rgba(102,0,51,0.1);
}

.glass-card {
    background: rgba(253,241,219,0.5);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(197,165,107,0.2);
    transition: all 0.3s ease;
}

.glass-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(102,0,51,0.15);
    background: rgba(253,241,219,0.8);
}

/* Animations */
@keyframes fade-in-up {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}
.animate-fade-in-up { animation: fade-in-up 0.6s ease forwards; }

@keyframes bounce-slow {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-10px); }
}
.animate-bounce-slow { animation: bounce-slow 2.5s ease-in-out infinite; }

@keyframes blob {
    0%, 100% { transform: translate(0,0) scale(1); }
    33%       { transform: translate(20px,-20px) scale(1.1); }
    66%       { transform: translate(-15px,15px) scale(0.9); }
}
.animate-blob { animation: blob 7s ease-in-out infinite; }

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-8px); }
}

.animation-delay-2000 { animation-delay: 2s; }