/* ============================================================
   category.css — Category Hub (product/category.blade.php)
   Desktop + Tablet + Mobile + Light + Dark (body.dark)
   pagetype: category  (e.g. /fans, /voltage-stabilizers)
   Phase 3: extracted from styles.css. Shared _pdcrd lives in common-atf.css.
   ============================================================ */

/* --- Category hub — light + responsive (from styles.css L384-676) --- */
/* ========== Category page — single white panel ========== */
.cat-page{margin:0;padding:1rem 0 2rem;}
.cat-page__panel{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:18px;
    box-shadow:0 10px 30px rgba(15,23,42,.06);
    padding:1.25rem 1rem 1.5rem;
}
.cat-page__intro{margin-bottom:0;padding-bottom:1.25rem;}
.cat-page__breadcrumb{margin-bottom:.75rem;}
.cat-page__title-row{
    align-items:center;
    justify-content:flex-start;
    gap:1rem;
    margin-bottom:1rem;
}
.cat-page__title{margin:0;letter-spacing:-.02em;width:auto;flex:none;min-width:0;}
.cat-page__share-wrap{flex:none;}
.cat-page__banner{
    overflow:hidden;
    border-radius:14px;
    border:1px solid #e5e7eb;
    background:#f8fafc;
}
.cat-page__banner img{display:block;width:100%;height:100%;}
.cat-page__content{
    margin-top:0;
    padding-top:1.35rem;
    border-top:1px solid #eef2f7;
}
.cat-page__share{display:none;}
.cat-wgt__title{
    margin:0 0 1.1rem;
    font-size:1.35rem;
    letter-spacing:-.02em;
    color:#0f172a;
}
.cat-brands-wgt__head .cat-wgt__title{margin:0;}

