/*
 * Fichier  : assets/css/refonte.css
 * Auteur   : KREMER Régis
 * Version  : 2.6.116
 * Date     : 2026-07-25
 * Description : Refonte UI/UX — angles francs (PC), bord à bord (mobile/tablette),
 *               sidebar conservée, accessibilité renforcée. Couche additive
 *               chargée APRÈS app.css/addons/enhancements : ne réécrit rien,
 *               surcharge par la cascade. Réversible : retirer le <link> suffit.
 *
 * Changelog :
 *   v2.4.0 (2026-07-08) — Création. Surcharge des tokens de rayon, sharpening
 *                      des composants, cartes Produits (.pc2) adaptées, bord à
 *                      bord mobile, sidebar/rail/onglets bas restylés.
 *   v2.5.1 (2026-07-08) — Style des intertitres de section (.sidebar-section/.slide-section).
 *   v2.6.2 (2026-07-08) — Alignement global maquette : densité shell, rail tablette, header, cartes, tableaux et formulaires.
 *   v2.6.4 (2026-07-08) — Parcours terrain scanner/mouvements/inventaire : cartes mobile, actions tactiles, aide stock.
 *   v2.6.5 (2026-07-08) — Harmonisation admin/paramètres/magasins/emplacements/commandes/rapports : headers humains, tables mobile en cartes, actions tactiles.
 *   v2.6.8 (2026-07-08) — Correction du menu replié desktop/tablette et bannière d’installation PWA.
 *   v2.6.13 (2026-07-08) — Bannière d’installation plus lisible pour aides navigateur longues.
 *   v2.6.24 (2026-07-08) — Cohérence finale : règles menu mobile/rail/sidebar et note images manquantes.
 *   v2.6.21 (2026-07-08) — UX mouvements : sélection BL compacte, mobile sans texte empilé.
 *   v2.6.20 (2026-07-08) — Sidebar logo entreprise : remplace le texte société sans remplacer le logo MageStock.
 *   v2.6.19 (2026-07-08) — État logo entreprise actif/introuvable et chemin enregistré visibles dans Paramètres.
 *   v2.6.74 (2026-07-17) — INVENTORY MOBILE FLOW1 : retrait des conversions génériques de tableaux Inventaires.
 *   v2.6.116 (2026-07-25) — Retrait des sélecteurs orphelins de l’ancienne interface Magasins.
 *
 * IMPORTANT — Ce fichier NE TOUCHE PAS :
 *   • les préfixes sm_ / le chemin /sm/
 *   • la logique JS ni les données
 *   • les couleurs de marque (bleu conservé) ; il réutilise tes variables
 *     existantes (--blue, --bg-card, --border…) donc thèmes clair/sombre OK.
 */

/* ================================================================
   1. TOKENS — angles francs sur PC (LE levier principal)
   Chargé après app.css → ces valeurs gagnent par ordre de cascade.
   ================================================================ */
:root{
  --r:2px;          /* défaut : quasi carré */
  --r-sm:0px;
  --r-lg:2px;
  --r-xl:3px;
  /* --r-full reste à 9999px : réservé avatars, pastilles, toggles */
}

/* Chiffres tabulaires pour toutes les données chiffrées (stocks, SKU, prix) */
.header-user-name,.sidebar-badge,.header-badge,
table td,table th,.pc2-qty,.pc2-val,.kpi-value,.stat-value,.badge{
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
}

/* Focus clavier visible et homogène (accessibilité) */
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2.5px solid var(--blue);
  outline-offset:2px;
}

/* ================================================================
   2. SHARPENING — on carre les composants qui codent un rayon en dur
   Liste ciblée (pas un reset global : on préserve avatars/toggles ronds)
   ================================================================ */
.card,.card-header,.card-hd,.card-body,.card-footer,
.modal,.modal-hdr,.modal-body,.modal-footer,
.btn,.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-ghost,.btn-icon,.btn-sm,.btn-lg,
input,select,textarea,.input,.form-input,.form-control,.form-select,.search,.search-input,.field,
.badge,.chip,.tag,.pill,.filter-chip,
.header-btn,.lang-picker-btn,.lang-picker-dropdown,
.toast,.dropdown,.dropdown-menu,.menu,.popover,
.table-wrap,.data-table,.tbl,.tablewrap,
.view-toggle,.view-toggle-btn,
.slide-menu,.slide-item,
.tab,.tabs,.tab-btn,
.empty-state,.alert,.notice{
  border-radius:var(--r) !important;
}
/* coins carrés parfaits pour les grands conteneurs plats */
.card,.table-wrap,.data-table,.tbl{border-radius:var(--r-lg) !important}

/* ================================================================
   3. SIDEBAR — conservée, affinée (accent gauche sur l'actif = signature)
   ================================================================ */
.sidebar{border-right:1px solid var(--border)}
.sidebar-link{
  border-radius:var(--r-sm) !important;
  border-left:3px solid transparent;
  transition:background var(--tr,.15s),color var(--tr,.15s),border-color var(--tr,.15s);
}
.sidebar-link.active{
  border-left-color:var(--blue);
  border-radius:0 !important;
  font-weight:700;
}
.sidebar-badge,.slide-badge{border-radius:var(--r-full) !important} /* petites pastilles : rond OK */

/* Intertitres de section (EXPLOITATION / ORGANISATION / …) — comme la maquette */
.sidebar-section,.slide-section{
  padding:14px 14px 6px;
  font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--text-muted,#94a3b8);
  user-select:none;
}
.sidebar-nav > .sidebar-section:first-child,
.slide-menu-body > .slide-section:first-child{ padding-top:8px }

/* ================================================================
   4. TOP HEADER — barre nette, filet fin, boutons carrés
   ================================================================ */
/* Header ciblé par ID (#appHeader) pour vaincre toute règle plus spécifique */
#appHeader,.top-header{
  border-bottom:1px solid var(--border) !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
#appHeader{ background:var(--bg-card) }
#appHeader .header-btn,.header-btn{ border-radius:var(--r) !important }
#appHeader .header-badge,.header-badge{ border-radius:var(--r-full) !important }
/* Boutons/champs éventuels dans le header : angles francs */
#appHeader .btn,#appHeader input,#appHeader select,#appHeader .lang-picker-btn{ border-radius:var(--r) !important }

/* ================================================================
   5. TABLEAUX — en-têtes collants, filet gauche au survol, densité
   ================================================================ */
#appContent table thead th{
  position:sticky;top:0;z-index:2;
  background:var(--bg-elevated);
  text-transform:uppercase;letter-spacing:.05em;font-size:10.5px;
}
#appContent table tbody tr{transition:background var(--tr,.15s)}
#appContent table tbody tr td:first-child{border-left:3px solid transparent}
#appContent table tbody tr:hover td:first-child{border-left-color:var(--blue)}

