:root {
            --primary: #008099;
            --secondary: #f4f7f6;
            --text: #333;
            --white: #ffffff;
            --border: #ccc;
            --accent: #e0f2f1;
            --success: #27ae60;
            --bg-question: #f9f9f9;
        }

        body.dark-mode {
            --primary: #4dd0e1;
            --secondary: #121212;
            --text: #e0e0e0;
            --white: #1e1e1e;
            --border: #444;
            --accent: #2c3e50;
            --bg-question: #2a2a2a;
        }

        body { font-family: 'Segoe UI', Arial, sans-serif; background-color: var(--secondary); color: var(--text); margin: 0; padding: 20px; transition: background-color 0.3s, color 0.3s; }
        .container { max-width: 900px; margin: 0 auto; position: relative; }
        
        .practitioner-bar { background: var(--white); padding: 10px 15px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; font-size: 0.85em; flex-wrap: wrap; gap: 10px; }
        .practitioner-id-badge { background: #ffebee; color: #c62828; padding: 4px 8px; border-radius: 4px; font-family: monospace; font-weight: bold; }
        .btn-link-action { background: none; border: none; color: var(--primary); cursor: pointer; text-decoration: underline; font-size: 0.9em; padding: 0; font-weight: bold; }
        .btn-theme { background: var(--primary); color: #fff; border: none; padding: 6px 12px; border-radius: 6px; cursor: pointer; font-size: 0.9em; }

        .card { background: var(--white); padding: 20px; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); margin-bottom: 20px; transition: background-color 0.3s; }
        h1, h2 { color: var(--primary); border-bottom: 2px solid var(--primary); padding-bottom: 5px; margin-top: 0; }
        .question-block { margin-bottom: 10px; padding: 10px; border-left: 4px solid var(--primary); background: var(--bg-question); transition: background-color 0.3s ease; }
        
        .prescription-tech-block { margin-bottom: 10px; padding: 15px; border-left: 5px solid #008099; background: var(--bg-question); border-radius: 0 6px 6px 0; }

        .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; align-items: flex-start; }
        .grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 15px; align-items: flex-start; }
        .grid-3-id { display: grid; grid-template-columns: 0.8fr 1fr 1fr; gap: 10px; align-items: center; }
        
        label { display: block; font-weight: bold; margin-bottom: 5px; font-size: 0.9em; cursor: pointer; }
        .sub-label { font-size: 0.85em; font-weight: normal; color: #777; margin-bottom: 3px; display: block; min-height: 2.5em; }
        
        select, input[type="text"], input[type="email"], input[type="password"] { width: 100%; padding: 8px; border: 1px solid var(--border); border-radius: 6px; box-sizing: border-box; font-size: 0.95rem; background: var(--white); color: var(--text); height: 42px; transition: box-shadow 0.3s ease, background-color 0.3s ease; }
        input[type="date"] { width: 100%; padding: 8px; border: 1px solid var(--border); border-radius: 6px; box-sizing: border-box; font-size: 0.95rem; background: var(--white); color: var(--text); height: 42px; transition: box-shadow 0.3s ease; }
        input[type="range"] { width: 100%; margin: 10px 0; box-sizing: border-box; cursor: pointer; }
        textarea { width: 100%; padding: 8px; border: 1px solid var(--border); border-radius: 6px; box-sizing: border-box; font-size: 0.95rem; background: var(--white); color: var(--text); }
        
        select option[disabled] { color: #aaa; background-color: #f0f0f0; }
        select:disabled { appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: none; opacity: 0.8; }

        .checkbox-group-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-top: 5px; }
        .dynamic-row { display: flex; gap: 5px; margin-bottom: 5px; align-items: center; }
        .btn-add { background: var(--primary); color: white; border: none; border-radius: 4px; cursor: pointer; padding: 5px 10px; font-weight: bold; font-size: 1.1em; height: 42px; }
        .btn-rem { background: #d93025; color: white; border: none; border-radius: 4px; cursor: pointer; padding: 5px 10px; font-weight: bold; height: 42px; }

        .consent-box { background: var(--accent); padding: 15px; border-radius: 8px; border: 2px solid var(--primary); margin-top: 20px; transition: all 0.3s ease; }
        .consent-row { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 15px; }
        .consent-row input { width: 22px; height: 22px; flex-shrink: 0; cursor: pointer; margin: 0; }
        .consent-text { font-size: 0.95em; font-weight: bold; line-height: 1.4; color: var(--text); }

        .checkbox-item { display: flex; align-items: center; font-size: 0.9em; cursor: pointer; }
        .checkbox-item input { width: auto; margin-right: 8px; }

        .score-display { background: var(--primary); color: white; padding: 10px; border-radius: 8px; font-weight: bold; margin-top: 10px; text-align: center; }
        .score-interp { font-size: 0.9em; margin-top: 8px; font-weight: bold; color: var(--primary); text-align: center; }

        .sig-container { background: #fff; border: 1px solid var(--border); border-radius: 6px; position: relative; margin-top: 5px; overflow: hidden; }
        .signature-pad { display: block; width: 100%; height: 120px; cursor: crosshair; touch-action: none; background-color: #ffffff; }
        .btn-clear { background: #666; color: white; margin-top: 5px; font-size: 0.75em; padding: 4px 8px; border-radius: 4px; border:none; cursor:pointer; }

        button { font-family: inherit; }
        .btn-gen { background: var(--primary); color: white; width: 100%; font-size: 1.1em; padding: 15px; border: none; border-radius: 8px; cursor: pointer; font-weight: bold; transition: background 0.2s; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
        .btn-gen:hover { background: #006073; }
        .btn-gen:disabled { cursor: not-allowed; background: #999; }

        .action-bar { display: flex; flex-wrap: wrap; gap: 15px; justify-content: center; background: var(--white); padding: 20px; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
        .btn-action { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 20px; font-size: 1em; font-weight: 600; border: none; border-radius: 8px; cursor: pointer; transition: all 0.2s ease-in-out; box-shadow: 0 4px 6px rgba(0,0,0,0.1); color: #fff; min-width: 200px; }
        .btn-action:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0,0,0,0.15); }
        .btn-print { background: #34495e; } .btn-print:hover { background: #2c3e50; }
        .btn-edit { background: #2980b9; } .btn-edit:hover { background: #1f6391; }
        .btn-new { background: #27ae60; } .btn-new:hover { background: #1e8449; }

        @keyframes fadeModal { from { opacity: 0; transform: scale(0.95) translateY(-10px); } to { opacity: 1; transform: scale(1) translateY(0); } }
        .modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); display: none; justify-content: center; align-items: center; z-index: 10000; backdrop-filter: blur(4px); }
        .modal-content { background: var(--white); padding: 30px; border-radius: 12px; width: 90%; max-width: 500px; box-shadow: 0 10px 25px rgba(0,0,0,0.2); max-height: 90vh; overflow-y: auto; animation: fadeModal 0.3s ease-out forwards; position: relative; }
        .modal-content h2 { border-bottom: none; text-align: center; margin-bottom: 20px; font-size: 1.5em; }
        .auth-input { width: 100%; padding: 10px; margin-bottom: 10px; border: 1px solid var(--border); border-radius: 6px; }
        .auth-buttons { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
        .btn-auth-primary { background: var(--primary); color: white; padding: 10px; border: none; border-radius: 6px; cursor: pointer; font-weight: bold; height: 42px;}
        .btn-auth-secondary { background: transparent; color: var(--primary); padding: 10px; border: 1px solid var(--primary); border-radius: 6px; cursor: pointer; height: 42px;}
        .btn-close-modal { position: absolute; top: 15px; right: 15px; background: none; border: none; color: #999; cursor: pointer; font-size: 1.4em; line-height: 1; }
        .logos-grid { display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; align-items: center; padding: 15px 0; }

        #btn-up { position: fixed; bottom: 20px; right: 20px; background: var(--primary); color: white; border: none; border-radius: 50%; width: 50px; height: 50px; font-size: 1.5em; cursor: pointer; box-shadow: 0 4px 10px rgba(0,0,0,0.3); z-index: 9999; display: none; transition: background 0.3s, transform 0.2s; }
        #btn-up:hover { background: #006073; transform: translateY(-3px); }

        .error-highlight { border: 2px solid #d32f2f !important; background-color: #fff5f5 !important; box-shadow: 0 0 8px rgba(211, 47, 47, 0.4); }

        /* Effet Visuel Flash */
        @keyframes highlightFlash { 0% { background-color: #fff59d; transform: scale(1.02); } 100% { background-color: transparent; transform: scale(1); } }
        .flash-effect { animation: highlightFlash 1.2s ease-out; }

        /* Tables Médicales Bilan */
        .bilan-col { display: flex; flex-direction: column; gap: 12px; height: 100%; }
        .medical-table { width: 100%; border-collapse: collapse; font-size: 9.5pt; background: #fff; margin-bottom: 0; }
        .medical-table th { background-color: #e3f2fd; color: #005b70; padding: 6px; text-align: left; border: 1px solid #90caf9; font-weight: bold; text-transform: uppercase; font-size: 9pt; }
        .medical-table td { padding: 6px; border: 1px solid #e0e0e0; line-height: 1.3; vertical-align: top; }
        .medical-table td.label-col { color: #555; background-color: #fbfbfb; }
        .medical-table td.val-col { font-weight: bold; color: #222; }

        @media (max-width: 650px) {
            .grid-2, .grid-3, .grid-3-id { grid-template-columns: 1fr; }
            .grid-3-id { align-items: stretch; }
            .btn-action { width: 100%; }
        }

        /* --- PDF & PRINT OPTIMIZATION --- */
        #ordo-wrapper { background: #e0e0e0; padding: 15px; display: block; text-align: center; width: 100%; box-sizing: border-box; }
        
        .page-a4 { background: white; color: black; width: 210mm; height: 297mm; box-sizing: border-box; display: inline-flex; flex-direction: column; text-align: left; box-shadow: 0 5px 20px rgba(0,0,0,0.2); margin: 0 auto 20px auto; position: relative; overflow: hidden; padding: 10mm 12mm; font-size: 10pt; line-height: 1.3; }
        
        .ordo-top-header { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; border-bottom: 2px solid #000; padding-bottom: 5px; margin-bottom: 5px; }
        .ordo-title { text-align: center; margin: 5px 0; font-size: 1.6em; font-weight: bold; letter-spacing: 1px; text-transform: uppercase; }
        .prescription-content { flex-grow: 1; display: flex; flex-direction: column; }
        .qsp-inline { font-size: 8.5pt !important; font-weight: bold; margin-left: 10px; }
        .instruction-italic { font-style: italic; font-size: 8.5pt; color: #333; display: block; padding-left: 15px; margin-top: 4px; line-height: 1.3; }
        
        .surv-title { text-align: center; font-weight: bold; text-transform: uppercase; margin-top: 10px; margin-bottom: 8px; display: block; width: 100%; font-size: 1.15em; color: #008099; letter-spacing: 0.5px; }
        .surv-table { width: 100%; border-collapse: collapse; margin: 8px 0; font-size: 0.85em; }
        .surv-table th { border: 1px solid #000; text-align: center; padding: 6px; background: #f2f2f2; font-weight: bold; text-transform: uppercase; font-size: 0.9em; }
        .surv-table td { border: 1px solid #000; padding: 8px; vertical-align: top; width: 50%; line-height: 1.3; }
        .conduite-box { border-top: none; margin-top: 6px; padding-top: 4px; font-weight: bold; color: #008099; }
        
        .signature-line-wrapper { display: flex; justify-content: space-between; align-items: flex-start; margin: 15px 0 5px 0; font-size: 1.05em; }
        .sig-placeholder { height: 60px; }
        
        .ordo-bottom-legal { border-top: 2px solid #000; padding-top: 8px; margin-top: auto; }
        
        .info-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 6px; }
        .info-columns div { font-size: 8.5pt; line-height: 1.35; text-align: justify; color: #222; }
        .info-columns ul { margin: 4px 0 0 15px; padding: 0; list-style-type: square; }
        .info-columns li { margin-bottom: 3px; }
        .info-columns strong { color: #000; text-transform: uppercase; font-size: 9pt; display: block; margin-bottom: 2px; letter-spacing: 0.3px; }
        .disclaimer-box { font-size: 8pt; text-align: center; border: none; padding: 4px; font-weight: bold; text-transform: uppercase; background: #f9f9f9; line-height: 1.3; color: #111; }
        
        .bilan-page h2 { margin-top: 0; margin-bottom: 8px; text-align: center; font-size: 1.5em; }
        .bilan-header { background:#eeeeee; padding:6px; margin-bottom:8px; display:grid; grid-template-columns:1fr 1fr; border-radius: 4px; font-size: 0.95em; }
        .bilan-traitement-box { margin-bottom:12px; padding:10px; border:2px solid #90caf9; background:#e3f2fd; color: #005b70; font-weight:bold; border-radius:6px; font-size: 1.05em; text-align: center; }
        
        .bilan-consent-box { margin-top: 15px; margin-bottom: 5px; padding: 6px; border: 1px solid #ccc; background:#fdfdfd; font-size:0.85em; border-radius:6px; }
        
        .facture-page { font-size: 11pt; line-height: 1.5; }
        .facture-header { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; border-bottom: 2px solid #000; padding-bottom: 15px; margin-bottom: 30px; }
        .facture-header div { word-break: break-word; }
        .facture-content-wrapper { flex-grow: 1; display: flex; flex-direction: column; justify-content: space-between; }
        .facture-title { text-align: center; font-size: 1.8em; font-weight: bold; margin-top: 20px; margin-bottom: 40px; letter-spacing: 2px; }
        .facture-table { width: 100%; border-collapse: collapse; margin-bottom: 20px; font-size: 1.05em; }
        .facture-table th { border-bottom: 2px solid #000; text-align: left; padding: 12px 8px; background: #f9f9f9; }
        .facture-table td { border-bottom: 1px solid #ddd; padding: 15px 8px; }

        /* IMPRESSION NATIVE UNIVERSELLE */
        @media print {
            @page { 
                margin: 0 !important; 
                size: A4 portrait !important; 
            }
            html, body { 
                margin: 0 !important; 
                padding: 0 !important; 
                background: #fff !important; 
                width: 210mm !important; 
                height: auto !important; 
                min-height: 100vh !important;
                overflow: visible !important; 
            }
            #btn-up, .container, .card, button, h1, .btn-theme, .practitioner-bar, .action-bar, .print-header-hide, .no-print { 
                display: none !important; 
            }
            #ordo-preview-section { 
                background: white !important; 
                padding: 0 !important; 
                display: block !important; 
                margin: 0 !important; 
            }
            #ordo-wrapper { 
                background: white !important; 
                padding: 0 !important; 
                margin: 0 !important; 
                width: 100% !important; 
                display: block !important; 
            }
            .page-a4 { 
                box-shadow: none !important; 
                margin: 0 !important; 
                width: 210mm !important; 
                height: 296mm !important; 
                max-height: 296mm !important; 
                padding: 15mm !important; 
                box-sizing: border-box !important; 
                page-break-after: always !important; 
                break-after: page !important; 
                page-break-inside: avoid !important; 
                break-inside: avoid !important; 
                overflow: hidden !important; 
                border: none !important; 
            }
            .page-a4.last-print-page { 
                page-break-after: avoid !important; 
                break-after: avoid !important; 
            }
        }


/* Correctif RC1 : évite qu'une page A4 prévisualisée conserve une largeur anormale
   lors du retour au questionnaire sur mobile. */
html, body {
    max-width: 100%;
}

body {
    overflow-x: hidden;
}

#form-container {
    width: 100%;
    box-sizing: border-box;
}

#ordo-preview-section[style*="display: none"] {
    width: 0;
    height: 0;
    overflow: hidden;
}

/* RC7 bis : fiabilisation mobile de la barre praticien. */
.practitioner-bar {
    position: relative;
    z-index: 20001;
    pointer-events: auto;
}
.practitioner-bar button,
.practitioner-bar .btn-link-action,
#btn-auth-action,
.btn-theme {
    pointer-events: auto !important;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(0, 128, 153, 0.18);
    position: relative;
    z-index: 20002;
}


/* Compactage ordonnance pour éviter une page supplémentaire avec certains pilotes d'impression */
.ordo-page .signature-line-wrapper { margin: 6px 0 2px 0 !important; }
.ordo-page .sig-placeholder { height: 44px !important; }
.ordo-page #img-sig-dr-ordo { max-height: 55px !important; margin-top: 2px !important; }
.ordo-page .ordo-bottom-legal { padding-top: 5px !important; }
.ordo-page .info-columns { margin-bottom: 4px !important; }
.ordo-page .info-columns div { font-size: 8.2pt !important; line-height: 1.25 !important; }
.ordo-page .info-columns li { margin-bottom: 2px !important; }
.ordo-page .disclaimer-box { font-size: 7.8pt !important; padding: 3px !important; line-height: 1.2 !important; }


/* --- Interface v1.0 : Informations, RGPD, compte et logos dynamiques --- */
.app-modal-title { text-align: center; margin-bottom: 15px; border-bottom: none; }
.app-modal-body { font-size: 0.92em; line-height: 1.55; color: var(--text); }
.collaboration-title { text-align: center; font-weight: 700; color: var(--primary); }
.featured-logo-wrapper { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 16px 0 24px; }
.featured-logo { max-width: 180px; max-height: 95px; object-fit: contain; }
.logo-caption { font-size: .82em; color: #666; text-align: center; }
.section-title-centered { color: var(--primary); text-align: center; font-size: 1.05em; margin: 22px 0 8px; }
.logo-carousel { min-height: 100px; display: flex; justify-content: center; align-items: center; border: 1px solid var(--border); border-radius: 10px; background: var(--white); padding: 12px; overflow: hidden; }
.logo-carousel img { max-width: 190px; max-height: 78px; object-fit: contain; opacity: 0; transform: scale(.97); transition: opacity .35s ease, transform .35s ease; }
.logo-carousel img.carousel-image-visible { opacity: 1; transform: scale(1); }
.modal-center-action { display: flex; justify-content: center; margin: 25px 0 15px; }
.app-credits { text-align: center; font-size: .9em; }
.app-credits span { font-size: .85em; color: #777; display: block; margin-top: 5px; font-weight: 700; }
.rgpd-content { text-align: justify; }
.account-profile { display: grid; grid-template-columns: 130px 1fr; gap: 22px; align-items: start; }
.account-logo { width: 100%; max-height: 100px; object-fit: contain; }
.account-details { margin: 0; }
.account-details div { display: grid; grid-template-columns: 130px 1fr; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); }
.account-details dt { font-weight: 700; color: var(--primary); }
.account-details dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 650px) {
  .practitioner-bar > div:last-child { width: 100%; justify-content: center; gap: 10px !important; }
  .practitioner-bar .btn-link-action, .practitioner-bar .btn-theme { min-height: 40px; padding: 7px 9px; }
  .account-profile { grid-template-columns: 1fr; }
  .account-logo { max-width: 150px; justify-self: center; }
  .account-details div { grid-template-columns: 1fr; gap: 2px; }
}


/* Correctif UI Refresh : les modales passent au-dessus de la barre praticien. */
.modal-overlay { z-index: 30000 !important; pointer-events: auto !important; }
.modal-content { position: relative; z-index: 30001; pointer-events: auto; }


/* Finition v1.0 : alignement uniforme des commandes d'en-tête. */
.practitioner-status-group,
.practitioner-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.practitioner-status-group {
    gap: 10px;
}

.practitioner-actions {
    gap: 12px;
    justify-content: flex-end;
}

.practitioner-actions > button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    margin: 0;
    line-height: 1;
    box-sizing: border-box;
    white-space: nowrap;
}

.practitioner-actions .btn-link-action {
    padding: 7px 8px;
    text-underline-offset: 3px;
}

.practitioner-actions .btn-theme {
    width: 38px;
    min-width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 50%;
    font-size: 1.15rem;
    line-height: 1;
    text-decoration: none;
}

@media (max-width: 650px) {
    .practitioner-actions {
        width: 100%;
        justify-content: center;
        gap: 8px;
    }

    .practitioner-actions > button {
        min-height: 40px;
    }

    .practitioner-actions .btn-theme {
        width: 40px;
        min-width: 40px;
        height: 40px;
    }
}


/* Carrousels compacts et synchronisés */
.logo-carousel {
    width: 50%;
    max-width: 340px;
    min-width: 260px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}

.logo-carousel img {
    width: 100%;
    height: 180px;
    object-fit: contain;
    opacity: 1;
    transform: scale(1);
    will-change: opacity, transform;
}

/* Actions cohérentes dans Mon compte */
.account-action-stack {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-top: 22px;
}

.account-wide-button {
    width: min(100%, 320px);
    min-height: 48px;
    margin: 0;
}

@media (max-width: 640px) {
    .logo-carousel {
        width: 72%;
        min-width: 220px;
    }

    .logo-carousel img {
        height: 160px;
    }
}


/* Harmonisation finale des modales */
.account-urps-space {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 150px;
    padding: 8px 16px 18px;
}

.account-urps-space .account-logo {
    display: block;
    width: auto;
    max-width: 280px;
    max-height: 135px;
    object-fit: contain;
    margin: 0 auto;
}

.account-profile {
    display: block;
}

.modal-footer-centered {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 20px;
}

.modal-footer-centered .account-wide-button {
    width: min(100%, 320px);
    min-height: 48px;
    margin: 0;
}

@media (max-width: 640px) {
    .account-urps-space {
        min-height: 125px;
    }

    .account-urps-space .account-logo {
        max-width: 230px;
        max-height: 110px;
    }
}


/* Barre d'accueil simplifiée : statut centré, thème à droite. */
.practitioner-bar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 74px;
}

.practitioner-status-group {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin: 0 auto;
}

.practitioner-actions {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Bouton thème : blanc en mode clair, noir en mode sombre. */
#btn-theme-toggle {
    background: #ffffff !important;
    color: #111111 !important;
    border: 1px solid #d0d0d0 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

body.dark-mode #btn-theme-toggle {
    background: #000000 !important;
    color: #ffffff !important;
    border-color: #444444 !important;
}

/* La fenêtre Contact doit toujours passer devant les autres modales sur mobile. */
#contact-modal {
    z-index: 10050;
}

#account-modal {
    z-index: 10020;
}

@media (max-width: 640px) {
    .practitioner-bar {
        min-height: 88px;
        padding-left: 16px;
        padding-right: 76px;
    }

    .practitioner-status-group {
        width: 100%;
        flex-wrap: wrap;
        gap: 8px;
    }

    .practitioner-actions {
        right: 12px;
    }
}


/* Barre praticien responsive — état déconnecté */
.practitioner-bar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    width: 100%;
}

.practitioner-status-group {
    grid-column: 2;
    justify-self: center;
    min-width: 0;
    text-align: center;
}

.practitioner-actions {
    grid-column: 3;
    justify-self: end;
    position: static !important;
    transform: none !important;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
    min-width: 0;
}

/* Barre praticien après connexion */
.practitioner-bar.is-connected {
    grid-template-columns: minmax(190px, 1fr) minmax(0, 2fr);
}

.practitioner-bar.is-connected .practitioner-status-group {
    grid-column: 1;
    justify-self: start;
    text-align: left;
    max-width: 100%;
}

.practitioner-bar.is-connected .practitioner-actions {
    grid-column: 2;
    justify-self: stretch;
    justify-content: flex-end;
}

.practitioner-bar.is-connected .practitioner-id-badge {
    display: inline-block;
    max-width: min(42vw, 420px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

.practitioner-actions .btn-link-action,
.practitioner-actions .btn-theme {
    flex: 0 0 auto;
    white-space: nowrap;
}

@media (max-width: 900px) {
    .practitioner-bar.is-connected {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .practitioner-bar.is-connected .practitioner-status-group,
    .practitioner-bar.is-connected .practitioner-actions {
        grid-column: 1;
        justify-self: stretch;
    }

    .practitioner-bar.is-connected .practitioner-status-group {
        justify-content: center;
        text-align: center;
    }

    .practitioner-bar.is-connected .practitioner-actions {
        justify-content: center;
    }

    .practitioner-bar.is-connected .practitioner-id-badge {
        max-width: 72vw;
    }
}

@media (max-width: 560px) {
    .practitioner-bar {
        grid-template-columns: 1fr auto;
        padding: 14px !important;
    }

    .practitioner-status-group {
        grid-column: 1;
        justify-self: center;
    }

    .practitioner-actions {
        grid-column: 2;
    }

    .practitioner-bar.is-connected {
        grid-template-columns: 1fr;
    }

    .practitioner-bar.is-connected .practitioner-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: 8px;
    }

    .practitioner-bar.is-connected .practitioner-actions > button {
        width: 100%;
        justify-content: center;
        font-size: 0.9rem;
    }

    .practitioner-bar.is-connected #btn-theme-toggle {
        grid-column: 2;
    }
}