/* Extracted from template/product/category.twig */

 :root {
      --blue: #05245A;
      --blue-d: #041c47;
      --blue-l: #eef1ff;
      --orange: #CD1016;
      --orange-d: #890507;
      --orange-l: #fff1f0;
      --dark: #0f1923;
      --dark2: #1e2d3d;
      --text: #111827;
      --text2: #4b5563;
      --text3: #9ca3af;
      --bg: #f5f6fa;
      --white: #fff;
      --border: #e5e7eb;
      --border2: #f1f5f9;
      --green: #00b87a;
      --yellow: #f7b731;
      --shadow: 0 2px 16px rgba(59, 92, 255, .08);
      --r: 6px;
      --r2: 10px;
      --font-body: 'Encode Sans', sans-serif;
      --font-head: 'Manrope', sans-serif;
    }
@media (min-width: 992px) {
    .filter-card {
        margin-right: 10px;
    }
}
@media (max-width: 767px) {
    .breadcrumbs_ml {
        margin-top: 0px;
    }
    #content {
        padding: 0px;
    }
    /* Mobile filter drawer */
    #column-left {
        position: fixed;
        top: 0;
        left: -100%;
        width: 82%;
        max-width: 320px;
        height: 100%;
        z-index: 1050;
        overflow-y: auto;
        background: #f5f6fa;
        transition: left 0.3s ease;
        padding: 0;
        box-shadow: 4px 0 20px rgba(0,0,0,0.15);
    }
    #column-left.show {
        left: 0;
    }
    .filter-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.5);
        z-index: 1040;
    }
    /* Fixed mobile filter button */
    .mobile-filter-fab {
        display: flex !important;
    }
}
@media (min-width: 768px) {
    .mobile-filter-fab {
        display: none !important;
    }
}
.breadcrumbs_ml{
    padding:0;
}
.after-header {
    padding: 14px 0 0px 25px;
    background: #ffffff;
}
.child-list {
    padding: 10px 0px;
}
.category-seo-description h1 {
    color: var(--s-secondary);
    font-weight: 400;
    font-size: 22px;
    font-family: "Trebuchet MS", sans-serif;
    margin: 10px 0px;
}
.category-description {
    padding: 15px;
    margin: 0px 0 30px;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}
.category-description h1,
.category-description h2,
.category-description h3,
.category-description h4,
.category-description h5,
.category-description h6 {
    font-weight: bold !important;
}
.category-description h1,
.category-description h2,
.category-description h3,
.category-description h4,
.category-description h5,
.category-description h6, p {
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
}

@media (max-width: 767px) {
    table.table-bordered {
        width: 100% !important;
        display: block; 
        overflow-x: auto; 
        white-space: nowrap; 
    }

  table.table-bordered td, 
  table.table-bordered th {
        min-width: 150px; 
        white-space: normal; 
    }
}
.pull-rights a {
    border: none;
    padding: 7.5px 12px;
    font-size: 13px;
    font-weight: 500;
    background: var(--blue);
    color: #ffff;
}
.pull-rights a:hover {
    background: var(--orange);
    color:#ffffff;
}
.category-description ul {
    list-style: disc;
    list-style-position: outside;
    margin-bottom: 10px;
    padding-left: 30px;
    font-size: 14px;
}
.cat-pagination-wrap {
    margin-top: 20px;
    width: 100%;
    text-align: center;
}
.row.cat-pagination {
    padding: 16px 0px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-top: 25px;
}
.row.cat-pagination .col-sm-6.text-right {
    margin-top: 10px;
}
.pagination {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 0;
}

.pagination li:not(.prev):not(.next) a,
.pagination li:not(.prev):not(.next) span,
.pagination li.active span {
    font-family:"Trebuchet MS", sans-serif;
    border: none !important;
    border-radius: 4px !important;
    color: #000;
    background-color: #f7f7f7;
    padding: 8px 14px;
    font-weight: 600;
    font-size: 12px;
    transition: all 0.3s ease;
}

.pagination li.active span {
    background-color: var(--blue) !important;
    color: #fff !important;
    text-decoration: underline;
}

