/* ============================================================
   Styles spécifiques à gite_detail.php
   ============================================================ */

/* =====================================================
   GITE DETAIL PAGE — Premium Redesign
   Palette: navy #1a3a5c | blue #2e6da4 | amber #e8922a
   Background: warm linen #faf8f5
   ===================================================== */

/* ===== CSS VARIABLES (local overrides) ===== */
:root {
    --gd-primary: #1a3a5c;
    --gd-primary-mid: #2e6da4;
    --gd-accent: #e8922a;
    --gd-bg-warm: #faf8f5;
    --gd-text-dark: #1a2535;
    --gd-text-muted: #64748b;
    --gd-hero-overlay: linear-gradient(to top, rgba(10,20,40,0.82) 0%, rgba(10,20,40,0.25) 65%, transparent 100%);
    --gd-green: #16a34a;
    --gd-green-hover: #15803d;
    --gd-border: #e2e8ef;
    --gd-radius: 14px;
}

/* ===== HERO — Full viewport width ===== */
.gite-hero {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #0a1428;
}

/* Gallery: full width, 520px tall, no border-radius, no container */
.gite-hero .gallery-airbnb {
    display: grid;
    gap: 4px;
    border-radius: 0;
    overflow: hidden;
    height: 520px;
    box-shadow: none;
    width: 100%;
}

.gite-hero .gallery-airbnb.gallery-one {
    grid-template-columns: 1fr;
}

.gite-hero .gallery-airbnb.gallery-few,
.gite-hero .gallery-airbnb.gallery-full {
    grid-template-columns: 3fr 2fr;
}

.gallery-main {
    overflow: hidden;
    height: 100%;
}

.gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;
    display: block;
    transition: transform 0.4s ease;
}
.gallery-main:hover img { transform: scale(1.06); }

.gallery-secondary {
    display: grid;
    gap: 4px;
    overflow: hidden;
    height: 520px; /* doit correspondre à .gallery-airbnb height */
    min-height: 0;
}

/* 1 photo secondaire */
.gallery-secondary.gsec-1 {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
}

/* 2 photos : 2 lignes égales */
.gallery-secondary.gsec-2 {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
}

/* 3 photos : 1 en haut, 2 en bas */
.gallery-secondary.gsec-3 {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
}
.gallery-secondary.gsec-3 .gallery-sub:first-child {
    grid-column: span 2;
}

/* 4 photos : 2×2 égal */
.gallery-secondary.gsec-4 {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
}

.gallery-sub {
    overflow: hidden;
    position: relative;
    min-height: 0;
}

.gallery-sub img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
    cursor: pointer;
    display: block;
}
.gallery-sub:hover img { transform: scale(1.06); }

.gallery-more-overlay {
    position: absolute;
    inset: 0;
    background: rgba(10,20,40,0.52);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    backdrop-filter: blur(3px);
    transition: background 0.2s;
    letter-spacing: 0.3px;
}
.gallery-more-overlay:hover { background: rgba(10,20,40,0.7); }


/* Hero overlay — dark gradient at bottom with title */
.gite-hero-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--gd-hero-overlay);
    padding: 60px 0 32px;
    z-index: 10;
    pointer-events: none;
}
.gite-hero-overlay a,
.gite-hero-overlay button {
    pointer-events: auto;
}

.gite-breadcrumb {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    color: rgba(255,255,255,0.65);
    margin-bottom: 10px;
}
.gite-breadcrumb a {
    color: rgba(255,255,255,0.75);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s;
}
.gite-breadcrumb a:hover { color: white; }
.gite-breadcrumb svg { opacity: 0.5; }

.gite-main-title {
    font-size: 2.8rem;
    font-weight: 800;
    color: white;
    margin: 0 0 12px;
    line-height: 1.1;
    letter-spacing: -0.5px;
    text-shadow: 0 2px 16px rgba(0,0,0,0.4);
}

.gite-meta-bar {
    display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: wrap;
}

