/*
  Mebazaa Voyages — manifeste CSS du prototype.
  Chaque composant a un fichier propriétaire ; ne pas ajouter de correctifs dans ce manifeste.
*/
@import url('./base.css?v=210');
@import url('./voyage.css?v=210');
@import url('./catalogues.css?v=210');
@import url('./prototype.css?v=210');


/* V166 — page Profil */
.profile-panel{max-width:980px}
.profile-form{display:flex;flex-direction:column;gap:16px}
.profile-avatar-line{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:end}
.profile-avatar-placeholder{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--brand-soft,#e8f1f4);color:var(--brand,#0f5664);font-weight:700;font-size:1.1rem}
.profile-grid-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.profile-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:4px}
@media (max-width:720px){.profile-grid-2{grid-template-columns:1fr}.profile-avatar-line{grid-template-columns:1fr}.profile-avatar-placeholder{width:54px;height:54px}.profile-actions{justify-content:stretch}.profile-actions .btn{flex:1}}


/* DEV 62 — barre d’entête stabilisée. */
.header-center-tools{display:flex;align-items:center;gap:7px;flex:0 0 auto;white-space:nowrap}
.header-view-btn{width:34px;height:34px;min-width:34px;border-radius:9px;display:inline-grid;place-items:center;transition:transform .12s ease,box-shadow .12s ease,opacity .12s ease,filter .12s ease;border-width:1px!important}
.header-view-btn .icon{width:17px;height:17px}
.header-view-admin{background:#f3c74f!important;border-color:#b78600!important;color:#4c3900!important}
.header-view-voyageur,.smartphone-preview-btn{background:var(--brand,#0f5664)!important;border-color:#0a3e48!important;color:#fff!important}
.header-view-btn:not(.is-active){opacity:.52;filter:saturate(.72)}
.header-view-btn.is-active{opacity:1;filter:none;transform:translateY(-1px);box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(15,86,100,.48),0 3px 9px rgba(0,0,0,.18)}
.header-view-admin.is-active{box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(183,134,0,.58),0 3px 9px rgba(0,0,0,.18)}
.header-view-btn[hidden]{display:none!important}
.user-initials{display:none;font-weight:800;letter-spacing:.03em}
@media(max-width:900px){.site-header .user-name,.site-header .role{display:none!important}.site-header .user-initials{display:block}.header-center-tools{gap:5px}.header-view-btn{width:32px;height:32px;min-width:32px}}
@media(max-width:620px){.header-center-tools{gap:4px}.header-view-btn{width:30px;height:30px;min-width:30px}.header-view-btn .icon{width:15px;height:15px}}
/* Un compte admin/superadmin conserve TOUJOURS les trois sélecteurs de vue. */
body[data-account-role="admin"] .header-center-tools .header-view-btn,
body[data-account-role="superadmin"] .header-center-tools .header-view-btn{display:inline-grid!important}

/* DEV 61 — le mode Voyageur est un mode d'affichage indépendant du rôle réel. */
body[data-ui-mode="voyageur"] main .admin-only,
body[data-ui-mode="voyageur"] main .admin-actions,
body[data-ui-mode="voyageur"] main .voyage-section-plus,
body[data-ui-mode="voyageur"] main .step-catalogue-admin,
body[data-ui-mode="voyageur"] main .preview-control,
body[data-ui-mode="voyageur"] .agency-edit-btn,
body[data-ui-mode="smartphone"] main .admin-only,
body[data-ui-mode="smartphone"] main .admin-actions,
body[data-ui-mode="smartphone"] main .voyage-section-plus,
body[data-ui-mode="smartphone"] main .step-catalogue-admin,
body[data-ui-mode="smartphone"] main .preview-control,
body[data-ui-mode="smartphone"] .agency-edit-btn {display:none!important}
/* Les trois boutons Admin/Voyageur/Smartphone restent hors de cette règle. */