/*
|--------------------------------------------------------------------------
| Penzi dynamic brand shell + SINGLE premium loader V6.2
|--------------------------------------------------------------------------
*/

:root {
    --penzi-app-logo-height: 72px;
    --penzi-app-logo-width: 230px;
    --penzi-brand-primary: #2f8f12;
    --penzi-brand-accent: #f59e0b;
    /*
     * One source of truth:
     * desktop topbar height = sidebar header height = configured logo height.
     */
    --penzi-shell-bar-height: var(--penzi-app-logo-height);
}

.fi-topbar > nav,
.fi-topbar nav {
    min-height: var(--penzi-shell-bar-height) !important;
    height: var(--penzi-shell-bar-height) !important;
}

.fi-sidebar-header {
    min-height: var(--penzi-shell-bar-height) !important;
    height: var(--penzi-shell-bar-height) !important;
    padding-block: 0 !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
}

.fi-sidebar-header > a,
.fi-sidebar-header .fi-logo-link {
    min-width: 0 !important;
    min-height: 0 !important;
    align-items: center !important;
    justify-content: flex-start !important;
}

.fi-sidebar-header img,
.fi-sidebar-header img.fi-logo,
.fi-sidebar-header .fi-logo img,
.fi-sidebar-header a > img {
    width: var(--penzi-app-logo-width) !important;
    height: var(--penzi-app-logo-height) !important;
    max-width: calc(100% - 42px) !important;
    max-height: var(--penzi-shell-bar-height) !important;
    object-fit: contain !important;
    object-position: left center !important;
    flex: 0 1 auto !important;
}

.fi-sidebar-header a:has(img) {
    min-width: 0 !important;
    width: min(
        var(--penzi-app-logo-width),
        calc(100% - 42px)
    ) !important;
    height: var(--penzi-shell-bar-height) !important;
    max-height: var(--penzi-shell-bar-height) !important;
    padding-block: 0 !important;
    overflow: visible !important;
}

.fi-sidebar-header button {
    flex: 0 0 auto !important;
    align-self: center !important;
}

/*
|--------------------------------------------------------------------------
| EXACT HEADER / LOGO HEIGHT SYNC
|--------------------------------------------------------------------------
| On desktop/tablet, the configured Penzi logo height is the physical shell
| height. No +8/+16 padding and no 52px topbar cap.
|--------------------------------------------------------------------------
*/

