/* =========================================================
   ALPHÉA SUITE
   Topbar et navigation universelles Premium++++
   ========================================================= */

:root {
    --alphea-sidebar-width: 288px;
    --alphea-topbar-height: 86px;
}

/* Accessibilité */

.alphea-screen-reader-title {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* =========================================================
   TOPBAR UNIVERSELLE
   ========================================================= */

body.alphea-v2 .alphea-topbar {
    position: sticky;
    top: 0;
    z-index: 120;
    display: grid !important;
    grid-template-columns:
        minmax(420px, 1fr)
        auto !important;
    width: 100%;
    min-height: var(--alphea-topbar-height) !important;
    height: var(--alphea-topbar-height) !important;
    gap: 24px !important;
    align-items: center;
    padding: 0 28px !important;
    overflow: visible !important;
    border-bottom:
        1px solid rgba(148, 163, 184, .17) !important;
    background:
        rgba(255, 255, 255, .92) !important;
    backdrop-filter:
        blur(22px)
        saturate(150%);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, .75),
        0 8px 32px rgba(15, 23, 42, .035);
}

body.alphea-v2 .alphea-topbar-left,
body.alphea-v2 .alphea-topbar-heading {
    display: none !important;
}

body.alphea-v2 .alphea-topbar-center {
    display: flex !important;
    width: 100% !important;
    min-width: 0;
    max-width: none !important;
    justify-content: flex-start;
    padding: 0 !important;
    margin: 0 !important;
}

body.alphea-v2 .alphea-global-search {
    position: relative;
    width: min(100%, 920px) !important;
    max-width: 920px !important;
    min-width: 360px;
    margin: 0 !important;
}

body.alphea-v2 .alphea-global-search-form {
    width: 100% !important;
    min-height: 54px !important;
    height: 54px !important;
    padding: 0 11px 0 18px !important;
    border:
        1px solid rgba(148, 163, 184, .26) !important;
    border-radius: 17px !important;
    background:
        linear-gradient(
            180deg,
            rgba(248, 250, 252, .96),
            rgba(241, 245, 249, .82)
        ) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .95),
        0 6px 20px rgba(15, 23, 42, .035) !important;
    transition:
        border-color 170ms ease,
        box-shadow 170ms ease,
        background 170ms ease,
        transform 170ms ease;
}

body.alphea-v2
.alphea-global-search-form:hover {
    border-color:
        rgba(59, 130, 246, .29) !important;
}

body.alphea-v2
.alphea-global-search-form:focus-within {
    border-color:
        rgba(37, 99, 235, .55) !important;
    background: #fff !important;
    box-shadow:
        0 0 0 4px rgba(37, 99, 235, .09),
        0 12px 30px rgba(15, 23, 42, .07) !important;
    transform: translateY(-1px);
}

body.alphea-v2 .alphea-global-search-icon {
    display: grid;
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 auto;
    place-items: center;
    color: #64748b !important;
    font-size: 22px !important;
}

body.alphea-v2 .alphea-search {
    min-width: 0;
    height: 50px !important;
    padding: 0 14px !important;
    color: #172033 !important;
    font-size: 15px !important;
    font-weight: 650 !important;
}

body.alphea-v2 .alphea-search::placeholder {
    color: #718099 !important;
    opacity: 1;
}

body.alphea-v2 .alphea-search-shortcut {
    min-width: 68px !important;
    height: 36px !important;
    padding: 0 12px !important;
    border:
        1px solid rgba(148, 163, 184, .25) !important;
    border-radius: 11px !important;
    color: #475569 !important;
    background:
        rgba(255, 255, 255, .85) !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    box-shadow:
        0 2px 7px rgba(15, 23, 42, .045);
}

body.alphea-v2 .alphea-topbar-right {
    display: flex !important;
    width: auto !important;
    min-width: max-content;
    align-items: center;
    justify-content: flex-end;
    gap: 10px !important;
    margin: 0 !important;
}

/* =========================================================
   SIDEBAR UNIVERSELLE
   ========================================================= */