/* ================================================================
   6. CARTES PRODUITS (.pc2) — on GARDE le visuel rapide (héro + jauge
   de stock colorée) mais on carre les angles. Spécificité #appContent
   #prodGrid (2 ids) > la CSS injectée (#prodGrid, 1 id) → gagne sans !important war.
   ================================================================ */
#appContent #prodGrid .pc2{
  border-radius:var(--r-lg) !important;
  border-width:1px !important;
}
#appContent #prodGrid .pc2:hover{
  transform:translateY(-2px) !important;                 /* survol plus sobre */
  box-shadow:0 6px 18px rgba(15,23,42,.10) !important;
}
#appContent #prodGrid .pc2-hero{border-radius:0 !important}
#appContent #prodGrid .pc2-flag{border-radius:0 !important}
#appContent #prodGrid .pc2-chip{border-radius:var(--r) !important}
#appContent #prodGrid .pc2-qa{border-radius:var(--r) !important}
#appContent #prodGrid .pc2-doc{border-radius:var(--r) !important}
/* La jauge de stock : on garde le dégradé (visuel rapide) mais carrée */
#appContent #prodGrid .pc2-bar,
#appContent #prodGrid .pc2-bar-fill{border-radius:0 !important}
#appContent #prodGrid .pc2-qty{font-variant-numeric:tabular-nums !important}

/* Toggle grille/liste : carré + état actif net */
.view-toggle-btn{border-radius:var(--r) !important}
.view-toggle-btn.active{background:var(--blue-pale);color:var(--blue)}

/* ================================================================
   7. ONGLETS BAS (mobile) — restylés, pouce, actif net
   ================================================================ */
.bottom-nav{border-top:1px solid var(--border)}
.bnav-item{border-radius:0 !important;position:relative}
.bnav-item.active{color:var(--blue)}
.bnav-item.active::before{
  content:"";position:absolute;top:0;left:22%;right:22%;height:2.5px;background:var(--blue);
}
.bnav-icon{width:24px;height:24px}

/* ================================================================
   8. BORD À BORD — MOBILE & TABLETTE (≤ 900px : le contenu touche les bords)
   Respecte les encoches via env(safe-area-*). C'est la demande explicite.
   ================================================================ */
@media (max-width: 900px){
  /* Le contenu ne garde qu'un retrait d'encoche, plus de marge latérale */
  .main-content{
    padding-left:var(--safe-left,0px) !important;
    padding-right:var(--safe-right,0px) !important;
  }
  /* Cartes en pleine largeur : filets haut/bas, plus de coins ni de bords latéraux */
  .main-content > .card,
  .main-content .card{
    border-radius:0 !important;
    border-left-width:0 !important;
    border-right-width:0 !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  /* Les tableaux/paniers pleine largeur */
  .table-wrap,.data-table,.tbl,.tablewrap{
    border-radius:0 !important;border-left:0 !important;border-right:0 !important;
  }
  /* Grille produits : petits gouttières, collée aux bords */
  #appContent #prodGrid.products-grid,
  #appContent #prodGrid.prod-grid{
    padding-left:8px !important;padding-right:8px !important;
  }
}

/* ================================================================
   9. TABLETTE — sidebar → rail d'icônes (menu gauche conservé, place gagnée)
   Ne s'applique que si la sidebar reste visible à cette taille.
   ================================================================ */
@media (min-width: 641px) and (max-width: 1024px){
  /* La sidebar reste cliquable (icônes = liens <a href>) ; seuls les libellés sont masqués. */
  .app-shell .sidebar{ width:64px }
  .app-shell .sidebar .logo-text,
  .app-shell .sidebar .sidebar-label,
  .app-shell .sidebar .sidebar-section,
  .app-shell .sidebar .sidebar-badge{ display:none }
  .app-shell .sidebar .sidebar-link{ justify-content:center;padding-left:0;padding-right:0 }
}

/* ================================================================
   10. FLUIDITÉ — transitions sobres ; respect de prefers-reduced-motion
   ================================================================ */
.card,.btn,.sidebar-link,.bnav-item,.header-btn,.view-toggle-btn{
  transition:background .14s ease,color .14s ease,border-color .14s ease,transform .14s ease;
}
@media (prefers-reduced-motion: reduce){
  *{transition:none !important;animation:none !important;scroll-behavior:auto !important}
}

/* Cibles tactiles ≥ 48px en mobile (accessibilité) */
@media (max-width: 900px){
  .btn,.header-btn,.bnav-item,.sidebar-link,.slide-item,.view-toggle-btn{
    min-height:var(--touch-min,48px);
  }
}


/* ================================================================
   11. LOT 2 — ALIGNEMENT GLOBAL MAQUETTE v2.6.2
   Objectif : harmoniser le shell et les composants communs sans toucher
   à la logique JS ni aux vues métier. Couche additive uniquement.
   ================================================================ */
:root{
  --sidebar-width:248px;
  --header-height:56px;
  --bottom-nav-height:60px;
  --blue-strong:var(--blue-dim,var(--blue));
  --amber:var(--orange);
  --amber-pale:var(--orange-pale);
  --text-1:var(--text-primary);
  --text-2:var(--text-secondary);
  --text-3:var(--text-muted);
}

html{font-size:14px}
body{letter-spacing:-.005em}

/* Shell PC : densité proche prototype, menu gauche conservé */
.app-shell{background:var(--bg-body)}
.sidebar{width:var(--sidebar-width)!important;background:var(--bg-sidebar);box-shadow:none!important}
.sidebar-header{min-height:var(--header-height);padding:0 14px!important;display:flex;align-items:center;border-bottom:1px solid var(--border)}
.sidebar-logo{width:100%}
.logo-icon{width:32px!important;height:32px!important;border-radius:3px!important;background:linear-gradient(135deg,var(--blue-strong),var(--blue));}
.logo-icon .logo-img{width:32px!important;height:32px!important}
.logo-text{font-size:15px!important;font-weight:800!important;letter-spacing:-.02em}
.sidebar-nav{padding:8px!important;scrollbar-width:thin}
.sidebar-link{min-height:40px!important;padding:0 10px!important;margin-bottom:2px!important;gap:11px!important;font-size:13.5px!important;border-left:3px solid transparent!important;background:transparent}
.sidebar-link:hover{background:var(--bg-hover)!important;transform:none!important}
.sidebar-link.active{background:var(--blue-pale)!important;color:var(--blue)!important;border-left-color:var(--blue)!important}
.sidebar-icon{width:19px!important;height:19px!important}
.sidebar-label,.sidebar-text{font-size:13.5px!important;font-weight:600!important;line-height:1.15}
.sidebar-footer{padding:10px 14px!important;border-top:1px solid var(--border);min-height:48px;display:flex;align-items:center}
.sidebar-footer-logo{max-height:32px!important;object-fit:contain!important;margin:0!important}

