/* ═══════════════════════════════════════════════
   RESPONSIVE / MOBILE ADAPTATION v2
   Full adaptive layout for all screen sizes
   ═══════════════════════════════════════════════ */

@-ms-viewport { width: device-width; }

/* ── Touch-friendly minimums ── */
@media (pointer: coarse) {
    a, button, [onclick], .header-nav-link, .catalogueLink,
    .pdf-action-btn, .bookmark-panel-remove {
        min-height: 44px;
    }
    .header-nav-link { padding: 0 16px !important; }
    input[type="text"], input[type="search"], input[type="number"],
    input[type="email"], input[type="password"], textarea, select {
        font-size: 16px !important;
    }
}

/* ── Ensure nothing overflows ── */
img { max-width: 100%; height: auto; }
#bodyContainer, #mainContent, #searchContent {
    max-width: 100vw;
    overflow-x: hidden;
}

/* ════════════════════════════════════
   TABLET — max-width: 1024px
   ════════════════════════════════════ */
@media (max-width: 1024px) {
    .header-inner { padding: 0 16px; gap: 14px; }
    .header-search { max-width: 380px; }
    .catalogues { gap: 16px !important; }
    .catalogue { min-width: 280px !important; }
    .catalogViewPage {
        --pdf-layout-left: 240px !important;
        --pdf-layout-gap: 8px !important;
        --pdf-layout-side: 12px !important;
    }
}

/* ════════════════════════════════════
   SMALL TABLET — max-width: 860px
   ════════════════════════════════════ */
@media (max-width: 860px) {
    /* Header stacks */
    #header { height: auto !important; min-height: 60px !important; }
    .header-inner {
        flex-wrap: wrap;
        height: auto !important;
        padding: 10px 12px;
        gap: 8px;
    }
    .header-logo { order: 1; }
    .header-nav { order: 2; margin-left: auto; }
    .header-search { order: 3; flex-basis: 100%; max-width: 100%; margin: 0; }
    .header-breadcrumb { padding: 0 12px; font-size: 11px; }

    #mainContent, #searchContent {
        top: 110px !important;
        left: 8px !important;
        right: 8px !important;
    }
    .catalogue, .catalogue--pdf {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    #footerText, #footerLine { left: 8px !important; right: 8px !important; }
    .bookmark-panel { width: 100% !important; max-width: 100% !important; }

    /* 3Catalog: hide TOC, PDF full width */
    .catalogViewPage #header { height: auto !important; }
    .catalogViewPage #pdfNavigationHead,
    .catalogViewPage #pdfNavigation,
    .catalogViewPage #splitter2,
    .catalogViewPage .splitter2 { display: none !important; }
    .catalogViewPage #pdf,
    .catalogViewPage .pdf,
    .catalogViewPage .pdfNormal {
        left: 4px !important; right: 4px !important;
        top: 110px !important; bottom: 8px !important;
        height: auto !important; min-width: 0 !important;
    }
    .catalogViewPage .pageflipArea,
    .catalogViewPage .pageflipAreaNormal,
    .catalogViewPage #iframeArea,
    .catalogViewPage #iframeAreaDiv,
    .catalogViewPage #iframeAreaPH {
        left: 4px !important; right: 4px !important;
        top: 110px !important; bottom: 8px !important;
        min-width: 0 !important;
    }
    .catalogViewPage #pdfQuickDownload {
        right: 8px !important; bottom: 14px !important;
        font-size: 12px !important; padding: 5px 10px !important;
    }
    /* Hide old elements */
    .headerContent, .headerQuickActions, .headerLeft { display: none !important; }
    #bodyContainer { min-width: 0 !important; width: 100% !important; }
    #header { min-width: 0 !important; }
}

/* ════════════════════════════════════
   MOBILE — max-width: 768px
   ════════════════════════════════════ */