body.alphea-v2 .alphea-sidebar,
body .alphea-universal-sidebar {
    position: sticky;
    top: 0;
    display: block;
    width: var(--alphea-sidebar-width) !important;
    min-width: var(--alphea-sidebar-width) !important;
    max-width: var(--alphea-sidebar-width) !important;
    height: 100vh;
    padding: 0 !important;
    overflow: hidden !important;
    border-right:
        1px solid rgba(148, 163, 184, .10) !important;
    color: #e8eefc;
    background:
        radial-gradient(
            circle at 15% -5%,
            rgba(37, 99, 235, .26),
            transparent 30%
        ),
        radial-gradient(
            circle at 110% 60%,
            rgba(91, 33, 182, .14),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            #111b31 0%,
            #0d1628 100%
        ) !important;
    box-shadow:
        inset -1px 0 0 rgba(255, 255, 255, .025);
}

.alphea-universal-sidebar-inner {
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    flex-direction: column;
    padding: 22px 18px 18px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color:
        rgba(148, 163, 184, .25)
        transparent;
}

.alphea-universal-sidebar-inner::-webkit-scrollbar {
    width: 5px;
}

.alphea-universal-sidebar-inner::-webkit-scrollbar-thumb {
    border-radius: 99px;
    background: rgba(148, 163, 184, .24);
}

/* Marque */

.alphea-universal-brand {
    display: flex;
    min-height: 67px;
    align-items: center;
    gap: 14px;
    padding: 7px 9px;
    border-radius: 17px;
    color: #fff !important;
    text-decoration: none !important;
    transition:
        background 160ms ease,
        transform 160ms ease;
}

.alphea-universal-brand:hover {
    background: rgba(255, 255, 255, .045);
    transform: translateY(-1px);
}

.alphea-universal-brand-logo {
    display: grid;
    width: 52px;
    height: 52px;
    flex: 0 0 auto;
    place-items: center;
    border:
        1px solid rgba(147, 197, 253, .28);
    border-radius: 16px;
    color: #fff;
    background:
        linear-gradient(
            145deg,
            #2f70f5,
            #1d4ed8
        );
    font-size: 26px;
    font-weight: 950;
    box-shadow:
        0 13px 26px rgba(37, 99, 235, .24),
        inset 0 1px 0 rgba(255, 255, 255, .18);
}

.alphea-universal-brand-copy {
    display: block;
    min-width: 0;
}

.alphea-universal-brand-copy strong {
    display: block;
    color: #fff;
    font-size: 18px;
    font-weight: 900;
    letter-spacing: -.025em;
}

.alphea-universal-brand-copy small {
    display: block;
    margin-top: 4px;
    color: #8fa4c8;
    font-size: 12px;
    font-weight: 650;
}

.alphea-universal-divider {
    height: 1px;
    flex: 0 0 auto;
    margin: 17px 8px;
    background:
        linear-gradient(
            90deg,
            rgba(148, 163, 184, .04),
            rgba(148, 163, 184, .22),
            rgba(148, 163, 184, .04)
        );
}

/* Modules principaux */

.alphea-universal-primary {
    display: grid;
    gap: 7px;
}

.alphea-universal-primary-link {
    position: relative;
    display: grid;
    min-height: 62px;
    grid-template-columns:
        42px
        minmax(0, 1fr)
        18px;
    gap: 11px;
    align-items: center;
    padding: 8px 11px;
    overflow: hidden;
    border:
        1px solid transparent;
    border-radius: 15px;
    color: #c9d5ea !important;
    text-decoration: none !important;
    transition:
        color 160ms ease,
        border-color 160ms ease,
        background 160ms ease,
        transform 160ms ease,
        box-shadow 160ms ease;
}

.alphea-universal-primary-link::before {
    content: "";
    position: absolute;
    top: 12px;
    bottom: 12px;
    left: 0;
    width: 3px;
    border-radius: 0 4px 4px 0;
    background: #60a5fa;
    opacity: 0;
    transform: scaleY(.45);
    transition:
        opacity 160ms ease,
        transform 160ms ease;
}

.alphea-universal-primary-link:hover {
    color: #fff !important;
    border-color:
        rgba(148, 163, 184, .10);
    background:
        rgba(255, 255, 255, .045);
    transform: translateX(2px);
}

.alphea-universal-primary-link.is-active {
    color: #fff !important;
    border-color:
        rgba(96, 165, 250, .18);
    background:
        linear-gradient(
            100deg,
            rgba(37, 99, 235, .20),
            rgba(37, 99, 235, .075)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .035),
        0 10px 24px rgba(2, 6, 23, .10);
}