/* Header : plus fin, plus net, comme la maquette */
.top-header{height:var(--header-height)!important;min-height:var(--header-height)!important;padding:0 16px!important}
.header-title{font-size:15px!important;font-weight:800!important;letter-spacing:-.01em}
.header-left,.header-right{min-width:0}
.header-btn{width:38px!important;height:38px!important;min-height:38px!important;border:1px solid transparent!important;border-radius:var(--r)!important}
.header-btn:hover{border-color:var(--border)!important;background:var(--bg-hover)!important}
.header-user{height:38px;border-radius:var(--r)!important;background:transparent!important;padding:4px 8px!important;border:1px solid transparent!important;gap:9px!important}
.header-user:hover{background:var(--bg-hover)!important;border-color:var(--border)!important;box-shadow:none!important}
.header-avatar{width:30px;height:30px;border-radius:var(--r-full);display:inline-grid;place-items:center;background:var(--blue);color:#fff;font-weight:800;font-size:11.5px;letter-spacing:-.02em;flex:0 0 auto}
.header-user-name{font-size:12.5px!important;line-height:1.05;font-weight:800!important;max-width:150px!important}
.header-user-role{font-size:10.5px!important;line-height:1.05;color:var(--text-muted)!important}
.lang-picker-dropdown{border-radius:var(--r)!important;border:1px solid var(--border)!important;box-shadow:var(--shadow-lg)!important}

/* Contenu : marges PC compactes, cartes/panneaux à angles francs */
.main-content{padding:18px 20px 28px!important;background:var(--bg-body)}
.page-body{max-width:100%}
.card,.settings-card,.dash-chart-card,.inv-header-bar,.inv-kpi-card,.settings-action-card,.settings-panel,.archive-reminder,
.filters-bar,.prod-filters-bar,.pagination-bar,#prodPager,.table-container,.tbl-wrap,.table-wrap{
  border-radius:var(--r-lg)!important;
  border-color:var(--border)!important;
  box-shadow:var(--shadow,0 1px 2px rgba(15,23,42,.06))!important;
}
.card-header,.card-hd{padding:12px 14px!important;min-height:48px;border-bottom:1px solid var(--border)!important;background:var(--bg-card)}
.card-title,.card-header h3,.card-hd h3{font-size:13px!important;font-weight:800!important;letter-spacing:-.01em;margin:0}
.card-body{padding:14px!important}
.card-body-flush{padding:0!important}
.card-footer,.modal-footer{padding:12px 14px!important;border-top:1px solid var(--border)!important}

