/* Platform 90.5 — UI/UX fixes: sticky header, mega menu balance, admin sidebar, responsive */

:root {
    --fe885-sticky-offset: 3.5rem;
}

html {
    scroll-padding-top: var(--fe885-sticky-offset);
}

.fe885-header {
    position: sticky;
    top: 0;
    z-index: var(--fe885-z-header, 1200);
}

.fe885-header.is-scrolled .fe885-header__bar {
    background: color-mix(in srgb, var(--fe885-bg, #fff) 92%, transparent);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.fe885-mega-portal__stage {
    max-width: min(72rem, calc(100vw - 2rem));
    margin-inline: auto;
}

.fe885-mega__panel {
    max-width: min(72rem, calc(100vw - 2rem));
}

.fe885-mega__columns {
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: 0.75rem 1.25rem;
    align-items: start;
}

.fe885-mega__col {
    min-width: 0;
}

.fe885-mega--compact .fe885-mega__columns--compact {
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    max-width: 42rem;
}

/* Homepage — prevent horizontal overflow on category grid */
.homepage .fe8825-categories__grid {
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 639px) {
    .homepage .fe8825-hero__actions {
        flex-direction: column;
        align-items: stretch;
    }
}

/* Admin sidebar — readable labels, no horizontal clip */
.fe-sidebar__link {
    min-width: 0;
}

.fe-sidebar__link span {
    flex: 1;
    min-width: 0;
    overflow: visible;
    white-space: normal;
    line-height: 1.35;
    word-break: break-word;
}

.fe-sidebar__nav-group-label,
.fe-sidebar__section-toggle span {
    overflow: visible;
    white-space: normal;
    word-break: break-word;
}

.fe-admin-shell[data-sidebar-collapsed="true"] .fe-sidebar__link {
    justify-content: center;
}

.fe-admin-shell[data-sidebar-collapsed="true"] .fe-sidebar__link i {
    margin: 0 auto;
}

/* Row actions + JSON panel — small screens */
@media (max-width: 767px) {
    .fe-row-action-btn span.hidden {
        display: none !important;
    }

    .content-json-tools-panel,
    [data-content-json-tools] {
        max-width: 100%;
        overflow-x: auto;
    }
}
