/* QUALITE 24 — appli Architecte : socle de design « Apple » commun (css/q24-design.css, 22/10/2026) appliqué au préfixe ar-.
   Chargée EN DERNIER par architecte.html (<html class="q-apple">), après q24-design.css. CSS seulement : aucun JavaScript changé.
   Mêmes règles que les autres applis (section 4 et 5 de q24-design.css) : barre du haut translucide, grands titres 34/41, barre d'onglets
   en bas sur iPhone (onglet actif = couleur d'accent + pastille), BARRE LATÉRALE sur ordinateur (≥ 1024 px), densité « Mac » à la souris.
   L'Atelier 3D (racine .at, z-index 1000, plein écran) passe au-dessus de tout : il n'est pas touché. */

/* Barre du haut (barre de navigation iOS) */
html.q-apple .ar-haut{background:var(--q-bar)!important;-webkit-backdrop-filter:var(--q-blur);backdrop-filter:var(--q-blur);
  border-bottom:.5px solid var(--q-sep-strong)!important;box-shadow:none!important}
html.q-apple .ar-haut__titre{font-weight:600;letter-spacing:-.01em}
html.q-apple .ar-quitter{position:relative}
html.q-apple .ar-quitter::after{content:"";position:absolute;inset:-6px -4px}

/* Grands titres */
html.q-apple .ar-grand-titre{font:var(--q-t-large)!important;letter-spacing:.011em!important;margin:var(--q-2) 0 var(--q-1)!important}
@media (max-width:359px){html.q-apple .ar-grand-titre{font-size:30px!important;line-height:36px!important}}
html.q-apple .ar-entete__date{font:600 13px/18px var(--q-font);letter-spacing:.06em}

/* Barre d'onglets (iPhone) : 6 onglets sur une ligne, pastille sous l'onglet actif */
html.q-apple .ar-barre{grid-template-columns:repeat(6,minmax(0,1fr));background:var(--q-bar)!important;-webkit-backdrop-filter:var(--q-blur);backdrop-filter:var(--q-blur);
  border-top:.5px solid var(--q-sep-strong)}
html.q-apple .ar-barre button{isolation:isolate;padding-left:1px;padding-right:1px;color:var(--q-label2)}
@media (max-width:430px){html.q-apple .ar-barre button{letter-spacing:-.045em;font-size:11px;padding-left:0;padding-right:0}}   /* 6 onglets : « Aujourd'hui » et « Intervenants » entiers (11 pt = minimum iOS) */
html.q-apple .ar-barre button[aria-current="true"]{color:var(--q-accent)}
html.q-apple .ar-barre button[aria-current="true"]::before{content:"";position:absolute;inset:2px 2px;z-index:-1;border-radius:14px;background:var(--q-fill)}
@media (prefers-reduced-motion:no-preference){html.q-apple .ar-barre button[aria-current="true"]::before{animation:q-pastille var(--q-dur-2) var(--q-ease)}}
@media (min-width:820px) and (max-width:1023px){
  html.q-apple .ar-barre{width:min(680px,calc(100vw - 32px));box-shadow:var(--q-shadow-2);border:.5px solid var(--q-sep-strong);border-radius:26px}
}

/* Ordinateur (≥ 1024 px) : barre latérale à gauche, contenu centré à droite */
@media (min-width:1024px){
  html.q-apple .ar:has(>.ar-coque:not([hidden])){max-width:none!important;margin:0!important;padding:0 0 48px!important}
  html.q-apple .ar-coque{margin-left:var(--q-sidebar)!important;padding:0 var(--q-marge-ordi)!important;max-width:none!important;min-height:100vh}
  html.q-apple .ar-haut{margin:0 calc(-1 * var(--q-marge-ordi)) 16px!important;padding:10px var(--q-marge-ordi)!important;min-height:56px}
  html.q-apple .ar-haut__logo{display:none!important}
  html.q-apple .ar-haut__titre{font-size:17px}
  html.q-apple .ar-vue{max-width:var(--q-content-max)!important;margin:0 auto!important}
  html.q-apple .ar-barre{position:fixed!important;top:0!important;bottom:0!important;left:0!important;right:auto!important;transform:none!important;
    width:var(--q-sidebar)!important;height:auto;display:flex!important;flex-direction:column;align-items:stretch;gap:2px;overflow-y:auto;
    padding:84px 12px 16px!important;border:0!important;border-right:.5px solid var(--q-sep-strong)!important;border-radius:0!important;box-shadow:none!important;
    background:var(--q-sidebar-bg)!important;z-index:30}
  html.q-apple .ar-barre::after{content:"";position:absolute;top:20px;left:22px;width:118px;height:48px;
    background:url(/assets/equipe/logo-qualite24.png) no-repeat left center/contain;pointer-events:none}
  html.q-apple .ar-barre button{flex:none;flex-direction:row!important;align-items:center;justify-content:flex-start!important;gap:12px!important;
    min-height:44px!important;padding:0 12px!important;border-radius:10px!important;color:var(--q-label)!important;font:500 15px/1.2 var(--q-font)!important;letter-spacing:-.01em;text-align:left}
  html.q-apple .ar-barre button svg{flex:none;width:22px!important;height:22px!important;color:var(--q-accent);stroke-width:1.8}
  html.q-apple .ar-barre button>span{flex:1;min-width:0}
  html.q-apple .ar-barre button[aria-current="true"]{background:var(--q-accent-tint)!important;color:var(--q-accent)!important;font-weight:600!important}
  html.q-apple .ar-barre button[aria-current="true"]::before{content:none}
  html.q-apple .ar-barre button:not([aria-current="true"]):hover{background:var(--q-fill2)!important}
  html.q-apple .ar-barre__pastille{position:static!important;margin-left:auto;flex:none;transform:none}
  html.q-apple .ar-toast{left:calc(50% + var(--q-sidebar) / 2)!important;right:auto!important;transform:translateX(-50%)!important;bottom:24px!important;width:max-content;max-width:min(560px,calc(100vw - var(--q-sidebar) - 48px))}
  html.q-apple section[aria-label="Simulateur de démonstration"]{left:auto!important;right:16px!important;bottom:16px!important}
  html.q-apple .ar-grand-titre{font-size:30px!important;line-height:36px!important}
}
@media (min-width:1024px) and (prefers-color-scheme:dark){html.q-apple .ar-barre::after{filter:invert(1) hue-rotate(180deg) saturate(1.2)}}
@media (min-width:1024px) and (pointer:fine){
  html.q-apple .ar-barre button{min-height:38px!important}
  html.q-apple .ar-coque{font-size:15px}
}
/* iPhone : « Intervenants » ne tient pas dans 1/6 de 375 px → « Interv. » affiché (le mot entier reste lu par VoiceOver) */
@media (max-width:430px){
  html.q-apple .ar-barre button[data-onglet="intervenants"]>span{font-size:0}
  html.q-apple .ar-barre button[data-onglet="intervenants"]>span::after{content:"Interv.";font-size:11px}
}