/* Bandeaux et KPI : accent simple, pas d'arrondis exagérés */
.dash-welcome,.settings-hero{border-radius:var(--r-lg)!important;margin-bottom:16px!important;box-shadow:none!important}
.dash-sc,.settings-hero-pill{border-radius:var(--r)!important}
.dash-kpi{border-radius:var(--r-lg)!important;border-left:3px solid var(--blue);padding:12px 14px!important;box-shadow:var(--shadow)!important}
.dash-kpi::before{display:none!important}
.dash-kpi[data-c="green"]{border-left-color:var(--green)}
.dash-kpi[data-c="orange"]{border-left-color:var(--orange)}
.dash-kpi[data-c="red"]{border-left-color:var(--red)}
.dash-kpi[data-c="purple"]{border-left-color:#8b5cf6}
.dash-kpi[data-c="cyan"]{border-left-color:#06b6d4}
.dash-kpi-ico,.dash-act-ico{border-radius:var(--r)!important}
.dash-kpi-val,.kpi-value,.stat-value,.inv-kpi-val{font-weight:800!important;letter-spacing:-.02em}

/* Boutons et champs : hauteur homogène, lisibilité, focus visible */
.btn,.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-ghost,.btn-sm,.btn-icon,
.form-input,.form-select,input[type="text"],input[type="search"],input[type="number"],input[type="email"],input[type="password"],select,textarea{
  border-radius:var(--r)!important;
}
.btn,.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-ghost{min-height:38px;font-weight:700!important;letter-spacing:-.005em}
.form-input,.form-select,input:not([type]),input[type="text"],input[type="search"],input[type="number"],input[type="email"],input[type="password"],input[type="tel"],input[type="url"],select,textarea{min-height:38px;border-color:var(--border)!important;background:var(--bg-input)!important;color:var(--text-primary)!important}
.form-input:focus,.form-select:focus,input:not([type]):focus,input[type="text"]:focus,input[type="search"]:focus,input[type="number"]:focus,input[type="email"]:focus,input[type="password"]:focus,input[type="tel"]:focus,input[type="url"]:focus,select:focus,textarea:focus{border-color:var(--blue)!important;box-shadow:0 0 0 3px var(--blue-pale)!important;outline:none!important}
.form-label{font-weight:700!important;color:var(--text-primary)!important}
.form-hint,.text-muted{color:var(--text-muted)!important}

/* Tableaux : signature accent gauche + densité cohérente */
.table-container,.tbl-wrap,.table-wrap{overflow:auto;background:var(--bg-card)}
table{border-collapse:collapse!important}
thead th,.data-table thead th{
  background:var(--bg-elevated)!important;color:var(--text-muted)!important;
  text-transform:uppercase!important;letter-spacing:.06em!important;font-size:10.5px!important;font-weight:800!important;
  padding:10px 14px!important;border-bottom:1px solid var(--border)!important;
}
tbody td,.data-table tbody td{padding:10px 14px!important;border-bottom:1px solid var(--border-light,var(--border))!important}
tbody tr:hover{background:var(--bg-hover)!important}
.badge,.chip,.tag,.pill{font-size:11px!important;font-weight:800!important;letter-spacing:.02em;border-radius:var(--r)!important}

/* Produits : barre de filtres collée mais carrée */
#pgProducts{--prod-filter-radius:var(--r-lg)!important}
#pgProducts .prod-filters-bar{border-radius:var(--r-lg)!important;background:var(--bg-card)!important;box-shadow:var(--shadow)!important}
#pgProducts .prod-filters-bar.is-compact{border-radius:var(--r-lg)!important;box-shadow:var(--shadow-lg)!important}
#pgProducts #prodPager.pagination-bar{border-radius:var(--r-lg)!important;box-shadow:var(--shadow)!important}
#pgProducts .search-clear-btn{border-radius:var(--r)!important}

/* Modales : fond plus lisible, coins maîtrisés, header compact */
.modal-overlay{backdrop-filter:blur(2px)}
.modal{border-radius:var(--r-lg)!important;border:1px solid var(--border)!important;box-shadow:var(--shadow-lg)!important}
.modal-hdr{padding:12px 14px!important;border-bottom:1px solid var(--border)!important}
.modal-hdr-icon,.modal-close{border-radius:var(--r)!important}
.modal-close{width:38px!important;height:38px!important;min-height:38px!important}

/* Slide menu mobile : même signature que le menu gauche */
nav#slideMenu.slide-menu{box-shadow:var(--shadow-lg)!important}
nav#slideMenu .slide-menu-head{min-height:56px!important;padding:10px 14px!important}
nav#slideMenu .slide-menu-logo,.slide-menu-logo-ph{width:32px!important;height:32px!important;border-radius:3px!important}
nav#slideMenu .slide-item{border-radius:var(--r)!important;border-left:3px solid transparent!important;min-height:44px!important;padding:0 12px!important}
nav#slideMenu .slide-item.active{background:var(--blue-pale)!important;color:var(--blue)!important;border-left-color:var(--blue)!important}
nav#slideMenu .slide-menu-close{border-radius:var(--r)!important;width:38px!important;height:38px!important}

/* Tablette : rail d'icônes au lieu d'un tiroir, comme la maquette */
@media (min-width:641px) and (max-width:1024px){
  .app-shell .sidebar{display:flex!important;width:64px!important;min-width:64px!important}
  .app-shell .sidebar-header{justify-content:center;padding:0!important}
  .app-shell .sidebar-logo{justify-content:center}
  .app-shell .sidebar .logo-text,
  .app-shell .sidebar .sidebar-label,
  .app-shell .sidebar .sidebar-text,
  .app-shell .sidebar .sidebar-section,
  .app-shell .sidebar .sidebar-badge,
  .app-shell .sidebar .sidebar-footer{display:none!important}
  .app-shell .sidebar-link{justify-content:center!important;padding:0!important;height:46px!important;margin:0 0 2px!important;border-left:0!important;border-radius:0!important}
  .app-shell .sidebar-link.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;background:var(--blue)}
  .mobile-menu-btn,.bottom-nav{display:none!important}
  .main-content{padding:14px!important;padding-bottom:24px!important}
  .top-header{padding:0 14px!important}
  .dash-kpi-grid{grid-template-columns:repeat(3,1fr)!important}
  .dash-charts,.dash-bottom,.settings-main-grid{grid-template-columns:1fr!important}
}

/* Mobile : bord à bord réel, onglets bas propres, champs lisibles */
@media (max-width:640px){
  html{font-size:15px}
  .main-content{padding:0 0 calc(var(--bottom-nav-height) + var(--safe-bottom) + 8px)!important}
  .top-header{height:56px!important;min-height:56px!important;padding-left:calc(12px + var(--safe-left))!important;padding-right:calc(12px + var(--safe-right))!important}
  .header-title{font-size:15px!important;max-width:48vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .header-user{display:none!important}
  .header-btn{width:40px!important;height:40px!important;min-height:40px!important}
  .dash-welcome,.settings-hero{border-radius:0!important;margin:12px 0 0!important;padding:16px 14px!important}
  .dash-shortcuts{display:none!important}
  .dash-kpi-grid{grid-template-columns:repeat(2,1fr)!important;gap:0!important;margin:0!important;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
  .dash-kpi{border-radius:0!important;border:0!important;border-left:3px solid var(--blue)!important;border-right:1px solid var(--border)!important;border-bottom:1px solid var(--border)!important;box-shadow:none!important;margin:0!important}
  .dash-kpi:nth-child(2n){border-right:0!important}
  .dash-charts,.dash-bottom{gap:0!important;margin:0!important}
  .card,.settings-card,.dash-chart-card,.inv-header-bar,.settings-action-card,.filters-bar,.prod-filters-bar,.pagination-bar,#prodPager,.table-container,.tbl-wrap,.table-wrap{
    border-radius:0!important;border-left-width:0!important;border-right-width:0!important;margin-left:0!important;margin-right:0!important;box-shadow:none!important;
  }
  .card + .card{margin-top:12px!important}
  #pgProducts .prod-filters-bar{position:sticky;top:0;z-index:70;border-radius:0!important;padding:10px 12px!important}
  .form-input,.form-select,input:not([type]),input[type="text"],input[type="search"],input[type="number"],input[type="email"],input[type="password"],input[type="tel"],input[type="url"],select,textarea{font-size:16px!important;min-height:44px!important}
  .btn,.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-ghost{min-height:44px!important}
  .bottom-nav{height:calc(var(--bottom-nav-height) + var(--safe-bottom))!important;box-shadow:none!important;border-top:1px solid var(--border)!important}
  .bnav-item{min-height:48px!important;padding:4px 2px!important;font-size:10.5px!important;font-weight:800!important}
  .bnav-item.active::before{left:22%!important;right:22%!important;height:2.5px!important}
  .modal-overlay{align-items:flex-end!important;padding:0!important}
  .modal{max-width:100%!important;width:100%!important;border-radius:var(--r-lg) var(--r-lg) 0 0!important;border-bottom:0!important;max-height:calc(100dvh - var(--safe-top))!important}
}
/* ================================================================
   11. LOT 4 — Parcours terrain scanner / mouvements / inventaire
   Mobile-tablette : cartes lisibles, actions pouce, caméra stable.
   ================================================================ */
.terrain-stock-info{
  margin:10px 0 2px;padding:10px 12px;border:1px solid var(--border);
  background:var(--bg-elevated);color:var(--text-secondary);font-size:12.5px;line-height:1.45;
  border-radius:var(--r)!important;border-left:3px solid var(--blue);
}
.terrain-stock-info strong{color:var(--text-primary);font-weight:800}
.terrain-stock-info--ok{border-left-color:var(--green)}
.terrain-stock-info--low{border-left-color:var(--orange,#f59e0b)}
.terrain-stock-info--empty{border-left-color:var(--red)}
.terrain-qty{display:flex;gap:6px;align-items:center}
.terrain-qty .inp{min-width:92px;text-align:center;font-weight:800}
.terrain-actions .btn{flex:1 1 130px;justify-content:center}
.offline-move-row{border-radius:var(--r)!important;border-left:3px solid var(--blue)}

.inv-scan-qty-tools{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0}
.inv-scan-qty-tools .btn,.inv-scan-actions .btn{justify-content:center}
.inv-scan-qty{font-size:18px!important;font-weight:800;text-align:center}
.inv-line-count-modal .inp{font-size:18px!important;font-weight:800;text-align:center}
.inv-scanner-result small{display:block;margin-top:2px;color:var(--text-muted);font-size:12px}

@media (max-width: 760px){
  #pgMovements .filters-bar{display:grid!important;grid-template-columns:1fr;gap:8px;padding:10px 12px!important}
  #pgMovements .filters-divider{display:none!important}
  #pgMovements .filters-section{width:100%;display:flex!important;gap:8px;align-items:center;flex-wrap:wrap}
  #pgMovements .filters-section .form-input,
  #pgMovements .filters-section .form-select,
  #pgMovements .search-box{width:100%!important;min-width:0!important;flex:1 1 100%}
  #pgMovements .filters-section.ml-auto{margin-left:0!important;display:grid!important;grid-template-columns:1fr 48px}
  #pgMovements .flex.items-center.justify-between.gap-4.mb-4{padding:10px 12px;margin-bottom:0!important;align-items:stretch!important}
  #pgMovements .flex.items-center.justify-between.gap-4.mb-4 > .flex{display:grid!important;grid-template-columns:1fr 1fr;gap:8px;width:100%}
  #pgMovements .results-count{font-weight:800;color:var(--text-secondary)}

  #pgMovements #mvTable thead{display:none!important}
  #pgMovements #mvTable,
  #pgMovements #mvTable tbody,
  #pgMovements #mvTable tr,
  #pgMovements #mvTable td{display:block!important;width:100%!important}
  #pgMovements #mvTable tbody{padding:0;background:var(--bg-body)}
  #pgMovements #mvTable tr{margin:10px 0;background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--blue);box-shadow:var(--shadow);border-radius:0!important;overflow:hidden}
  #pgMovements #mvTable td{display:flex!important;align-items:flex-start;justify-content:space-between;gap:14px;padding:9px 12px!important;border-bottom:1px solid var(--border-light,var(--border))!important;text-align:right!important}
  #pgMovements #mvTable td::before{content:attr(data-label);font-size:10.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);text-align:left;min-width:98px;max-width:42%}
  #pgMovements #mvTable td[data-label="Produit"]{display:block!important;text-align:left!important;background:var(--bg-elevated)}
  #pgMovements #mvTable td[data-label="Produit"]::before{display:block;margin-bottom:4px;max-width:none}
  #pgMovements #mvTable td.mv-select-cell{justify-content:space-between!important;align-items:center!important;background:var(--bg-elevated);text-align:right!important}
  #pgMovements #mvTable td.mv-select-cell::before{content:'Bon de livraison';display:block!important;font-size:10.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);text-align:left;min-width:auto;max-width:62%}
  #pgMovements #mvTable td.mv-select-cell .mv-delivery-select{margin-left:auto}
  #pgMovements #mvTable tr.is-delivery-selected{border-left-color:#2563eb!important;box-shadow:0 10px 28px rgba(37,99,235,.18)}
  #pgMovements #mvTable td.cell-center{justify-content:space-between!important;text-align:right!important}
  #pgMovements .pagination-bar{display:none!important}

  /* Inventaires : la page utilise désormais ses propres cartes et son assistant natif.
     Ne pas reconvertir ses tableaux génériquement ici. */

  .inv-scan-qty-tools{grid-template-columns:repeat(3,1fr)}
  .inv-scan-qty-tools #btnInvScanExpected{grid-column:1/-1}
  .inv-scan-actions{display:grid!important;grid-template-columns:1fr;gap:8px!important}
  #modalBox:has(.inv-scanner-container){width:100vw!important;max-width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}
  #modalBox:has(.inv-scanner-container) .modal-body{max-height:calc(100dvh - 112px)!important;overflow:auto!important}
}



/* ================================================================
   12. LOT 5 — Admin / paramètres / magasins / emplacements / commandes / rapports
   Objectif : homogénéiser les écrans d'administration avec la maquette sans
   changer la logique métier. Styles additifs + responsive terrain.
   ================================================================ */
.admin-page-hero{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--blue);
  border-radius:var(--r-lg)!important;padding:14px 16px;margin:0 0 14px;box-shadow:var(--shadow);
}
.admin-page-hero__copy{min-width:0;max-width:860px}
.admin-page-hero__kicker{
  display:block;margin-bottom:3px;font-size:10.5px;font-weight:900;letter-spacing:.09em;
  text-transform:uppercase;color:var(--text-muted);
}
.admin-page-hero__title{margin:0;font-size:19px;font-weight:900;letter-spacing:-.025em;color:var(--text-primary)}
.admin-page-hero__text{margin:4px 0 0;color:var(--text-secondary);font-size:13px;line-height:1.45}
.admin-page-hero__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.admin-page-hero__pill{
  display:inline-flex;align-items:center;min-height:28px;padding:4px 9px;border:1px solid var(--border);
  background:var(--bg-elevated);border-radius:var(--r)!important;font-size:11px;font-weight:800;color:var(--text-secondary);
}
.admin-action-row{display:flex;justify-content:flex-end;margin:0 0 14px;gap:8px;flex-wrap:wrap}

/* Paramètres : structure lisible, zones sensibles mieux cadrées */
#pgSettings .settings-shell{max-width:1400px;margin:0 auto}
#pgSettings .settings-hero-card{border-left:3px solid var(--blue)!important}
#pgSettings .settings-hero-body{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
#pgSettings .settings-hero-title{font-size:20px!important;font-weight:900!important;letter-spacing:-.025em;margin:0}
#pgSettings .settings-hero-text{max-width:820px;color:var(--text-secondary)!important}
#pgSettings .settings-main-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:14px;align-items:start}
#pgSettings .settings-main-column{display:flex;flex-direction:column;gap:14px}
#pgSettings .settings-card{overflow:hidden}
#pgSettings .settings-section-header svg{width:18px;height:18px;color:var(--blue);vertical-align:-4px;margin-right:6px}
#pgSettings .settings-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#pgSettings .settings-action-card{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;align-items:start;padding:12px;border:1px solid var(--border);background:var(--bg-elevated);border-radius:var(--r)!important}
#pgSettings .settings-action-card .btn{grid-column:1/-1;justify-content:center}
#pgSettings .settings-action-icon{width:40px;height:40px;display:grid;place-items:center;background:var(--blue-pale);color:var(--blue);border-radius:var(--r)!important}
#pgSettings .settings-action-content h4{margin:0 0 3px;font-size:13px;font-weight:900}
#pgSettings .settings-action-content p{margin:0;color:var(--text-muted);font-size:12px;line-height:1.35}
#pgSettings .settings-danger-zone,.settings-card.danger{border-left:3px solid var(--red)!important}

/* Utilisateurs / emplacements : filtres et tableaux cohérents */
#pgUsers .filters-bar,#pgLocations .loc-topbar,
#ordersRoot .orders-filters,#pgReports .report-filter-bar{
  background:var(--bg-card)!important;border:1px solid var(--border)!important;border-radius:var(--r-lg)!important;
  box-shadow:var(--shadow)!important;padding:12px 14px!important;margin-bottom:14px!important;
}
#pgUsers .filters-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#pgUsers .filters-section{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
#pgUsers .search-box{min-width:min(100%,320px);flex:1 1 320px}
#pgUsers .search-box input{font-size:14px}
#pgUsers .cell-actions .btn,#pgLocations td .btn,#ordersRoot .oact{min-width:38px;min-height:38px;justify-content:center}
#pgUsers #userTable tbody tr td:first-child,#pgLocations #tblLocations tbody tr td:first-child{border-left:3px solid transparent}
#pgUsers #userTable tbody tr:hover td:first-child,#pgLocations #tblLocations tbody tr:hover td:first-child{border-left-color:var(--blue)}

/* Emplacements : topbar claire et zones visuelles plus premium */
#pgLocations .loc-topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
#pgLocations .loc-topbar-left,#pgLocations .loc-topbar-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
#pgLocations .loc-search-wrap{min-width:min(100%,320px);flex:1 1 320px}
#pgLocations .loc-view-bar{display:flex;justify-content:flex-end;margin:0 0 12px}
#pgLocations .loc-view-toggle{display:inline-flex;border:1px solid var(--border);background:var(--bg-card);border-radius:var(--r)!important;overflow:hidden}
#pgLocations .loc-vbtn{border:0;border-right:1px solid var(--border);background:transparent;color:var(--text-secondary);min-height:38px;padding:0 12px;font-weight:800}
#pgLocations .loc-vbtn:last-child{border-right:0}
#pgLocations .loc-vbtn.active{background:var(--blue-pale);color:var(--blue)}
#pgLocations .loc-zones{gap:12px}
#pgLocations .loc-zone-card,#pgLocations .loc-emplacement{border-radius:var(--r-lg)!important;border-color:var(--border)!important;box-shadow:var(--shadow)!important}
#pgLocations .loc-emplacement{border-left:3px solid var(--blue)!important}
#pgLocations .loc-card-inactive{opacity:.72;border-left-color:var(--text-muted)!important}

/* Commandes : liste humaine, KPI denses, actions stables */
#ordersRoot .orders-list-view{gap:14px!important}
#ordersRoot .olv-header{background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--blue);border-radius:var(--r-lg)!important;padding:14px 16px!important;box-shadow:var(--shadow)}
#ordersRoot .olv-title h2{font-size:19px!important;font-weight:900!important;letter-spacing:-.025em}
#ordersRoot .orders-stats{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px!important}
#ordersRoot .order-stat-card{max-width:none!important;min-width:0!important;border-left:3px solid var(--blue);border-radius:var(--r-lg)!important;box-shadow:var(--shadow)}
#ordersRoot .osc-num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;font-weight:900!important}
#ordersRoot .orders-filters select,#ordersRoot .orders-filters .form-control{min-height:38px;border-radius:var(--r)!important;background:var(--bg-input)!important;border:1px solid var(--border)!important;color:var(--text-primary)!important}
#ordersRoot #ordersTable{width:100%;border-collapse:collapse!important}
#ordersRoot #ordersTable td,#ordersRoot #ordersTable th{padding:10px 12px!important;border-bottom:1px solid var(--border)!important}
#ordersRoot #ordersTable tbody tr:hover{background:var(--bg-hover)!important}
#ordersRoot .order-form-view,#ordersRoot .ofv-nav,#ordersRoot .ofv-body{border-radius:0!important}
#ordersRoot .order-line-card,#ordersRoot .recv-line-card,#ordersRoot .order-product-summary{border-radius:var(--r)!important}

/* Rapports : onglets et filtres lisibles, tableaux préparés mobile */
#pgReports .report-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px;padding:8px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-lg)!important;box-shadow:var(--shadow)}
#pgReports .report-tab{min-height:38px;border:1px solid var(--border)!important;background:var(--bg-elevated);color:var(--text-secondary);border-radius:var(--r)!important;padding:0 10px;font-weight:800}
#pgReports .report-tab.active{background:var(--blue);border-color:var(--blue)!important;color:#fff}
#pgReports .sect-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;flex-wrap:wrap}
#pgReports .page-title{font-size:17px!important;font-weight:900!important;letter-spacing:-.02em;margin:0}
#pgReports .kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
#pgReports .kpi-card{border-radius:var(--r-lg)!important;border:1px solid var(--border)!important;border-left:3px solid var(--blue);box-shadow:var(--shadow);background:var(--bg-card)}
#pgReports .kpi-card.green{border-left-color:var(--green)}
#pgReports .kpi-card.red{border-left-color:var(--red)}
#pgReports .kpi-card.blue{border-left-color:var(--blue)}
#pgReports .kpi-value{font-size:24px!important;font-weight:900!important}
#pgReports .kpi-label{font-size:11px!important;font-weight:800!important;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}
#pgReports .report-tab-content:not(.active){display:none!important}

@media (max-width: 1024px){
  #pgSettings .settings-main-grid{grid-template-columns:1fr}
  #ordersRoot .orders-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
  #pgReports .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width: 760px){
  .admin-page-hero{border-left:0;border-right:0;border-radius:0!important;margin:0 0 12px;padding:14px;display:block}
  .admin-page-hero__actions{justify-content:flex-start;margin-top:10px}
  #pgSettings .settings-hero-body{display:block}
  #pgSettings .settings-hero-pills{margin-top:10px}
  #pgSettings .settings-action-grid{grid-template-columns:1fr}
  #pgUsers .filters-bar,#pgLocations .loc-topbar,#ordersRoot .orders-filters,#pgReports .report-filter-bar{border-left:0!important;border-right:0!important;border-radius:0!important;margin-left:0!important;margin-right:0!important;box-shadow:none!important}
  #pgUsers .filters-section,#pgLocations .loc-topbar-left,#pgLocations .loc-topbar-right{width:100%;display:grid!important;grid-template-columns:1fr;gap:8px}
  #pgUsers .filters-section.ml-auto{grid-template-columns:1fr;align-items:stretch}
  #pgUsers .search-box,#pgLocations .loc-search-wrap{min-width:0;width:100%}
  #pgLocations .loc-sel,#pgLocations .loc-search-inp,#pgLocations .loc-topbar-right .btn{width:100%}
  #pgLocations .loc-view-bar{justify-content:stretch;padding:0 12px}
  #pgLocations .loc-view-toggle{width:100%}.loc-vbtn{flex:1}
  #ordersRoot .olv-header{border-left:0;border-right:0;border-radius:0!important;box-shadow:none!important}
  #ordersRoot .orders-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0!important;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
  #ordersRoot .order-stat-card{border-radius:0!important;border:0!important;border-left:3px solid var(--blue)!important;border-right:1px solid var(--border)!important;border-bottom:1px solid var(--border)!important;box-shadow:none!important}
  #ordersRoot .orders-filters{display:grid!important;grid-template-columns:1fr;gap:8px!important}
  #ordersRoot .orders-filters select,#ordersRoot .orders-filters .btn{width:100%!important;min-width:0!important}
  #pgReports .report-tabs{border-left:0!important;border-right:0!important;border-radius:0!important;overflow:auto;flex-wrap:nowrap;scroll-snap-type:x proximity}
  #pgReports .report-tab{white-space:nowrap;scroll-snap-align:start}
  #pgReports .sect-toolbar{padding:10px 12px;margin:0}
  #pgReports .sect-toolbar .flex{display:grid!important;grid-template-columns:1fr 1fr;gap:8px;width:100%}

  /* Tables longues -> cartes mobiles via data-label */
  #pgUsers #userTable thead,#pgLocations #tblLocations thead,#ordersRoot #ordersTable thead,
  #pgReports .data-table thead{display:none!important}
  #pgUsers #userTable,#pgUsers #userTable tbody,#pgUsers #userTable tr,#pgUsers #userTable td,
  #pgLocations #tblLocations,#pgLocations #tblLocations tbody,#pgLocations #tblLocations tr,#pgLocations #tblLocations td,
  #ordersRoot #ordersTable,#ordersRoot #ordersTable tbody,#ordersRoot #ordersTable tr,#ordersRoot #ordersTable td,
  #pgReports .data-table,#pgReports .data-table tbody,#pgReports .data-table tr,#pgReports .data-table td{display:block!important;width:100%!important}
  #pgUsers #userTable tbody,#pgLocations #tblLocations tbody,#ordersRoot #ordersTable tbody,#pgReports .data-table tbody{background:var(--bg-body)}
  #pgUsers #userTable tr,#pgLocations #tblLocations tr,#ordersRoot #ordersTable tr,#pgReports .data-table tr{margin:10px 0;background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--blue);box-shadow:var(--shadow);border-radius:0!important;overflow:hidden}
  #pgUsers #userTable td,#pgLocations #tblLocations td,#ordersRoot #ordersTable td,#pgReports .data-table td{display:flex!important;align-items:flex-start;justify-content:space-between;gap:14px;padding:9px 12px!important;border-bottom:1px solid var(--border-light,var(--border))!important;text-align:right!important;white-space:normal!important}
  #pgUsers #userTable td::before,#pgLocations #tblLocations td::before,#ordersRoot #ordersTable td::before,#pgReports .data-table td::before{content:attr(data-label);font-size:10.5px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);text-align:left;min-width:96px;max-width:42%}
  #pgUsers #userTable td:first-child,#pgLocations #tblLocations td:first-child,#ordersRoot #ordersTable td:first-child,#pgReports .data-table td:first-child{display:block!important;text-align:left!important;background:var(--bg-elevated)}
  #pgUsers #userTable td:first-child::before,#pgLocations #tblLocations td:first-child::before,#ordersRoot #ordersTable td:first-child::before,#pgReports .data-table td:first-child::before{display:block;margin-bottom:4px;max-width:none}
  #pgUsers #userTable td.cell-actions,#ordersRoot #ordersTable td.order-actions{display:flex!important;justify-content:flex-end!important;flex-wrap:wrap;gap:8px;background:var(--bg-card)}
  #pgUsers #userTable td.cell-actions::before,#ordersRoot #ordersTable td.order-actions::before{display:none!important}
}

/* ================================================================
   13. v2.6.8 — Correctif menu replié + PWA installable
   ================================================================ */
.sidebar.is-collapsed{
  width:76px!important;
  min-width:76px!important;
  flex-basis:76px!important;
}
.sidebar.is-collapsed .sidebar-header{
  padding:0!important;
  justify-content:center!important;
}
.sidebar.is-collapsed .sidebar-logo{
  justify-content:center!important;
  width:100%!important;
}
.sidebar.is-collapsed .logo-text,
.sidebar.is-collapsed .sidebar-label,
.sidebar.is-collapsed .sidebar-text,
.sidebar.is-collapsed .sidebar-section,
.sidebar.is-collapsed .sidebar-badge,
.sidebar.is-collapsed .sidebar-footer{
  display:none!important;
}
.sidebar.is-collapsed .sidebar-nav{
  padding:8px 6px!important;
}
.sidebar.is-collapsed .sidebar-link{
  position:relative!important;
  justify-content:center!important;
  align-items:center!important;
  min-height:44px!important;
  height:44px!important;
  padding:0!important;
  margin:0 0 2px!important;
  gap:0!important;
  border-left:0!important;
  border-radius:0!important;
}
.sidebar.is-collapsed .sidebar-link.active{
  background:var(--blue-pale)!important;
  color:var(--blue)!important;
}
.sidebar.is-collapsed .sidebar-link.active::before{
  content:"";
  position:absolute;
  left:0;
  top:8px;
  bottom:8px;
  width:3px;
  background:var(--blue);
}
.sidebar.is-collapsed .sidebar-icon{
  width:21px!important;
  height:21px!important;
  margin:0!important;
}
.sidebar.is-collapsed .sidebar-link::after{
  content:attr(data-label);
  position:absolute;
  left:68px;
  top:50%;
  transform:translateY(-50%) translateX(-4px);
  background:#0f172a;
  color:#fff;
  padding:7px 9px;
  border-radius:2px;
  box-shadow:var(--shadow-lg);
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  z-index:1200;
  transition:opacity .14s ease,transform .14s ease;
}
.sidebar.is-collapsed .sidebar-link:hover::after,
.sidebar.is-collapsed .sidebar-link:focus-visible::after{
  opacity:1;
  transform:translateY(-50%) translateX(0);
}

.pwa-install-card{
  position:fixed;
  left:calc(16px + var(--safe-left,0px));
  right:calc(16px + var(--safe-right,0px));
  bottom:calc(16px + var(--safe-bottom,0px));
  z-index:1200;
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  align-items:center;
  gap:10px;
  max-width:820px;
  margin:0 auto;
  padding:10px 12px;
  background:var(--bg-card);
  border:1px solid var(--border-strong,var(--border));
  border-left:3px solid var(--blue);
  box-shadow:var(--shadow-lg);
  border-radius:2px;
}
.pwa-install-card[hidden]{display:none!important}
.pwa-install-mark img{width:34px;height:34px;display:block;border-radius:3px}
.pwa-install-body{min-width:0;display:flex;flex-direction:column;gap:1px}
.pwa-install-body strong{font-size:13px;font-weight:900;color:var(--text-primary)}
.pwa-install-body span{font-size:12px;color:var(--text-muted);line-height:1.35}
.pwa-install-action,.pwa-install-close{
  border-radius:2px;
  min-height:38px;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}
.pwa-install-action{border:1px solid var(--blue);background:var(--blue);color:#fff;padding:0 12px}
.pwa-install-close{width:38px;border:1px solid var(--border);background:var(--bg-card);color:var(--text-muted);font-size:20px;line-height:1}
@media (max-width:640px){
  .pwa-install-card{
    left:0;right:0;bottom:calc(var(--bottom-nav-height,60px) + var(--safe-bottom,0px));
    max-width:none;border-left:0;border-right:0;border-bottom:0;
    grid-template-columns:auto 1fr auto;
  }
  .pwa-install-close{grid-column:3;grid-row:1}
  .pwa-install-action{grid-column:1 / -1;width:100%}
}


/* v2.6.14 — Paramètres entreprise : logo client */
#pgSettings .settings-logo-panel{
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  gap:14px;
  align-items:center;
  margin-top:16px;
  padding:14px;
  border:1px solid var(--border);
  border-left:3px solid var(--blue);
  background:linear-gradient(135deg,rgba(37,99,235,.06),rgba(255,255,255,.02));
  border-radius:2px!important;
}
#pgSettings .settings-logo-preview{
  width:120px;
  height:82px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px solid var(--border);
  background:var(--bg-card);
  border-radius:2px!important;
  box-shadow:inset 0 0 0 1px rgba(148,163,184,.08);
}
#pgSettings .settings-logo-preview img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  display:block;
}
#pgSettings #companyLogoFallback{
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  color:var(--text-muted);
  text-transform:uppercase;
}
#pgSettings .settings-logo-content{min-width:0;display:flex;flex-direction:column;gap:10px}
#pgSettings .settings-logo-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
#pgSettings .settings-logo-status{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:3px 8px;
  border:1px solid var(--border);
  background:var(--bg-elevated);
  color:var(--text-muted);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
  border-radius:2px!important;
}
#pgSettings .settings-logo-status.is-ok{border-color:rgba(16,185,129,.35);background:rgba(16,185,129,.10);color:var(--green,#10b981)}
#pgSettings .settings-logo-status.is-pending{border-color:rgba(245,158,11,.4);background:rgba(245,158,11,.10);color:var(--orange,#f59e0b)}
#pgSettings .settings-logo-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
#pgSettings .settings-logo-actions .btn{min-height:38px}
@media (max-width:720px){
  #pgSettings .settings-logo-panel{grid-template-columns:1fr;align-items:stretch}
  #pgSettings .settings-logo-preview{width:100%;height:104px}
  #pgSettings .settings-logo-title-row{flex-direction:column;align-items:flex-start}
  #pgSettings .settings-logo-actions .btn{width:100%;justify-content:center}
}
.sidebar .logo-icon.company-logo-icon,
nav#slideMenu .slide-menu-logo.company-logo-icon{
  background:var(--bg-card)!important;
  border:1px solid var(--border)!important;
  padding:2px!important;
  object-fit:contain!important;
}
.sidebar .logo-icon.company-logo-icon .logo-img{
  object-fit:contain!important;
  background:transparent!important;
}

