/* =====================================================
   RAMIRENT PRODUCT CATEGORY ARCHIVE (FULL HARD RESET)
   ===================================================== */

body.tax-product_cat{
  --rami-pill-h: 52px;
  --rami-pill-radius: 999px;
  --rami-blue: #003287;
  --rami-orange: #f47c20;
  --rami-gray-bg: #eeeeee;
  --rami-gray-border: #d9d9d9;
  --rami-gray-text: #777;
}

/* Container */
body.tax-product_cat .rami-archive{
  max-width:1320px;
  margin:0 auto;
  padding:40px 16px 70px;
}

body.tax-product_cat .rami-archive__header{
  margin-bottom:20px;
}

body.tax-product_cat .rami-archive__title{
  font-size:56px;
  line-height:1;
  margin:18px 0 0;
}

/* =====================================================
   LAYOUT: sidebar + products
   ===================================================== */
body.tax-product_cat .rami-archive__layout{
  display:grid !important;
  grid-template-columns:320px 1fr !important;
  gap:28px !important;
  align-items:start !important;
}

body.tax-product_cat .rami-archive__main{
  min-width:0 !important;
}

/* =====================================================
   SIDEBAR
   ===================================================== */
body.tax-product_cat .rami-archive__sidebar{
  margin-top:55px;
  background:#f5f5f5;
  border:1px solid #eaeaea;
  border-radius:8px;
  padding:18px 16px;
}

body.tax-product_cat .rami-archive__sidebar .wpfFilter{
  padding:14px 0 !important;
  border-top:1px solid #e6e6e6 !important;
}
body.tax-product_cat .rami-archive__sidebar .wpfFilter:first-child{
  border-top:0 !important;
  padding-top:0 !important;
}

/* Make the top buttons stack nicely */
body.tax-product_cat .rami-archive__sidebar .wpfFilterButtons,
body.tax-product_cat .rami-archive__sidebar .wpfFilterButtonsTop{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
}

/* =====================================================
   HIDE/SHOW FILTER BUTTON (SAME SIZE AS CLEAR) + NO ARROW
   (Your markup: button.wfpHideButton ... <span> <i class="fa ..."></i>)
   ===================================================== */
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton{
  width:100% !important;
  height:var(--rami-pill-h) !important;
  min-height:var(--rami-pill-h) !important;
  padding:0 18px !important;

  border-radius:var(--rami-pill-radius) !important;
  border:2px solid var(--rami-blue) !important;
  background:var(--rami-blue) !important;
  color:#fff !important;

  font-weight:700 !important;
  font-size:16px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  cursor:pointer !important;
  transition:all .25s ease !important;

  /* kill weird plugin/min theme constraints */
  line-height:1 !important;
  text-decoration:none !important;
  box-shadow:none !important;
}

/* Hover */
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton:hover{
  background:var(--rami-orange) !important;
  border-color:var(--rami-orange) !important;
  color:#fff !important;
}

/* Center the text span (and prevent it from shrinking) */
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton .wfpHideText{
  display:block !important;
  width:100% !important;
  text-align:center !important;
  margin:0 !important;
  padding:0 !important;
}

/* REMOVE THE ARROW ICON COMPLETELY */
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton i,
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton svg,
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton .fa{
  display:none !important;
}
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton .fa:before{
  content:none !important;
}

/* =====================================================
   CLEAR BUTTON (gray -> blue active -> orange hover)
   ===================================================== */
body.tax-product_cat .rami-archive__sidebar button.wpfClearButton.wpfButton{
  width:100% !important;
  height:var(--rami-pill-h) !important;
  min-height:var(--rami-pill-h) !important;
  padding:0 18px !important;

  border-radius:var(--rami-pill-radius) !important;
  border:2px solid var(--rami-gray-border) !important;
  background:var(--rami-gray-bg) !important;
  color:var(--rami-gray-text) !important;

  font-weight:700 !important;
  font-size:16px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  transition:all .25s ease !important;
  cursor:pointer !important;

  line-height:1 !important;
}

/* Active (filters applied) */
body.tax-product_cat .wpfMainWrapper:not(.wpfNotActive) button.wpfClearButton.wpfButton{
  background:var(--rami-blue) !important;
  border-color:var(--rami-blue) !important;
  color:#fff !important;
}

/* Hover when active */
body.tax-product_cat .wpfMainWrapper:not(.wpfNotActive) button.wpfClearButton.wpfButton:hover{
  background:var(--rami-orange) !important;
  border-color:var(--rami-orange) !important;
  color:#fff !important;
}

/* =====================================================
   REMOVE WOOCOMMERCE DEFAULT LAYOUT CONFLICTS
   ===================================================== */

/* hide sorting dropdown */
body.tax-product_cat .woocommerce-ordering{
  display:none !important;
}

body.tax-product_cat .woocommerce,
body.tax-product_cat .woocommerce-page,
body.tax-product_cat .rami-archive__main,
body.tax-product_cat .rami-archive__main *{
  box-sizing:border-box;
}

/* =====================================================
   FORCE PRODUCTS UL INTO A REAL GRID
   ===================================================== */
body.tax-product_cat .rami-archive__main ul.products{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:34px !important;

  width:100% !important;
  max-width:100% !important;

  margin:0 !important;
  padding:0 !important;
  list-style:none !important;

  float:none !important;
  clear:both !important;
}

body.tax-product_cat .rami-archive__main ul.products:before,
body.tax-product_cat .rami-archive__main ul.products:after{
  content:none !important;
  display:none !important;
}

