/* Responsive V2 — ergonomie mobile après la couche de hardening initiale.
   Cette feuille est chargée après responsive.css et reste volontairement
   limitée aux breakpoints tablette/téléphone. */

@media (max-width: 980px){
  .main-content,
  .container,
  .card,
  .session-card,
  .trainee-profile-card,
  .modal,
  .modal-body,
  .partner-sidebar,
  .command-search__panel,
  .notif-panel{
    overflow-wrap:anywhere;
    word-break:normal;
  }

  .card :where(a, span, strong, small, p, dd, dt),
  .modal-body :where(a, span, strong, small, p, dd, dt),
  .trainee-info-grid :where(a, span, strong, small, p),
  .session-card :where(a, span, strong, small, p){
    min-width:0;
    max-width:100%;
  }

  .table-wrap,
  .partners-table-wrap,
  .responsive-table-scroll{
    scrollbar-gutter:stable;
    scrollbar-width:thin;
  }

  .table-wrap.is-scrollable,
  .partners-table-wrap.is-scrollable,
  .responsive-table-scroll.is-scrollable{
    position:relative;
    box-shadow:inset -18px 0 18px -22px rgba(15,23,42,.55);
  }

  .table-wrap.is-scrollable.is-at-end,
  .partners-table-wrap.is-scrollable.is-at-end,
  .responsive-table-scroll.is-scrollable.is-at-end{
    box-shadow:none;
  }

  .table-wrap.is-scrollable:not(.is-at-end),
  .partners-table-wrap.is-scrollable:not(.is-at-end),
  .responsive-table-scroll.is-scrollable:not(.is-at-end){
    border-right-color:#cbd5e1;
  }

  .badge,
  .chip,
  .docs-badge,
  .status-badge,
  .pill,
  [class*="badge"],
  [class*="chip"]{
    max-width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
  }

  .modal,
  .app-modal-card,
  .billing-modal,
  .subscription-modal-card,
  .trainee-summary__card{
    overscroll-behavior:contain;
  }

  .modal-body,
  .app-modal-card,
  .billing-modal,
  .subscription-modal-card,
  .trainee-summary__card{
    scrollbar-width:thin;
  }
}

