.app-shell { min-height: 100vh; }

.app-sidebar {
    background: var(--cde-navy);
    bottom: 0;
    color: #fff;
    display: flex;
    flex-direction: column;
    left: 0;
    position: fixed;
    top: 0;
    width: var(--cde-sidebar);
    z-index: 1040;
}

.app-brand {
    align-items: center;
    color: #fff;
    display: flex;
    gap: 0;
    min-height: var(--cde-topbar);
    padding: .8rem 1.25rem;
    text-decoration: none;
}
.app-brand:hover { color: #fff; }
.app-brand-lockup { display:block; width:100%; }
.app-brand-wordmark { display:block; height:auto; width:158px; }
.app-brand-name { display: block; font-size: 1.12rem; font-weight: 800; letter-spacing: .05em; }
.app-brand-tagline { color: #aab4c5; display: block; font-size: .53rem; letter-spacing: .015em; margin-top:.28rem; white-space: nowrap; }

.app-sidebar-nav { flex: 1; overflow-y: auto; padding: .7rem .75rem 1rem; }
.app-nav-label { color: #778398; font-size: .66rem; font-weight: 700; letter-spacing: .1em; padding: 1.1rem .75rem .45rem; text-transform: uppercase; }
.app-nav-link {
    align-items: center;
    border-radius: var(--cde-radius-sm);
    color: #bdc6d5;
    display: flex;
    font-size: .87rem;
    font-weight: 600;
    gap: .75rem;
    margin-bottom: .2rem;
    padding: .68rem .75rem;
    text-decoration: none;
    transition: background var(--cde-transition), color var(--cde-transition), transform var(--cde-transition);
}
.app-nav-link:hover { background: rgba(255,255,255,.07); color: #fff; transform: translateX(2px); }
.app-nav-link.active { background: var(--cde-primary); color: #fff; box-shadow: 0 8px 18px rgba(20,100,214,.24); }
.app-nav-icon { height: 19px; width: 19px; flex: 0 0 19px; }
.app-nav-badge { background: var(--cde-warning); border-radius: 999px; color: var(--cde-navy); font-size: .68rem; margin-left: auto; padding: .12rem .45rem; }

.app-sidebar-footer { border-top: 1px solid rgba(255,255,255,.08); padding: .75rem; }
.app-main { margin-left: var(--cde-sidebar); min-height: 100vh; }
.app-topbar {
    align-items: center;
    background: rgba(255,255,255,.94);
    border-bottom: 1px solid var(--cde-border);
    display: flex;
    height: var(--cde-topbar);
    justify-content: space-between;
    padding: 0 clamp(1rem, 3vw, 2rem);
    position: sticky;
    top: 0;
    z-index: 1020;
    backdrop-filter: blur(12px);
}
.app-context-title { color: var(--cde-navy); font-size: .96rem; font-weight: 700; margin: 0; }
.app-context-path { color: var(--cde-muted); font-size: .73rem; }
.app-global-search { align-items:center; background:#fff; border:1px solid #dce4ef; border-radius:14px; box-shadow:0 3px 12px rgba(15,34,64,.06); display:flex; flex:0 1 620px; margin:0 clamp(1rem, 3vw, 3rem); min-width:240px; padding:0 .55rem 0 .9rem; position:relative; transition:border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease; }
.app-global-search:focus-within { border-color:rgba(20,100,214,.55); box-shadow:0 7px 24px rgba(20,100,214,.13), 0 0 0 3px rgba(20,100,214,.08); transform:translateY(-1px); }
.app-global-search-icon { align-items:center; color:var(--cde-primary); display:flex; margin-right:.65rem; }
.app-global-search input { background:transparent; border:0; color:var(--cde-navy); font-size:.86rem; font-weight:500; height:44px; min-width:0; outline:0; width:100%; }
.app-global-search input::placeholder { color:var(--cde-muted); }
.app-search-popover { background:#fff; border:1px solid #d9e1ec; border-radius:14px; box-shadow:0 22px 55px rgba(15,34,64,.22); left:50%; max-height:min(74vh, 690px); overflow:auto; padding:0; position:absolute; top:calc(100% + 9px); transform:translateX(-50%); width:min(510px,calc(100vw - 2rem)); z-index:1100; }
.app-search-popover[hidden] { display:none; }
.app-search-group + .app-search-group { border-top:1px solid #e7ebf2; }
.app-search-group-title { align-items:center; background:#f3f2fb; color:#403a8c; display:flex; font-size:.68rem; font-weight:900; justify-content:space-between; letter-spacing:.08em; padding:.48rem .7rem; text-align:center; text-transform:uppercase; }
.app-search-group-title span:first-child { margin-left:auto; }.app-search-group-title span:last-child{background:#fff;border-radius:999px;color:#6c67a9;font-size:.59rem;margin-left:auto;padding:.13rem .38rem}
.app-search-result { align-items:center; color:var(--cde-text); display:flex; gap:.65rem; justify-content:space-between; min-height:66px; padding:.42rem .6rem; text-decoration:none; }
.app-search-result + .app-search-result { border-top:1px solid #eef1f5; }
.app-search-result:nth-child(odd) { background:#fafafe; }
.app-search-result:hover, .app-search-result.active { background:#eef4ff; color:var(--cde-navy); }
.app-search-result-visual { align-items:center; background:linear-gradient(145deg,#3157a8,#6b4aa5); border-radius:7px; color:#fff; display:flex; flex:0 0 56px; font-size:1.2rem; height:48px; justify-content:center; }
.app-search-result-utilisateurs .app-search-result-visual { background:linear-gradient(145deg,#6654bb,#8b70d3); }
.app-search-result-agences .app-search-result-visual { background:linear-gradient(145deg,#168c88,#27b5a9); }
.app-search-result-factures .app-search-result-visual { background:linear-gradient(145deg,#c78318,#e9ac42); }
.app-search-result-content { min-width:0; width:100%; }
.app-search-result strong { color:#17233a; display:block; font-size:.76rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.app-search-result small { color:#66758c; display:block; font-size:.64rem; line-height:1.3; margin-top:.12rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.app-search-result-arrow { color:var(--cde-primary); opacity:0; transition:opacity 140ms ease, transform 140ms ease; }
.app-search-result:hover .app-search-result-arrow, .app-search-result.active .app-search-result-arrow { opacity:1; transform:translateX(2px); }
.app-search-empty { color:var(--cde-muted); font-size:.82rem; padding:1.6rem; text-align:center; }
.app-search-footer { background:#f6f5fb; border:0; border-top:1px solid #e2e1ee; color:#5148a0; display:block; font-size:.73rem; font-weight:900; padding:.72rem; text-align:center; width:100%; }
.app-search-footer:hover { background:#ebe9f8; }
.app-topbar-actions { align-items: center; display: flex; gap: .5rem; margin-right:.35rem; }
.app-account-trigger { align-items: center; border-radius: 10px; color: var(--cde-text); display: flex; gap: .7rem; min-width:170px; padding: .4rem .7rem; text-decoration: none; }
.app-account-trigger:hover { background: var(--cde-bg); color: var(--cde-navy); }
.app-account-avatar { align-items:center; background:var(--cde-primary-soft); border-radius:50%; color:var(--cde-primary); display:inline-flex; font-size:.78rem; font-weight:800; height:34px; justify-content:center; object-fit:cover; width:34px; }
.app-account-meta { line-height: 1.15; }
.app-account-name { color: var(--cde-navy); display:block; font-size:.78rem; font-weight:700; max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.app-account-role { color: var(--cde-muted); font-size:.65rem; }
.app-mobile-toggle { display: none; }
.app-content { max-width: 1600px; padding: 1.5rem clamp(1rem, 3vw, 2rem) 3rem; }
.app-back-row { margin-bottom: 1rem; }
.app-back-row .site-back-nav-button { background: transparent !important; border: 0 !important; color: var(--cde-muted) !important; padding-left: 0; }
.app-back-row .site-back-nav-button:hover { color: var(--cde-primary) !important; }

.public-shell { align-items:center; background:radial-gradient(circle at 15% 20%, rgba(20,100,214,.13), transparent 32%), radial-gradient(circle at 85% 80%, rgba(0,184,169,.12), transparent 30%), var(--cde-bg); display:flex; justify-content:center; min-height:100vh; padding:2rem 1rem; }
.public-shell .app-content { max-width: 1180px; padding: 0; width:100%; }