.pagination li.prev a, .pagination li.next a, .pagination li.prev span, .pagination li.next span {
    font-family: "Trebuchet MS", sans-serif;
    background-color: transparent !important;
    color: #555 !important;
    font-weight: bold;
    font-size: 12px;
    padding: 8px 14px;
    border: none !important;
    text-transform: uppercase;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-radius: 4px;
}

.pagination li.prev.disabled span,
.pagination li.next.disabled span {
    color: #ccc !important; 
    cursor: default;
}

.pagination li:not(.prev):not(.next) a:hover {
    background-color: var(--blue) !important;
    color: #fff !important;
    text-decoration: underline !important;
}

.pagination li.prev a:hover,
.pagination li.next a:hover {
    background-color: var(--blue) !important;
    color: #fff !important;
    text-decoration: underline !important;
}
.pricebrd {
    margin-top: 15px;
    border-top: 1px solid #eee;
    padding-top: 20px;
    text-align:center;
}
.price-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    margin-bottom: 20px;
    border: none;
}

.price-table tbody tr {
    border-bottom: 1px solid #eaeaea;
    transition: background 0.3s;
}

.price-table tbody tr:hover {
    background-color: #f9f9f9;
}

.price-table td {
    padding: 15px 10px;
    border: none;
    vertical-align: middle;
    color: #333;
    font-size: 15px;
}

.price-table thead td {
    font-weight: 700;
    font-size: 16px;
    color: #000;
    padding-bottom: 15px !important;
    background: none;
    border: none !important;
    vertical-align: middle;
}
.table-bordered>tbody>tr>td{
    border: none !important;
    vertical-align:middle;
}

.price-table td:nth-child(2), 
.price-table thead td:nth-child(2) {
    text-align: right;
    white-space: nowrap; 
}

.price-table tbody td:nth-child(2) {
    font-weight: 400;
    color: #000;
}

.price-table a {
    color: #333;
    text-decoration: none;
    font-weight: 500;
}
.category-description .price-table a {
    color: #000000 !important;
}
.category-description a:not(.product-name a):hover {
    text-decoration: underline !important;
}
.cat-short-description {
    flex: 1 1 auto;
    margin-bottom: 5px;
    padding: 0px 10px 0px 10px;
    height: 150px;
    overflow: hidden;
}
.cat-short-description li {
    font-size: 13px;
    color: #666666;
    line-height: 16px;
    padding: 5px 0px;
}
@media (min-width: 1150px) {
    aside#column-left {
        flex: 0 0 280px;
        max-width: 280px;
        padding-right:10px;
    }

    .cat-body div#content {
        flex: 1 1 auto;
        min-width: 0; 
        width: 0; 
    }
}



/* MAIN CONTENT */
.cat-main{display:block}