@media (max-width: 720px){
  html{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
  }

  body{
    min-height:100dvh;
  }

  body.responsive-sidebar-lock{
    position:fixed;
    inset-inline:0;
    width:100%;
    overflow:hidden;
    touch-action:none;
  }

  .topbar-inner,
  body.admin-sidebar-active .topbar-inner{
    padding-left:max(10px, env(safe-area-inset-left));
    padding-right:max(10px, env(safe-area-inset-right));
  }

  .main-content,
  .container,
  body.partner-space .main-content,
  body.admin-sidebar-active .main-content{
    padding-left:max(10px, env(safe-area-inset-left)) !important;
    padding-right:max(10px, env(safe-area-inset-right)) !important;
    padding-bottom:max(20px, env(safe-area-inset-bottom)) !important;
  }

  .partner-sidebar__scroll{
    padding-bottom:max(18px, env(safe-area-inset-bottom));
  }

  .btn,
  a.btn,
  .partner-sidebar a,
  .partner-sidebar button,
  .notif-icon-btn,
  .modal button,
  .modal a.btn,
  .app-modal-card button,
  .app-modal-card a.btn{
    min-height:44px;
    touch-action:manipulation;
  }

  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  select,
  textarea{
    font-size:max(16px, 1em);
  }

  .page-head :where(h1,h2,h3),
  .session-header :where(h1,h2,h3),
  .card :where(h1,h2,h3),
  .modal :where(h1,h2,h3){
    overflow-wrap:anywhere;
  }

  /* Les tableaux simples deviennent des cartes. La classe est ajoutée par
     responsive-v2.js uniquement après une détection conservatrice. */
  table.responsive-card-table{
    display:block;
    width:100% !important;
    min-width:0 !important;
    border:0 !important;
    background:transparent !important;
  }

  table.responsive-card-table thead{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
  }

  table.responsive-card-table tbody{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:12px;
    width:100%;
  }

  table.responsive-card-table tbody tr{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    width:100%;
    min-width:0;
    overflow:hidden;
    border:1px solid var(--line, #e2e8f0);
    border-radius:16px;
    background:var(--card, #fff);
    box-shadow:0 6px 18px rgba(15,23,42,.05);
  }

  table.responsive-card-table tbody tr[hidden]{
    display:none !important;
  }

  table.responsive-card-table tbody td{
    display:grid !important;
    grid-template-columns:minmax(96px, 38%) minmax(0,1fr);
    align-items:start;
    gap:10px;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    padding:10px 12px !important;
    border:0 !important;
    border-bottom:1px solid var(--line, #e2e8f0) !important;
    position:static !important;
    left:auto !important;
    white-space:normal !important;
    overflow-wrap:anywhere;
    box-shadow:none !important;
  }

  table.responsive-card-table tbody td:last-child{
    border-bottom:0 !important;
  }

  table.responsive-card-table tbody td::before{
    content:attr(data-label);
    color:var(--muted, #64748b);
    font-size:11px;
    font-weight:900;
    line-height:1.35;
    letter-spacing:.04em;
    text-transform:uppercase;
    overflow-wrap:anywhere;
  }

  table.responsive-card-table tbody td[data-label=""]{
    grid-template-columns:minmax(0,1fr);
  }

  table.responsive-card-table tbody td[data-label=""]::before{
    display:none;
  }

  table.responsive-card-table tbody td > :where(a, span, div, form, button){
    min-width:0;
    max-width:100%;
  }

  .modal-backdrop,
  .app-modal-backdrop,
  .billing-modal-overlay,
  .subscription-modal{
    padding-top:max(8px, env(safe-area-inset-top)) !important;
    padding-right:max(8px, env(safe-area-inset-right)) !important;
    padding-bottom:max(8px, env(safe-area-inset-bottom)) !important;
    padding-left:max(8px, env(safe-area-inset-left)) !important;
  }

  .modal,
  .app-modal-card,
  .billing-modal,
  .subscription-modal-card,
  .trainee-summary__card{
    max-height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  }

  .modal-head,
  .modal-foot{
    position:sticky;
    z-index:3;
    background:var(--card, #fff);
  }

  .modal-head{
    top:0;
  }

  .modal-foot{
    bottom:0;
    padding-bottom:max(12px, env(safe-area-inset-bottom)) !important;
    box-shadow:0 -8px 18px rgba(15,23,42,.05);
  }

  .command-search__panel,
  .notif-panel,
  .trainee-search-panel,
  .docs-to-control-panel{
    max-height:calc(100dvh - 84px - env(safe-area-inset-bottom)) !important;
  }

  .command-search__result,
  .search-item{
    min-width:0;
  }

  .command-search__copy,
  .search-item > *{
    min-width:0;
  }

  .command-search__copy strong,
  .command-search__copy small,
  .search-name,
  .search-sub{
    overflow-wrap:anywhere;
  }
}

@media (max-width: 480px){
  table.responsive-card-table tbody td{
    grid-template-columns:minmax(84px, 34%) minmax(0,1fr);
    gap:8px;
    padding:9px 10px !important;
  }

  .page-head h1{
    line-height:1.12;
  }

  .topbar-actions{
    width:100%;
  }

  .topbar-actions > .btn,
  .topbar-actions > button,
  .topbar-actions > .notif-wrap{
    max-width:100%;
  }
}

@media (max-width: 980px) and (orientation: landscape) and (max-height: 600px){
  .topbar-inner,
  body.admin-sidebar-active .topbar-inner{
    padding-top:6px;
    padding-bottom:6px;
  }

  .command-search__panel,
  .notif-panel{
    top:58px !important;
    max-height:calc(100dvh - 66px) !important;
  }

  .modal,
  .app-modal-card,
  .billing-modal,
  .subscription-modal-card{
    max-height:calc(100dvh - 8px) !important;
    border-radius:14px !important;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 980px){
  .partner-sidebar,
  .partner-sidebar-overlay,
  .modal,
  .app-modal-card,
  .command-search__panel,
  .responsive-card-table tbody tr{
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
  }
}