/**
 * SKIA Forge — gold scrollbars + shared hub logo sizing.
 * Scrollbars match Skia-FULL globals (.skia-scrollbar-premium).
 * Hero logos match Skia-FULL dashboard / feature pages (.feature-page-logo in app.css;
 * mobile overrides in mobile.css).
 */

/* Viewport scrollbar (document scroll) */
html.skia-scrollbar-premium {
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: rgba(212, 175, 55, 0.45) rgba(0, 0, 0, 0.35);
}

    html.skia-scrollbar-premium::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }

    html.skia-scrollbar-premium::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.35);
    }

    html.skia-scrollbar-premium::-webkit-scrollbar-thumb {
        background: rgba(212, 175, 55, 0.45);
        border-radius: 4px;
        border: 1px solid rgba(212, 175, 55, 0.25);
    }

        html.skia-scrollbar-premium::-webkit-scrollbar-thumb:hover {
            background: rgba(212, 175, 55, 0.75);
        }

@media (max-width: 768px) {
    html.skia-scrollbar-premium::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    html.skia-scrollbar-premium::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.45);
    }
}

/* Overflow regions (code blocks, optional wrappers) */
.skia-scrollbar-premium,
.code-block {
    scrollbar-width: thin;
    scrollbar-color: rgba(212, 175, 55, 0.45) rgba(0, 0, 0, 0.35);
}

    .skia-scrollbar-premium::-webkit-scrollbar,
    .code-block::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }

    .skia-scrollbar-premium::-webkit-scrollbar-track,
    .code-block::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.35);
    }

    .skia-scrollbar-premium::-webkit-scrollbar-thumb,
    .code-block::-webkit-scrollbar-thumb {
        background: rgba(212, 175, 55, 0.45);
        border-radius: 4px;
        border: 1px solid rgba(212, 175, 55, 0.25);
    }

        .skia-scrollbar-premium::-webkit-scrollbar-thumb:hover,
        .code-block::-webkit-scrollbar-thumb:hover {
            background: rgba(212, 175, 55, 0.75);
        }

@media (max-width: 768px) {
    .skia-scrollbar-premium::-webkit-scrollbar,
    .code-block::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }

    .skia-scrollbar-premium::-webkit-scrollbar-track,
    .code-block::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.45);
    }
}

/* Sidebar logo — show full logo, no circle crop */
.pc-sidebar-logo-img {
    width: 120px;
    height: auto;
    border-radius: 0;
    object-fit: contain;
    filter: drop-shadow(0 0 12px rgba(212, 175, 55, 0.35));
}

/* Top-of-page hero logo — same as Skia-FULL .feature-page-logo (dashboard, hubs) */
.page-logo,
.feature-page-logo {
    display: block;
    width: 160px;
    max-width: min(160px, 92vw);
    height: auto;
    object-fit: contain;
    border-radius: 0;
    filter: drop-shadow(0 0 24px rgba(212, 175, 55, 0.4)) drop-shadow(0 0 48px rgba(212, 175, 55, 0.15));
    margin: 0 auto 16px;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .page-logo,
    .feature-page-logo {
        width: 110px;
        max-width: min(110px, 88vw);
        margin: 0 auto 12px;
        filter: drop-shadow(0 0 16px rgba(212, 175, 55, 0.4));
    }
}