.gite-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13.5px;
    color: rgba(255,255,255,0.88);
    font-weight: 500;
}
.gite-meta-item + .gite-meta-item::before {
    content: '·';
    margin: 0 8px;
    color: rgba(255,255,255,0.4);
    font-size: 16px;
}
.gite-meta-item svg { opacity: 0.8; }

/* ===== INFO STRIP below hero ===== */
.gite-info-strip {
    background: white;
    border-bottom: 1px solid var(--gd-border);
    box-shadow: 0 2px 12px rgba(26,58,92,0.07);
}
.gite-info-strip-inner {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0;
    overflow: hidden;
    border-radius: 0;
}
.info-strip-item {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 24px;
    border-right: 1px solid var(--gd-border);
    transition: background 0.15s;
}
.info-strip-item:last-child { border-right: none; }
.info-strip-item:hover { background: #f5f8fd; }
.info-strip-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, #eef4fc, #ddeaf7);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--gd-primary-mid);
}
.info-strip-label {
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--gd-text-muted);
    margin-bottom: 2px;
}
.info-strip-value {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--gd-text-dark);
}

/* ===== MAIN SECTION ===== */
.section.gite-section {
    background: var(--gd-bg-warm) !important;
}

.gite-detail-content {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 44px;
    margin-bottom: 30px;
    padding-top: 0;
    align-items: start;
}

/* ===== LEFT COLUMN ===== */
.gite-detail-description {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Section heading style */
.gd-section-heading {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--gd-primary);
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid #e8eef5;
    display: flex;
    align-items: center;
    gap: 10px;
    letter-spacing: -0.2px;
}
.gd-section-heading::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 22px;
    background: linear-gradient(to bottom, var(--gd-accent), #c86d10);
    border-radius: 3px;
    flex-shrink: 0;
}

/* Description box */
.description-box {
    background: white;
    border: 1px solid var(--gd-border);
    border-radius: var(--gd-radius);
    padding: 28px 30px;
    margin-bottom: 28px;
    box-shadow: 0 1px 6px rgba(26,58,92,0.05);
}
.description-box h4 {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--gd-primary);
    margin: 0 0 14px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e8eef5;
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: -0.2px;
}
.description-box h4::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 20px;
    background: linear-gradient(to bottom, var(--gd-accent), #c86d10);
    border-radius: 3px;
    flex-shrink: 0;
}
.description-box p {
    color: #374151;
    line-height: 1.9;
    font-size: 0.97rem;
    margin: 0;
}

/* Amenities / features */
/* ===== ÉQUIPEMENTS ===== */
.features-block {
    margin-bottom: 32px;
    background: white;
    border: 1.5px solid #e6d9c8;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 6px rgba(180,120,60,0.07);
}
.features-block-title {
    font-size: 1rem;
    font-weight: 700;
    color: #7a4f20;
    padding: 20px 24px 18px;
    border-bottom: 1.5px solid #eddfc8;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fdf6ec;
}
.features-block-title svg { color: var(--gd-accent); }

.amenity-categories {
    padding: 0;
}
.amenity-category {
    border-bottom: 1px solid #f0f4f8;
}
.amenity-category:last-child { border-bottom: none; }

.amenity-cat-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 24px 10px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--gd-text-muted);
}
.amenity-cat-header svg { color: var(--gd-accent); flex-shrink: 0; }

.amenity-category ul {
    list-style: none;
    padding: 0 24px 16px;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 6px 20px;
}
.amenity-category li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--gd-text-dark);
    padding: 5px 0;
}
.amenity-category li svg {
    width: 18px;
    height: 18px;
    color: var(--gd-primary-mid);
    flex-shrink: 0;
    background: #eef4fc;
    border-radius: 6px;
    padding: 3px;
    box-sizing: content-box;
}

/* legacy */
.features-list { display: none; }
.feature-chip { display: none; }

/* Info cards strip (inside left column) */
.info-cards {
    display: none; /* hidden — replaced by hero overlay + info strip */
}

