/* ========================================================================
   NZ Responsive Header & Footer - Mobile Only
   ------------------------------------------------------------------------
   Extracted from:
     - css/ewp-helper.css                       (responsive header block)
     - CustomEstores/NewZealand/Views/Product/Details/PartialViews/
       UpdateableBookDetail.ascx                (responsive footer block,
                                                 inline <style>)
   Intended to be included only on opted-in pages (e.g. PDP, edit account,
   order confirmation, login) so the styles do not affect the rest of
   the site.
   The previous `.pdp-responsive` scope has been removed so the same
   styles apply consistently to every opted-in page.
   ======================================================================== */


/* ------------------------------------------------------------------------
   1) Desktop defaults - hide responsive elements on large screens
   ------------------------------------------------------------------------ */
.responsive-layer { display: none; }
.pdp-responsive-header-icons { display: none; }
#hamburger-icon,
#search-icon,
#search-cross-icon,
#hamburger-cross-icon { display: none; }
.search-layer { display: none; }

/* Hide hamburger menu elements by default (prevents desktop visibility leak) */
.nz-hamburger-panel {
    display: none;
}

/* Hide responsive estore navigation by default (prevents desktop visibility leak) */
.nz-estore-nav-responsive {
    display: none;
}


/* ========================================================================
   2) Mobile responsive styles
   ======================================================================== */