/* v2.6.17 — Logo entreprise : priorité visuelle réelle dans le shell */
.sidebar-logo.sidebar-logo--company{
  justify-content:center!important;
  gap:0!important;
  min-height:54px;
}
.sidebar-logo.sidebar-logo--company .logo-icon.company-logo-icon{
  width:min(180px,100%)!important;
  min-width:120px!important;
  height:48px!important;
  border-radius:2px!important;
  padding:5px 8px!important;
  background:var(--bg-card)!important;
}
.sidebar-logo.sidebar-logo--company .logo-img{
  width:100%!important;
  height:100%!important;
  max-width:168px!important;
  object-fit:contain!important;
}
.logo-text--image-active{display:none!important;}
#pgSettings .settings-logo-active-hint{
  margin:6px 0 0;
  font-size:12px;
  color:var(--text-muted);
  font-weight:700;
}
#pgSettings .settings-logo-active-hint.is-ok{color:var(--green,#10b981);}
#pgSettings .settings-logo-status.is-ok::before{content:'✓ ';font-weight:1000;}
#pgSettings .settings-logo-status.is-pending::before{content:'⏳ ';font-weight:1000;}

/* v2.6.18 — Logo entreprise : état actif et aperçu persistant plus lisibles */
#pgSettings .settings-logo-panel.is-active,
.settings-logo-panel.is-active{
  border-color:rgba(37,99,235,.45)!important;
  box-shadow:0 10px 30px rgba(37,99,235,.10)!important;
}
#pgSettings .settings-logo-status.is-ok{
  background:#dcfce7!important;
  color:#166534!important;
  border-color:#86efac!important;
}
#pgSettings .settings-logo-status.is-pending{
  background:#fef3c7!important;
  color:#92400e!important;
  border-color:#fbbf24!important;
}
#pgSettings .settings-logo-preview img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}