/* Each product <li> is a grid cell */
body.tax-product_cat .rami-archive__main ul.products > li.product,
body.tax-product_cat .rami-archive__main ul.products > li{
  float:none !important;
  clear:none !important;

  width:auto !important;
  max-width:100% !important;

  margin:0 !important;
  padding:0 !important;

  display:block !important;
  position:relative !important;

  min-width:0 !important;
}

body.tax-product_cat .rami-archive__main ul.products > li.product{
  flex:none !important;
}

/* Card link fills cell */
body.tax-product_cat .rami-card__link{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  text-decoration:none !important;
}

/* =====================================================
   IMAGE: FULL WIDTH, ROUNDED
   ===================================================== */
body.tax-product_cat .rami-card__imgwrap{
  width:100% !important;
  aspect-ratio:333 / 187;
  border-radius:14px !important;
  overflow:hidden !important;
  background:#eee !important;
  position:relative !important;
}

/* Force image to fill */
body.tax-product_cat .rami-card__imgwrap img,
body.tax-product_cat .rami-card__img{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:cover !important;
  display:block !important;
  border-radius:14px !important;
}

/* override Woo default img sizing */
body.tax-product_cat ul.products li.product img{
  width:100% !important;
  height:auto !important;
  display:block !important;
}

/* =====================================================
   OVERLAY BUTTONS (Specs / 3D)
   ===================================================== */
body.tax-product_cat .rami-card__actions{
  position:absolute !important;
  right:16px !important;
  bottom:16px !important;
  display:flex !important;
  gap:10px !important;
  z-index:5 !important;
}

body.tax-product_cat .rami-card__btn{
  min-width:112px !important;
  height:42px !important;
  padding:0 22px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:999px !important;
  background:#f2f2f2 !important;
  color:var(--rami-blue) !important;

  font-weight:700 !important;
  font-size:14px !important;
  line-height:1 !important;

  text-decoration:none !important;
  border:1px solid rgba(0,0,0,0.08) !important;
  box-shadow:0 8px 18px rgba(0,0,0,0.16) !important;

  transition:all .25s ease !important;
}

body.tax-product_cat .rami-card__btn::before,
body.tax-product_cat .rami-card__btn::after{
  content:none !important;
  display:none !important;
}

body.tax-product_cat .rami-card__btn:hover{
  background:var(--rami-blue) !important;
  color:#fff !important;
  transform:translateY(-1px) !important;
}

/* =====================================================
   CATEGORY + TITLE (NO TRUNCATION)
   ===================================================== */
body.tax-product_cat .rami-card__cat{
  margin-top:12px !important;
  font-size:12px !important;
  text-transform:uppercase !important;
  letter-spacing:.05em !important;
  opacity:.75 !important;
}

body.tax-product_cat .rami-card__title{
  margin:6px 0 0 !important;
  font-size:18px !important;
  font-weight:700 !important;
  line-height:1.3 !important;

  color:var(--rami-blue) !important;

  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:break-word !important;
  hyphens:auto !important;
}

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width:1024px){
  body.tax-product_cat .rami-archive__layout{
    grid-template-columns:1fr !important;
  }

  body.tax-product_cat .rami-archive__sidebar{
    margin-top:10px !important;
  }

  body.tax-product_cat .rami-archive__main ul.products{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}

@media (max-width:640px){
  body.tax-product_cat .rami-archive__main ul.products{
    grid-template-columns:1fr !important;
  }

  body.tax-product_cat .rami-archive__title{
    font-size:40px !important;
  }
}
/* =====================================================
   FORCE SHOW FILTER BUTTON FULL WIDTH
   ===================================================== */

/* wrapper fix */
body.tax-product_cat .rami-archive__sidebar .wpfFilterButtons,
body.tax-product_cat .rami-archive__sidebar .wpfFilterButtonsTop{
  width:100% !important;
  align-items:stretch !important;
}

/* force button to stretch */
body.tax-product_cat .rami-archive__sidebar 
button.wfpHideButton.wfpButton.wfpClickable{
  display:flex !important;
  width:100% !important;
  max-width:100% !important;
  min-width:100% !important;

  height:52px !important;
  min-height:52px !important;

  align-self:stretch !important;
  box-sizing:border-box !important;

  border-radius:999px !important;
}

/* remove any inner width constraints */
body.tax-product_cat .rami-archive__sidebar 
button.wfpHideButton.wfpButton.wfpClickable .wfpHideText{
  width:100% !important;
  text-align:center !important;
}
/* =====================================================
   MOBILE: make "Show filter" align EXACTLY like "Clear"
   ===================================================== */

/* The Show/Hide filter button lives in this wrapper (it adds padding) */
body.tax-product_cat .rami-archive__sidebar .wpfFilterButtonsTop{
  width:100% !important;
  padding:0 !important;          /* <- this is the key */
  margin:0 0 10px !important;
}

/* Force BOTH buttons to use the exact same sizing rules */
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton,
body.tax-product_cat .rami-archive__sidebar button.wpfClearButton.wpfButton{
  width:100% !important;
  max-width:100% !important;
  min-width:100% !important;
  margin:0 !important;

  min-height:52px !important;
  height:52px !important;
  padding:14px 18px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:999px !important;
  box-sizing:border-box !important;
}

/* Kill the icon / arrow completely */
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton i,
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton svg{
  display:none !important;
}

/* Keep text centered */
body.tax-product_cat .rami-archive__sidebar button.wfpHideButton .wfpHideText{
  width:100% !important;
  text-align:center !important;
}
/* Add spacing between Show filter and Clear */
body.tax-product_cat .rami-archive__sidebar .wpfFilterButtonsTop{
  margin:0 0 12px !important; /* space below Show filter group */
}

body.tax-product_cat .rami-archive__sidebar button.wfpHideButton.wfpButton{
  margin-bottom:12px !important; /* space between the two pills */
}