/* Ana Renk Değişkenleri */
:root {
    /* Mistik & Koyu Tonlar (Başlıklar, Navbar) */
    --astro-dark-red: #540B0E;
    --astro-deep-teal: #136F63;
    --astro-ocean: #33658A;
    --astro-blood-red: #800E13;
    --astro-dark-teal: #335C67;
    --astro-bright-red: #D00000;
    --astro-dark-brick: #AD2831;

    /* Toprak & Parşömen Tonları (Arka Planlar, Kartlar) */
    --astro-cream: #FFF3B0;
    --astro-sand: #FBF6EF;
    --astro-clay: #D5BDAF;
    --astro-wood: #7F5539;
    --astro-parchment: #FAEDCD;
    --astro-light-cream: #FEFAE0;
    --astro-beige: #D4A373;
    --astro-light-beige: #E3D5CA;
    --astro-soft-beige: #F5EBE0;
    --astro-pale-beige: #D6CCC2;
    --astro-very-light-beige: #EDEDE9;
    --astro-dark-wood: #9C6644;
    --astro-medium-wood: #B08968;
    --astro-light-wood: #DDB892;
    --astro-pale-wood: #E6CCB2;
    --astro-soft-wood: #EDE0D4;
    --astro-warm-beige: #EAD7C3;
    --astro-cool-beige: #DCE0D9;

    /* Doğal & Pastel Tonlar */
    --astro-light-green: #E9EDC9;
    --astro-sage: #CCD5AE;

    /* Vurgu & Altın Tonları (İkonlar, Kenarlıklar) */
    --astro-gold: #E09F3E;
    --astro-brick: #9E2A2B;
    --astro-orange: #F26419;

    /* Mavi Tonları */
    --astro-light-blue: #86BBD8;
    --astro-dark-blue: #05192d; /* Burçlar bölümü arka plan rengi */
    --astro-night-blue: #080a1a; /* Hikayeni Yeniden Yaz bölümü arka plan rengi */
    
    /* Yeşil Tonları */
    --astro-main-green: #2f8f7a; /* Ana yeşil renk */
    --astro-main-green-hover: #1f6f5e; /* Hover için koyu yeşil */
}

/* Dinamik Bootstrap-Vari Sınıflar */

/* Arka Planlar (bg-...) */
.bg-astro-dark        { background-color: var(--astro-dark-red) !important; color: white; }
.bg-astro-teal        { background-color: var(--astro-deep-teal) !important; color: white; }
.bg-astro-dark-teal   { background-color: var(--astro-dark-teal) !important; color: white; }
.bg-astro-ocean       { background-color: var(--astro-ocean) !important; color: white; }
.bg-astro-light-blue  { background-color: var(--astro-light-blue) !important; }
.bg-astro-cream       { background-color: var(--astro-cream) !important; }
.bg-astro-light-cream { background-color: var(--astro-light-cream) !important; }
.bg-astro-sand        { background-color: var(--astro-sand) !important; }
.bg-astro-parchment   { background-color: var(--astro-parchment) !important; }
.bg-astro-clay        { background-color: var(--astro-clay) !important; }
.bg-astro-beige       { background-color: var(--astro-beige) !important; }
.bg-astro-light-beige { background-color: var(--astro-light-beige) !important; }
.bg-astro-soft-beige  { background-color: var(--astro-soft-beige) !important; }
.bg-astro-pale-beige  { background-color: var(--astro-pale-beige) !important; }
.bg-astro-very-light-beige { background-color: var(--astro-very-light-beige) !important; }
.bg-astro-warm-beige  { background-color: var(--astro-warm-beige) !important; }
.bg-astro-cool-beige  { background-color: var(--astro-cool-beige) !important; }
.bg-astro-wood        { background-color: var(--astro-wood) !important; color: white; }
.bg-astro-dark-wood   { background-color: var(--astro-dark-wood) !important; color: white; }
.bg-astro-medium-wood { background-color: var(--astro-medium-wood) !important; }
.bg-astro-light-wood  { background-color: var(--astro-light-wood) !important; }
.bg-astro-pale-wood   { background-color: var(--astro-pale-wood) !important; }
.bg-astro-soft-wood   { background-color: var(--astro-soft-wood) !important; }
.bg-astro-light-green { background-color: var(--astro-light-green) !important; }
.bg-astro-sage        { background-color: var(--astro-sage) !important; }
.bg-astro-brick       { background-color: var(--astro-brick) !important; color: white; }
.bg-astro-dark-brick  { background-color: var(--astro-dark-brick) !important; color: white; }
.bg-astro-blood-red   { background-color: var(--astro-blood-red) !important; color: white; }
.bg-astro-bright-red  { background-color: var(--astro-bright-red) !important; color: white; }