/* v2.6.19 — Paramètres logo entreprise : chemin enregistré et état introuvable */
#pgSettings .settings-logo-panel.is-missing{
  border-color:rgba(245,158,11,.45)!important;
  box-shadow:0 10px 30px rgba(245,158,11,.10)!important;
}
#pgSettings .settings-logo-status.is-warning{
  background:#fff7ed!important;
  color:#9a3412!important;
  border-color:#fdba74!important;
}
#pgSettings .settings-logo-status.is-warning::before{content:'! ';font-weight:1000;}
#pgSettings .settings-logo-path{
  margin:6px 0 0;
  padding:6px 8px;
  border:1px dashed var(--border);
  background:rgba(148,163,184,.08);
  color:var(--text-muted);
  font-size:11px;
  font-family:var(--font-mono,ui-monospace,Consolas,monospace);
  word-break:break-all;
}


/* v2.6.20 — Sidebar branding : le logo entreprise remplace le texte, pas le logo MageStock */
.sidebar-logo.sidebar-logo--with-company-logo{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  min-height:54px!important;
  width:100%!important;
  overflow:hidden!important;
}
.sidebar-logo.sidebar-logo--with-company-logo .logo-icon{
  width:36px!important;
  min-width:36px!important;
  height:36px!important;
  border-radius:8px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  flex:0 0 36px!important;
}
.sidebar-logo.sidebar-logo--with-company-logo .logo-icon .logo-img{
  width:36px!important;
  height:36px!important;
  max-width:36px!important;
  object-fit:contain!important;
  display:block!important;
}
.logo-text.logo-text--company-logo{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  min-width:0!important;
  flex:1 1 auto!important;
  overflow:hidden!important;
}
.logo-text.logo-text--company-logo .company-wordmark-img{
  display:block!important;
  max-width:156px!important;
  max-height:42px!important;
  width:auto!important;
  height:auto!important;
  object-fit:contain!important;
}
.sidebar.is-collapsed .logo-text.logo-text--company-logo{display:none!important;}
.sidebar.is-collapsed .sidebar-logo.sidebar-logo--with-company-logo{justify-content:center!important;gap:0!important;overflow:visible!important;}
@media (max-width:1100px){
  .app-shell .sidebar .sidebar-logo.sidebar-logo--with-company-logo{justify-content:center!important;gap:0!important;overflow:visible!important;}
  .app-shell .sidebar .logo-text.logo-text--company-logo{display:none!important;}
}