@media (min-width: 769px) {
    .fi-topbar,
    .fi-topbar > nav,
    .fi-topbar nav,
    .fi-sidebar-header {
        min-height: var(--penzi-shell-bar-height) !important;
        height: var(--penzi-shell-bar-height) !important;
    }

    .fi-topbar > nav,
    .fi-topbar nav,
    .fi-sidebar-header {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .fi-topbar img.fi-logo,
    .fi-topbar .fi-logo img,
    .fi-sidebar-header img.fi-logo,
    .fi-sidebar-header .fi-logo img {
        height: var(--penzi-shell-bar-height) !important;
        max-height: var(--penzi-shell-bar-height) !important;
        object-fit: contain !important;
    }
}

/*
 * Mobile keeps the existing two-row navigation/search layout. Its topbar may
 * grow vertically, but the logo itself still uses the configured logo height.
 */
@media (max-width: 768px) {
    .fi-topbar img.fi-logo,
    .fi-topbar .fi-logo img {
        height: var(--penzi-app-logo-height) !important;
        max-height: var(--penzi-app-logo-height) !important;
        object-fit: contain !important;
    }
}

/*
|--------------------------------------------------------------------------
| LEGACY LOADER KILL SWITCH
|--------------------------------------------------------------------------
| These are intentionally limited to common full-page custom loader names.
| Filament's own loading indicators are NOT touched.
|--------------------------------------------------------------------------
*/

#page-loader,
.page-loader,
#app-loader,
.app-loader,
#workspace-loader,
.workspace-loader,
#penzi-page-loader,
.penzi-page-loader,
#penzi-loader:not(#penzi-premium-page-loader),
.penzi-loader:not(.penzi-premium-loader),
#td-page-loader,
.td-page-loader,
#td-loader,
.td-loader,
#legacy-page-loader,
.legacy-page-loader,
#preloader,
.preloader {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* -------------------------------------------------------------------------
   The only supported global Penzi loader.
   ------------------------------------------------------------------------- */

.penzi-premium-loader {
    position: fixed;
    inset: 0;
    z-index: 2147483000;

    display: grid;
    place-items: center;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    background: rgba(248, 250, 252, .30);
    -webkit-backdrop-filter: blur(11px) saturate(115%);
    backdrop-filter: blur(11px) saturate(115%);

    transition:
        opacity .18s ease,
        visibility .18s ease;
}

.dark .penzi-premium-loader {
    background: rgba(2, 6, 23, .40);
}

.penzi-premium-loader.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.penzi-premium-loader__glass {
    min-width: 190px;
    display: grid;
    justify-items: center;
    gap: .82rem;
    padding: 1rem 1.15rem .9rem;

    border: 1px solid rgba(255, 255, 255, .62);
    border-radius: 24px;

    background: rgba(255, 255, 255, .70);

    box-shadow:
        0 24px 70px rgba(15, 23, 42, .16),
        inset 0 1px 0 rgba(255, 255, 255, .72);

    -webkit-backdrop-filter: blur(20px) saturate(135%);
    backdrop-filter: blur(20px) saturate(135%);
}

.dark .penzi-premium-loader__glass {
    border-color: rgba(255,255,255,.10);
    background: rgba(15, 23, 42, .78);

    box-shadow:
        0 24px 70px rgba(0, 0, 0, .38),
        inset 0 1px 0 rgba(255,255,255,.05);
}

.penzi-premium-loader__orbit {
    position: relative;
    width: 112px;
    height: 112px;
    display: grid;
    place-items: center;
}

.penzi-premium-loader__ring {
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.penzi-premium-loader__ring--outer {
    inset: 0;
    border: 2px solid
        color-mix(in srgb, var(--penzi-brand-primary) 16%, transparent);

    border-top-color: var(--penzi-brand-primary);

    border-right-color:
        color-mix(in srgb, var(--penzi-brand-accent) 90%, white);

    animation: penziLoaderSpin 1.08s linear infinite;
}

.penzi-premium-loader__ring--inner {
    inset: 8px;

    border: 1px solid
        color-mix(in srgb, var(--penzi-brand-primary) 18%, transparent);

    border-bottom-color:
        color-mix(in srgb, var(--penzi-brand-primary) 72%, white);

    animation: penziLoaderSpinReverse 1.55s linear infinite;
}

.penzi-premium-loader__logo-shell {
    width: 82px;
    height: 82px;

    display: grid;
    place-items: center;

    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.74);

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(255,255,255,.98),
            rgba(255,255,255,.84) 48%,
            rgba(248,250,252,.80)
        );

    box-shadow:
        0 10px 28px
            color-mix(in srgb, var(--penzi-brand-primary) 14%, transparent),
        inset 0 0 0 5px rgba(255,255,255,.34);

    overflow: hidden;
}

.dark .penzi-premium-loader__logo-shell {
    border-color: rgba(255,255,255,.12);

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(51,65,85,.96),
            rgba(15,23,42,.92)
        );

    box-shadow:
        0 10px 28px rgba(0,0,0,.30),
        inset 0 0 0 5px rgba(255,255,255,.025);
}

.penzi-premium-loader__logo {
    width: 70px;
    height: 70px;
    max-width: 70px;
    max-height: 70px;

    object-fit: contain;
    object-position: center;

    user-select: none;
    pointer-events: none;

    animation:
        penziLoaderLogoBreath
        1.65s
        ease-in-out
        infinite;
}

.penzi-premium-loader__status {
    display: inline-flex;
    align-items: center;
    gap: .42rem;

    color: #64748b;
    font-size: .62rem;
    line-height: 1;
    font-weight: 850;
    letter-spacing: .04em;
}

.dark .penzi-premium-loader__status {
    color: #cbd5e1;
}

.penzi-premium-loader__pulse {
    width: 6px;
    height: 6px;

    border-radius: 999px;

    background: var(--penzi-brand-primary);

    box-shadow:
        0 0 0 4px
        color-mix(
            in srgb,
            var(--penzi-brand-primary) 13%,
            transparent
        );

    animation:
        penziLoaderPulse
        1.15s
        ease-in-out
        infinite;
}

@keyframes penziLoaderSpin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes penziLoaderSpinReverse {
    to {
        transform: rotate(-360deg);
    }
}

@keyframes penziLoaderLogoBreath {
    0%,
    100% {
        transform: scale(.95);
        opacity: .88;
    }

    50% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes penziLoaderPulse {
    0%,
    100% {
        transform: scale(.78);
        opacity: .60;
    }

    50% {
        transform: scale(1);
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .penzi-premium-loader__ring,
    .penzi-premium-loader__logo,
    .penzi-premium-loader__pulse {
        animation: none !important;
    }
}


/* A JS safety pass may mark a genuinely duplicated same-source brand image. */
[data-penzi-duplicate-logo="hidden"] {
    display: none !important;
}