@media (max-width: 768px) {

    /* ====================================================================
       HEADER - Responsive layer / global header / search / country
       ==================================================================== */

    /* Responsive layer - visible on mobile */
    .responsive-layer {
        display: block;
        background-color: #fff;
    }

    /* Header icons container - vertically centered in site header logo row */
    /* Global header bar is ~36px, logo row (tr-SiteHeader-inner) is 78px */
    .pdp-responsive-header-icons {
        display: flex;
        align-items: center;
        position: absolute;
        right: 0.75rem;
        top: 36px;
        height: 78px;
        z-index: 890;
    }

    .responsive-header-icon {
        cursor: pointer;
    }

    /* Hamburger icon */
    #hamburger-icon {
        display: block;
    }

    /* Search icon */
    #search-icon {
        display: block;
    }

    /* Search cross icon - hidden by default, shown via JS */
    #search-cross-icon {
        display: none;
    }

    /* Hamburger cross icon - hidden by default, shown via JS */
    #hamburger-cross-icon {
        display: none;
    }

    /* Global header responsive */
    .tr-GlobalHeader-inner-responsive {
        flex-wrap: wrap;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .tr-GlobalHeader-responsive {
        display: flex !important;
        justify-content: flex-start !important;
        width: 100% !important;
    }

    .tr-GlobalHeader-responsive > nav {
        width: 100%;
    }

    /* Show short labels, hide long labels on mobile global header (right items) */
    .tr-GlobalHeader-rightItems .tr-GlobalHeaderBaseItem-linkLabel {
        display: inline !important;
    }

    .tr-GlobalHeader-rightItems .tr-GlobalHeaderBaseItem-longLinkLabel {
        display: none !important;
    }

    /* Keep long label for left items (Global directory) */
    .tr-GlobalHeader-leftItems .tr-GlobalHeaderBaseItem-longLinkLabel {
        display: inline !important;
    }

    .tr-GlobalHeader-leftItems .tr-GlobalHeaderBaseItem-linkLabel {
        display: none !important;
    }

    /* Compact global header items on mobile */
    .tr-GlobalHeader-rightItems {
        display: flex !important;
        margin-left: auto;
    }

    .tr-GlobalHeaderBaseItem-link {
        padding-left: 0.4rem;
        padding-right: 0.4rem;
        font-size: 0.75rem;
    }

    /* Country header */
    .country-header {
        display: block !important; /* overrides inline display:none from site-header-teamsite.ascx */
        padding: 10px 15px;
        font-weight: 500;
        font-size: 14px;
        color: #404040;
        border: 1px solid #d0d0d0;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        background-color: #F4F4F4;
    }

    /* Search layer */
    .search-layer {
        display: none;
        padding: 10px 15px;
        border-top: 1px solid #d0d0d0;
    }

    .search-layer #search-header {
        display: flex;
        align-items: center;
        border: 1px solid #d0d0d0;
        border-radius: 0.375rem;
        padding: 0.5rem 0.75rem;
        background: #fff;
    }

    .search-layer .search-text-input {
        flex: 1;
        border: none;
        outline: none;
        font-size: 16px;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        color: #505050;
        background: none;
        padding: 0.25rem;
    }

    .search-layer .search-submit-input {
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        display: flex;
        align-items: center;
        color: #4d4d4d;
    }

    .search-layer .search-submit-input svg {
        width: 20px;
        height: 20px;
    }

    /* Hide desktop navigation menus on mobile */
    .tr-SiteHeader-menus-responsive {
        display: none !important;
    }

    /* Hide eStore navigation bar on mobile */
    .shopestore {
        display: none;
    }

    /* Adjust site header for mobile - show logo, hide desktop nav items */
    .tr-SiteHeader-menus {
        display: none !important;
    }

    .tr-SiteHeader-buttons {
        display: none !important;
    }

    /* Site name / country label */
    .tr-nz-header-responsive {
        display: none;
    }

    /* Autocomplete dropdown for responsive search */
    .ac_results {
        z-index: 1000;
    }

    .tr-SiteHeader-siteName{
        display: none;
    }

    /* Cart: show only the number, hide "items" label on mobile */
    .item-text {
        display: none;
    }


    /* ====================================================================
       NZ Hamburger Menu Panel - Multi-level AU-style navigation
       Panel is in normal document flow, appears below country-header.
       jQuery slideDown/slideUp controls visibility.
       ==================================================================== */

    /* Panel container - absolutely positioned to overlay content below country header */
    /* z-index ensures hamburger panel overlaps the Bookstore accordion below it */
    .nz-hamburger-panel {
        display: none;
        width: 100%;
        background: #fff;
        z-index: 900;
        position: absolute;
        left: 0;
    }

    /* ---------- Level containers ---------- */
    .nz-hamburger-level {
        display: none;
        flex-direction: column;
        background: #fff;
    }

    .nz-hamburger-level--active {
        display: flex;
        border-bottom: 1px solid #ededed;
    }

    .nz-hamburger-level--hidden-left {
        display: none;
    }

    /* ---------- Level 1: Main menu list ---------- */
    .nz-hamburger-main-list {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .nz-hamburger-main-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 1rem 1rem;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 1rem;
        font-weight: 400;
        color: #1a1a1a;
        text-decoration: none;
        background: none;
        border: none;
        border-bottom: 1px solid #e8e8e8;
        cursor: pointer;
        text-align: left;
    }

    .nz-hamburger-main-item:hover {
        background: #fafafa;
    }

    .nz-hamburger-arrow-right {
        flex-shrink: 0;
    }

    /* ---------- Level 2: Header with back button ---------- */
    .nz-hamburger-level-header {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.875rem 1rem;
        border-bottom: 1px solid #e0e0e0;
        background: #fff;
        flex-shrink: 0;
    }

    .nz-hamburger-back {
        background: none;
        border: none;
        cursor: pointer;
        padding: 0.25rem;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .nz-hamburger-back:hover {
        opacity: 0.7;
    }

    .nz-hamburger-level-title {
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 1rem;
        font-weight: 600;
        color: #e65100;
    }

    /* ---------- Scrollable content area (for Level 2 with many items) ---------- */
    .nz-hamburger-panel-content {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        max-height: 70vh;
        padding: 0;
    }

    /* ---------- Accordion section ---------- */
    .nz-hamburger-accordion-section {
        border-bottom: 1px solid #e8e8e8;
    }

    .nz-hamburger-accordion-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        background: none;
        border: none;
        padding: 1.2rem;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 0.9375rem;
        font-weight: 400;
        color: #1a1a1a;
        cursor: pointer;
        text-align: left;
    }

    .nz-hamburger-accordion-toggle:hover {
        background: #fafafa;
        border-bottom: 1px solid #ededed;
    }

    /* Chevron rotation */
    .nz-hamburger-chevron {
        transition: transform 0.2s ease;
        flex-shrink: 0;
    }

    .nz-hamburger-chevron.is-rotated {
        transform: rotate(180deg);
    }

    /* Collapsible sub-menu */
    .nz-hamburger-submenu {
        display: none;
        list-style: none;
        margin: 0;
        /* padding: 0 1rem 0.5rem 1.5rem; */
    }

    .nz-hamburger-submenu li a {
        display: block;
        padding: 0.5rem 0;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 0.875rem;
        color: #404040;
        text-decoration: none;
        border-bottom: 1px solid #e8e8e8;
        padding: 1rem 1rem 1rem 1.5rem;
    }

    .nz-hamburger-submenu li:last-child a {
        border-bottom: none;
    }

    .nz-hamburger-submenu li a:hover {
        color: #d14800;
    }

    /* "All ..." link at bottom of accordion (highlighted) */
    .nz-hamburger-submenu li a.nz-hamburger-all-link {
        color: #F2F2F2 !important;
        font-weight: 500;
        background: #123021;
        padding: 1rem 1rem 1rem 1.5rem;
        border-radius: 3px;
        border-bottom: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .nz-hamburger-submenu li a.nz-hamburger-all-link::after {
        content: '';
        display: inline-block;
        width: 16px;
        height: 21px;
        flex-shrink: 0;
        margin-left: 0.5rem;
        background: url("data:image/svg+xml,%3Csvg width='16' height='21' viewBox='0 0 16 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.8438 12.875L9.34375 18.375C9.15625 18.5625 8.8125 18.5625 8.625 18.375C8.4375 18.1875 8.4375 17.8438 8.625 17.6562L13.2812 13H1.5C1.21875 13 1 12.7812 1 12.5C1 12.25 1.21875 12 1.5 12H13.2812L8.625 7.375C8.4375 7.1875 8.4375 6.84375 8.625 6.65625C8.8125 6.46875 9.15625 6.46875 9.34375 6.65625L14.8438 12.1562C15.0312 12.3438 15.0312 12.6875 14.8438 12.875Z' fill='%23F2F2F2'/%3E%3C/svg%3E") no-repeat center center;
        background-size: contain;
    }

    .nz-hamburger-submenu li a.nz-hamburger-all-link:hover {
        background: #123021;
    }

    /* Promo card (e.g. Book Club) */
    .nz-hamburger-promo-card {
        padding: 20px;
        background: #f5f5f5;
        border-radius: 6px;
    }

    .nz-hamburger-promo-eyebrow {
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1px;
        color: #404040;
        margin: 0 0 6px;
    }

    .nz-hamburger-promo-title {
        font-size: 18px;
        font-weight: 700;
        color: #404040;
        margin: 0 0 10px;
    }

    .nz-hamburger-promo-text {
        font-size: 13px;
        line-height: 1.5;
        color: #404040;
        margin: 0 0 16px;
    }

    .nz-hamburger-promo-cta {
        display: block;
        width: 100%;
        padding: 12px 16px;
        font-size: 15px;
        font-weight: 700;
        color: #404040;
        text-align: center;
        text-decoration: none;
        background: #fff;
        border: 1px solid #1F1F1F;
        border-radius: 4px;
        cursor: pointer;
        box-sizing: border-box;
    }

    .nz-hamburger-promo-cta:hover {
        background: #f5f5f5;
        text-decoration: none;
    }

    .nz-hamburger-promo-cta svg {
        display: none;
    }


    /* ====================================================================
       NZ Responsive Estore Navigation Accordion (?768px)
       Replaces the horizontal desktop nav with a vertical accordion.
       Follows the same accordion pattern used in the hamburger panel.
       ==================================================================== */

    /* Container: shown on mobile */
    .nz-estore-nav-responsive {
        display: block;
        width: 100%;
        background: #fff;
        border-bottom: 1px solid #d0d0d0;
    }

    /* ---------- Top-level Bookstore accordion header ---------- */
    .nz-estore-accordion-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding: 0.875rem 1rem;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 18px;
        font-weight: 400;
        color: #1a1a1a;
        background: #fff;
        border: none;
        border-bottom: 1px solid #e8e8e8;
        cursor: pointer;
        text-align: left;
    }

    .nz-estore-accordion-header:hover {
        background: #fafafa;
    }

    /* Remove default browser focus outline on accordion buttons */
    .nz-estore-accordion-header:focus,
    .nz-estore-nested-toggle:focus {
        outline: none;
    }

    /* Bookstore header: font-weight 500 when expanded */
    .nz-estore-accordion-header[aria-expanded="true"] span {
        font-weight: 500;
    }

    /* Subject areas / International nested toggle: font-weight 500 when expanded */
    .nz-estore-nested-toggle[aria-expanded="true"] span {
        font-weight: 500;
    }

    /* Chevron rotation for all estore accordion chevrons */
    .nz-estore-chevron {
        transition: transform 0.2s ease;
        flex-shrink: 0;
    }

    .nz-estore-chevron.is-rotated {
        transform: rotate(180deg);
    }

    /* ---------- Bookstore accordion body (collapsed by default) ---------- */
    .nz-estore-accordion-body {
        display: none;
        background: #fff;
    }

    /* ---------- Nav list items ---------- */
    .nz-estore-nav-list {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .nz-estore-nav-list > li > a {
        display: flex;
        align-items: center;
        padding: 14px 16px 14px 32px;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 18px;
        font-weight: 400;
        color: #404040;
        text-decoration: none;
        border-bottom: 1px solid #e8e8e8;
    }

    .nz-estore-nav-list > li > a:hover {
        color: #d14800;
        background: #fafafa;
    }

    /* ---------- Nested accordion sections (Subject areas, International) ---------- */
    .nz-estore-nested-section {
        border-bottom: 1px solid #e8e8e8;
    }

    .nz-estore-nested-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        background: none;
        padding: 14px 16px 14px 32px;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 18px;
        font-weight: 400;
        color: #404040;
        cursor: pointer;
        text-align: left;
        border-bottom: 1px solid #e8e8e8;
    }

    .nz-estore-nested-toggle:hover {
        background: #fafafa;
    }

    /* ---------- Nested sub-menu (collapsed by default) ---------- */
    .nz-estore-submenu {
        display: none;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    /* Sub-menu heading (e.g. "Top subject areas") */
    .nz-estore-submenu-heading {
        padding: 14px 16px 14px 32px;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 18px;
        font-weight: 500;
        color: #e65100;
        border-bottom: 1px solid #e8e8e8;
    }

    /* Sub-menu links */
    .nz-estore-submenu li a {
        display: block;
        padding: 14px 16px 14px 48px;
        font-family: Knowledge2017, Helvetica Neue, Arial, sans-serif;
        font-size: 18px;
        font-weight: 400;
        color: #404040;
        text-decoration: none;
        border-bottom: 1px solid #e8e8e8;
    }

    .nz-estore-submenu li:last-child a {
        border-bottom: none;
    }

    .nz-estore-submenu li a:hover {
        color: #d14800;
    }

    /* "All subject areas" / "See all International" CTA link */
    .nz-estore-submenu li a.nz-estore-all-link {
        color: #F2F2F2 !important;
        font-size: 16px;
        font-weight: 600;
        background: #D64000;
        padding: 14px 16px 14px 48px;
        border-radius: 3px;
        border-bottom: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .nz-estore-submenu li a.nz-estore-all-link::after {
        content: '';
        display: inline-block;
        width: 16px;
        height: 21px;
        flex-shrink: 0;
        margin-left: 0.5rem;
        background: url("data:image/svg+xml,%3Csvg width='16' height='21' viewBox='0 0 16 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.8438 12.875L9.34375 18.375C9.15625 18.5625 8.8125 18.5625 8.625 18.375C8.4375 18.1875 8.4375 17.8438 8.625 17.6562L13.2812 13H1.5C1.21875 13 1 12.7812 1 12.5C1 12.25 1.21875 12 1.5 12H13.2812L8.625 7.375C8.4375 7.1875 8.4375 6.84375 8.625 6.65625C8.8125 6.46875 9.15625 6.46875 9.34375 6.65625L14.8438 12.1562C15.0312 12.3438 15.0312 12.6875 14.8438 12.875Z' fill='%23F2F2F2'/%3E%3C/svg%3E") no-repeat center center;
        background-size: contain;
    }

    .nz-estore-submenu li a.nz-estore-all-link:hover {
        background: #123021;
    }


    /* ====================================================================
       FOOTER - Responsive footer styles
       Extracted from UpdateableBookDetail.ascx inline <style>
       ==================================================================== */

    #footer-2015 {
        display: none;
    }

    #table-contentsresp {
        margin-bottom: 0;
    }

    #RightNavDiv {
        margin-top: 0;
    }

    .tr-SemanticFooter {
        display: none;
    }

    .pdp-responsive-footer {
        display: block !important;
        background: #222;
        color: #fff;
        margin: 0;
        padding: 0;
        width: 100%;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        position: relative;
    }

    .pdp-footer-accordion {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .pdp-footer-title {
        width: 100%;
        background: #1F1F1F;
        color: #FFFFFF;
        font-weight: 500;
        font-size: 16px;
        padding: 18px 20px;
        border-bottom: 1px solid #404040;
        outline: none;
        cursor: pointer;
        text-align: left;
        display: flex;
        align-items: center;
        justify-content: space-between;
        text-transform: uppercase;
        letter-spacing: 0.02em;
    }

    .pdp-footer-caret {
        margin-left: auto;
        transition: transform 0.2s;
    }

    .pdp-footer-section.open .pdp-footer-caret {
        transform: rotate(180deg);
    }

    .pdp-footer-list {
        display: none;
        flex-direction: column;
        background: #1F1F1F;
        padding: 0;
        margin: 0;
        list-style: none;
    }

    .pdp-footer-section.open .pdp-footer-list {
        display: flex;
    }

    .pdp-footer-list li {
        border-bottom: 1px solid #404040;
        width: 320px;
    }

    .pdp-footer-list a, .pdp-footer-list button {
        text-align: unset;
        display: block;
        color: #FFFFFF;
        text-decoration: none;
        padding-top: 22px;
        padding-bottom: 22px;
        padding-right: 20px;
        padding-left: 36px;
        font-size: 1rem;
        background: none;
        border: none;
        transition: background 0.2s, color 0.2s;
    }

        .pdp-footer-list a:focus {
            text-decoration: underline;
            color: #FFFFFF !important;
        }

    .pdp-footer-logo {
        font-weight: 500;
        font-size: 16px;
        text-transform: none;
    }
}