/**
 * Styles du shortcode [ludo_status]
 * Badges statut d'ouverture + evenements a venir + info samedi
 *
 * Valeurs alignées avec le site prod (divi-child-ludo/custom.css)
 * + clamp() pour fluidité responsive.
 */

/* Override des variables typographiques pour conserver des tailles compactes
   (le badge statut doit rester discret) */
.ludo-status-wrapper,
.ludo-status-badge,
.ludo-open-badge,
.ludo-event-badges,
.ludo-event-badge,
.ludo-saturday-info {
    --ludo-font-xs: clamp(11px, calc(10px + 0.15vw), 12px);
    --ludo-font-sm: clamp(12px, calc(11px + 0.2vw), 14px);
    --ludo-font-base: clamp(13px, calc(12px + 0.15vw), 14px);
}

/* Badge statut ouverture - style uniforme orange */
.ludo-status-badge,
.ludo-open-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: clamp(6px, 0.8vw, 10px) !important;
    padding: clamp(8px, 1vw, 12px) clamp(16px, 2vw, 24px) !important;
    border-radius: 50px !important;
    margin-bottom: 0 !important;
    font-size: var(--ludo-font-sm, clamp(12px, calc(11px + 0.2vw), 14px)) !important;
    font-weight: 500 !important;
    background: rgba(245, 156, 0, 0.08) !important;
    border: 2px solid rgba(245, 156, 0, 0.25) !important;
    color: #e89a3c !important;
}

.ludo-status-icon {
    font-size: clamp(20px, calc(18px + 0.7vw), 28px) !important;
    line-height: 1 !important;
}

/* Couleurs des icônes selon le statut */
.ludo-status-open .ludo-status-icon {
    color: #22c55e !important; /* Vert */
}

.ludo-status-closing-soon .ludo-status-icon {
    color: #f59c00 !important; /* Orange */
}

.ludo-status-opens-later .ludo-status-icon {
    color: #9ca3af !important; /* Gris */
}

.ludo-status-closed .ludo-status-icon {
    color: #ef4444 !important; /* Rouge */
}

/* Statut Click & Collect (lundi) */
.ludo-status-click-collect {
    background: rgba(59, 130, 246, 0.08) !important;
    border-color: rgba(59, 130, 246, 0.25) !important;
    color: #3b82f6 !important;
}

.ludo-status-click-collect .ludo-status-icon {
    color: #3b82f6 !important; /* Bleu */
}

/* Badge status cliquable */
a.ludo-status-badge {
    text-decoration: none !important;
    cursor: pointer !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease !important;
    color: #e89a3c !important;
}

a.ludo-status-badge:hover,
a.ludo-status-badge:focus {
    transform: scale(1.05) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    text-decoration: none !important;
    color: #f5b46a !important;
    background: rgba(245, 156, 0, 0.14) !important;
}

/* Wrapper du badge + info samedi */
.ludo-status-wrapper {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: clamp(6px, 0.8vw, 8px) !important;
    margin-bottom: clamp(16px, 2vw, 25px) !important;
}

/* Info samedi sous le badge */
.ludo-saturday-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin: 0 !important;
    padding-left: 5px !important;
    font-size: clamp(11px, calc(10px + 0.2vw), 13px) !important;
    line-height: 1.4 !important;
}

.ludo-saturday-open {
    color: #22c55e !important;
    font-weight: 500 !important;
}

.ludo-saturday-closed {
    color: #ef4444 !important;
    font-weight: 500 !important;
}

.ludo-saturday-note {
    color: #9ca3af !important;
    font-size: clamp(10px, calc(9px + 0.15vw), 11px) !important;
    font-style: italic !important;
}

.ludo-saturday-note sup {
    font-size: clamp(8px, 0.7vw, 9px) !important;
}

/* ==========================================================================
   Badges evenements (animations a venir)
   ========================================================================== */

.ludo-event-badges {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: clamp(8px, 1vw, 12px) !important;
    margin-top: 4px !important;
    margin-bottom: 6px !important;
}

.ludo-event-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: clamp(6px, 0.8vw, 10px) !important;
    padding: clamp(8px, 1vw, 10px) clamp(14px, 1.6vw, 20px) !important;
    background: linear-gradient(135deg, #E36C1D 0%, #F5A050 100%) !important;
    color: #ffffff !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    font-size: var(--ludo-font-sm, clamp(12px, calc(11px + 0.2vw), 14px)) !important;
    font-weight: 500 !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
    box-shadow: 0 2px 8px rgba(227, 108, 29, 0.25) !important;
}

.ludo-event-badge:hover,
.ludo-event-badge:focus {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(227, 108, 29, 0.45) !important;
    background: linear-gradient(135deg, #F5A050 0%, #E36C1D 100%) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

.ludo-event-icon {
    font-size: clamp(14px, calc(13px + 0.3vw), 18px) !important;
    line-height: 1 !important;
}

.ludo-event-info {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    line-height: 1.2 !important;
}

.ludo-event-name {
    font-size: var(--ludo-font-sm, clamp(12px, calc(11px + 0.2vw), 14px)) !important;
    font-weight: 500 !important;
}

.ludo-event-date {
    font-size: clamp(10px, calc(9px + 0.15vw), 11px) !important;
    font-weight: 500 !important;
    opacity: 0.9 !important;
}

.ludo-event-hint {
    font-size: var(--ludo-font-xs, clamp(11px, calc(10px + 0.15vw), 12px)) !important;
    color: var(--global-palette6, #6b7280) !important;
    font-style: italic !important;
    margin: 8px 0 0 0 !important;
}