/* Better Books responsive storefront header */
:root{
    --bbk-header-bg:#fff;
    --bbk-header-text:#111827;
    --bbk-header-muted:#64748b;
    --bbk-header-line:#e5e7eb;
    --bbk-header-soft:#f8fafc;
    --bbk-header-hover:#eef2ff;
    --bbk-header-blue:#1d4ed8;
    --bbk-header-red:#ef4444;
    --bbk-header-green:#16a34a;
    --bbk-header-shadow:0 8px 28px rgba(15,23,42,.08);
}

.bbk-customer-header{
    position:sticky;
    top:0;
    z-index:1000;
    display:grid;
    grid-template-columns:minmax(0,1fr) 190px minmax(0,1fr);
    align-items:center;
    gap:14px;
    height:72px;
    padding:0 28px;
    overflow:visible;
    background:var(--bbk-header-bg);
    border-bottom:1px solid var(--bbk-header-line);
    box-shadow:var(--bbk-header-shadow);
}

.bbk-head-side{
    display:flex;
    align-items:center;
    gap:9px;
    min-width:0;
    height:72px;
}
.bbk-head-left{justify-content:flex-start}
.bbk-head-right{justify-content:flex-end}

.bbk-head-link,
.bbk-account-button,
.bbk-mobile-menu-button{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    height:44px;
    padding:0 13px;
    border:1px solid var(--bbk-header-line);
    border-radius:14px;
    background:var(--bbk-header-soft);
    color:var(--bbk-header-text);
    font:850 15px/1 inherit;
    text-decoration:none;
    white-space:nowrap;
    cursor:pointer;
    transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;
}
.bbk-head-link:hover,
.bbk-account-button:hover,
.bbk-mobile-menu-button:hover,
.bbk-head-link.is-active{
    background:var(--bbk-header-hover);
    border-color:#c7d2fe;
    color:var(--bbk-header-blue);
}
.bbk-head-link:active,
.bbk-account-button:active,
.bbk-mobile-menu-button:active{transform:translateY(1px)}

.bbk-head-icon-only{width:44px;padding:0}
.bbk-head-icon,.bbk-account-icon{font-size:18px;line-height:1}
.bbk-dashboard-tile{display:inline-flex;align-items:center;justify-content:center}

.bbk-head-logo{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:190px;
    height:72px;
    overflow:visible;
}
.bbk-head-logo img{
    position:absolute;
    left:50%;
    top:50%;
    z-index:1500;
    width:auto;
    height:118px;
    max-width:185px;
    object-fit:contain;
    transform:translate(-50%,-32%);
}

.bbk-action-count,
.bbk-account-notice-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:19px;
    height:19px;
    padding:0 5px;
    border-radius:999px;
    color:#fff;
    font-size:11px;
    font-weight:900;
    line-height:1;
}
.bbk-action-count{
    position:absolute;
    top:-5px;
    right:-5px;
    background:var(--bbk-header-red);
    box-shadow:0 2px 7px rgba(239,68,68,.3);
}
.bbk-account-notice-count{
    display:none;
    background:var(--bbk-header-green);
    box-shadow:0 2px 7px rgba(22,163,74,.28);
}

.bbk-wishlist-count{
    background: var(--bbk-header-green);
    box-shadow:0 2px 7px rgba(22,163,74,.28);
}

.bbk-dropdown-wrap{position:relative}
.bbk-account-label{display:inline-flex;align-items:center}
.bbk-account-name{max-width:150px;overflow:hidden;text-overflow:ellipsis}
.bbk-account-caret{font-size:12px;color:var(--bbk-header-muted)}

