/*
 * Prise de RDV patient : choix de la langue et du thème, et thème sombre (classe .dark sur <html>, posée par le
 * gabarit ClinicAlpha/app.html.twig). Les couleurs claires restent celles de app.css.
 */

/*
 * Langue et thème : en tête du menu, ou en haut à droite sans barre ; même rendu que la barre des interfaces v2
 * (bouton drapeau + code pays, liste déroulante, bouton icône lune / soleil)
 */
.clinicAlpha-app .hidden {
    display: none !important;
}
.clinicAlpha-app .ca-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: Arial, sans-serif;
}
.clinicAlpha-app .ca-nav-controls {
    display: flex;
    align-items: center;
    margin-right: 12px;
}
.clinicAlpha-app .ca-floating-controls {
    position: fixed;
    top: 12px;
    right: 16px;
    z-index: 1030;
}
.clinicAlpha-app .ca-locale {
    position: relative;
}
.clinicAlpha-app .ca-locale-toggle,
.clinicAlpha-app .ca-theme {
    display: flex;
    align-items: center;
    gap: 6px;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #334155;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    cursor: pointer;
}
.clinicAlpha-app .ca-locale-toggle {
    padding: 6px 8px;
}
.clinicAlpha-app .ca-theme {
    padding: 8px;
    color: #64748b;
}
.clinicAlpha-app .ca-locale-toggle:hover,
.clinicAlpha-app .ca-theme:hover {
    background: #f1f5f9;
}
.clinicAlpha-app .ca-locale-toggle:disabled {
    opacity: .6;
}
.clinicAlpha-app .ca-flag {
    flex-shrink: 0;
    width: 20px;
    height: 14px;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .1);
}
.clinicAlpha-app .ca-chevron {
    font-size: 12px;
    color: #94a3b8;
}
.clinicAlpha-app .ca-locale-menu {
    position: absolute;
    left: 0;
    z-index: 1040;
    width: 176px;
    margin: 4px 0 0;
    padding: 4px;
    border-radius: 6px;
    background: white;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1), 0 0 0 1px #e2e8f0;
    font-size: 14px;
    list-style: none;
}
.clinicAlpha-app .ca-floating-controls .ca-locale-menu {
    right: 0;
    left: auto;
}
.clinicAlpha-app .ca-locale-menu li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    border-radius: 4px;
    color: #334155;
    cursor: pointer;
}
.clinicAlpha-app .ca-locale-menu li:hover {
    background: #f1f5f9;
}
.clinicAlpha-app .ca-locale-menu li[aria-selected="true"] {
    font-weight: 600;
}
.clinicAlpha-app .ca-locale-code {
    width: 24px;
    font-weight: 500;
}
.clinicAlpha-app .ca-locale-label {
    overflow: hidden;
    color: #64748b;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.clinicAlpha-app .ca-theme .ca-theme-light,
html.dark .clinicAlpha-app .ca-theme .ca-theme-dark {
    display: none;
}
html.dark .clinicAlpha-app .ca-theme .ca-theme-light {
    display: inline;
}
html.dark .clinicAlpha-app .ca-locale-toggle {
    color: #f5f5f5;
}
html.dark .clinicAlpha-app .ca-theme {
    color: #a3a3a3;
}
html.dark .clinicAlpha-app .ca-locale-toggle:hover,
html.dark .clinicAlpha-app .ca-theme:hover,
html.dark .clinicAlpha-app .ca-locale-menu li:hover {
    background: #262626;
}
html.dark .clinicAlpha-app .ca-locale-menu {
    background: #171717;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .4), 0 0 0 1px #404040;
}
html.dark .clinicAlpha-app .ca-locale-menu li {
    color: #f5f5f5;
}
html.dark .clinicAlpha-app .ca-locale-label {
    color: #a3a3a3;
}
@media (max-width: 991px) {
    .clinicAlpha-app .ca-nav-controls {
        margin: 12px 0 0;
    }
}

/* Logo : version claire sur fond transparent en mode sombre (images/hopi-ca-dark.png) */
.clinicAlpha-app .ca-logo-dark,
html.dark .clinicAlpha-app .ca-logo-light {
    display: none;
}
html.dark .clinicAlpha-app .ca-logo-dark {
    display: inline;
}

/* Thème sombre */
html.dark {
    color-scheme: dark;
    --secondary-color: #5b8fc4;
}
html.dark body.clinicAlpha-app {
    background: #121417 !important;
    color: #d6d9de;
}
html.dark .clinicAlpha-app .ca-nav.navbar,
html.dark .clinicAlpha-app .ca-nav.navbar.bg-light {
    background: #1b1e23 !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .08);
    color: #b8bcc4;
}
html.dark .clinicAlpha-app .ca-nav.navbar li > a,
html.dark .clinicAlpha-app .ca-nav.navbar li.active > a,
html.dark .clinicAlpha-app .ca-nav .dropdown-menu .dropdown-item {
    color: #b8bcc4 !important;
}
html.dark .clinicAlpha-app .ca-nav.navbar li > a:hover,
html.dark .clinicAlpha-app .ca-nav.navbar li > a.active,
html.dark .clinicAlpha-app .ca-nav.navbar li.dropdown.show > a,
html.dark .clinicAlpha-app .ca-nav .dropdown-menu .dropdown-item:hover {
    color: #2ea3f2 !important;
}
html.dark .clinicAlpha-app .ca-nav .dropdown-menu,
html.dark .clinicAlpha-app .ca-nav .dropdown-item:hover,
html.dark .clinicAlpha-app .ca-nav .dropdown-item:focus {
    background: #1b1e23;
}
html.dark .clinicAlpha-app .ca-nav .navbar-toggler {
    border-color: rgba(255, 255, 255, .2);
}
html.dark .clinicAlpha-app .ca-nav .navbar-toggler-icon {
    filter: invert(1);
}
@media (max-width: 991px) {
    html.dark .clinicAlpha-app .ca-nav.navbar .navbar-collapse,
    html.dark .clinicAlpha-app .ca-nav.navbar .navbar-nav > li {
        background: #1b1e23;
        border-color: rgba(255, 255, 255, .08);
    }
}

html.dark .clinicAlpha-app h2,
html.dark .clinicAlpha-app h3,
html.dark .clinicAlpha-app h5,
html.dark .clinicAlpha-app h6,
html.dark .clinicAlpha-app address,
html.dark .clinicAlpha-app p {
    color: #d6d9de;
}
html.dark .clinicAlpha-app h2 a,
html.dark .clinicAlpha-app .meeting-confirmation-page h3,
html.dark .clinicAlpha-app a:not(.btn):not(.meeting-hour):not(.next-meeting):not(.nav-link):not(.dropdown-item) {
    color: var(--main-color);
}

/* Liste des centres et fiche du centre */
html.dark .clinicAlpha-app .centers-details > .row {
    border-color: rgba(255, 255, 255, .1);
}
html.dark .clinicAlpha-app .centers-details .opening,
html.dark .clinicAlpha-app .centers-details .closed,
html.dark .row-withoutAppointment,
html.dark .row-open {
    background: #1b1e23;
}
html.dark .clinicAlpha-app .centers-details .name-address .address,
html.dark .clinicAlpha-app .centers-details .opening .open-hours,
html.dark .row-center .name,
html.dark .row-center .address,
html.dark .row-withoutAppointment .title-withoutAppointment,
html.dark .row-withoutAppointment .list-plage-withoutAppointment,

html.dark .row-specialties .list-specialties {
    color: #b8bcc4;
}
html.dark .row-withoutAppointment .plage-withoutAppointment {
    border-color: #b8bcc4;
    color: #d6d9de;
}
html.dark .clinicAlpha-app .dot {
    background-color: #3a3f47;
}
html.dark .clinicAlpha-app .dot.success { background-color: #0eba00; }
html.dark .clinicAlpha-app .dot.warning { background-color: #fd8800; }
html.dark .clinicAlpha-app .dot.danger { background-color: #ed0000; }
html.dark #map-center {
    filter: brightness(.85);
}

/* Choix du créneau */
html.dark .clinicAlpha-app .meeting-selector-page .meeting-selector .date {
    border-color: #3a3f47;
    color: #d6d9de;
}
html.dark .clinicAlpha-app .meeting-selector-page .meeting-selector .meeting-hour.with-appointment.disabled,
html.dark .clinicAlpha-app .meeting-selector-page .meeting-selector .meeting-hour.without-appointment {
    background: #2a2e35;
    color: #8a8f98;
}
html.dark .clinicAlpha-app .meeting-selector-page .meeting-selector .next-meeting,
html.dark .clinicAlpha-app .meeting-selector-page .meeting-selector .meeting-hour.with-appointment {
    background: var(--main-color);
    color: white;
}
html.dark .ca-alert {
    background: #12343f;
    border-color: #35aad5;
    color: #bfe9f7;
}
html.dark .ca-alert .close {
    color: #bfe9f7;
    text-shadow: none;
}
html.dark .next-week {
    background: #3a3f47;
}

/* Formulaires, listes, fenêtres et alertes Bootstrap */
html.dark .clinicAlpha-app .list-group-item {
    background: #1b1e23;
    border-color: rgba(255, 255, 255, .1);
    color: #d6d9de;
}
html.dark .clinicAlpha-app .form-control,

html.dark .clinicAlpha-app .custom-select {
    background-color: #121417;
    border-color: #3a3f47;
    color: #d6d9de;
}
html.dark .clinicAlpha-app .form-control:focus {
    background-color: #121417;
    color: #d6d9de;
}
html.dark .clinicAlpha-app .form-control::placeholder {
    color: #7d838c;
}
html.dark .clinicAlpha-app .form-control:disabled,
html.dark .clinicAlpha-app .form-control[readonly] {
    background-color: #24282e;
}
html.dark .clinicAlpha-app .input-group-text {
    background: #24282e;
    border-color: #3a3f47;
    color: #b8bcc4;
}
/* Case à cocher (ex. #followUp) : bordure visible sur le fond sombre (pas de bordure en Bootstrap 4.1, fond gris clair) */
html.dark .clinicAlpha-app .custom-control-label::before {
    background-color: #2a2e35;
    border: 1px solid #8a8f98;
}
html.dark .clinicAlpha-app .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #007bff;
    border-color: #007bff;
}
html.dark .clinicAlpha-app .modal-content {
    background: #1b1e23;
    color: #d6d9de;
}
html.dark .clinicAlpha-app .modal-header,
html.dark .clinicAlpha-app .modal-footer {
    border-color: rgba(255, 255, 255, .1);
}
html.dark .clinicAlpha-app .close {
    color: #d6d9de;
    text-shadow: none;
}
html.dark .clinicAlpha-app .btn:not(.btn-primary) {
    background: #3a3f47;
    border-color: #3a3f47;
    color: #d6d9de;
}
html.dark .clinicAlpha-app .alert-warning {
    background: #3a2f12;
    border-color: #6b5520;
    color: #f3dc9b;
}
html.dark .clinicAlpha-app .alert-danger {
    background: #3d1717;
    border-color: #6d2626;
    color: #f2b8b8;
}
html.dark .clinicAlpha-app .meeting-confirmation-page .summary,
html.dark .clinicAlpha-app .remove-meeting-page .summary {
    color: #d6d9de;
}
html.dark .row-specialties {
    background: #2a2e35;
}
html.dark .row-specialties .title-specialties {
    color: #ffffff;
}
html.dark .ca-alert .danger-circle {
    filter: brightness(0) invert(.85);
}

/* Erreurs du formulaire patient (style de l'ancien jquery-form-validator) */
.clinicAlpha-app .help-block.form-error {
    display: block;
    margin-top: 4px;
    color: #b94a48;
}
html.dark .clinicAlpha-app .help-block.form-error {
    color: #f08a87;
}

/* Marqueur de la carte du centre : logo dans une pastille blanche, chevron qui pointe sur l'adresse (booking_map_controller) */
.ca-map-marker-icon {
    background: none;
    border: none;
}
.ca-map-marker {
    position: relative;
    box-sizing: border-box;
    width: 28px;
    height: 28px;
    padding: 2px;
    border: 1.5px solid var(--main-color);
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .35);
}
/* Sélecteur plus fort que celui de Leaflet (.leaflet-container .leaflet-marker-pane img { width: auto; max-width: none }),
   qui laissait un logo non carré déborder de la pastille */
.leaflet-container .leaflet-marker-pane .ca-map-marker img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.ca-map-marker::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -5px;
    margin-left: -4px;
    border-width: 5px 4px 0;
    border-style: solid;
    border-color: var(--main-color) transparent transparent;
}