/* CDR77 Simulateur v2.0 — simulateur.css */

.cdr77-sim-wrap {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    font-size: 14px;
    color: #2c2c2a;
    max-width: 660px;
    margin: 0 auto;
}

.cdr77-sim-intro {
    font-size: 13px;
    color: #5f5e5a;
    margin-bottom: 18px;
    padding: 10px 14px;
    background: #f1efe8;
    border-radius: 6px;
    border-left: 3px solid #378ADD;
}

/* ── Champs ── */
.cdr77-sim-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 14px;
}
.cdr77-sim-field--date  { grid-column: 1; }
.cdr77-sim-field--challenge { grid-column: 2; }
.cdr77-sim-field--ville { grid-column: 1 / -1; }

@media (max-width: 520px) {
    .cdr77-sim-fields { grid-template-columns: 1fr; }
    .cdr77-sim-field--date,
    .cdr77-sim-field--challenge,
    .cdr77-sim-field--ville { grid-column: 1; }
}

.cdr77-sim-wrap label {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #5f5e5a;
    margin-bottom: 5px;
}
.cdr77-sim-wrap label .req { color: #a32d2d; }
.cdr77-sim-wrap label .opt { font-weight: 400; color: #b4b2a9; font-size: 11px; }

.cdr77-sim-wrap input[type="date"],
.cdr77-sim-wrap input[type="text"],
.cdr77-sim-wrap select {
    width: 100%;
    box-sizing: border-box;
    height: 38px;
    padding: 0 11px;
    border: 0.5px solid #b4b2a9;
    border-radius: 6px;
    font-size: 13px;
    color: #2c2c2a;
    background: #fff;
    transition: border-color .15s;
}
.cdr77-sim-wrap input:focus,
.cdr77-sim-wrap select:focus {
    outline: none;
    border-color: #378ADD;
    box-shadow: 0 0 0 2px rgba(55,138,221,.15);
}

/* ── Bouton ── */
.cdr77-sim-actions { margin-bottom: 16px; }

#cdr77-sim-btn {
    height: 40px;
    padding: 0 24px;
    background: #185fa5;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background .15s;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
#cdr77-sim-btn:hover    { background: #0c447c; }
#cdr77-sim-btn:disabled { background: #b4b2a9; cursor: not-allowed; }

#cdr77-sim-spinner {
    display: none;
    width: 13px; height: 13px;
    border: 2px solid rgba(255,255,255,.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: sim-spin .6s linear infinite;
}
@keyframes sim-spin { to { transform: rotate(360deg); } }

/* ── Messages ── */
#cdr77-sim-resultat { margin-bottom: 10px; }

.cdr77-sim-msg {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    font-size: 13px;
    line-height: 1.65;
    margin-bottom: 8px;
    border-left: 3px solid transparent;
    border-radius: 0 6px 6px 0;
}
.cdr77-sim-ico { font-size: 15px; flex-shrink: 0; margin-top: 1px; }

.cdr77-sim-libre  { background: #eaf3de; border-color: #3b6d11; color: #27500a; }
.cdr77-sim-bloque { background: #fcebeb; border-color: #a32d2d; color: #791f1f; }
.cdr77-sim-warn   { background: #faeeda; border-color: #854f0b; color: #633806; }

/* ── CTA ── */
.cdr77-sim-cta { margin: 10px 0 4px; }
.cdr77-sim-btn-andre {
    display: inline-block;
    height: 32px; line-height: 32px;
    padding: 0 14px;
    border: 0.5px solid #b4b2a9;
    border-radius: 6px;
    font-size: 12px; font-weight: 500;
    color: #444441;
    text-decoration: none;
    background: transparent;
    transition: background .15s, border-color .15s;
}
.cdr77-sim-btn-andre:hover {
    background: #f1efe8;
    border-color: #888780;
    color: #2c2c2a;
}

/* ── Alternatives ── */
#cdr77-sim-alternatives { margin: 16px 0; }
.cdr77-sim-alt-titre {
    font-size: 13px; font-weight: 600;
    color: #0c447c;
    margin-bottom: 8px;
}
.cdr77-sim-alt {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: #f1efe8;
    border: 0.5px solid #d3d1c7;
    border-radius: 6px;
    margin-bottom: 6px;
    cursor: pointer;
    transition: background .15s, border-color .15s;
    flex-wrap: wrap;
}
.cdr77-sim-alt:hover, .cdr77-sim-alt:focus {
    background: #e6f1fb;
    border-color: #378ADD;
    outline: none;
}
.cdr77-sim-alt-date { font-weight: 600; font-size: 13px; color: #0c447c; min-width: 90px; }
.cdr77-sim-alt-n    { font-size: 11px; color: #888780; flex: 1; }
.cdr77-sim-alt-cta  { font-size: 11px; font-weight: 500; color: #185fa5; white-space: nowrap; }

.cdr77-sim-alt-badge {
    display: inline-block;
    font-size: 10px; font-weight: 600;
    padding: 2px 7px; border-radius: 3px;
    white-space: nowrap;
}
.badge-libre  { background: #eaf3de; color: #27500a; }
.badge-normal { background: #dbeafe; color: #0c447c; }
.badge-charge { background: #faeeda; color: #633806; }
.badge-sature { background: #fcebeb; color: #791f1f; }

/* ── Mini-calendrier ── */
#cdr77-sim-calendrier { margin-top: 20px; }
.cdr77-sim-cal-titre {
    font-size: 13px; font-weight: 500;
    color: #2c2c2a;
    text-align: center;
    margin-bottom: 8px;
}
.cdr77-sim-cal-grille {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}
.cdr77-sim-cal-th {
    font-size: 10px; font-weight: 500;
    color: #888780;
    text-align: center;
    padding: 3px 0;
}
.cdr77-sim-cal-vide { min-height: 32px; }
.cdr77-sim-cal-jour {
    min-height: 32px;
    background: #f1efe8;
    border-radius: 4px;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 2px;
    cursor: default;
}
.cdr77-sim-cal-jour.occupe { background: #e6f1fb; }
.cdr77-sim-cal-jour.selec  { background: #185fa5 !important; }
.cdr77-sim-cal-jour.selec .cdr77-sim-cal-num { color: #fff; }
.cdr77-sim-cal-num { font-size: 11px; color: #444441; line-height: 1; }
.cdr77-sim-cal-dots {
    display: flex; gap: 2px; margin-top: 2px;
    flex-wrap: wrap; justify-content: center;
}
.cdr77-sim-cal-dot {
    display: inline-block;
    width: 5px; height: 5px;
    border-radius: 50%;
}
.cdr77-sim-cal-legende {
    display: flex; flex-wrap: wrap;
    gap: 8px 14px; margin-top: 10px;
    font-size: 11px; color: #5f5e5a;
    align-items: center;
}
.cdr77-sim-cal-legende span { display: flex; align-items: center; gap: 4px; }
.legende-selec { color: #185fa5; font-weight: 500; }

/* ── Indicateur densité semaines ── */
.cdr77-sim-cal-jour[data-densite="libre"]  { background: #eaf3de; }
.cdr77-sim-cal-jour[data-densite="normal"] { background: #dbeafe; }
.cdr77-sim-cal-jour[data-densite="charge"] { background: #faeeda; }
.cdr77-sim-cal-jour[data-densite="sature"] { background: #fcebeb; }

/* Garder la couleur occupe si des courses sont présentes ce jour */
.cdr77-sim-cal-jour.occupe[data-densite="charge"],
.cdr77-sim-cal-jour.occupe[data-densite="sature"] { background: #faeeda; }
.cdr77-sim-cal-jour.occupe[data-densite="normal"] { background: #dbeafe; }

/* Légende densité */
.legende-titre { font-weight: 500; color: var(--gris1); }
.legende-sep   { color: var(--gris3); margin: 0 4px; }
.dens-dot {
    display: inline-block;
    width: 10px; height: 10px;
    border-radius: 2px;
    border: 0.5px solid rgba(0,0,0,.1);
    flex-shrink: 0;
}
.d-libre  { background: #eaf3de; }
.d-normal { background: #dbeafe; }
.d-charge { background: #faeeda; }
.d-sature { background: #fcebeb; }

/* ── Message déplacement de date ── */
.cdr77-sim-deplacement {
    background: #fff7ed;
    border-left: 3px solid #ea580c;
    border-radius: 0 6px 6px 0;
    color: #7c2d12;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    font-size: 13px;
    line-height: 1.6;
    margin-bottom: 10px;
}
.cdr77-sim-deplacement strong { color: #9a3412; }