.bbk-account-menu,
.bbk-mobile-dropdown{
    position:absolute;
    top:calc(100% + 10px);
    min-width:230px;
    padding:9px;
    border:1px solid var(--bbk-header-line);
    border-radius:18px;
    background:#fff;
    box-shadow:0 22px 55px rgba(15,23,42,.16);
    opacity:0;
    transform:translateY(-6px);
    pointer-events:none;
    transition:opacity .18s ease,transform .18s ease;
    z-index:1600;
}
.bbk-account-menu{right:0}
.bbk-dropdown-wrap.is-open > .bbk-account-menu,
.bbk-dropdown-wrap.is-open > .bbk-mobile-dropdown{
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
}
.bbk-account-summary{
    padding:10px 11px 12px;
    margin-bottom:5px;
    border-bottom:1px solid #f1f5f9;
}
.bbk-account-summary strong{display:block;font-size:14px;font-weight:900;color:var(--bbk-header-text)}
.bbk-account-summary span{display:block;margin-top:4px;font-size:12px;color:var(--bbk-header-muted)}
.bbk-account-menu a,
.bbk-account-menu button,
.bbk-account-info-row,
.bbk-mobile-dropdown a{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:10px 11px;
    border:0;
    border-radius:12px;
    background:transparent;
    color:var(--bbk-header-text);
    text-align:left;
    text-decoration:none;
    font:800 14px/1.25 inherit;
}
.bbk-account-menu a:hover,
.bbk-account-menu button:hover,
.bbk-mobile-dropdown a:hover,
.bbk-mobile-dropdown a.is-active{background:#f1f5f9}
.bbk-account-menu form{margin:0}
.bbk-account-menu button{color:#dc2626;cursor:pointer}
.bbk-account-info-row{color:var(--bbk-header-muted);font-size:13px}
.bbk-account-info-row strong,.bbk-account-menu a strong{color:var(--bbk-header-green);font-size:12px}
.bbk-account-menu a[href*="register"]{color:var(--bbk-header-blue);background:#eff6ff}

.bbk-mobile-nav-wrap{display:none}

@media(max-width:900px){
    .bbk-customer-header{
        grid-template-columns:40px minmax(112px,1fr) auto;
        gap:7px;
        height:60px;
        padding:0 9px;
    }
    .bbk-head-left{display:none}
    .bbk-mobile-nav-wrap{display:block;justify-self:start}
    .bbk-mobile-menu-button{
        width:38px;
        min-width:38px;
        height:38px;
        padding:0;
        border-radius:11px;
        font-size:20px;
    }
    .bbk-mobile-dropdown{
        left:0;
        min-width:190px;
    }
    .bbk-head-logo{
        grid-column:2;
        justify-self:center;
        width:128px;
        min-width:128px;
        height:68px;
    }
    .bbk-head-logo img{
        height:100px;
        max-width:150px;
        transform:translate(-50%,-35%);
    }
    .bbk-head-right{
        grid-column:3;
        gap:6px;
        height:60px;
    }
    .bbk-wishlist-head-link{display:none}
    .bbk-cart-head-link,
    .bbk-account-button{
        width:38px!important;
        min-width:38px!important;
        height:38px;
        padding:0!important;
        border-radius:11px;
    }
    .bbk-head-icon,.bbk-account-icon{font-size:17px}
    .bbk-account-label,.bbk-account-caret{display:none!important}
    .bbk-account-notice-count{
        position:absolute;
        top:-5px;
        right:-5px;
        display:inline-flex;
        min-width:17px;
        height:17px;
        padding:0 4px;
        font-size:9px;
    }
    .bbk-action-count{
        top:-5px;
        right:-5px;
        min-width:17px;
        height:17px;
        padding:0 4px;
        font-size:9px;
    }
    .bbk-account-menu{
        right:0;
        min-width:215px;
    }
}

@media(max-width:390px){
    .bbk-customer-header{
        grid-template-columns:36px minmax(96px,1fr) auto;
        gap:5px;
        padding:0 7px;
    }
    .bbk-mobile-menu-button,
    .bbk-cart-head-link,
    .bbk-account-button{
        width:35px!important;
        min-width:35px!important;
        height:36px;
        border-radius:10px;
    }
    .bbk-head-right{gap:5px}
    .bbk-head-logo{width:106px;min-width:106px}
    .bbk-head-logo img{height:90px;max-width:132px;transform:translate(-50%,-35%)}
}

/* Header compatibility and compact mobile navigation refinements */
.bbk-customer-header nav a,
.bbk-customer-header nav button{
    margin-left:0;
}

.bbk-mobile-dropdown a{
    justify-content:flex-start;
    gap:10px;
}

.bbk-mobile-nav-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:22px;
    min-width:22px;
    font-size:16px;
    line-height:1;
}

@media(max-width:900px){
    .bbk-mobile-dropdown a{
        min-height:40px;
        padding:9px 10px;
    }
}