/* Tarifs section */
.tarifs-section {
    margin-top: 0;
    margin-bottom: 28px;
    background: white;
    border: 1.5px solid #c8e1ed;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 6px rgba(32,101,122,0.07);
}
.tarifs-section h4 {
    font-size: 1rem;
    font-weight: 700;
    color: #20657a;
    margin: 0;
    padding: 20px 24px 18px;
    border-bottom: 1.5px solid #c8e1ed;
    display: flex;
    align-items: center;
    gap: 10px;
    background: #ecf7fd;
}
.tarifs-section h4 svg { color: #20657a; }
.tarifs-section-body {
    padding: 20px 24px;
}
.tarifs-section h5 {
    font-size: 0.9rem;
    font-weight: 600;
    color: #20657a;
    margin: 20px 0 10px;
}
.tarifs-base-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;
    margin-bottom: 8px;
}
.tarif-base-item {
    background: #ecf7fd;
    border: 1px solid #c8e1ed;
    border-radius: 8px;
    padding: 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.tarif-label { font-size: 0.8rem; color: #20657a; }
.tarif-value { font-size: 1rem; font-weight: 700; color: #20657a; }

.tarifs-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.88rem;
    border-radius: 12px;
    overflow: hidden;
}
.tarifs-table th {
    padding: 11px 16px;
    text-align: left;
    font-weight: 700;
    color: #20657a;
    border-bottom: 1.5px solid #c8e1ed;
    font-size: 0.84rem;
    letter-spacing: 0.2px;
}
.tarifs-table td {
    padding: 10px 16px;
    border-bottom: 1px solid #daeef7;
    color: var(--gd-text-dark);
}
.tarifs-table tbody tr:hover td { background: #ecf7fd; }
.tarifs-matrix .tarif-date-only td { border-bottom: none; color: var(--gd-text-muted); font-size: 0.83rem; }
.tarifs-matrix .tarif-type-header:hover td { background: #daeef745; }.tarifs-table tr:last-child td { border-bottom: none; }
.tarifs-table small { color: #4a8fa3; }
.tarifs-table td.tarif-vide {
    padding-left: 35px;
    color: #cbd5e0;
    font-size: 0.75em;
}
.tarifs-matrix .tarif-type-header td {
    background: #daeef745;
    font-weight: 700;
    color: #20657a;
    font-size: 0.84rem;
    padding: 10px 16px;
    border-bottom: 1px solid #c8e1ed;
}
.tarifs-matrix .tarif-type-header td:first-child {
    border-left: 3px solid #20657a;
}
.tarifs-matrix .tarif-base-row td {
    background: #20657a;
    color: #ffffff;
    font-weight: 700;
    font-size: 0.95rem;
    padding: 12px 16px;
    border-bottom: 2px solid #20657a;
}
.tarifs-matrix .tarif-base-row:hover td { background: #1a5268; }
.tarifs-matrix .tarif-period-dates {
    color: var(--gd-text-muted);
    font-size: 0.83rem;
    text-align: left !important;
}
.tarif-promo {
    margin: 0;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(220,80,30,0.18);
    border: none;
    padding: 0;
    background: none;
}
.tarif-promo-inner {
    background: linear-gradient(135deg, #ff6b35 0%, #e8431a 50%, #c73010 100%);
    padding: 18px 22px;
    display: flex;
    align-items: center;
    gap: 16px;
    position: relative;
    overflow: hidden;
}
.tarif-promo-inner::before {
    content: '';
    position: absolute;
    top: -20px; right: -20px;
    width: 100px; height: 100px;
    background: rgba(255,255,255,0.08);
    border-radius: 50%;
}
.tarif-promo-inner::after {
    content: '';
    position: absolute;
    bottom: -30px; right: 40px;
    width: 140px; height: 140px;
    background: rgba(255,255,255,0.05);
    border-radius: 50%;
}
.tarif-promo-badge {
    background: white;
    color: #c73010;
    font-size: 1.5rem;
    font-weight: 900;
    border-radius: 10px;
    padding: 8px 14px;
    line-height: 1;
    flex-shrink: 0;
    letter-spacing: -1px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    z-index: 1;
}
.tarif-promo-badge span {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0;
    display: block;
    text-align: center;
    margin-top: 1px;
}
.tarif-promo-text {
    z-index: 1;
}
.tarif-promo-text strong {
    display: inline;
    color: white;
    font-size: 1rem;
    font-weight: 800;
    margin-right: 6px;
}
.tarif-promo-text p {
    display: inline;
    color: rgba(255,255,255,0.88);
    font-size: 0.85rem;
    margin: 0;
    line-height: 1.4;
}
.tarif-promo-pill {
    position: absolute;
    top: 14px;
    right: 18px;
    z-index: 2;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.35);
    color: white;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    padding: 4px 10px;
    border-radius: 20px;
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    gap: 5px;
}
.tarif-promo-pill::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    opacity: 0.9;
    animation: promo-pulse 1.8s ease-in-out infinite;
}
@keyframes promo-pulse {
    0%, 100% { opacity: 0.9; transform: scale(1); }
    50%       { opacity: 0.4; transform: scale(0.7); }
}

del.tarif-prix-normal { color: #a0aec0; font-size: 0.88em; font-weight: normal; }
.tarif-promo-price { display: block; color: #dc2626; font-weight: 700; line-height: 1.4; }
.tarif-promo-pct {
    display: inline-block;
    background: #dc2626;
    color: white;
    font-size: 0.7em;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 4px;
    margin-left: 3px;
    vertical-align: middle;
}

/* ===== LIGHTBOX ===== */
.gite-lightbox {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.92);
    z-index: 10000;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.gite-lightbox.active { display: flex; }
.gite-lightbox-content {
    max-width: 90%;
    max-height: 82vh;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.6);
}
.gite-lightbox-close {
    position: absolute;
    top: 20px; right: 28px;
    font-size: 38px;
    color: rgba(255,255,255,0.85);
    cursor: pointer;
    background: none;
    border: none;
    z-index: 10001;
    line-height: 1;
    transition: color 0.2s;
}
.gite-lightbox-close:hover { color: white; }
.gite-lightbox-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 36px;
    color: rgba(255,255,255,0.75);
    cursor: pointer;
    background: rgba(255,255,255,0.1);
    border: none;
    padding: 16px 20px;
    z-index: 10001;
    border-radius: 8px;
    backdrop-filter: blur(4px);
    transition: all 0.2s;
}
.gite-lightbox-nav:hover { color: white; background: rgba(255,255,255,0.2); }
.gite-lightbox-prev { left: 20px; }
.gite-lightbox-next { right: 20px; }

/* ===== SIDEBAR ===== */
.gite-detail-sidebar {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: static;
}

/* ===== BOOKING CARD (premium) ===== */
.booking-card {
    background: white;
    border: 1.5px solid var(--gd-border);
    border-radius: 20px;
    padding: 0;
    box-shadow: 0 8px 40px rgba(26,58,92,0.14), 0 2px 8px rgba(0,0,0,0.05);
    position: relative;
    overflow: hidden;
}
.booking-card-header {
    background: linear-gradient(135deg, var(--gd-accent) 0%, #d07520 100%);
    padding: 16px 24px;
    border-radius: 20px 20px 0 0;
}
.booking-card-header-label {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: rgba(255,255,255,0.8);
    margin-bottom: 2px;
}
.booking-card-header-text {
    font-size: 13px;
    font-weight: 600;
    color: white;
}
.booking-card-body {
    padding: 22px 24px;
}
.booking-card-price {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid #f0f4f8;
}
.booking-price-main {
    font-size: 2rem;
    font-weight: 900;
    color: var(--gd-text-dark);
    letter-spacing: -1.5px;
    line-height: 1;
}
.booking-price-unit {
    font-size: 14px;
    color: var(--gd-text-muted);
    font-weight: 500;
}

/* CTA Button — green */
.booking-cta-btn {
    display: block;
    width: 100%;
    padding: 16px;
    background: var(--gd-green);
    color: white;
    border: none;
    border-radius: var(--gd-radius);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    transition: all 0.2s;
    box-shadow: 0 4px 18px rgba(22,163,74,0.3);
    margin-bottom: 10px;
    box-sizing: border-box;
    letter-spacing: 0.2px;
}
.booking-cta-btn:hover:not(:disabled) {
    background: var(--gd-green-hover);
    color: white;
}
.booking-cta-btn:disabled {
    background: #e2e8f0;
    color: #94a3b8;
    box-shadow: none;
    cursor: not-allowed;
    transform: none;
}

.booking-cta-secondary {
    background: white !important;
    color: var(--gd-primary-mid) !important;
    border: 2px solid var(--gd-primary-mid) !important;
    box-shadow: none !important;
}
.booking-cta-secondary:hover:not(:disabled) {
    background: #eef4fc !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 3px 10px rgba(46,109,164,0.12) !important;
}

.booking-hint {
    font-size: 11.5px;
    color: var(--gd-text-muted);
    text-align: center;
    margin: 0 0 16px;
    line-height: 1.5;
}

.booking-features {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding-top: 16px;
    border-top: 1px solid #f0f4f8;
}
.booking-feature-item {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 12.5px;
    color: #475569;
    font-weight: 500;
}
.booking-feature-item svg {
    color: var(--gd-green);
    flex-shrink: 0;
}

.booking-calc {
    background: #f5f8fc;
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 13px;
    color: #475569;
    margin-bottom: 12px;
    line-height: 1.8;
    border: 1px solid #e8eef5;
}

/* Reservation info display */
.reservation-info {
    padding: 0;
    margin-top: 0;
    margin-bottom: 14px;
}
.reservation-info .reservation-dates { margin-bottom: 12px; }
.reservation-info .reservation-values {
    font-size: 0.9rem;
    color: var(--gd-text-dark);
    line-height: 1.6;
    font-weight: 500;
}

/* ===== LOCATION CARD ===== */
.gite-detail-card {
    background: white;
    padding: 22px;
    border-radius: 16px;
    box-shadow: 0 2px 16px rgba(26,58,92,0.08);
    border: 1.5px solid var(--gd-border);
}
.gite-detail-card p,
.gite-detail-card > a.btn-reservation,
.gite-detail-card .reservation-info {
    margin-bottom: 16px;
}
.gite-detail-card > a.btn-reservation:last-child { margin-bottom: 0; }
.gite-detail-card h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--gd-primary);
    margin: 0 0 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.gite-detail-card h3 svg { color: var(--gd-primary-mid); }

/* ===== CALENDAR ===== */
.calendar-detail {
    background: white;
    padding: 22px;
    border-radius: 16px;
    box-shadow: 0 2px 16px rgba(26,58,92,0.08);
    border: 1.5px solid var(--gd-border);
}
.calendar-detail-header {
    margin-bottom: 20px;
    position: relative;
}
.calendar-detail-header .month-display {
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 8px;
    transition: background 0.2s ease;
    display: inline-block;
    font-weight: 700;
    color: var(--gd-primary);
}
.calendar-detail-header .month-display:hover { background: #eef4fc; }
.calendar-detail-header h3 {
    color: var(--gd-primary);
    margin: 0 0 20px;
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}
.calendar-detail-header h3 svg { color: var(--gd-primary-mid); }

.calendar-nav {
    display: flex;
    gap: 10px;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.calendar-nav span { font-weight: 700; flex: 1; text-align: center; color: var(--gd-primary); }
.calendar-nav button {
    background: transparent !important;
    color: var(--gd-primary-mid) !important;
    border: none;
    padding: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    outline: none;
    opacity: 1 !important;
    border-radius: 8px;
    transition: background 0.15s;
}
.calendar-nav button:hover:not(:disabled) { background: #eef4fc !important; }
.calendar-nav button:focus, .calendar-nav button:active {
    background: transparent !important;
    color: var(--gd-primary-mid) !important;
    outline: none;
    opacity: 1 !important;
}
.calendar-nav button svg { fill: var(--gd-primary-mid) !important; pointer-events: none; }
.calendar-nav button:disabled { color: #ccc !important; cursor: not-allowed; opacity: 0.4 !important; }
.calendar-nav button:disabled svg { fill: #ccc !important; }

.calendar-detail-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.calendar-detail-days-header { display: contents; }
.calendar-detail-day-name {
    text-align: center;
    font-weight: 700;
    font-size: 0.78rem;
    color: var(--gd-text-muted);
    padding: 8px 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.calendar-detail-days { display: contents; }
.calendar-detail-day {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 0.85rem;
    font-weight: 500;
    position: relative;
    cursor: default;
    transition: all 0.15s;
}
.calendar-detail-day.prev-month,
.calendar-detail-day.next-month { color: #d1d5db; background: transparent; }
.calendar-detail-day.available {
    background: #dcfce7;
    color: #15803d;
    font-weight: 600;
    cursor: pointer;
}
.calendar-detail-day.available:hover {
    background: #16a34a;
    color: white;
    transform: scale(1.1);
    box-shadow: 0 2px 8px rgba(22,163,74,0.3);
}
.calendar-detail-day.reserved { background: #fee2e252; color: #991b1b; box-shadow: inset 0 0 0 2px #fca5a526; }
.calendar-detail-day.blocked { background: #fef9c3; color: #854d0e; box-shadow: inset 0 0 0 2px #fbf394cc; }
.calendar-detail-day.past { background: transparent; color: #d1d5db; }
.calendar-detail-day.today { font-weight: 800; box-shadow: inset 0 0 0 2px #b3e9bf; }
.calendar-detail-day.reserved.today { box-shadow: inset 0 0 0 2px #fca5a526; }

/* Date selection */
.calendar-detail-day.selected { background: #22c55e !important; color: white !important; font-weight: 700; }
.calendar-detail-day.selected.start,
.calendar-detail-day.selected.end { background: #63c0d5 !important; color: white !important; box-shadow: inset 0 0 0 2px #ffffff; }
.calendar-detail-day.selected.range { background: #63c0d5 !important; color: #ffffff !important; box-shadow: inset 0 0 0 2px #ffffff; }

/* Hover preview (avant sélection de la date de fin) */
.calendar-detail-day.hover-range { background: #b2e8ef !important; color: #0e7490 !important; }
.calendar-detail-day.hover-end { background: #63c0d5 !important; color: white !important; font-weight: 700; }

.availability-legend {
    display: flex;
    gap: 16px;
    margin-top: 16px;
    flex-wrap: wrap;
    justify-content: center;
}
.legend-item { display: flex; align-items: center; gap: 6px; font-size: 0.82rem; color: var(--gd-text-muted); }
.legend-color { width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0; }
.legend-color.available { background: #dcfce7; }
.legend-color.reserved { background: #fee2e252; box-shadow: inset 0 0 0 2px #fca5a526; }
.legend-color.blocked { background: #fef9c3; box-shadow: inset 0 0 0 2px #fbf394cc; }

/* ===== MONTH/YEAR PICKER ===== */
.month-year-picker {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: white;
    border-radius: 14px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.18);
    z-index: 1000;
    padding: 20px;
    min-width: 300px;
    border: 1.5px solid var(--gd-border);
}
.month-year-picker.active { display: block; }
.month-year-picker-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--gd-border);
}
.month-year-picker-header h4 { margin: 0; color: var(--gd-primary); font-size: 1.05rem; }
.month-year-picker-close {
    background: none; border: none;
    font-size: 20px; cursor: pointer;
    color: #999; padding: 0;
    width: 24px; height: 24px;
    display: flex; align-items: center; justify-content: center;
}
.month-year-picker-close:hover { color: #ef4444; }
.month-year-picker-body { display: flex; gap: 15px; }
.month-year-picker-group { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.month-year-picker-group label { font-size: 0.85rem; font-weight: 600; color: #666; }
.month-year-picker-group input, .month-year-picker-group select {
    padding: 8px 12px;
    border: 1.5px solid var(--gd-border);
    border-radius: 8px;
    font-size: 0.95rem;
    background: white;
    cursor: pointer;
    width: 100%;
}
.month-year-picker-group input:focus, .month-year-picker-group select:focus {
    outline: none; border-color: var(--gd-primary-mid);
}
.month-year-picker-actions {
    display: flex; gap: 10px;
    margin-top: 15px; padding-top: 15px;
    border-top: 1px solid var(--gd-border);
}
.month-year-picker-actions button {
    flex: 1; padding: 10px;
    border-radius: 8px;
    font-size: 0.9rem; font-weight: 600;
    cursor: pointer; border: none;
}
.month-year-picker-actions .btn-cancel { background: #f0f0f0; color: #666; }
.month-year-picker-actions .btn-confirm {
    background: var(--gd-primary);
    color: white;
}
.month-year-picker-actions .btn-confirm:hover { background: var(--gd-primary-mid); }

/* ===== MODALS ===== */
.reservation-modal {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.55);
    z-index: 10000;
    align-items: center;
    justify-content: center;
}
.reservation-modal.active { display: flex; }
.reservation-modal-content {
    background: white;
    border-radius: 18px;
    max-width: 600px;
    width: 90%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
}
.reservation-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid var(--gd-border);
}
.reservation-modal-header h2 { margin: 0; color: var(--gd-primary); font-size: 1.1rem; }
.modal-close {
    background: none; border: none;
    font-size: 26px; cursor: pointer;
    color: #999; padding: 0;
    width: 30px; height: 30px;
    display: flex; align-items: center; justify-content: center;
}
.modal-close:hover { color: #ef4444; }
.reservation-modal-form { padding: 20px 24px; }
.reservation-modal-form .form-section { margin-bottom: 22px; }
.reservation-modal-form .form-section h3 {
    color: var(--gd-primary); margin: 0 0 14px;
    font-size: 1rem; border-bottom: 1.5px solid var(--gd-border);
    padding-bottom: 10px;
}
.reservation-summary {
    background: #f5f8fc;
    padding: 14px;
    border-radius: 10px;
    border: 1px solid var(--gd-border);
}
.reservation-summary p { margin: 6px 0; font-size: 0.9rem; color: var(--gd-text-dark); }
.reservation-modal-form .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 14px;
}
.reservation-modal-form .form-group { margin-bottom: 14px; }
.reservation-modal-form .form-group label {
    display: block; margin-bottom: 5px;
    font-weight: 600; font-size: 0.87rem;
    color: var(--gd-text-dark);
}
.reservation-modal-form .form-group input,
.reservation-modal-form .form-group textarea {
    width: 100%; padding: 10px 12px;
    border: 1.5px solid var(--gd-border);
    border-radius: 8px;
    font-size: 14px;
    transition: border-color 0.2s;
    box-sizing: border-box;
}
.reservation-modal-form .form-group input:focus,
.reservation-modal-form .form-group textarea:focus {
    outline: none; border-color: var(--gd-primary-mid);
    box-shadow: 0 0 0 3px rgba(46,109,164,0.1);
}
.reservation-modal-form .form-actions {
    display: flex; gap: 10px;
    justify-content: flex-end; margin-top: 18px;
}
.btn-cancel-modal,
.btn-submit-reservation {
    padding: 11px 24px;
    border-radius: 8px;
    font-size: 14px; font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}
.btn-cancel-modal { background: #f0f0f0; border: 1px solid #ddd; color: #666; }
.btn-cancel-modal:hover { background: #e0e0e0; }
.btn-submit-reservation {
    background: var(--gd-green);
    border: none; color: white;
    box-shadow: 0 3px 12px rgba(22,163,74,0.25);
}
.btn-submit-reservation:hover {
    background: var(--gd-green-hover);
    transform: translateY(-1px);
    box-shadow: 0 5px 16px rgba(22,163,74,0.35);
}

.reservation-success { padding: 40px 20px; text-align: center; }
.reservation-success .success-icon { font-size: 60px; margin-bottom: 20px; }
.reservation-success h3 { color: var(--gd-green); margin-bottom: 15px; }
.btn-close-success {
    margin-top: 20px; padding: 12px 30px;
    background: var(--gd-primary); color: white;
    border: none; border-radius: 10px;
    cursor: pointer; font-size: 14px; font-weight: 600;
}

/* Alert modal */
.custom-alert-modal {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 10001;
    align-items: center;
    justify-content: center;
}
.custom-alert-modal.active { display: flex; }
.custom-alert-content {
    background: white;
    border-radius: 16px;
    max-width: 400px;
    width: 90%;
    padding: 32px 24px;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
}
.custom-alert-icon { font-size: 48px; margin-bottom: 14px; }
.custom-alert-content h3 { margin-bottom: 12px; color: var(--gd-text-dark); }
.custom-alert-message { color: var(--gd-text-muted); margin-bottom: 24px; line-height: 1.6; font-size: 0.92rem; }
.btn-alert-close {
    padding: 11px 28px;
    background: var(--gd-primary); color: white;
    border: none; border-radius: 10px;
    cursor: pointer; font-size: 14px; font-weight: 600;
}
.btn-alert-close:hover { background: var(--gd-primary-mid); }

/* ===== Btn reservation legacy ===== */
.reservation-info .btn-reservation,
.gite-detail-card > a.btn-reservation {
    display: block;
    width: 100%;
    padding: 16px;
    background: var(--gd-green) !important;
    color: white !important;
    text-align: center;
    text-decoration: none;
    border-radius: var(--gd-radius);
    font-size: 15px;
    font-weight: 700;
    border: none !important;
    cursor: pointer;
    box-shadow: 0 4px 18px rgba(22,163,74,0.3) !important;
    transition: all 0.2s !important;
    font-family: inherit;
    line-height: normal;
    box-sizing: border-box;
}
.reservation-info .btn-reservation:hover:not(:disabled),
.gite-detail-card > a.btn-reservation:hover {
    background: var(--gd-green-hover) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(22,163,74,0.4) !important;
    color: white !important;
}
.reservation-info .btn-reservation:disabled {
    background: #e2e8f0 !important;
    color: #94a3b8 !important;
    cursor: not-allowed;
    transform: none;
    box-shadow: none !important;
}

/* ===== Section title utility (gite detail content only) ===== */
.gite-section .section-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--gd-primary);
    margin: 0 0 20px;
    padding-bottom: 14px;
    border-bottom: 2px solid #e8eef5;
    display: flex;
    align-items: center;
    gap: 10px;
}
.gite-section .section-title svg { color: var(--gd-primary-mid); }

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
    .gite-detail-content { grid-template-columns: 1fr; }
    .gite-detail-sidebar { position: static; }
}

@media (max-width: 768px) {
    .gite-hero .gallery-airbnb { height: 300px; }
    .gite-hero .gallery-airbnb.gallery-few,
    .gite-hero .gallery-airbnb.gallery-full { grid-template-columns: 1fr; }
    .gallery-secondary { display: none; }
    .gite-main-title { font-size: 1.7rem; letter-spacing: 0; }
    .gite-info-strip-inner { flex-wrap: wrap; }
    .info-strip-item { flex: 0 0 50%; border-bottom: 1px solid var(--gd-border); }
    .info-strip-item:nth-child(odd) { border-right: 1px solid var(--gd-border); }
    .info-strip-item:nth-child(even) { border-right: none; }
    .features-list { grid-template-columns: repeat(2, 1fr); }
    .booking-price-main { font-size: 2rem; }
    .reservation-modal-form .form-row { grid-template-columns: 1fr; }
    .gite-detail-content { padding-top: 28px; }
}

@media (max-width: 480px) {
    .features-list { grid-template-columns: 1fr; }
    .gite-main-title { font-size: 1.4rem; }
    .info-strip-item { flex: 0 0 100%; border-right: none !important; }
}