.alphea-universal-primary-link.is-active::before {
    opacity: 1;
    transform: scaleY(1);
}

.alphea-universal-primary-icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border:
        1px solid rgba(148, 163, 184, .12);
    border-radius: 12px;
    color: #a9bad6;
    background:
        rgba(255, 255, 255, .04);
}

.alphea-universal-primary-icon svg {
    width: 21px;
    height: 21px;
}

.alphea-universal-primary-link.is-active
.alphea-universal-primary-icon {
    border-color:
        rgba(96, 165, 250, .23);
    color: #bfdbfe;
    background:
        rgba(37, 99, 235, .19);
    box-shadow:
        0 7px 17px rgba(37, 99, 235, .12);
}

.alphea-universal-primary-icon.is-candidature {
    color: #d8b4fe;
}

.alphea-universal-primary-icon.is-intervention {
    color: #fbbf24;
}

.alphea-universal-primary-icon.is-immeuble {
    color: #67e8f9;
}

.alphea-universal-primary-icon.is-sinistre {
    color: #93c5fd;
}

.alphea-universal-primary-copy {
    display: block;
    min-width: 0;
}

.alphea-universal-primary-copy strong {
    display: block;
    overflow: hidden;
    color: inherit;
    font-size: 14px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.alphea-universal-primary-copy small {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: #8296b7;
    font-size: 10px;
    font-weight: 650;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.alphea-universal-primary-chevron {
    color: #607492;
    font-size: 22px;
    font-weight: 400;
    transition:
        color 160ms ease,
        transform 160ms ease;
}

.alphea-universal-primary-link:hover
.alphea-universal-primary-chevron,
.alphea-universal-primary-link.is-active
.alphea-universal-primary-chevron {
    color: #bfdbfe;
    transform: translateX(2px);
}

/* Sous-menu */

.alphea-universal-context {
    margin-top: 22px;
    padding: 16px 11px 12px;
    border:
        1px solid rgba(148, 163, 184, .09);
    border-radius: 17px;
    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, .032),
            rgba(255, 255, 255, .017)
        );
}

.alphea-universal-context > header {
    display: block;
    padding: 0 8px 11px;
}

.alphea-universal-context > header span {
    display: block;
    color: #7186a8;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.alphea-universal-context > header strong {
    display: block;
    margin-top: 4px;
    color: #eaf0fb;
    font-size: 13px;
    font-weight: 850;
}

.alphea-universal-subnav {
    display: grid;
    gap: 3px;
}

.alphea-universal-subnav a {
    display: grid;
    min-height: 39px;
    grid-template-columns:
        11px
        minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    padding: 0 9px;
    border-radius: 10px;
    color: #9fb0ca !important;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none !important;
    transition:
        color 150ms ease,
        background 150ms ease,
        transform 150ms ease;
}

.alphea-universal-subnav a:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, .04);
    transform: translateX(2px);
}

.alphea-universal-subnav a.is-active {
    color: #dbeafe !important;
    background:
        rgba(37, 99, 235, .14);
}

.alphea-universal-subnav-dot {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4b5f7d;
    transition:
        background 150ms ease,
        box-shadow 150ms ease;
}

.alphea-universal-subnav a.is-active
.alphea-universal-subnav-dot {
    background: #60a5fa;
    box-shadow:
        0 0 0 4px rgba(96, 165, 250, .10);
}

.alphea-universal-sidebar-spacer {
    min-height: 22px;
    flex: 1 1 auto;
}

/* Administration */

.alphea-universal-administration {
    padding: 0 5px;
}

.alphea-universal-administration > span {
    display: block;
    margin: 0 8px 8px;
    color: #647897;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.alphea-universal-administration > a {
    display: grid;
    min-height: 54px;
    grid-template-columns:
        36px
        minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 7px 9px;
    border-radius: 13px;
    color: #aebdd4 !important;
    text-decoration: none !important;
    transition:
        color 150ms ease,
        background 150ms ease;
}

.alphea-universal-administration > a:hover,
.alphea-universal-administration > a.is-active {
    color: #fff !important;
    background: rgba(255, 255, 255, .045);
}

