/* /css/va2026.css */

:root {
    /* Palette de couleurs calquée sur l'identité visuelle du logo */
    --va-blue: #0ea5e9;       /* Bleu azur dynamique */
    --va-terracotta: #c2591f; /* Ocre / Terracotta du logo */
    --dark-slate: #1e293b;    /* Ardoise sombre pour le texte */
    --light-bg: #f8fafc;      /* Fond très clair et moderne */

    /* Variables ajoutées pour cohérence avec header.php */
    --algeria-green: #006633;
    --algeria-red: #D21034;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: var(--dark-slate);
    background-color: #ffffff;
}

/* Ajustement du logo dans la Navbar */
.navbar-brand img {
    height: 55px;
    width: auto;
    object-fit: contain;
}

/* VRAI SLIDER HERO CONTENEUR */
.hero-slider-container {
    position: relative;
    height: 80vh;
    overflow: hidden;
}

/* Chaque slide occupe 80% de la hauteur de l'écran */
.carousel-item {
    height: 80vh;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* Superposition sombre sur les images pour garantir le contraste du texte */
.carousel-item::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 23, 42, 0.5);
    z-index: 1;
}

/* Forcer le contenu à passer au-dessus du filtre sombre */
.hero-slider-container .container {
    position: relative;
    z-index: 2;
}

/* MOTEUR DE RECHERCHE TRANSLUCIDE (GLASSMORPHISM) */
.search-box {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 16px;
    padding: 30px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
    color: #ffffff;
}

.search-box .form-label {
    color: rgba(255, 255, 255, 0.9);
}

.search-box .form-control {
    background: rgba(255, 255, 255, 0.9);
    border: none;
    color: var(--dark-slate);
}

.search-box .form-control::placeholder {
    color: #64748b;
}

/* Section TRIBU */
.tribu-badge {
    background-color: var(--va-terracotta);
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 1px;
}

.badge-concept-tribu {
    background-color: rgba(194, 89, 31, 0.12) !important;
    color: var(--va-terracotta) !important;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.badge-concept-carrieres {
    background-color: rgba(14, 165, 233, 0.12) !important;
    color: var(--va-blue) !important;
    font-weight: 700;
    letter-spacing: 0.5px;
}

/* Card Customization */
.destination-card {
    border: none;
    border-radius: 15px;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.destination-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.08);
}

/* Boutons */
.btn-va-blue {
    background-color: var(--va-blue);
    color: white;
    border: none;
}
.btn-va-blue:hover {
    background-color: #0284c7;
    color: white;
}

.btn-va-terracotta {
    background-color: var(--va-terracotta);
    color: white;
    border: none;
}
.btn-va-terracotta:hover {
    background-color: #a34716;
    color: white;
}

.text-va-blue {
    color: var(--va-blue) !important;
}

/* Boutons spécifiques header (Ajouté) */
.btn-custom-green {
    background-color: var(--algeria-green);
    color: white;
}
.btn-custom-green:hover {
    background-color: #004d26;
    color: white;
}

/* ENCARD PUBLICITAIRE SYSTÈME */
.ad-space-container {
    background-color: #f1f5f9;
    border: 2px dashed #cbd5e1;
    border-radius: 12px;
    min-height: 250px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    transition: background-color 0.3s ease;
}
.ad-space-container:hover {
    background-color: #e2e8f0;
}

/* Ruban Bêta (Ajouté) */
.beta-ribbon-fixed-left {
    position: fixed;
    top: 0;
    left: 0;
    width: 180px;
    height: 180px;
    overflow: hidden;
    z-index: 99999;
    pointer-events: none;
}

.beta-ribbon-text-left {
    font-family: 'Arial', sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: #ffffff;
    text-transform: uppercase;
    background: #d9534f;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 36px;
    position: absolute;
    top: 45px;
    left: -50px;
    width: 260px;
    transform: rotate(-45deg);
    box-shadow: 0 3px 10px rgba(0,0,0,0.3);
}