/* 360 Seals Inventory Page */
:root{--blue:#005bd8;--navy:#001b33;--line:#dfe6ef;--light:#f7f9fc;--text:#06101b}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f5f7fa;color:var(--text)}
a{text-decoration:none;color:inherit}
.header{height:84px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 30px;border-bottom:1px solid #e7e7e7;position:sticky;top:0;z-index:100}
.logo-wrap{line-height:.88;min-width:255px}
.logo{font-weight:900;font-size:45px;letter-spacing:-2px;color:#0a57bb}.logo .black{color:#050505;letter-spacing:-1px}.logo .deg{font-size:20px;vertical-align:top;margin-left:1px}
.logo-sub{font-size:9px;color:#005bd8;font-weight:900;letter-spacing:.8px;margin-left:92px;margin-top:-2px}
.nav{display:flex;gap:22px;font-size:11px;font-weight:800;align-items:center}.nav span:after{content:"";border:4px solid transparent;border-top-color:#111;display:inline-block;margin-left:5px;transform:translateY(2px)}
.head-right{display:flex;align-items:center;gap:11px}.login{font-size:10px;font-weight:700;white-space:nowrap}.cart{font-size:22px;position:relative}
.cart:after{content:"0";position:absolute;right:-8px;top:-7px;background:#005bd8;color:white;border-radius:50%;font-size:10px;width:15px;height:15px;display:flex;align-items:center;justify-content:center}
.top-search{height:31px;width:190px;border:1px solid #ccd3dc;border-radius:4px;display:flex;align-items:center;background:#fff;overflow:hidden}
.top-search input{border:0;outline:0;font-size:10px;padding:0 8px;width:160px}.top-search button{border:0;background:white;color:#005bd8;font-size:17px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:4px;font-weight:900;font-size:12px;text-transform:uppercase;cursor:pointer}
.btn-blue{background:#005bd8;color:white;border:1px solid #005bd8}.btn-outline{border:1px solid #005bd8;color:#005bd8;background:#fff}.mobile-menu-btn{display:none}
.page-hero{background:#001b33;color:#fff;padding:34px 42px;position:relative;overflow:hidden}
.page-hero:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(0,91,216,.16) 0 2px,transparent 2px 18px)}
.page-hero-content{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:30px}
.page-hero h1{margin:0 0 8px;font-size:42px;line-height:1;font-weight:900;text-transform:uppercase}.page-hero p{margin:0;font-size:16px;color:#dcecff;font-weight:700}
.hero-search{width:430px;height:52px;background:white;border-radius:6px;display:flex;overflow:hidden;box-shadow:0 10px 25px rgba(0,0,0,.25)}
.hero-search input{flex:1;border:0;outline:0;padding:0 16px;font-size:14px}.hero-search button{width:60px;border:0;background:#005bd8;color:#fff;font-size:22px}
.inventory-layout{display:grid;grid-template-columns:340px 1fr;gap:18px;padding:18px}
.panel{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,.04)}
.panel-title{background:#eef3f8;padding:13px 16px;font-size:13px;font-weight:900;text-transform:uppercase;color:#001b33;border-bottom:1px solid var(--line)}
.filter-section{padding:16px;border-bottom:1px solid var(--line)}.filter-section:last-child{border-bottom:0}.filter-section h3{margin:0 0 12px;font-size:12px;text-transform:uppercase}
.group-list{list-style:none;margin:0;padding:0}.group-list li{padding:7px 0;font-size:13px;font-weight:800;cursor:pointer}.group-list li.active{color:#005bd8}
.input-row{display:flex;gap:8px}input,select{height:36px;border:1px solid #cfd8e3;border-radius:4px;padding:0 10px;font-size:13px;background:#fff}.input-row input{flex:1}.full{width:100%;margin-bottom:12px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px}.small-label{display:block;font-size:11px;font-weight:900;margin:0 0 5px}.checkbox-line{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;margin-top:8px}
.main-panel{min-width:0}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;background:#fff;border:1px solid var(--line);border-radius:8px;margin-bottom:16px}
.toolbar h2{margin:0;font-size:22px;text-transform:uppercase;color:#001b33}.update{font-size:12px;color:#198754;font-weight:900}
.category-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:12px}
.category-card{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px;display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:center;box-shadow:0 3px 12px rgba(0,0,0,.04)}
.category-icon{width:40px;height:40px;border-radius:50%;border:3px solid #005bd8;background:#f0f6ff}.category-card h3{margin:0 0 4px;font-size:14px;text-transform:uppercase}.category-card strong{font-size:20px;color:#005bd8}.category-card p{margin:4px 0 0;font-size:11px;color:#555;font-weight:700}
.table-wrap{background:#fff;border:1px solid var(--line);border-radius:8px;overflow:auto}.inventory-table{width:100%;border-collapse:collapse;min-width:900px}.inventory-table th{background:#001b33;color:#fff;text-align:left;padding:14px;font-size:12px;text-transform:uppercase}.inventory-table td{padding:14px;border-bottom:1px solid var(--line);font-size:13px;font-weight:700}.inventory-table tr:nth-child(even){background:#fafcff}
.status{color:#005bd8;font-weight:900}.qty{font-size:20px;font-weight:900}.add-btn{background:#005bd8;color:#fff;border:0;border-radius:4px;padding:9px 16px;font-weight:900;text-transform:uppercase}
.note{margin-top:12px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:13px 16px;font-size:12px;color:#4a5565}

@media(max-width:1000px){.header{height:auto;display:grid;grid-template-columns:1fr auto;gap:12px;padding:14px 16px}.logo{font-size:34px}.logo-sub{font-size:7px;margin-left:68px}.logo-wrap{min-width:auto}.mobile-menu-btn{display:block;background:#005bd8;color:#fff;border:0;border-radius:4px;padding:10px 14px;font-weight:900}.nav{grid-column:1/-1;display:none;flex-direction:column;align-items:stretch;gap:0;background:#f7f9fc;border:1px solid var(--line);border-radius:8px;overflow:hidden}.nav.open{display:flex}.nav a,.nav span{padding:14px;border-bottom:1px solid var(--line)}.head-right{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px}.top-search{grid-column:1/-1;width:100%;height:42px}.login,.cart{display:none}.page-hero-content{display:block}.hero-search{width:100%;margin-top:18px}.inventory-layout{grid-template-columns:1fr}.category-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.category-grid{grid-template-columns:1fr}.page-hero h1{font-size:34px}}
@media(max-width:1000px){

    .header{
        height:auto;
        min-height:95px;
        padding:10px 16px;
        display:grid;
        grid-template-columns:1fr auto;
        align-items:center;
        gap:10px;
    }

    .logo-wrap{
        min-width:0;
    }

    .site-logo{
        width:220px;
        max-width:100%;
        height:auto;
    }

    .mobile-menu-btn{
        align-self:center;
    }

    .page-hero{
        margin-top:0;
    }
}
@media(max-width:560px){
    .header{
        min-height:80px;
        padding:8px 14px;
    }

    .site-logo{
        width:200px;
    }
}

/* ---------- Shared Header ---------- */

.site-logo{
    width:255px;
    height:auto;
    display:block;
}

.logo-wrap{
    display:flex;
    align-items:center;
    text-decoration:none;
}

.desktop-logout{
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
}

.mobile-logout{
    display:none;
}



/* ---------- Tablet ---------- */

@media (max-width:1200px){

    .site-logo{
        width:220px;
    }

    .customer-header-card{
        min-width:240px;
        font-size:12px;
    }

}

/* ---------- Mobile ---------- */

@media (max-width:1000px){

    .site-logo{
        width:180px;
    }

    .desktop-logout{
        display:none;
    }

    .mobile-logout{
        display:block;
        color:#005bd8;
        font-weight:800;
    }

    .head-right{
        width:100%;
    }

    .customer-header-card{
        width:100%;
        min-width:0;
        margin-top:10px;
    }

}