@media (max-width: 768px) {
    .logo-schuco { font-size: 20px !important; letter-spacing: 0.08em !important; }
    .logo-docu { font-size: 16px !important; }
    .header-search-input { height: 38px !important; padding: 0 10px !important; }
    .header-search-btn { height: 38px !important; padding: 0 14px !important; font-size: 14px !important; }
    .header-nav-link { font-size: 12px !important; padding: 0 10px !important; height: 32px !important; }
    .header-breadcrumb { display: none !important; }

    #mainContent, #searchContent { top: 100px !important; padding: 8px !important; }

    .catalogue, .catalogue--pdf { padding: 12px !important; border-radius: 10px !important; }
    .catalogueLink { gap: 12px !important; }
    .catalogueIcon { width: 80px !important; min-width: 80px !important; height: 100px !important; }
    .catalogueIconImg, .catalogueIconImg--pdf {
        max-width: 80px !important; max-height: 100px !important;
    }
    .catalogueText { font-size: 14px !important; line-height: 1.3 !important; }
    .pdf-meta { font-size: 12px !important; }
    .pdf-card-actions { gap: 6px !important; }
    .pdf-action-btn { font-size: 12px !important; padding: 6px 10px !important; }

    #footer { height: 50px !important; }
    #footerText { font-size: 10px !important; }

    /* Tables scroll */
    table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
    /* Dialogs full width */
    .ui-dialog { width: calc(100vw - 20px) !important; max-width: 100% !important; left: 10px !important; }
    .ui-dialog-content { padding: 10px !important; }
}

/* ════════════════════════════════════
   MOBILE PORTRAIT — max-width: 480px
   ════════════════════════════════════ */
@media (max-width: 480px) {
    .header-inner { padding: 8px 10px; gap: 6px; }
    .logo-schuco { font-size: 17px !important; }
    .logo-docu { font-size: 14px !important; }
    .header-nav { gap: 4px !important; }
    .header-nav-link {
        font-size: 11px !important; padding: 0 8px !important;
        height: 30px !important; border-radius: 6px !important;
    }
    .header-search-input { height: 36px !important; }
    .header-search-btn { height: 36px !important; padding: 0 12px !important; font-size: 13px !important; }

    #mainContent, #searchContent {
        top: 94px !important; left: 4px !important;
        right: 4px !important; bottom: 54px !important; padding: 4px !important;
    }

    /* Cards vertical on small screens */
    .catalogueLink { flex-direction: column !important; align-items: center !important; gap: 8px !important; }
    .catalogueIcon {
        width: 100% !important; min-width: 0 !important;
        height: auto !important; max-height: 160px !important;
        display: flex !important; justify-content: center !important;
    }
    .catalogueIconImg, .catalogueIconImg--pdf {
        max-width: 100% !important; max-height: 160px !important;
        width: auto !important; object-fit: contain !important;
    }
    .catalogueText { font-size: 14px !important; text-align: center !important; }
    .pdf-meta { justify-content: center !important; }
    .pdf-card-actions { justify-content: center !important; flex-wrap: wrap !important; }

    #footer { height: 44px !important; }
    #footerLine { bottom: 26px !important; }
    #footerText { font-size: 9px !important; bottom: 4px !important; }

    /* Bookmark panel */
    .bookmark-panel { width: 100% !important; }
    .bookmark-panel-header { padding: 12px 14px !important; }
    .bookmark-panel-item { padding: 10px 14px !important; }
    .bookmark-panel-link { font-size: 13px !important; }
}

/* ════════════════════════════════════
   VERY SMALL — max-width: 360px
   ════════════════════════════════════ */
@media (max-width: 360px) {
    .logo-schuco { font-size: 15px !important; }
    .logo-docu { display: none !important; }
    .header-inner { padding: 6px 8px; }
    .catalogue, .catalogue--pdf { padding: 10px !important; }
}

/* ════════════════════════════════════
   Admin pages responsive
   ════════════════════════════════════ */
@media (max-width: 768px) {
    .admin-container { padding: 24px 12px !important; }
    .admin-header h1 { font-size: 22px !important; }
    .admin-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
    .admin-card { padding: 20px !important; }
    .adminPanel { padding: 8px !important; }
    .adminPanel h1 { font-size: 22px !important; }
    .adminPanelForm { max-width: 100% !important; }
    .adminGrid { grid-template-columns: 1fr !important; }
    .adminCardWide { grid-column: 1 !important; }
}
@media (max-width: 480px) {
    .admin-container { padding: 16px 8px !important; }
    .admin-header h1 { font-size: 18px !important; }
}

/* ═══ Safe area for notched phones ═══ */
@supports (padding: env(safe-area-inset-left)) {
    #header, .header-inner, #pv-header {
        padding-left: max(env(safe-area-inset-left), 12px);
        padding-right: max(env(safe-area-inset-right), 12px);
    }
    #footer, #footerText { padding-bottom: env(safe-area-inset-bottom); }
}