/**
 * MageTicket
 *
 * Fichier        : public/assets/css/shell.css
 * Rôle           : Shell authentifié commun, workspace adaptatif, rail tablette, tiroir mobile et footer.
 * Auteur         : Régis KREMER
 * Version        : 0.33.51
 * Version projet : 0.33.0
 * Lot            : MAGETICKET BRAND PNG LOGO SYSTEM REPLACEMENT1
 * Base requise   : 0.33.37
 * Créé le        : 2026-07-22
 * Modifié le     : 2026-07-26
 * Dépendances    : tokens.css, components.css, app.css, responsive.css et layout.php
 * Contraintes    : bord à bord tablette/mobile, zoom autorisé, zones sûres, aucun défilement horizontal imposé.
 * Modifications  : Dimensionnement natif du verrouillage horizontal PNG et bascule vers le monogramme compact sur mobile.
 */

:root{--shell-sidebar-current:var(--sidebar-w);--shell-mobile-nav-h:0px}
body:has(.app-shell){min-height:100dvh;overflow:hidden;background:var(--bg)}
.app-shell{min-width:0;min-height:100dvh;height:var(--visual-viewport-height,100dvh);display:grid;grid-template-columns:var(--shell-sidebar-current) minmax(0,1fr);grid-template-rows:var(--topbar-h) minmax(0,1fr);background:var(--bg);color:var(--text);isolation:isolate}
.app-shell-topbar{grid-column:1/-1;grid-row:1;position:relative;z-index:70;min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--space-4);padding:max(8px,var(--safe-top)) max(14px,var(--safe-right)) 8px max(14px,var(--safe-left));border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg-deep) 94%,transparent);box-shadow:0 1px 0 rgb(255 255 255 / 2%);backdrop-filter:blur(16px)}
.app-shell-menu-button{display:none}.app-shell-brand,.app-shell-drawer-brand{display:flex;align-items:center;color:var(--text);text-decoration:none}.app-shell-brand-lockup{display:block;width:clamp(128px,10vw,152px);height:auto;max-height:36px;object-fit:contain}.app-shell-brand-mark{display:none;width:34px;height:34px;object-fit:contain}.app-shell-drawer-brand img{display:block;width:150px;height:auto;max-height:42px;object-fit:contain}html[data-theme="dark"] .app-shell-brand-lockup{display:none}html[data-theme="dark"] .app-shell-brand-mark{display:block}
.app-shell-page-context{min-width:0;min-height:32px;display:flex;align-items:center;gap:7px;padding:5px max(16px,var(--safe-right)) 5px max(16px,var(--safe-left));border-bottom:1px solid var(--line);background:var(--surface-soft);color:var(--muted);font-size:var(--fs-xs)}.app-shell-page-context small{font:inherit}.app-shell-page-context i{font-size:var(--icon-sm)}.app-shell-page-context strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:var(--fs-sm)}.app-shell-profile small{color:var(--muted);font-size:var(--fs-xs)}
.app-shell-search{min-width:0;width:min(100%,680px);height:40px;justify-self:center;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;padding:0 11px;border:1px solid var(--line-strong);border-radius:var(--r-ctrl);background:var(--surface);box-shadow:inset 0 1px 0 rgb(255 255 255 / 3%)}.app-shell-search:focus-within{border-color:var(--focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 25%,transparent)}.app-shell-search input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:var(--text)}.app-shell-search input::placeholder{color:var(--muted)}
.app-shell-actions{justify-self:end;display:flex;align-items:center;justify-content:flex-end;gap:6px}.app-shell-actions form{margin:0}.app-shell-profile{min-width:0;max-width:220px;height:42px;display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:8px;padding:4px 7px;border:1px solid transparent;border-radius:var(--r-sm);color:var(--text);text-decoration:none}.app-shell-profile:hover{border-color:var(--line);background:var(--surface-soft)}.app-shell-profile .avatar{width:32px;height:32px}.app-shell-profile span:last-child{min-width:0}.app-shell-profile strong,.app-shell-profile small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-shell-profile strong{font-size:var(--fs-sm)}
.app-shell-sidebar{grid-column:1;grid-row:2;position:relative;z-index:60;min-width:0;min-height:0;display:flex;flex-direction:column;border-right:1px solid var(--line);background:linear-gradient(180deg,var(--bg-deep),color-mix(in srgb,var(--bg-deep) 86%,var(--surface)));overflow:visible}.app-shell-drawer-heading{display:none}.app-shell-navigation{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;padding:10px 8px;scrollbar-width:thin}.app-shell-nav-group{display:grid;gap:3px;margin:0 0 10px}.app-shell-nav-group h2{margin:7px 9px 4px;color:var(--muted);font-size:var(--fs-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.app-shell-nav-item{position:relative;min-height:42px;display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:10px;padding:0 10px;border:1px solid transparent;border-radius:var(--r-sm);color:var(--text);font-size:var(--fs-sm);font-weight:570;text-decoration:none}.app-shell-nav-item i{font-size:var(--icon-md);color:var(--muted);text-align:center}.app-shell-nav-item:hover{border-color:var(--line);background:var(--surface-soft)}.app-shell-nav-item.is-active{border-color:color-mix(in srgb,var(--brand) 42%,var(--line));background:color-mix(in srgb,var(--brand) 15%,var(--surface));box-shadow:inset 3px 0 0 var(--brand)}.app-shell-nav-item.is-active i{color:var(--brand)}
.app-shell-sidebar-footer{position:relative;flex:0 0 auto;display:grid;gap:4px;padding:8px;border-top:1px solid var(--line);background:color-mix(in srgb,var(--bg-deep) 94%,var(--surface))}.app-shell-settings-link{position:relative;min-height:54px;display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:9px;padding:5px 8px;border:1px solid transparent;border-radius:var(--r-sm);color:var(--text);text-decoration:none}.app-shell-settings-link:hover{border-color:var(--line);background:var(--surface-soft)}.app-shell-settings-link.is-active{border-color:color-mix(in srgb,var(--brand) 42%,var(--line));background:color-mix(in srgb,var(--brand) 15%,var(--surface));box-shadow:inset 3px 0 0 var(--brand)}.app-shell-settings-icon,.app-shell-collapse-icon{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);color:var(--muted)}.app-shell-settings-link.is-active .app-shell-settings-icon{border-color:color-mix(in srgb,var(--brand) 46%,var(--line));color:var(--brand)}.app-shell-settings-copy{min-width:0}.app-shell-settings-copy strong,.app-shell-settings-copy small{display:block;overflow:hidden}.app-shell-settings-copy strong{font-size:var(--fs-sm);text-overflow:ellipsis;white-space:nowrap}.app-shell-settings-copy small{display:-webkit-box;margin-top:2px;color:var(--muted);font-size:var(--fs-xs);line-height:1.25;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:normal}
.app-shell-collapse{min-height:42px;display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:9px;padding:4px 8px;border:1px solid transparent;border-radius:var(--r-sm);background:transparent;color:var(--muted);font-size:var(--fs-sm);text-align:left;white-space:nowrap}.app-shell-collapse:hover{border-color:var(--line);color:var(--text);background:var(--surface-soft)}.app-shell-collapse-icon{transition:transform var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease),background var(--dur-1) var(--ease)}.app-shell-collapse:hover .app-shell-collapse-icon{transform:translateX(-2px);border-color:var(--line-strong);background:var(--surface-raised)}.app-shell-collapse:active .app-shell-collapse-icon{transform:translateX(-1px) scale(.96)}
.app-shell[data-sidebar-state="collapsed"] [data-navigation-tooltip]::after{content:attr(data-navigation-tooltip);position:absolute;z-index:95;left:calc(100% + 10px);top:50%;width:max-content;max-width:260px;padding:8px 10px;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface-raised);box-shadow:var(--shadow-2);color:var(--text);font-size:var(--fs-xs);font-weight:550;line-height:1.4;white-space:normal;opacity:0;pointer-events:none;transform:translate(4px,-50%);transition:opacity var(--dur-1) var(--ease),transform var(--dur-1) var(--ease)}.app-shell[data-sidebar-state="collapsed"] [data-navigation-tooltip]:is(:hover,:focus-visible)::after{opacity:1;transform:translate(0,-50%)}
.app-shell-stage{grid-column:2;grid-row:2;min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:contain}.app-shell-content{min-width:0;min-height:0;flex:1 1 auto;display:flex;flex-direction:column;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.app-shell-content>*{min-width:0}.app-shell-footer{min-height:var(--footer-h);flex:0 0 auto;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;padding:10px max(16px,var(--safe-right)) max(10px,var(--safe-bottom)) max(16px,var(--safe-left));border-top:1px solid var(--line);background:var(--bg-deep);color:var(--muted);font-size:var(--fs-xs)}.app-shell-footer strong{color:var(--text)}.app-shell-footer a{color:var(--brand)}
.app-shell-scrim{position:fixed;inset:var(--topbar-h) 0 0;z-index:55;background:rgb(0 0 0 / 58%);backdrop-filter:blur(2px)}.app-shell-mobile-navigation{display:none}

/* État replié persistant sur grand écran. */
.app-shell[data-sidebar-state="collapsed"]{--shell-sidebar-current:var(--sidebar-w-collapsed)}.app-shell[data-sidebar-state="collapsed"] .app-shell-nav-group h2,.app-shell[data-sidebar-state="collapsed"] .app-shell-nav-item span,.app-shell[data-sidebar-state="collapsed"] .app-shell-settings-copy,.app-shell[data-sidebar-state="collapsed"] .app-shell-collapse>[data-shell-collapse-label]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-shell[data-sidebar-state="collapsed"] .app-shell-nav-item{grid-template-columns:1fr;justify-items:center;padding:0}.app-shell[data-sidebar-state="collapsed"] .app-shell-nav-item i{font-size:var(--icon-lg)}.app-shell[data-sidebar-state="collapsed"] .app-shell-nav-group{margin-bottom:5px}.app-shell[data-sidebar-state="collapsed"] .app-shell-nav-group h2{margin:0}.app-shell[data-sidebar-state="collapsed"] .app-shell-settings-link,.app-shell[data-sidebar-state="collapsed"] .app-shell-collapse{grid-template-columns:1fr;justify-items:center;padding:4px}.app-shell[data-sidebar-state="collapsed"] .app-shell-sidebar-footer{padding:7px 8px}

/* Les centres historiques deviennent le contenu du shell commun. */
.app-shell-content>.app-page-workspace{width:100%;min-width:0;min-height:100%;height:auto}.app-shell-content .app-page-main{width:100%;min-width:0;min-height:0}
.app-shell-content>.workspace{min-height:100%;height:auto;display:block;background:transparent}.app-shell-content>.workspace>.workspace-topbar,.app-shell-content>.workspace>.sidebar,.app-shell-content>.workspace>.navigation-scrim{display:none!important}.app-shell-content>.workspace>.dashboard{min-height:0;width:100%;margin:0;padding:var(--space-4);grid-column:auto;grid-row:auto}.app-shell-content>.cockpit-workspace{min-height:0;height:100%;flex:1 1 auto;display:flex;flex-direction:column;overflow:hidden}.app-shell-content>.cockpit-workspace>.cockpit-dashboard{min-height:0;height:100%;flex:1 1 auto;padding:0;overflow:hidden}.app-shell-content>.workspace>.mobile-action-bar{z-index:65}
.app-shell-content>:is(.account-security-shell,.archive-shell,.assets-shell,.automation-shell,.collaboration-shell,.distribution-shell,.field-shell,.identity-admin-shell,.itsm-shell,.ldap-shell,.observability-shell,.omni-shell,.portal-shell,.privacy-shell,.pwa-shell,.reporting-shell,.routing-shell,.search-shell,.settings-shell){min-height:100%;height:auto;background:transparent}
.app-shell-content>.collaboration-shell{width:100%;max-width:none}.app-shell-content .collaboration-main{width:100%;max-width:none!important;margin:0;align-self:stretch}




.app-shell-content :is(.distribution-brand,.observability-brand,.privacy-brand){display:none!important}
.app-shell-content :is(.archive-main,.assets-main,.automation-main,.collaboration-main,.field-main,.identity-admin-main,.itsm-main,.ldap-main,.omni-main,.portal-main,.reporting-main,.routing-main,.search-main,.distribution-workspace,.observability-workspace,.privacy-workspace,.pwa-workspace,.ai-workspace,.knowledge-shell,.identity-admin.account-security){min-width:0;min-height:0;flex:1 0 auto}
.app-shell-content [data-responsive-workspace]{min-width:0;min-height:0;flex:1 1 auto}.app-shell-content .upper-grid{min-width:0;min-height:0;flex:1 1 auto}.app-shell-content .lower-grid{margin-top:auto}

@media (max-width:1199px){
  .app-shell{--shell-sidebar-current:var(--sidebar-w-collapsed)}
  .app-shell-topbar{grid-template-columns:auto minmax(0,1fr) auto;gap:var(--space-3)}
  .app-shell-search{width:min(100%,560px)}.app-shell-profile{max-width:44px;grid-template-columns:32px;padding:4px}.app-shell-profile>span:last-child{display:none}
  .app-shell-nav-group h2,.app-shell-nav-item span,.app-shell-settings-copy{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-shell-nav-item{grid-template-columns:1fr;justify-items:center;padding:0}.app-shell-nav-item i{font-size:var(--icon-lg)}.app-shell-nav-group{margin-bottom:5px}.app-shell-settings-link{grid-template-columns:1fr;justify-items:center;padding:4px}.app-shell-collapse{display:none}.app-shell [data-navigation-tooltip]::after{content:attr(data-navigation-tooltip);position:absolute;z-index:95;left:calc(100% + 10px);top:50%;width:max-content;max-width:260px;padding:8px 10px;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--surface-raised);box-shadow:var(--shadow-2);color:var(--text);font-size:var(--fs-xs);font-weight:550;line-height:1.4;white-space:normal;opacity:0;pointer-events:none;transform:translate(4px,-50%);transition:opacity var(--dur-1) var(--ease),transform var(--dur-1) var(--ease)}.app-shell [data-navigation-tooltip]:is(:hover,:focus-visible)::after{opacity:1;transform:translate(0,-50%)}
}

@media (max-width:760px),(max-height:520px) and (max-width:960px){
  :root{--shell-mobile-nav-h:64px}
  body:has(.app-shell){overflow:hidden}
  .app-shell{--shell-sidebar-current:0px;grid-template-columns:minmax(0,1fr);grid-template-rows:var(--topbar-h) minmax(0,1fr)}
  .app-shell-topbar{grid-column:1;grid-template-columns:auto auto minmax(0,1fr) auto;gap:8px;padding:max(7px,var(--safe-top)) max(10px,var(--safe-right)) 7px max(10px,var(--safe-left))}.app-shell-menu-button{display:inline-grid}.app-shell-page-context{display:none}.app-shell-search{width:100%;height:38px;padding:0 9px}.app-shell-actions>a[aria-label="Ouvrir l’aide"],.app-shell-actions .app-shell-profile,.app-shell-actions form{display:none}
  .app-shell-sidebar{position:fixed;top:0;bottom:0;left:0;z-index:80;width:min(86vw,340px);max-width:100%;padding:0 0 var(--safe-bottom);border-right:1px solid var(--line-strong);box-shadow:var(--shadow-3);overflow:hidden;transform:translateX(-105%);transition:transform var(--dur-2) var(--ease)}.app-shell.is-navigation-open .app-shell-sidebar{transform:translateX(0)}.app-shell-drawer-heading{min-height:calc(var(--topbar-h) + var(--safe-top));display:flex;align-items:center;justify-content:space-between;gap:12px;padding:max(10px,var(--safe-top)) 12px 10px;border-bottom:1px solid var(--line)}.app-shell-brand-lockup{display:none}.app-shell-brand-mark{display:block}.app-shell-drawer-brand img{width:150px;height:auto;max-height:42px}.app-shell-navigation{padding:9px 8px}.app-shell-nav-group h2{position:static;width:auto;height:auto;margin:9px 10px 4px;overflow:visible;clip:auto;white-space:normal}.app-shell-nav-item{grid-template-columns:24px minmax(0,1fr);justify-items:stretch;padding:0 10px}.app-shell-nav-item span,.app-shell-settings-copy{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal}.app-shell-settings-link{grid-template-columns:34px minmax(0,1fr);justify-items:stretch;padding:5px 8px}.app-shell-sidebar-footer{padding:8px max(8px,var(--safe-right)) max(8px,var(--safe-bottom)) max(8px,var(--safe-left))}.app-shell-collapse{display:none}.app-shell [data-navigation-tooltip]::after{display:none}
  .app-shell-stage{grid-column:1;grid-row:2;padding-bottom:var(--shell-mobile-nav-h)}.app-shell-content{scrollbar-gutter:auto}.app-shell.has-contextual-mobile-navigation .app-shell-stage{padding-bottom:0}.app-shell-footer{padding-bottom:max(10px,var(--safe-bottom));text-align:center}
  .app-shell-mobile-navigation{position:fixed;z-index:72;left:0;right:0;bottom:0;min-height:var(--shell-mobile-nav-h);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:5px max(5px,var(--safe-right)) max(5px,var(--safe-bottom)) max(5px,var(--safe-left));border-top:1px solid var(--line);background:color-mix(in srgb,var(--bg-deep) 96%,transparent);backdrop-filter:blur(16px)}.app-shell-mobile-navigation a,.app-shell-mobile-navigation button{min-width:0;min-height:50px;display:grid;place-items:center;align-content:center;gap:3px;padding:3px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--muted);font-size:var(--fs-xs);text-decoration:none}.app-shell-mobile-navigation i{font-size:var(--icon-lg)}.app-shell-mobile-navigation [aria-current="page"]{background:color-mix(in srgb,var(--brand) 16%,var(--surface));color:var(--brand)}
  .app-shell-content>.workspace>.dashboard{padding:0}
}

