
/* ============================================================
   Specialtools V2.2.3 — Refonte responsive
   Objectif : navigation réellement exploitable sur portable et mobile.
   Cette feuille est chargée en dernier pour surcharger les styles existants.
   ============================================================ */

html,body{max-width:100%;overflow-x:hidden}
body.sidebar-open{overflow:hidden}
main{min-width:0}
.sidebar-overlay{display:none}
#menuBtn.mobile{display:none;align-items:center;justify-content:center;font-size:22px;line-height:1}

/* Sécurisation générale des largeurs */
.view,.toolbar,.search,.control-filter-panel,.control-bulk-bar,.detail-panel,.form-panel,.video-panel,.pdf-panel,.video-choice-panel,.backup-panel,.v2-history-panel{max-width:100%}
.header-title,.header-actions,.access-account,.access-account-trigger,.access-user-text,.home214-welcome,.home214-search,.home214-panel,.settings-admin-card,.tool-card,.v2-card,.detail-content,.detail-info-main,.detail-info-side{min-width:0}
.home214-panel-head>div,.home214-shortcut-grid button>div,.results-line,.results-actions,.analytics-card,.settings-admin-content{min-width:0}

/* Écran ordinateur portable / petits écrans desktop */
@media (max-width: 1360px){
  header{padding:12px 18px;height:auto;min-height:78px;gap:12px;align-items:flex-start}
  .header-title{flex:1 1 240px}
  .header-title h1{font-size:26px}
  .header-actions{margin-left:auto;flex-wrap:wrap;justify-content:flex-end;max-width:100%}
  .view{padding:18px 18px 28px}
  #toolsView .toolbar{grid-template-columns:minmax(240px,1fr) repeat(2,minmax(150px,1fr)) !important}
  .toolbar>.search{grid-column:1 / -1}
  .tools-results-line{align-items:flex-start;flex-wrap:wrap}
  .results-actions{flex-wrap:wrap;justify-content:flex-start}
  .home214-main-grid,.home2-main-grid{grid-template-columns:1fr !important}
  .settings-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

/* Tablette et portable compact : navigation repliable */
@media (max-width: 1180px){
  .app-shell{display:block !important}
  .sidebar{position:fixed !important;top:0;left:0;bottom:0;width:min(300px,84vw);height:100vh;z-index:130;transform:translateX(-104%);transition:transform .22s ease,box-shadow .22s ease;box-shadow:none;padding:18px 14px 16px !important}
  .sidebar.open{transform:translateX(0);box-shadow:0 14px 40px rgba(6,14,22,.34)}
  .sidebar .brand>div:last-child,.sidebar .brand-home>div:last-child,.sidebar nav .nav span,.sidebar .version{display:block !important}
  .sidebar .brand,.sidebar .brand-home{justify-content:flex-start !important;padding-bottom:20px !important}
  .sidebar .nav{text-align:left !important;justify-content:flex-start !important;font-size:15px !important}
  .sidebar-overlay{display:block;position:fixed;inset:0;background:rgba(8,14,20,.42);border:0;padding:0;margin:0;z-index:120;opacity:0;pointer-events:none;transition:opacity .18s ease}
  body.sidebar-open .sidebar-overlay{opacity:1;pointer-events:auto}
  #menuBtn.mobile{display:inline-flex !important;flex:0 0 44px}
  header{position:sticky;top:0;z-index:110}
  .header-title{flex:1 1 auto}
  .header-actions{width:100%;margin-left:0;display:grid;grid-template-columns:repeat(3,minmax(0,max-content));justify-content:end}
  .view-mode-switch{grid-column:1 / -1;justify-self:stretch;width:100%}
  .view-mode-btn{flex:1 1 0}
  .access-account,.public-login-btn{justify-self:stretch}
  .access-account-trigger,#publicLoginBtn{width:100%}
  .language-switch{justify-self:start}
  .home214-dashboard,.home2-dashboard{padding:14px}
  .home214-hero,.home2-topbar,.home214-main-grid,.home2-main-grid,.analytics-grid,.settings-admin-grid{grid-template-columns:1fr !important}
  .home214-search{grid-template-columns:minmax(0,1fr) auto auto;align-items:center}
  .home214-shortcut-grid,.home2-actions,.home2-future-strip,.control-stats{grid-template-columns:1fr 1fr !important}
  .detail-admin-layout,.detail-info-layout,.detail-hero,.detail-image,.detail-information-grid,.source-data-grid-main,.v2-tool-instance-grid,.warranty-layout,.warranty-side{grid-template-columns:1fr !important}
  .detail-admin-sidebar{grid-template-columns:1fr !important}
  .detail-media-zone{grid-template-columns:1fr !important}
  .detail-media-zone .zoom-panel{display:none !important}
  .table-wrap,.control-table-wrap,.v2-inventory-table-wrap{overflow:auto}
}

/* Téléphone / mobile */
@media (max-width: 760px){
  header{padding:12px 12px 14px !important;gap:10px}
  .header-title h1{font-size:21px !important}
  .header-title p{display:block !important;font-size:12px !important;line-height:1.35}
  .header-actions{grid-template-columns:1fr 1fr !important;gap:8px !important;align-items:stretch}
  .language-switch{width:100%;min-width:0}
  .access-account{grid-column:1 / -1}
  .public-login-btn{grid-column:2}
  .view-mode-switch{order:3;grid-column:1 / -1}
  .access-account-trigger{height:auto;min-height:48px;padding:8px 10px}
  .access-user-text strong{max-width:none !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .view{padding:12px 12px 22px !important}

  /* Accueil */
  .home214-kpis,.home2-kpis,.home214-shortcut-grid,.home2-future-strip,.stats{grid-template-columns:1fr !important}
  .home214-panel,.home2-panel,.analytics-card,.settings-admin-card,.settings-card,.v2-card,.tool-card{border-radius:14px}
  .home214-search,.home2-search,.toolbar,.v2-toolbar,.control-filter-grid,.control-filter-secondary,.bulk-actions,.backup-actions,.analytics-actions,.detail-actions,.form-actions{display:grid !important;grid-template-columns:1fr !important;gap:10px}
  .home214-search-submit,.home214-search-clear,.home2-search-submit,.home2-search-clear,.toolbar .icon-btn,.results-actions #viewToggle,.results-actions #addBtn,.btn,.icon-btn,.detail-actions .btn,.form-actions .btn,.settings-admin-actions .btn{width:100%}
  #toolsView .toolbar{grid-template-columns:1fr !important;padding:12px !important}
  .toolbar>.search{grid-column:auto !important}
  .tools-results-line,.results-meta,.results-actions{display:grid !important;grid-template-columns:1fr !important;gap:8px;justify-items:stretch}
  .cards{grid-template-columns:1fr !important}
  .tool-image{height:170px !important}

  /* Fiche outil et modales : plein écran mobile */
  .modal{padding:0 !important;align-items:stretch !important}
  .modal-panel{width:100vw !important;max-width:none !important;max-height:100vh !important;height:100vh;border-radius:0 !important}
  .modal-window-header,.modal-title.prominent{position:sticky;top:0;z-index:3;background:#fff;padding-right:58px}
  .modal-window-header{min-height:56px}
  .modal-close,.modal-close-main{position:fixed !important;top:10px !important;right:10px !important;z-index:5}
  #toolModal #toolDetail,#pdfModal .pdf-panel,#videoModal .video-panel,#videoChoiceModal .video-choice-panel,#v2HistoryModal .v2-history-panel{padding-bottom:env(safe-area-inset-bottom,0)}
  .detail-panel{border-top-width:0 !important}
  .detail-hero{grid-template-columns:1fr !important;min-height:auto !important}
  .detail-image,.zoom-stage{padding:16px !important;min-height:220px !important}
  .detail-content{padding:18px !important}
  .detail-content h2{font-size:22px !important;line-height:1.18}
  .ref-display{font-size:18px !important;word-break:break-word}
  .detail-tabs,.detail-tablist{display:flex;gap:8px;overflow:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  .detail-tab{white-space:nowrap}
  .detail-info-layout,.info-grid,.info-grid.compact,.source-data-grid-main,.detail-information-grid{grid-template-columns:1fr !important;padding:0 16px 18px !important}
  .info-box{padding:12px}
  .detail-actions{margin-top:18px !important}
  .video-stage{min-height:220px}
  #pdfViewer{height:calc(100vh - 130px) !important}
  .video-panel video{max-height:calc(100vh - 180px)}

  /* Paramètres / tableau */
  .settings-admin-grid{grid-template-columns:1fr !important}
  .settings-admin-actions,.backup-actions,.bulk-actions{display:grid !important;grid-template-columns:1fr !important}
  .control-table-simplified,.data-table,.v2-inventory-table{font-size:13px}
}

/* Très petits téléphones */
@media (max-width: 420px){
  .header-title h1{font-size:19px !important}
  .header-title p{font-size:11.5px !important}
  .access-user-avatar{width:30px;height:30px}
  .language-switch select,.view-mode-btn,.access-user-text strong,.btn{font-size:13px !important}
  .detail-content h2{font-size:20px !important}
  .detail-image,.zoom-stage{min-height:200px !important}
  .home214-panel-head,.home2-panel-head{grid-template-columns:32px minmax(0,1fr) !important}
  .home214-panel-head>button,.home2-panel-head>button{grid-column:1 / -1;justify-self:start}
}

/* Portail d'accueil (index) */
@media (max-width: 900px){
  .portal-main,.portal-hero{padding-left:20px !important;padding-right:20px !important}
  .hero-copy h1{font-size:44px}
  .portal-content{width:min(100%,860px)}
}
@media (max-width: 640px){
  .portal-shell{min-height:100vh}
  .brand-row{align-items:flex-start}
  .hero-copy h1{font-size:34px !important;line-height:1.08}
  .lead{font-size:15.5px !important}
  .portal-main,.portal-hero{padding-left:16px !important;padding-right:16px !important}
  .portal-content{gap:18px}
  .login-card{gap:14px}
  .portal-access-actions{display:grid !important;grid-template-columns:1fr !important;gap:10px}
  .primary-btn,.secondary-btn,.text-action{width:100% !important}
  .modal-card{width:min(100vw - 20px,540px);padding:20px}
}