/* Category banner */
.cat-banner-wrapper{background:linear-gradient(120deg, #1930a0, #10377a);border-radius:var(--r2);padding:20px 24px;overflow: hidden;position: relative;}
.cat-banner-wrapper::before{content:'';position:absolute;right:-20px;top:-20px;width:180px;height:180px;background:rgba(50,94,254,.08);border-radius:50%}
.cat-banner{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;position:relative;overflow:hidden}
.cat-banner-l h2{font-size:20px;font-weight:700;color:#fff;margin-bottom:4px;margin-top:0px;}
.cat-banner-l p{font-size:12px;color:rgba(255,255,255,.5)}
.cat-banner-tags{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.cat-tag{background:rgba(50,94,254,.2);border:1px solid rgba(50,94,254,.35);color:#000000;font-size:16px;font-weight:500;padding:0px 10px;border-radius:20px;cursor:pointer;transition:all .2s}
.cat-tag:hover,.cat-tag.on{background:var(--orange);border-color:var(--orange);color:#fff}
.cat-banner-r{display:flex;align-items:center;gap:8px;z-index:1}
.cat-stat{text-align:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);padding:10px 16px}
.cat-stat .n{font-size:20px;font-weight:900;color:#fff}
.cat-stat .l{font-size:10px;color:rgba(255,255,255,.45);margin-top:2px}

@media (max-width: 767px) {
    .cat-banner-wrapper {
        padding: 10px 10px;
    }
}

/* Sort bar */
.sort-bar{background:var(--white);border:1.5px solid var(--border2);border-radius:var(--r2);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;margin:12px 0px;gap:12px;flex-wrap:wrap}
.sort-l{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sort-lbl{font-size:12px;color:var(--text3);font-weight:500;white-space:nowrap}
.sort-tabs{display:flex;gap:4px}
.sort-tab{background:none;border:1px solid var(--border);padding:5px 12px;border-radius:20px;font-size:11.5px;font-weight:500;cursor:pointer;color:var(--text2);font-family:'Roboto',sans-serif;transition:all .2s;text-decoration:none;display:inline-block}
.sort-tab:hover{border-color:#ff6502;color:var(--blue)}.sort-tab.on{background:#ff6502;color:#fff;border-color:#ff6502}
.sort-r{display:flex;align-items:center;gap:10px;flex-shrink:0;flex-wrap:nowrap}
.result-count{font-size:12px;color:var(--text3);white-space:nowrap}
.result-count strong{color:var(--text);font-weight:600}
.view-btns{display:flex;gap:4px}
.vbtn{width:30px;height:30px;background:none;border:1.5px solid var(--border);border-radius:var(--r);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text3);transition:all .2s}
.vbtn:hover,.vbtn.on{background:var(--blue-l);border-color:#ff6502;color:#ff6502;}.vbtn .mi{font-size:16px}
.sort-select{border:1.5px solid var(--border);border-radius:var(--r);padding:5px 10px;font-size:12px;font-family:'Roboto',sans-serif;color:var(--text2);outline:none;cursor:pointer;background:var(--white);height:30px;}
.sort-select:focus{border-color:var(--blue)}

/* PRODUCT GRID */
.pgrid4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.pgrid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;display:none}

/* Product card */
.pcard{background:var(--white);border:1.5px solid var(--border2);border-radius:var(--r2);overflow:hidden;transition:all .22s;position:relative;display:flex;flex-direction:column}
.pcard:hover{border-color:#cd1016!important;box-shadow:0 8px 28px rgba(50,94,254,.14);transform:translateY(-4px)}
.pcard-img{background:#fff;aspect-ratio:1;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.pcard-img img{width:100%;height:100%;object-fit:contain;padding:12px;transition:transform .3s}
.pcard:hover .pcard-img img{transform:scale(1.06)}
.b-off{position:absolute;top:8px;left:8px;background:var(--blue);color:#fff;font-size:8px;font-weight:700;padding:3px 7px;border-radius:3px;letter-spacing:.5px;text-transform:uppercase;display:flex;align-items:center;gap:2px;z-index:2}
.b-off .mi{font-size:10px}
.b-sale{    position: absolute;
    top: 15px;
    right: 0px;
    background: var(--orange);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 15px;
    border-radius: 3px 0px 0px 03px;
    z-index: 2;
    white-space: nowrap;}
.b-new{    position: absolute;
    top: 15px;
    right: 0px;
    background: var(--orange);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 15px;
    border-radius: 3px 0px 0px 03px;
    z-index: 2;
    white-space: nowrap;}
.p-acts{position:absolute;bottom:8px;right:8px;display:flex;flex-direction:column;gap:4px;opacity:0;transition:opacity .2s;z-index:3}
.pcard:hover .p-acts{opacity:1}
.pac{width:30px;height:30px;background:var(--white);border:1px solid var(--border);border-radius:5px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;color:var(--text2)}
.pac:hover{background:var(--blue);border-color:var(--blue);color:#fff}.pac .mi{font-size:16px}
.pcard-body{padding:10px 12px 12px;display:flex;flex-direction:column;flex:1}
.pcard-brand{font-size:10px;font-weight:500;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px}
.pcard-name{
    font-family: var(--font-body);
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.4;
    margin-bottom: 6px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 34px;
}
.pcard-stars{display:flex;align-items:center;gap:4px;margin-bottom:0px;margin-top:auto}
.s-ico{color:var(--yellow);font-size:12px;letter-spacing:-1px}
.s-cnt{font-size:10.5px;color:var(--text3)}
.pcard-bot{display:flex;align-items:center;justify-content:space-between;padding-top:8px}
.p-price .pn{font-size:15px;font-weight:700;color:var(--orange)}
.p-price .po{font-size:11px;color:var(--text3);text-decoration:line-through;display:block;margin-top:-1px}
.btn-add{background:#ff6502;color:#fff;border:none;padding:6px 11px;border-radius:var(--r);font-size:11px;font-weight:700;cursor:pointer;font-family:'Roboto',sans-serif;display:flex;align-items:center;gap:4px}
.btn-add:hover{background:var(--orange)}.btn-add .mi{font-size:14px}

/* LIST VIEW */
.plist{display:none;flex-direction:column;gap:10px}
.plist-item{background:var(--white);border:1.5px solid var(--border2);border-radius:var(--r2);display:flex;gap:0;overflow:hidden;cursor:pointer;transition:all .22s}
.plist-item:hover{border-color:var(--blue);box-shadow:0 4px 18px rgba(50,94,254,.1)}
.plist-img{width:160px;height:160px;flex-shrink:0;background:#fff;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--border2)}
.plist-img img{width:100%;height:100%;object-fit:contain;padding:12px}
.plist-info{flex:1;padding:14px 16px;display:flex;flex-direction:column;justify-content:space-between}
.plist-top{display:block}
.plist-brand{font-size:10px;font-weight:500;color:var(--text3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.plist-name{font-size:14px;font-weight:500;color:var(--text);line-height:1.5;margin-bottom:6px}
.plist-stars{display:flex;align-items:center;gap:5px;margin-bottom:8px}
.plist-desc{font-size:12px;color:var(--text3);line-height:1.6}
.plist-bot{display:flex;align-items:center;justify-content:space-between;margin-top:10px;padding-top:10px;border-top:1px solid var(--border2)}
.plist-price .pn{font-size:18px;font-weight:700;color:var(--orange)}
.plist-price .po{font-size:12px;color:var(--text3);text-decoration:line-through}
.plist-acts{display:flex;gap:8px;align-items:center}
.btn-wish{width:36px;height:36px;background:none;border:1.5px solid var(--border);border-radius:var(--r);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text3);transition:all .2s}
.btn-wish:hover{border-color:var(--orange);color:var(--orange)}.btn-wish .mi{font-size:18px}

/* CATEGORY DESCRIPTION */
.cat-desc{background:var(--white);border:1.5px solid var(--border2);border-radius:var(--r2);padding:22px 24px;margin-top:18px}
.cat-desc-hd{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--dark);margin-bottom:14px;padding-bottom:12px;border-bottom:2px solid var(--border2)}
.cat-desc-hd .mi{font-size:18px;color:var(--blue)}
.cat-desc p{font-size:13px;color:var(--text2);line-height:1.9;margin-bottom:12px}
.cat-desc p:last-of-type{margin-bottom:0}
.cat-desc-body{position:relative;overflow:hidden;max-height:320px;transition:max-height .4s ease}
.cat-desc-body.expanded{max-height:none}
.cat-desc-fade{position:absolute;bottom:0;left:0;right:0;height:80px;background:linear-gradient(transparent,#fff);pointer-events:none;transition:opacity .3s}
.cat-desc-body.expanded~.cat-desc-fade{opacity:0;pointer-events:none}
.cat-desc-more{display:inline-flex;align-items:center;gap:4px;margin-top:10px;background:none;border:1px solid var(--blue);color:var(--blue);font-size:13px;font-weight:600;padding:6px 16px;border-radius:20px;cursor:pointer;transition:background .2s,color .2s;font-family:inherit}
.cat-desc-more:hover{background:var(--blue);color:#fff}.cat-desc-more .mi{font-size:15px}
.cat-desc-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border2)}
.cat-desc-tag{background:var(--bg);border:1px solid var(--border2);border-radius:20px;padding:5px 13px;font-size:11.5px;color:var(--text2);cursor:pointer;transition:all .2s}
.cat-desc-tag:hover{background:var(--blue-l);border-color:var(--blue);color:var(--blue)}

/* Description image/video/iframe responsive fix */
.cat-desc img, .cat-desc video,
.category-description img, .category-description video {
  max-width: 100%;
  height: auto;
  display: block
}
.cat-desc iframe, .category-description iframe {
  max-width: 100%;
  width: 100%;
  aspect-ratio: 16/9;
  height: auto;
  display: block
}

/* Pagination overflow + wrap fix */
.pagination {
  flex-wrap: wrap !important;
  max-width: 100% !important;
}
.pagination li.pag-ellipsis span {
  border: none !important;
  background: none !important;
  color: #999;
  padding: 5px 4px;
  cursor: default
}

/* ===== RESPONSIVE ===== */
@media (max-width: 991px) {
  .pgrid4{grid-template-columns:repeat(3,1fr)}
}
@media (max-width: 767px) {
  /* Banner */
  .cat-banner{flex-direction:column;gap:10px;padding:14px 16px;align-items: start;}
  .cat-banner-r{width:100%;justify-content:space-between}
  .cat-stat{flex:1;padding:8px 6px}
  .cat-stat .n{font-size:16px}
  /* Sort bar */
  .sort-bar{padding:8px 10px;gap:6px}
  .sort-r{width:100%;justify-content:space-between}
  /* Grid */
  .pgrid4{grid-template-columns:repeat(2,1fr);gap:8px}
  .pcard-name{font-size:12px;min-height:30px}
  .cat-short-description{height:auto;max-height:80px;padding:0 8px}
  .btn-add{padding:5px 8px;font-size:10px}
  .p-price .pn{font-size:13px}
  /* List view */
  .plist-img{width:100px;height:100px}
  .plist-name{font-size:12px}
  .plist-price .pn{font-size:15px}
  .plist-bot{flex-wrap:wrap;gap:8px}
  /* Active filters */
  .active-filters{flex-wrap:wrap}
}
@media (max-width: 480px) {
  .cat-banner-r{display:none}
  .pgrid4{grid-template-columns:repeat(2,1fr);gap:6px}
  .pcard-body{padding:8px 8px 10px}
  .sort-select{max-width:100px;font-size:11px}
  .result-count{font-size:11px}
  .vbtn{width:26px;height:26px}
}



/* ===== Classic Computer redesign (category page) ===== */
:root{--cc-bg:#f1f4f9;--cc-card:#fff;--cc-ink:#0d1b36;--cc-mute:#5b6a85;--cc-line:#e1e7f0;--cc-navy:#004aad;--cc-accent:#1a6ee0;--cc-tile:#f5f8fd;--cc-chip:#e6eefb;--cc-badge:#f58220;--cc-badge-ink:#10203f}
body{background:var(--cc-bg)}
.cat-top-sec,.cat-body{font-family:'Manrope',system-ui,sans-serif;color:var(--cc-ink)}
/* hero */
.category-seo-description{background:var(--cc-card);border-radius:14px;padding:18px 22px;margin:4px 0 14px;font-size:14px;color:var(--cc-mute);line-height:1.6}
.category-seo-description h1{margin:0 0 6px;font-size:26px;font-weight:800;color:var(--cc-ink)}
/* sub-category chips */
.cat-banner-tags{display:flex;flex-wrap:wrap;gap:8px;background:var(--cc-card);border-radius:14px;padding:14px 18px;margin-bottom:18px}
.cat-tag{border:1px solid var(--cc-navy);background:var(--cc-chip);color:var(--cc-ink);border-radius:999px;padding:5px 15px;font:700 13.5px 'Manrope',sans-serif;text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.cat-tag:hover{background:var(--cc-accent);border-color:var(--cc-accent);color:#fff;text-decoration:none}
.cat-tag.on{background:var(--cc-navy);color:#fff}
/* filter sidebar (filter module in column_left) */
#column-left > *{background:var(--cc-card);border-radius:14px;border:0}
#column-left input[type=checkbox]{accent-color:var(--cc-navy)}
/* toolbar */
.sort-bar{background:var(--cc-card);border:0;border-radius:14px;padding:12px 16px;margin-bottom:16px;flex-wrap:wrap;gap:12px 16px}
.sort-lbl,.result-count{color:var(--cc-mute);font-weight:600;font-size:14px}
.sort-tab{border:1px solid var(--cc-navy);background:var(--cc-card);color:var(--cc-ink);border-radius:999px;padding:5px 14px;font:700 13px 'Manrope',sans-serif;text-decoration:none;transition:background .2s,color .2s}
.sort-tab:hover{background:var(--cc-accent);border-color:var(--cc-accent);color:#fff;text-decoration:none}
.sort-tab.on{background:var(--cc-navy);color:#fff}
.view-btns{border:1px solid var(--cc-line);border-radius:8px;overflow:hidden}
.vbtn{background:var(--cc-card);color:var(--cc-mute);border:0}
.vbtn.on{background:var(--cc-navy);color:#fff}
.sort-select{border:1px solid var(--cc-line);border-radius:8px;font:600 14px 'Manrope',sans-serif}
/* product cards */
.pgrid4{gap:16px}
.pgrid4 .pcard{background:var(--cc-card);border:1px solid var(--cc-line);border-radius:14px;padding:14px;display:flex;flex-direction:column;position:relative;transition:border-color .2s,box-shadow .2s}
.pgrid4 .pcard:hover{border-color:var(--cc-navy);box-shadow:0 6px 18px rgba(0,74,173,.14)}
.pgrid4 .pcard-img{background:var(--cc-tile);border-radius:10px;aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden;position:static}
.pgrid4 .pcard-img img{max-height:100%;object-fit:contain}
.pgrid4 .pcard-body{display:flex;flex-direction:column;flex:1;padding:0;gap:6px}
.b-sale{position:absolute;right:0;top:14px;left:auto;background:var(--cc-badge);color:var(--cc-badge-ink);font-weight:800;font-size:12px;padding:3px 10px;border-radius:4px 0 0 4px}
.pcard-brand{font-size:12px;font-weight:700;color:var(--cc-navy);margin-top:6px;text-transform:none}
.pgrid4 .pcard-name a{font-weight:700;font-size:14.5px;line-height:1.4;color:var(--cc-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.8em;text-decoration:none}
.pgrid4 .pcard-name a:hover{color:var(--cc-accent)}
.cat-short-description ul{margin:2px 0;padding-left:18px;font-size:12.5px;color:var(--cc-mute);line-height:1.55}
.pcard-stars{font-size:12px;color:var(--cc-mute)}
.pcard-stars .s-ico{color:var(--cc-badge)}
.pgrid4 .pcard-bot{margin-top:auto;display:block;border:0;padding:0}
.p-price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.p-price .pn{font-size:20px;font-weight:800;color:var(--cc-ink)}
.p-price .po{color:var(--cc-mute);font-size:13px;text-decoration:line-through}
.cc-pb{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
.cc-btn{border:0;border-radius:8px;padding:10px 6px;font:800 13px 'Manrope',sans-serif;color:#fff;cursor:pointer;transition:background .2s}
.cc-add{background:#0b0b0b}.cc-buy{background:var(--cc-navy)}
.cc-add:hover,.cc-buy:hover{background:var(--cc-accent)}
.cc-only{grid-column:1/-1;background:var(--cc-line);color:var(--cc-mute);cursor:not-allowed}
/* list view */
.plist-item{background:var(--cc-card);border:1px solid var(--cc-line);border-radius:14px}
.plist-price .pn{color:var(--cc-ink);font-weight:800}
.plist .btn-add{background:var(--cc-navy);border-radius:8px}
/* pagination */
.cat-pagination .pagination{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:26px 0 6px}
.cat-pagination .pagination>li>a,.cat-pagination .pagination>li>span{min-width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--cc-line);border-radius:8px!important;background:var(--cc-card);font:700 14px 'Manrope',sans-serif;color:var(--cc-ink);padding:0 12px}
.cat-pagination .pagination>li>a:hover{background:var(--cc-accent);color:#fff;border-color:var(--cc-accent)}
.cat-pagination .pagination>.active>span{background:var(--cc-navy);color:#fff;border-color:var(--cc-navy)}
.cat-desc,.cat-seo-description{background:var(--cc-card);border-radius:14px}
/* no icons in filter headers, no grid/list toggle */
.price-label .mia,.filter-title .mi,.filter-title .material-icons{display:none!important}
.view-btns{display:none!important}
/* mobile: compact cards, buttons on one line each */
@media (max-width:767px){
 .pgrid4 .pcard{padding:10px}
 .pgrid4 .pcard-name a{font-size:13px}
 .p-price .pn{font-size:17px}
 .cc-pb{grid-template-columns:1fr;gap:6px}
 .cc-btn{font-size:12.5px;padding:9px 6px;white-space:nowrap}
}
/* ===== mobile polish ===== */
@media (max-width:767px){
 .category-seo-description{padding:12px 14px;font-size:12.5px;line-height:1.5;border-radius:12px}
 .category-seo-description h1{font-size:19px;margin-bottom:4px}
 /* chips: one swipeable row */
 .cat-banner-tags{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:10px 12px;gap:6px;border-radius:12px;margin-bottom:12px}
 .cat-banner-tags::-webkit-scrollbar{display:none}
 .cat-tag{flex:0 0 auto;white-space:nowrap;font-size:12.5px;padding:5px 12px}
 /* sort bar: label + swipeable pills, count on its own line */
 .sort-bar{padding:10px 12px;gap:8px;border-radius:12px;margin-bottom:12px}
 .sort-l{display:flex;align-items:center;gap:8px;width:100%;min-width:0}
 .sort-tabs{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;scrollbar-width:none;min-width:0}
 .sort-tabs::-webkit-scrollbar{display:none}
 .sort-tab{flex:0 0 auto;white-space:nowrap;font-size:12px;padding:5px 11px}
 .sort-r{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px}
 .result-count{font-size:12px}
 .sort-select{font-size:12.5px;padding:5px 8px}
 .pgrid4{gap:10px}
}
/* mobile filter drawer above the site header so the Filter title + close (X) are visible */
@media (max-width:767px){
 #column-left{z-index:100001!important;top:0!important;width:86%!important}
 .filter-overlay{z-index:100000!important}
 #column-left .filter-mobile-header{display:flex!important;background:#004aad!important;border-radius:0!important;position:sticky;top:0}
 #column-left .filter-close-btn{width:36px;height:36px;font-size:20px}
}
/* keep the swipeable chip row from widening the page (flex/grid items default to min-width:auto) */
@media (max-width:767px){
 .cat-body .row,#content,#ajax-product-wrapper,.cat-main,.sort-bar,.sort-l,.sort-r{min-width:0!important;max-width:100%!important}
 #content{width:100%!important}
 .cat-banner-tags,.sort-tabs{max-width:100%}
 .pgrid4{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media (max-width:767px){
 .cat-top-sec{margin-bottom:0!important;padding-bottom:0!important}
 .cat-body{padding-top:0!important;margin-top:0!important}
 .category-seo-description{margin-bottom:10px}
 /* show 2 key features per card instead of a half-cut third line */
 .pgrid4 .cat-short-description{max-height:none!important;overflow:visible!important}
 .pgrid4 .cat-short-description li:nth-child(n+3){display:none}
}
@media (max-width:767px){
 /* chip row: soft fade on the right so a half-visible chip reads as "swipe for more" */
 .cat-banner-tags{-webkit-mask-image:linear-gradient(to right,#000 85%,transparent);mask-image:linear-gradient(to right,#000 85%,transparent);padding-right:28px}
 .sort-tabs{-webkit-mask-image:linear-gradient(to right,#000 88%,transparent);mask-image:linear-gradient(to right,#000 88%,transparent);padding-right:16px}
}
@media (max-width:767px){.sort-select{width:auto!important;min-width:118px;flex-shrink:0}}