/* v2.6.24 — Cohérence finale : identité MageStock + logo entreprise dans tous les menus */
.slide-menu-brand.slide-menu-brand--with-company-logo{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
}
.slide-menu-brand.slide-menu-brand--with-company-logo .slide-menu-logo{
  flex:0 0 32px!important;
  width:32px!important;
  height:32px!important;
  object-fit:contain!important;
}
.slide-menu-title.slide-menu-title--company-logo{
  display:flex!important;
  align-items:center!important;
  min-width:0!important;
  max-width:170px!important;
  overflow:hidden!important;
}
.slide-menu-title.slide-menu-title--company-logo .company-wordmark-img{
  display:block!important;
  max-width:160px!important;
  max-height:38px!important;
  width:auto!important;
  height:auto!important;
  object-fit:contain!important;
}
@media (max-width:380px){
  .slide-menu-title.slide-menu-title--company-logo{max-width:132px!important}
  .slide-menu-title.slide-menu-title--company-logo .company-wordmark-img{max-width:128px!important}
}
.ms-image-missing-note{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 7px;
  border:1px dashed var(--border);
  background:rgba(245,158,11,.08);
  color:#92400e;
  font-size:11px;
  font-weight:800;
}
@media print{
  .ms-image-missing-note{display:none!important}
}
