/* ============================================================================
   ROSTA BASKET — Responsive layer (sito pubblico)
   Complementa header.css e gli stili inline delle pagine.
   ============================================================================ */

:root {
    --site-header-offset: var(--hdr-height, 68px);
    --page-gutter: clamp(16px, 4vw, 28px);
    --touch-min: 44px;
}

/* Offset contenuto sotto header fisso */
body {
    padding-top: var(--site-header-offset);
}

@media (max-width: 768px) {
    :root {
        --site-header-offset: 60px;
        --hdr-height: 60px;
    }
}

/* Container globale (override leggero) */
.container {
    padding-left: var(--page-gutter);
    padding-right: var(--page-gutter);
}

img,
video,
svg {
    max-width: 100%;
    height: auto;
}

/* Sticky bar sotto header (news, calendario, legal) */
.news-filter-bar,
.cal-filter-bar,
.priv-nav-bar {
    top: var(--site-header-offset) !important;
}

/* Tab orizzontali scrollabili su mobile */
.news-filter-inner,
.priv-nav-inner,
.cal-filter-bar .container,
.ros-nav-inner {
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.news-filter-inner::-webkit-scrollbar,
.priv-nav-inner::-webkit-scrollbar,
.cal-filter-bar .container::-webkit-scrollbar {
    display: none;
}

@media (max-width: 768px) {
    .cal-filter-bar .container {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 0;
    }

    .filter-tab,
    .nf-tab {
        flex-shrink: 0;
        min-height: var(--touch-min);
    }

    .priv-nav-tab {
        flex-shrink: 0;
        padding: 14px 18px;
        min-height: var(--touch-min);
    }

    .priv-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0 calc(-1 * var(--page-gutter));
        padding: 0 var(--page-gutter);
    }

    .priv-table {
        min-width: 520px;
    }
}

/* Hero editoriali interne — padding mobile coerente */
@media (max-width: 768px) {
    .news-hero,
    .cal-hero,
    .cnt-hero,
    .sponsor-hero,
    .staff-hero,
    .sq-hero,
    .priv-hero {
        padding-top: calc(var(--site-header-offset) + 48px) !important;
        padding-bottom: 48px !important;
    }
}

/* Cookie banner sotto header */
@media (max-width: 768px) {
    .cookie-banner {
        bottom: 12px;
        left: var(--page-gutter);
        right: var(--page-gutter);
        max-width: none;
    }
}

/* Touch: niente hover dipendente su dispositivi coarse */
@media (hover: none) and (pointer: coarse) {
    .header-cta:hover,
    .drawer-cta:hover,
    .btn-primary:hover {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mobile-drawer,
    .mobile-backdrop {
        transition: none !important;
    }
}