/* ===== EPHB Connect — optimisation iPhone / téléphone ===== */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.topbar{padding-top:max(14px,env(safe-area-inset-top))}
.devfoot{padding-bottom:max(12px,env(safe-area-inset-bottom))}
.toast{bottom:max(24px,calc(env(safe-area-inset-bottom) + 12px))}
button,a,label,.chip,.match,.pl{-webkit-tap-highlight-color:transparent;touch-action:manipulation}

/* écrans tactiles : cibles d'au moins 44 px, pas de zoom auto sur les champs */
@media (pointer:coarse){
  input,select,textarea{font-size:16px !important}
  .btn,.chip,.seg button,.modes button,.pl{min-height:44px}
  .link{min-height:32px}
}

/* Stats en plein écran : on laisse la place à l'encoche et à la barre du bas */
body.stats-full{background:#0b1640}
body.stats-full #statsFrame{position:fixed !important;top:env(safe-area-inset-top);left:env(safe-area-inset-left);right:auto;bottom:auto;inset:env(safe-area-inset-top) auto auto env(safe-area-inset-left);width:calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right)) !important;height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;min-height:0 !important;max-width:none;max-height:none;margin:0;border:0;border-radius:0;z-index:99999}
body.stats-full{overflow:hidden;overscroll-behavior:none}
body.stats-full .topbar,body.stats-full #modeTabs,body.stats-full .devfoot{visibility:hidden}

@media (max-width:700px){
  /* bandeau compact, non collant pour libérer l'écran */
  .topbar{position:relative;padding:max(10px,env(safe-area-inset-top)) 12px 10px;gap:10px}
  .brand{gap:10px;min-width:0}
  .brand img{width:46px;height:auto}
  .brand-title{font-size:20px}
  .brand-tag{font-size:10.5px;letter-spacing:1px}
  .brand-sub{font-size:11.5px}
  .top-actions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .top-actions>.btn{justify-content:center;padding:8px 6px;font-size:12.5px;gap:5px;text-align:center;line-height:1.1;white-space:normal}
  .top-actions>.btn svg{flex:none}
  .top-actions #userBox{grid-column:1/-1}
  .progress{top:0}

  /* onglets en haut, sur une ligne qui défile, toujours accessibles */
  .layout{padding:0 10px 14px;gap:14px}
  .panel{display:contents}
  #modeTabs{order:-2;position:sticky;top:0;z-index:30;display:flex !important;flex-wrap:nowrap;overflow-x:auto;gap:6px;margin:0 -10px;padding:8px 10px;padding-top:max(8px,env(safe-area-inset-top));border-radius:0;border-left:0;border-right:0;background:rgba(7,15,43,.96);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);scrollbar-width:none;scroll-snap-type:x proximity}
  #modeTabs:not(.stuck){padding-top:8px}
  body.stats-on #modeTabs{position:relative;padding-top:8px}
  #modeTabs::-webkit-scrollbar{display:none}
  #modeTabs button{flex:0 0 auto;white-space:nowrap;padding:10px 14px;scroll-snap-align:start}
  body.stats-on .modes{max-width:none}
  .stage{order:-1}
  .layout>.step,.panel>.step{order:0}

  /* aperçu et boutons d'export */
  .stage-bar{gap:8px}
  .seg#fmtSeg{display:grid;grid-template-columns:repeat(4,1fr);width:100%}
  .seg#fmtSeg button{padding:8px 4px;font-size:13px}
  .preview{max-height:70vh;max-height:70dvh}
  .export,.export.social{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .export .btn{min-width:0;padding:10px 8px;font-size:14px;text-align:center}
  .export .btn.wa.main,.export #btnShare,.export.social #btnShare2{grid-column:1/-1}
  .export .btn.wa.main small{flex-basis:100%;text-align:center}
  .export .btn small{white-space:nowrap}
  .export .btn.wa.alt{flex-direction:column;gap:2px}

  /* listes et formulaires */
  .match-list{max-height:none}
  .players{max-height:none}
  .step{padding:14px 12px}
  .add-player{flex-wrap:wrap}
  .add-player>*{min-width:0}

  /* onglet Stats : l'iframe occupe l'écran */
  .statsview iframe,body.stats-on .statsview iframe{height:calc(100vh - env(safe-area-inset-top));height:calc(100dvh - env(safe-area-inset-top));min-height:520px;border-radius:12px}
  body.stats-on .statsview{scroll-margin-top:env(safe-area-inset-top)}
  .st-top{position:fixed;z-index:60;top:calc(env(safe-area-inset-top) + 8px);right:10px;display:none;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.25);border-radius:50%;padding:0;background:rgba(7,15,43,.88);color:#fff;font:700 13px var(--font-ui,sans-serif);box-shadow:0 4px 14px rgba(0,0,0,.35)}
  body.stats-on.stats-low .st-top{display:flex}
  body.stats-full .st-top{display:none !important}

  /* pied de page plus discret */
  .devfoot{padding:12px 14px max(14px,env(safe-area-inset-bottom));font-size:12px;justify-content:center;text-align:center}
  .devfoot .by{margin:0 auto}
  .devfoot img.sigimg{height:42px}

  /* vues en ligne (comptes, rôles, journal…) */
  .cloudview{overflow-x:auto}
  .cloudview input[type=search]{min-width:0;width:100%}
  .cloudview table{font-size:13px}
  .cdlg{padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))}
  .cdlg-box{max-height:calc(100dvh - 40px);overflow:auto}
}

/* téléphone tenu à l'horizontale : bandeau réduit */
@media (max-height:500px) and (orientation:landscape){
  .topbar{position:relative}
  .progress{top:0}
}
.topbar{z-index:40}
@media (max-width:760px){ .top-actions{grid-template-columns:1fr} .onl-d{right:auto;left:0} }
