/* PASIVITE 2.8.47.5 — audit responsive transversal.
   Dernière couche CSS : stabilise Web, PWA Personnel, PWA Pro et Admin sans modifier les droits ni les routes. */

/* Garanties globales : aucun contenu ne doit créer de débordement horizontal. */
html,body{max-width:100%;overflow-x:hidden}
.main-content,.mobile-app-main,.admin-shell,.senior-shell,.form-shell{min-width:0}
.main-content *, .mobile-app-main *, .admin-shell *{min-width:0}
img,video,iframe,canvas,svg{max-width:100%}
pre,code{max-width:100%;overflow-wrap:anywhere}
.table-wrap,.responsive-table,.admin-table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Grammaire de titres : mots normaux, pas de cassures au milieu d'un mot. */
:is(h1,h2,h3,.pv-list strong,.mobile-pro-journeys strong,.mobile-situation-copy strong){
  word-break:normal!important;
  overflow-wrap:normal!important;
  hyphens:none!important;
}

/* PWA : structure commune de toutes les pages. */
body.mobile-mode.pwa-app-shell .mobile-app-main{
  width:100%!important;
  padding:12px 12px calc(88px + env(safe-area-inset-bottom))!important;
}
body.mobile-mode.pwa-app-shell :is(.mobile-app-home,.mobile-pro-home,.notification-app-screen,.mobile-library-screen,.professional-guidance-shell,.maturity-shell,.promise-decoder-shell,.contact-app-shell,.audience-hub,.reflex-hub,.emergency-shell,.senior-shell,.form-shell){
  width:100%!important;
  max-width:720px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* En-têtes PWA : jamais de colonne texte trop étroite. */
body.mobile-mode.pwa-app-shell .mobile-dashboard-copy{width:100%!important;min-width:0!important}
body.mobile-mode.pwa-app-shell .mobile-dashboard-head h1{
  max-width:100%!important;
  text-wrap:pretty!important;
}

/* Sections et listes : alignement uniforme. */
body.mobile-mode.pwa-app-shell .pv-section-head{align-items:flex-start!important}
body.mobile-mode.pwa-app-shell .pv-section-head>div{width:100%!important}
body.mobile-mode.pwa-app-shell .pv-list>a,
body.mobile-mode.pwa-app-shell .pv-list>article{
  width:100%!important;
  text-align:left!important;
}
body.mobile-mode.pwa-app-shell .pv-list>a>span:nth-child(2),
body.mobile-mode.pwa-app-shell .pv-list>article>span:nth-child(2){min-width:0!important}
body.mobile-mode.pwa-app-shell .pv-list strong,
body.mobile-mode.pwa-app-shell .pv-list small{white-space:normal!important}

/* Formulaires : largeur exploitable et zones tactiles régulières. */
body.mobile-mode.pwa-app-shell :is(input:not([type=checkbox]):not([type=radio]),select,textarea){width:100%!important;max-width:100%!important}
body.mobile-mode.pwa-app-shell :is(button,.button,.primary-button,.secondary-button,.big-button,a.button){max-width:100%}

/* Tablettes / téléphones : passage progressif à une seule colonne. */
@media(max-width:760px){
  .pv-card-grid,.pv-home-trust-grid,.admin-body .pv-admin-priority,.admin-body .pv-admin-module-grid,
  .maturity-columns,.maturity-score-grid,.seo-topic-grid,.seo-article-layout{grid-template-columns:1fr!important}
  .pv-section-head{display:block!important}
  .pv-section-head>p{margin-top:6px!important}
  .admin-shell,.senior-shell,.main-content{width:min(100% - 20px,1180px)!important}
  table{font-size:.9em}
}

/* Breakpoint critique iPhone : l'en-tête doit être vertical AVANT que le titre soit comprimé. */
@media(max-width:560px){
  body.mobile-mode.pwa-app-shell .mobile-app-main{padding-left:10px!important;padding-right:10px!important}
  body.mobile-mode.pwa-app-shell :is(.mobile-dashboard-head,.mobile-pro-compact-head){
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding:13px!important;
  }
  body.mobile-mode.pwa-app-shell .mobile-mode-switcher{
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
  }
  body.mobile-mode.pwa-app-shell .mobile-mode-switcher>*{
    width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    padding:8px 10px!important;
    font-size:14px!important;
  }
  body.mobile-mode.pwa-app-shell .mobile-dashboard-kicker{font-size:12px!important}
  body.mobile-mode.pwa-app-shell .mobile-dashboard-head h1{
    font-size:30px!important;
    line-height:1.08!important;
    letter-spacing:-.025em!important;
    margin:2px 0 7px!important;
  }
  body.mobile-mode.pwa-app-shell .mobile-dashboard-head p:not(.mobile-dashboard-kicker){
    font-size:15px!important;
    line-height:1.42!important;
    max-width:none!important;
  }

  body.mobile-mode.pwa-app-shell .mobile-pro-journeys,
  body.mobile-mode.pwa-app-shell .mobile-situation-list,
  body.mobile-mode.pwa-app-shell .mobile-action-pair,
  body.mobile-mode.pwa-app-shell .mobile-quick-grid,
  body.mobile-mode.pwa-app-shell .mobile-pro-launch-grid,
  body.mobile-mode.pwa-app-shell .mobile-pro-launch-grid-v370,
  body.mobile-mode.pwa-app-shell .mobile-pro-partner-actions,
  body.mobile-mode.pwa-app-shell .maturity-score-grid,
  body.mobile-mode.pwa-app-shell .maturity-columns{
    grid-template-columns:1fr!important;
  }

  body.mobile-mode.pwa-app-shell .mobile-pro-journeys a{
    min-height:72px!important;
    padding:11px 12px!important;
  }
  body.mobile-mode.pwa-app-shell .mobile-pro-journeys strong{font-size:16px!important;line-height:1.2!important}
  body.mobile-mode.pwa-app-shell .mobile-pro-journeys small{font-size:13px!important;line-height:1.3!important}
  body.mobile-mode.pwa-app-shell .mobile-pro-journeys span{font-size:13px!important;margin-top:7px!important}

  body.mobile-mode.pwa-app-shell .pv-section{margin-top:14px!important}
  body.mobile-mode.pwa-app-shell .pv-section-head h2{font-size:20px!important;line-height:1.2!important}
  body.mobile-mode.pwa-app-shell .pv-section-head p{font-size:13px!important;line-height:1.35!important}
  body.mobile-mode.pwa-app-shell .pv-kicker{font-size:11px!important}

  body.mobile-mode.pwa-app-shell .pv-list>a,
  body.mobile-mode.pwa-app-shell .pv-list>article{
    grid-template-columns:38px minmax(0,1fr) 18px!important;
    gap:10px!important;
    min-height:66px!important;
    padding:11px!important;
  }
  body.mobile-mode.pwa-app-shell .pv-list .pv-mark{width:36px!important;height:36px!important}
  body.mobile-mode.pwa-app-shell .pv-list strong{font-size:16px!important;line-height:1.2!important}
  body.mobile-mode.pwa-app-shell .pv-list small{font-size:13px!important;line-height:1.3!important}

  /* Barre du bas : 5/6 entrées restent lisibles sans chevauchement. */
  body.mobile-mode .mobile-bottom-nav a{font-size:11px!important;min-width:0!important}
  body.mobile-mode .mobile-bottom-nav a>span:not(.alert-count-badge){white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
}

@media(max-width:380px){
  body.mobile-mode.pwa-app-shell .mobile-dashboard-head h1{font-size:27px!important}
  body.mobile-mode.pwa-app-shell .mobile-dashboard-head p:not(.mobile-dashboard-kicker){font-size:14px!important}
  body.mobile-mode.pwa-app-shell .mobile-mode-switcher>*{font-size:13px!important}
  body.mobile-mode .mobile-bottom-nav a{font-size:10px!important}
}

/* Web public sur téléphone : cartes, CTA et blocs de confiance ne doivent jamais rester multi-colonnes. */
@media(max-width:680px){
  body.public-body:not(.mobile-mode) :is(.pv-card-grid,.pv-home-trust-grid,.psv-home-feature-grid,.psv-home-method-grid,.psv-home-audience-grid){grid-template-columns:1fr!important}
  body.public-body:not(.mobile-mode) :is(.pv-card,.pv-signature,.seo-section,.seo-aside-card){width:100%!important}
  body.public-body:not(.mobile-mode) .pv-signature{grid-template-columns:1fr!important}
  body.public-body:not(.mobile-mode) .pv-signature :is(.primary-button,.secondary-button){width:100%!important}
}

/* Admin sur petites largeurs : privilégier la lecture au maintien artificiel des colonnes. */
@media(max-width:820px){
  body.admin-body .admin-nav-wrap{overflow-x:auto!important}
  body.admin-body :is(.pv-admin-priority,.pv-admin-module-grid){grid-template-columns:1fr!important}
  body.admin-body :is(.form-grid,.admin-grid,.stat-grid,.health-grid){grid-template-columns:1fr!important}
  body.admin-body table{min-width:680px}
  body.admin-body :is(.table-wrap,.responsive-table,.admin-table-wrap){overflow-x:auto!important}
}

/* Audit statique des 90 vues — grilles historiques restantes.
   Toute grille qui peut comprimer le contenu passe à 1 colonne sur mobile. */
@media(max-width:760px){
  body.mobile-mode.pwa-app-shell :is(
    .card-grid,.hero-actions,.audience-reflex-grid,.kit-card-grid,.maturity-reference-grid,
    .alert-concern-choices,.assistant-entry-actions,.audience-bottom-actions,.audience-first-actions,
    .choice-grid,.contact-field-grid,.emergency-grid,.emergency-help-actions,.filter-grid,
    .friend-verdict-grid,.install-benefit-grid,.install-device-grid,.kit-share-desktop-grid,
    .maturity-barometer-grid,.maturity-barometer-segments,.mobile-pro-resource-grid,
    .notification-compact-actions,.obs-mobile-kpis,.professional-guidance-priority-grid,
    .promise-meaning-grid,.promise-result-grid,.promise-source-grid,.promise-topics,
    .pwa-contribute-primary-grid,.recovery-codes,.reflex-card-grid,.reflex-detail-layout,
    .step-cards,.trusted-role-options,.pro-health-kpis,.pro-observatory-grid,.pro-trend-grid,
    .observatory-hero,.observatory-method-grid,.observatory-public-signals,.observatory-summary-grid,
    .observatory-trend-grid,.observatory-action-grid,.observatory-blindspot-grid,.observatory-verification-panel
  ){
    grid-template-columns:1fr!important;
  }

  body.mobile-mode.pwa-app-shell .mobile-segmented-tabs{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  body.mobile-mode.pwa-app-shell :is(.contact-modern-grid,.psv-home-hero-grid){
    grid-template-columns:1fr!important;
  }
}

/* Web public : les mêmes composants doivent rester lisibles en navigateur mobile. */
@media(max-width:760px){
  body.public-body:not(.mobile-mode) :is(
    .card-grid,.hero-actions,.audience-reflex-grid,.kit-card-grid,.maturity-reference-grid,
    .assistant-entry-actions,.audience-first-actions,.contact-modern-grid,.emergency-grid,
    .friend-verdict-grid,.install-benefit-grid,.install-device-grid,.kit-share-desktop-grid,
    .maturity-barometer-grid,.maturity-barometer-segments,.maturity-columns,.maturity-score-grid,
    .professional-guidance-priority-grid,.promise-meaning-grid,.promise-result-grid,.promise-source-grid,
    .promise-topics,.reflex-card-grid,.reflex-detail-layout,.seo-topic-grid,.seo-article-layout,.step-cards,
    .pro-health-kpis,.pro-observatory-grid,.pro-trend-grid,.observatory-hero,.observatory-method-grid,
    .observatory-public-signals,.observatory-summary-grid,.observatory-trend-grid,.observatory-action-grid,
    .observatory-blindspot-grid,.observatory-verification-panel,.alert-entity-grid
  ){
    grid-template-columns:1fr!important;
  }

  body.public-body:not(.mobile-mode) :is(.hero-actions,.maturity-score-grid,.promise-topics){gap:10px!important}
  body.public-body:not(.mobile-mode) :is(.hero-actions>a,.hero-actions>button){width:100%!important}
  body.public-body:not(.mobile-mode) .psv-footer-top{grid-template-columns:1fr!important}
}

/* Administration : formulaires et panneaux deviennent séquentiels sur tablette/téléphone. */
@media(max-width:900px){
  body.admin-body :is(
    .form-row,.admin-two-columns,.dashboard-grid,.form-grid-compact,.admin-case-columns,.admin-photo-review-grid,
    .health-beta-grid,.health-chart-grid,.health-detail-facts,.health-detail-grid,.health-kpi-grid,
    .health-observatory-state,.method-grid,.observatory-index-card,.source-health-strip,.stats-grid-three,
    .stats-grid-two,.stats-kpi-grid,.stats-report-builder,.trend-grid,.monitoring-grid
  ){
    grid-template-columns:1fr!important;
  }
  body.admin-body .admin-more-menu{grid-template-columns:1fr!important}
  body.admin-body .official-health-details>div{grid-template-columns:1fr!important;gap:4px!important}
}

/* Très petit écran : plus aucune grille secondaire en parallèle. */
@media(max-width:430px){
  body.mobile-mode.pwa-app-shell .mobile-segmented-tabs{grid-template-columns:1fr 1fr!important}
  body.mobile-mode.pwa-app-shell :is(.mobile-bottom-nav,.mobile-bottom-nav-v370){column-gap:0!important}
}

/* Rapport Observatoire PWA autonome : même discipline responsive. */
body.pwa-observatory-standalone .pwa-observatory-report__body{width:100%!important;max-width:760px!important;margin:0 auto!important}
body.pwa-observatory-standalone :is(.obs-mobile-list>div,.obs-mobile-ranked>div,.obs-mobile-table>div){min-width:0!important}
body.pwa-observatory-standalone :is(.obs-mobile-list strong,.obs-mobile-ranked strong,.obs-mobile-table strong){overflow-wrap:anywhere!important}
@media(max-width:560px){
  body.pwa-observatory-standalone .obs-mobile-kpis{grid-template-columns:1fr!important}
  body.pwa-observatory-standalone :is(.obs-mobile-list>div,.obs-mobile-ranked>div,.obs-mobile-table>div){display:grid!important;grid-template-columns:1fr!important;gap:4px!important}
  body.pwa-observatory-standalone :is(.obs-mobile-list strong,.obs-mobile-ranked strong,.obs-mobile-table strong){text-align:left!important}
}

/* PASIVITE 2.8.47.6 — listes d'actions : lecture alignée à gauche. */
body.mobile-mode .pv-list > a,
body.mobile-mode .pv-list > article {
  text-align: left !important;
}
body.mobile-mode .pv-list > a > span:nth-child(2),
body.mobile-mode .pv-list > article > span:nth-child(2) {
  min-width: 0 !important;
  width: 100% !important;
  justify-self: stretch !important;
  text-align: left !important;
}
body.mobile-mode .pv-list > a > span:nth-child(2) > strong,
body.mobile-mode .pv-list > a > span:nth-child(2) > small,
body.mobile-mode .pv-list > article > span:nth-child(2) > strong,
body.mobile-mode .pv-list > article > span:nth-child(2) > small {
  display: block !important;
  width: 100% !important;
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body.mobile-mode .pv-list .pv-arrow {
  justify-self: end !important;
  text-align: right !important;
}