.alphea-universal-admin-icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 10px;
    background: rgba(255, 255, 255, .04);
}

.alphea-universal-admin-icon svg {
    width: 18px;
    height: 18px;
}

.alphea-universal-administration strong {
    display: block;
    font-size: 12px;
    font-weight: 800;
}

.alphea-universal-administration small {
    display: block;
    margin-top: 2px;
    color: #7488a7;
    font-size: 9px;
}

/* Statut */

.alphea-universal-sidebar-footer {
    display: grid;
    min-height: 55px;
    grid-template-columns:
        12px
        minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    margin-top: 13px;
    padding: 10px 12px;
    border:
        1px solid rgba(148, 163, 184, .08);
    border-radius: 13px;
    background: rgba(2, 6, 23, .20);
}

.alphea-universal-status-dot {
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #34d399;
    box-shadow:
        0 0 0 4px rgba(52, 211, 153, .08),
        0 0 12px rgba(52, 211, 153, .35);
}

.alphea-universal-sidebar-footer strong {
    display: block;
    color: #cad5e7;
    font-size: 10px;
    font-weight: 800;
}

.alphea-universal-sidebar-footer small {
    display: block;
    margin-top: 2px;
    color: #637795;
    font-size: 8px;
}

/* Shell Framework */

body.alphea-v2 .alphea-shell {
    grid-template-columns:
        var(--alphea-sidebar-width)
        minmax(0, 1fr) !important;
}

body.alphea-v2 .alphea-main {
    min-width: 0;
}

/* Mode sombre */

html[data-alphea-theme="dark"]
body.alphea-v2 .alphea-topbar {
    border-bottom-color:
        rgba(148, 163, 184, .12) !important;
    background:
        rgba(10, 17, 31, .91) !important;
    box-shadow:
        0 8px 32px rgba(0, 0, 0, .14);
}

html[data-alphea-theme="dark"]
body.alphea-v2 .alphea-global-search-form {
    border-color:
        rgba(148, 163, 184, .14) !important;
    background:
        rgba(20, 30, 49, .92) !important;
}

html[data-alphea-theme="dark"]
body.alphea-v2 .alphea-search {
    color: #e7eef9 !important;
}

html[data-alphea-theme="dark"]
body.alphea-v2 .alphea-search-shortcut {
    border-color:
        rgba(148, 163, 184, .14) !important;
    color: #b8c6dc !important;
    background:
        rgba(30, 41, 59, .85) !important;
}

/* Responsive */

@media (max-width: 1350px) {
    :root {
        --alphea-sidebar-width: 270px;
    }

    body.alphea-v2 .alphea-global-search {
        max-width: 720px !important;
    }
}

@media (max-width: 1120px) {
    body.alphea-v2 .alphea-topbar {
        grid-template-columns:
            minmax(280px, 1fr)
            auto !important;
        padding: 0 18px !important;
    }

    body.alphea-v2 .alphea-user-button-copy {
        display: none !important;
    }
}

@media (max-width: 920px) {
    :root {
        --alphea-sidebar-width: 100%;
    }

    body.alphea-v2 .alphea-shell {
        display: block !important;
    }

    body.alphea-v2 .alphea-sidebar,
    body .alphea-universal-sidebar {
        position: relative;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: auto;
        min-height: 0;
    }

    .alphea-universal-sidebar-inner {
        min-height: 0;
        padding: 15px;
    }

    .alphea-universal-primary {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .alphea-universal-context,
    .alphea-universal-administration,
    .alphea-universal-sidebar-footer {
        display: none;
    }

    body.alphea-v2 .alphea-topbar {
        position: relative;
        grid-template-columns:
            minmax(0, 1fr)
            auto !important;
    }
}

@media (max-width: 690px) {
    body.alphea-v2 .alphea-topbar {
        min-height: 74px !important;
        height: 74px !important;
        gap: 10px !important;
        padding: 0 12px !important;
    }

    body.alphea-v2 .alphea-global-search {
        min-width: 0;
    }

    body.alphea-v2 .alphea-search-shortcut,
    body.alphea-v2 .alphea-theme-toggle,
    body.alphea-v2 .alphea-user-menu {
        display: none !important;
    }

    .alphea-universal-primary {
        grid-template-columns:
            minmax(0, 1fr);
    }
}
