/**
 * MageTicket
 *
 * Fichier        : public/assets/css/settings.css
 * Rôle           : Mise en page dense et responsive du centre Paramètres.
 * Auteur         : Régis KREMER
 * Version        : 0.33.2
 * Version projet : 0.33.0
 * Lot            : MAGETICKET GLOBAL DESIGN MODULES VISUAL CONSISTENCY FIX2
 * Base requise   : 0.33.0 + MAGETICKET GLOBAL DESIGN SYSTEM REQUESTER FULL VIEW UNIFICATION1
 * Créé le        : 2026-07-23
 * Modifié le     : 2026-07-24
 * Dépendances    : shell.css, tokens.css et components.css
 * Contraintes    : sélecteurs strictement scopés, aucune couleur locale, bord à bord mobile et cibles tactiles conformes
 * Modifications  : séparation structurelle de la racine et du contenu Paramètres, à apparence inchangée.
 */

.settings-shell{width:100%;min-width:0;min-height:100%;height:auto;display:flex;flex-direction:column;background:var(--bg)}
.settings-hub{min-width:0;min-height:0;flex:1 1 auto;display:flex;flex-direction:column;background:var(--bg)}


.settings-hub-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid var(--line);background:var(--surface)}.settings-hub-overview>div{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px var(--space-3);padding:var(--space-4) var(--space-5);border-right:1px solid var(--line)}.settings-hub-overview>div:last-child{border-right:0}.settings-hub-overview span{color:var(--muted);font-size:var(--fs-xs);font-weight:650;text-transform:uppercase;letter-spacing:.05em}.settings-hub-overview strong{grid-column:2;grid-row:1/3;max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:var(--fs-lg);font-variant-numeric:tabular-nums}.settings-hub-overview small{color:var(--muted-2);font-size:var(--fs-xs)}
.settings-hub-index{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--line);background:var(--bg-deep);overflow:auto;scrollbar-width:thin}.settings-hub-index a{flex:0 0 auto;min-height:36px;display:inline-flex;align-items:center;padding:0 var(--space-3);border:1px solid var(--line);border-radius:var(--r-ctrl);background:var(--surface);color:var(--text);font-size:var(--fs-sm);font-weight:600;text-decoration:none}.settings-hub-index a:hover{border-color:var(--line-strong);background:var(--surface-raised);color:var(--brand-strong)}
.settings-hub-sections{min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:var(--space-4);padding:var(--space-5)}
.settings-group{min-width:0;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--shadow-1);overflow:hidden;scroll-margin-top:var(--space-4)}.settings-group-heading{min-width:0;display:grid;grid-template-columns:38px minmax(0,1fr);align-items:start;gap:var(--space-3);padding:var(--space-4);border-bottom:1px solid var(--line);background:var(--surface-soft)}.settings-group-icon{width:38px;height:38px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--brand) 32%,var(--line));border-radius:var(--r-sm);background:var(--brand-soft);color:var(--brand-strong)}.settings-group-icon i{font-size:var(--icon-lg)}.settings-group-heading h2{margin:0;color:var(--text);font-size:var(--fs-lg);line-height:1.25}.settings-group-heading p{margin:var(--space-1) 0 0;color:var(--muted);font-size:var(--fs-sm);line-height:1.45}
.settings-entry-list{display:grid}.settings-entry{min-width:0;min-height:86px;display:grid;grid-template-columns:36px minmax(0,1fr) 30px;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--line);color:var(--text);text-decoration:none;transition:background var(--dur-1) var(--ease),box-shadow var(--dur-1) var(--ease)}.settings-entry:last-child{border-bottom:0}.settings-entry:hover{background:var(--surface-raised);box-shadow:inset 3px 0 0 var(--brand)}.settings-entry:active{background:var(--surface-3)}.settings-entry-icon{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface-soft);color:var(--muted)}.settings-entry:hover .settings-entry-icon{border-color:color-mix(in srgb,var(--brand) 36%,var(--line));color:var(--brand-strong)}.settings-entry-icon i{font-size:var(--icon-md)}.settings-entry-copy{min-width:0;display:block}.settings-entry-meta{display:block;margin-bottom:2px;color:var(--brand-strong);font-size:var(--fs-xs);font-weight:650;text-transform:uppercase;letter-spacing:.04em}.settings-entry-copy strong{display:block;color:var(--text);font-size:var(--fs-md);line-height:1.25}.settings-entry-copy small{display:block;margin-top:4px;color:var(--muted);font-size:var(--fs-sm);line-height:1.4}.settings-entry-open{width:30px;height:30px;display:grid;place-items:center;border:1px solid transparent;border-radius:var(--r-sm);color:var(--muted);transition:transform var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease),background var(--dur-1) var(--ease)}.settings-entry:hover .settings-entry-open{transform:translateX(2px);border-color:var(--line);background:var(--surface);color:var(--brand-strong)}
@media (max-width:1100px){.settings-hub-sections{grid-template-columns:minmax(0,1fr)}.settings-hub-overview>div,.settings-hub-index,.settings-hub-sections{padding-left:var(--space-4);padding-right:var(--space-4)}}
@media (max-width:700px){.settings-hub-overview{grid-template-columns:minmax(0,1fr)}.settings-hub-overview>div{min-height:66px;padding:var(--space-3) max(var(--space-4),var(--safe-right)) var(--space-3) max(var(--space-4),var(--safe-left));border-right:0;border-bottom:1px solid var(--line)}.settings-hub-overview>div:last-child{border-bottom:0}.settings-hub-overview strong{font-size:var(--fs-md)}.settings-hub-index{padding:var(--space-3) max(var(--space-4),var(--safe-right)) var(--space-3) max(var(--space-4),var(--safe-left))}.settings-hub-sections{gap:var(--space-3);padding:var(--space-3) max(var(--space-3),var(--safe-right)) max(var(--space-4),var(--safe-bottom)) max(var(--space-3),var(--safe-left))}.settings-group{border-radius:var(--r-sm)}.settings-entry{min-height:92px;grid-template-columns:34px minmax(0,1fr) 26px;padding:var(--space-3)}.settings-entry-copy small{font-size:var(--fs-xs)}}
@media (prefers-reduced-motion:reduce){.settings-entry,.settings-entry-open{transition:none}}
@media (forced-colors:active){.settings-group,.settings-entry,.settings-hub-index a{border-color:CanvasText}.settings-entry:hover{outline:2px solid Highlight;outline-offset:-2px}}