@media (prefers-reduced-motion:reduce){.app-shell-sidebar{transition:none!important}.app-shell-collapse-icon,.app-shell [data-navigation-tooltip]::after{transition:none}}
@media (forced-colors:active){.app-shell-topbar,.app-shell-sidebar,.app-shell-footer,.app-shell-mobile-navigation,.app-shell-sidebar-footer{border-color:CanvasText}.app-shell-nav-item.is-active,.app-shell-settings-link.is-active{outline:2px solid Highlight;outline-offset:-2px}}

.app-notification-center{position:relative}.app-notification-trigger{position:relative}.app-notification-badge{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;padding:0 4px;display:grid;place-items:center;border:2px solid var(--bg-deep);border-radius:999px;background:var(--danger);color:#fff;font-size:10px;font-weight:800}.app-notification-panel{position:absolute;z-index:120;top:calc(100% + 10px);right:0;width:min(420px,calc(100vw - 20px));max-height:min(620px,calc(var(--visual-viewport-height,100dvh) - var(--topbar-h) - 20px));display:flex;flex-direction:column;border:1px solid var(--line-strong);border-radius:var(--r-md);background:var(--surface-raised);box-shadow:var(--shadow-3);overflow:hidden}.app-notification-panel[hidden]{display:none}.app-notification-panel>header{display:flex;align-items:center;justify-content:space-between;padding:14px 14px 10px;border-bottom:1px solid var(--line)}.app-notification-panel h2{margin:2px 0 0;font-size:var(--fs-lg)}.app-notification-panel header small{color:var(--muted)}.app-notification-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-bottom:1px solid var(--line);background:var(--surface-soft)}.app-notification-toolbar a{color:var(--brand);font-size:var(--fs-sm);font-weight:700}.app-notification-list{min-height:120px;overflow:auto}.app-notification-item{display:grid;grid-template-columns:minmax(0,1fr) auto;border-bottom:1px solid var(--line)}.app-notification-item>a{min-width:0;display:grid;grid-template-columns:34px minmax(0,1fr);gap:9px;padding:12px;color:var(--text);text-decoration:none}.app-notification-item.is-unread{background:color-mix(in srgb,var(--brand) 9%,var(--surface))}.app-notification-item>a:hover{background:var(--surface-soft)}.app-notification-item strong,.app-notification-item small,.app-notification-item time{display:block}.app-notification-item small{margin-top:3px;color:var(--muted);line-height:1.35}.app-notification-item time{margin-top:6px;color:var(--muted);font-size:var(--fs-xs)}.app-notification-item>.icon-button{align-self:start;margin:8px 6px 0 0}.app-notification-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:var(--r-sm);background:color-mix(in srgb,var(--brand) 16%,var(--surface));color:var(--brand)}.app-notification-empty{padding:28px 18px;text-align:center;color:var(--muted)}@media(max-width:760px){.app-notification-panel{position:fixed;top:calc(var(--topbar-h) + var(--safe-top));right:8px;left:8px;width:auto;max-height:calc(var(--visual-viewport-height,100dvh) - var(--topbar-h) - var(--safe-top) - 16px)}.app-shell-actions .app-notification-center{display:block}}