/* Brands / child category tiles */
.cat-brands-wgt{
    margin:0;
    padding:1.35rem 0 1.4rem;
    border-top:1px solid #eef2f7;
    background:transparent;
}
.cat-brands-wgt__head{
    align-items:center;
    justify-content:space-between;
    gap:.85rem 1rem;
    flex-wrap:wrap;
    margin-bottom:1.1rem;
}
.cat-brand-search{
    position:relative;
    width:100%;
    max-width:100%;
    margin-left:auto;
}
.cat-brand-search__input{
    width:100%;
    height:42px;
    padding:.55rem 2.5rem .55rem .95rem;
    border:1px solid #dbe3ee;
    border-radius:10px;
    background:#fff;
    color:#0f172a;
    font-size:.875rem;
    font-family:inherit;
    outline:none;
    transition:border-color .2s ease,box-shadow .2s ease;
}
.cat-brand-search__input::placeholder{color:#94a3b8;}
.cat-brand-search__input:focus{
    border-color:#94a3b8;
    box-shadow:0 0 0 3px rgba(148,163,184,.18);
}
.cat-brand-search__icon{
    position:absolute;
    right:.75rem;
    top:50%;
    transform:translateY(-50%);
    width:18px;
    height:18px;
    color:#94a3b8;
    pointer-events:none;
}
.cat-brand-search__icon svg{width:100%;height:100%;display:block;}
.cat-brand-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.85rem;
    width:100%;
}
.cat-brand-item{width:100%;min-width:0;}
.cat-brand-item[hidden]{display:none !important;}
.cat-brand-empty{
    grid-column:1 / -1;
    margin:0;
    padding:1.75rem 1rem;
    text-align:center;
    font-size:.95rem;
    line-height:1.5;
    color:#64748b;
    background:#f8fafc;
    border:1px dashed #dbe3ee;
    border-radius:14px;
}
.cat-brand-empty[hidden]{display:none !important;}
.cat-brand-tile{
    display:flex;
    flex-direction:column;
    height:100%;
    background:#fff;
    border:1px solid rgba(226,232,240,.98);
    border-radius:16px;
    box-shadow:0 1px 2px rgba(15,23,42,.04),0 10px 24px rgba(15,23,42,.07);
    overflow:hidden;
    transition:transform .35s cubic-bezier(.4,0,.2,1),box-shadow .35s ease,border-color .35s ease;
}
.cat-brand-tile:hover{
    transform:translateY(-5px);
    border-color:rgba(148,163,184,.55);
    box-shadow:0 14px 32px rgba(15,23,42,.12),0 4px 12px rgba(15,23,42,.06);
}
.cat-brand-tile__media{
    width:100%;
    height:118px;
    align-items:center;
    justify-content:center;
    background:#fff;
    border:none;
    border-radius:0;
    border-bottom:1px solid #eef2f7;
    padding:1rem .85rem;
}
.cat-brand-tile__media img{
    max-width:76%;
    max-height:76%;
    width:auto;
    height:auto;
    object-fit:contain;
    transition:transform .4s cubic-bezier(.4,0,.2,1);
}
.cat-brand-tile:hover .cat-brand-tile__media img{transform:scale(1.06);}
.cat-brand-tile__name{
    margin:0;
    padding:.85rem .65rem .95rem;
    background:#f8fafc;
    font-size:.8rem;
    font-weight:500;
    line-height:1.3;
    letter-spacing:-.01em;
    text-align:center;
    color:#0f172a;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    min-height:3.1em;
}
.cat-brand-more{
    grid-column:1 / -1;
    width:100%;
    justify-content:center;
    margin-top:.55rem;
}
.cat-brand-more .category-see-more{
    padding:.7rem 1.65rem;
    border-radius:999px;
    background:linear-gradient(135deg,#3b82f6 0%,#8b5cf6 100%);
    box-shadow:0 8px 18px rgba(15,23,42,.18);
}
.cat-brand-more .category-see-more:hover{transform:translateY(-2px);box-shadow:0 12px 22px rgba(15,23,42,.22);}

/* Popular products on category */
.cat-popular-wgt{
    margin:0;
    padding:1.4rem 0 1.5rem;
    border-top:1px solid #eef2f7;
    background:transparent;
}

/* Types / By Price / Quick links */
.cat-links-wgt{
    position:relative;
    margin:1.15rem 0 0;
    padding:1.15rem 1rem 1.15rem 1.1rem;
    border-radius:14px;
    border:1px solid #e8ecf1;
    background:#f8fafc;
    box-shadow:none;
    overflow:hidden;
}
/* .cat-links-wgt::before{
    content:"";
    position:absolute;
    left:0;top:0;bottom:0;
    width:3px;
    background:#0f172a;
} */
.cat-links-wgt--price::before{background:#ea580c;}
.cat-links-wgt--brands::before{background:#64748b;}
.cat-links-wgt--types::before{background:#0284c7;}
.cat-links-wgt__title{
    position:relative;
    margin:0 0 .9rem;
    font-size:1.05rem;
    font-weight:700;
    letter-spacing:-.01em;
    color:#0f172a;
}
.cat-link-list{
    position:relative;
    display:grid;
    grid-template-columns:1fr;
    gap:.5rem;
    list-style:none;
    margin:0;
    padding:0;
}
.cat-link-chip{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    width:100%;
    padding:.68rem .85rem;
    border-radius:10px;
    border:1px solid #e8ecf1;
    background:#fff;
    color:#1e293b;
    font-size:.875rem;
    font-weight:600;
    line-height:1.3;
    text-decoration:none;
    transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.cat-link-chip::after{
    content:"";
    flex:none;
    width:.4rem;
    height:.4rem;
    border-right:2px solid #94a3b8;
    border-top:2px solid #94a3b8;
    transform:rotate(45deg);
    transition:border-color .2s ease,transform .2s ease;
}
.cat-link-chip:hover{
    transform:translateY(-1px);
    border-color:#cbd5e1;
    box-shadow:0 6px 14px rgba(15,23,42,.06);
    color:#0f172a;
}
.cat-link-chip:hover::after{
    border-color:#0f172a;
    transform:rotate(45deg) translate(.5px,-.5px);
}
.cat-links-wgt--price .cat-link-chip:hover{border-color:rgba(234,88,12,.35);}
.cat-links-wgt--price .cat-link-chip:hover::after{border-color:#ea580c;}

@media (min-width:640px){
    .cat-page__panel{padding:1.5rem 1.35rem 1.75rem;border-radius:20px;}
    .cat-brand-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem;}
    .cat-link-list{grid-template-columns:repeat(2,minmax(0,1fr));}
    .cat-links-wgt .category-price-list{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (min-width:1025px){
    .cat-page{padding:1.5rem 0 3rem;}
    .cat-page__panel{padding:2rem 2rem 2.25rem;border-radius:24px;box-shadow:0 14px 40px rgba(15,23,42,.07);}
    .cat-page__title{font-size:2.4rem;}
    .cat-page__title-row{align-items:center;justify-content:flex-start;gap:2rem;}
    .cat-page__intro{padding-bottom:1.5rem;}
    .cat-page__banner{border-radius:16px;margin:0 -2rem;border-radius:0;border:none;}
    .cat-wgt__title{font-size:1.75rem;margin-bottom:1.35rem;}
    .cat-brands-wgt__head{margin-bottom:1.35rem;}
    .cat-brands-wgt__head .cat-wgt__title{margin:0;}
    .cat-brand-search{max-width:280px;}
    .cat-brand-search__input{height:44px;font-size:.9rem;}
    .cat-brands-wgt{padding:1.75rem 0 1.85rem;}
    .cat-brand-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:1.1rem;}
    .cat-brand-tile{border-radius:18px;}
    .cat-brand-tile__media{height:148px;padding:1.2rem 1rem;}
    .cat-brand-tile__name{padding:1rem .75rem 1.1rem;font-size:.9rem;min-height:3.3em;}
    .cat-popular-wgt{padding:1.85rem 0 2rem;}
    .cat-links-wgt{padding:1.35rem 1.25rem 1.4rem 1.35rem;margin-top:1.35rem;border-radius:16px;}
    .cat-links-wgt__title{font-size:1.15rem;margin-bottom:1rem;}
    .cat-link-list,
    .cat-links-wgt .category-price-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;}
    .cat-link-chip{padding:.75rem .95rem;font-size:.9rem;}
    .cat-page__content{padding-top:1.75rem;}
}

/* --- Category hub — dark (body.dark) (from styles.css L2153-2218) --- */
body.dark .cat-page__panel{
    background:#1a1a1d;
    border-color:#2d2d30;
    box-shadow:0 14px 40px rgba(0,0,0,.35);
}
body.dark .cat-page__banner{background:#111214;border-color:#3f3f46;box-shadow:none;}
body.dark .cat-brands-wgt,
body.dark .cat-popular-wgt,
body.dark .cat-page__content{
    border-top-color:#2d2d30;
    background:transparent;
}
body.dark .cat-wgt__title{color:#f8fafc;}
body.dark .cat-brand-search__input{
    background:#111214;
    border-color:#3f3f46;
    color:#f8fafc;
}
body.dark .cat-brand-search__input:focus{
    border-color:#52525b;
    box-shadow:0 0 0 3px rgba(82,82,91,.25);
}
body.dark .cat-brand-search__icon{color:#71717a;}
body.dark .cat-brand-empty{
    color:#a1a1aa;
    background:#111214;
    border-color:#3f3f46;
}
body.dark .cat-brand-tile{
    background:#18181b;
    border-color:#3f3f46;
    box-shadow:0 1px 2px rgba(0,0,0,.35),0 12px 28px rgba(0,0,0,.35);
}
body.dark .cat-brand-tile:hover{
    border-color:#52525b;
    box-shadow:0 16px 34px rgba(0,0,0,.45),0 4px 12px rgba(0,0,0,.3);
}
body.dark .cat-brand-tile__media{
    background:#fff;
    border-bottom-color:#2d2d30;
}
body.dark .cat-brand-tile__name{
    background:#111214;
    color:#f8fafc;
}
body.dark .cat-brand-more .category-see-more{
    background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%);
    color:#0f172a;
    box-shadow:0 8px 18px rgba(0,0,0,.35);
}
body.dark .cat-links-wgt{
    background:#111214;
    border-color:#2d2d30;
}
body.dark .cat-links-wgt__title{color:#f8fafc;}
body.dark .cat-link-chip{
    background:#1a1a1d;
    border-color:#3f3f46;
    color:#e2e8f0;
}
body.dark .cat-link-chip:hover{
    background:#18181b;
    border-color:#52525b;
    color:#fff;
    box-shadow:0 6px 14px rgba(0,0,0,.4);
}


/* Mobile category price list (moved from styles responsive block) */
@media (max-width:768px){
.category-price-list { grid-template-columns: 1fr;}
}