/* Metin Renkleri (text-...) */
.text-astro-gold      { color: var(--astro-gold) !important; }
.text-astro-orange    { color: var(--astro-orange) !important; }
.text-astro-red       { color: var(--astro-blood-red) !important; }
.text-astro-blood-red { color: var(--astro-blood-red) !important; }
.text-astro-bright-red { color: var(--astro-bright-red) !important; }
.text-astro-brick     { color: var(--astro-brick) !important; }
.text-astro-dark-brick { color: var(--astro-dark-brick) !important; }
.text-astro-dark-red  { color: var(--astro-dark-red) !important; }
.text-astro-teal      { color: var(--astro-deep-teal) !important; }
.text-astro-dark-teal { color: var(--astro-dark-teal) !important; }
.text-astro-ocean     { color: var(--astro-ocean) !important; }
.text-astro-light-blue { color: var(--astro-light-blue) !important; }
.text-astro-wood      { color: var(--astro-wood) !important; }
.text-astro-dark-wood { color: var(--astro-dark-wood) !important; }
.text-astro-medium-wood { color: var(--astro-medium-wood) !important; }
.text-astro-clay      { color: var(--astro-clay) !important; }
.text-astro-beige     { color: var(--astro-beige) !important; }
.text-astro-sage      { color: var(--astro-sage) !important; }

/* Özel Butonlar - Bootstrap Tarzı */
.btn-astro-gold,
.btn.btn-astro-gold {
    background-color: var(--astro-gold);
    color: white;
    border: none;
    transition: all 0.3s ease;
    font-weight: 500;
}

.btn-astro-gold:hover,
.btn.btn-astro-gold:hover {
    background-color: var(--astro-dark-red);
    color: white;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    transform: translateY(-2px);
}
.btn-astro-gold:focus,
.btn.btn-astro-gold:focus {
    background-color: var(--astro-dark-red);
    color: white;
}

.btn-outline-astro-wood,
.btn.btn-outline-astro-wood {
    border: 2px solid var(--astro-wood);
    color: var(--astro-wood);
    background-color: transparent;
    transition: all 0.3s ease;
    font-weight: 500;
}
.btn-outline-astro-wood:hover,
.btn.btn-outline-astro-wood:hover {
    background-color: var(--astro-wood);
    color: white;
    border-color: var(--astro-wood);
    transform: translateY(-2px);
}

/* Buton Boyutları - Bootstrap Uyumlu */
.btn-astro-gold.btn-lg,
.btn.btn-astro-gold.btn-lg {
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
}

.btn-outline-astro-wood.btn-lg,
.btn.btn-outline-astro-wood.btn-lg {
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
}

.btn-astro-gold.btn-sm,
.btn.btn-astro-gold.btn-sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
}

.btn-outline-astro-wood.btn-sm,
.btn.btn-outline-astro-wood.btn-sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.875rem;
}

/* Rounded Pill Desteği */
.btn-astro-gold.rounded-pill,
.btn.btn-astro-gold.rounded-pill {
    border-radius: 50rem;
}

.btn-outline-astro-wood.rounded-pill,
.btn.btn-outline-astro-wood.rounded-pill {
    border-radius: 50rem;
}

/* Cool Beige Buton */
.btn-astro-cool-beige,
.btn.btn-astro-cool-beige {
    background-color: var(--astro-cool-beige);
    transition: all 0.3s ease;
  
}
.btn-astro-cool-beige:hover,
.btn.btn-astro-cool-beige:hover {
    background-color: var(--astro-wood);
    color: white;
    transform: translateY(-2px);
}
.btn-astro-cool-beige:focus,
.btn.btn-astro-cool-beige:focus {
    background-color: var(--astro-wood);
    color: white;
    box-shadow: 0 0 0 0.25rem rgba(220, 224, 217, 0.5);
}
/* Cool Beige Outline Buton */
.btn-outline-astro-cool-beige,
.btn.btn-outline-astro-cool-beige {
    border: 2px solid var(--astro-cool-beige);
    color: var(--astro-wood);
    background-color: transparent;
    transition: all 0.3s ease;
    font-weight: 500;
}
.btn-outline-astro-cool-beige:hover,
.btn.btn-outline-astro-cool-beige:hover {
    background-color: var(--astro-cool-beige);
    color: var(--astro-wood);
    border-color: var(--astro-cool-beige);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(220, 224, 217, 0.3);
}
.btn-outline-astro-cool-beige:focus,
.btn.btn-outline-astro-cool-beige:focus {
    box-shadow: 0 0 0 0.25rem rgba(220, 224, 217, 0.5);
}

/* Kırmızı Buton - Önemli işlemler için */
.btn-astro-blood-red,
.btn.btn-astro-blood-red {
    background-color: var(--astro-blood-red);
    color: white;
    border: none;
    transition: all 0.3s ease;
    font-weight: 600;
}

.btn-astro-blood-red:hover,
.btn.btn-astro-blood-red:hover {
    background-color: var(--astro-dark-brick);
    color: white;
    box-shadow: 0 4px 12px rgba(128, 14, 19, 0.4);
    transform: translateY(-2px);
}

.btn-astro-blood-red:focus,
.btn.btn-astro-blood-red:focus {
    background-color: var(--astro-dark-brick);
    color: white;
    box-shadow: 0 0 0 0.25rem rgba(128, 14, 19, 0.5);
}

.btn-astro-blood-red:active,
.btn.btn-astro-blood-red:active {
    background-color: var(--astro-dark-red);
    transform: translateY(0);
}