/* Smart product archive filter drawer — v1.4.99. Scoped to catalogue pages. */
body.doudoudis-product-archive .doudoudis-catalog-tool.is-filters{
  appearance:none;
  cursor:pointer;
  font:inherit;
  border-color:#d9e1ea !important;
  background:#fff !important;
  color:#142142 !important;
}

body.doudoudis-product-archive .doudoudis-catalog-tool.is-filters:hover{
  border-color:#142142 !important;
  background:#f7f9fb !important;
}

body.doudoudis-product-archive .doudoudis-catalog-tool__count{
  display:inline-grid;
  place-items:center;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:999px;
  background:#ef8c00;
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:1;
}

.doudoudis-filter-overlay{
  position:fixed;
  inset:0;
  z-index:100020;
  background:rgba(9,18,39,.48);
  opacity:0;
  backdrop-filter:blur(2px);
  transition:opacity .24s ease;
}

.doudoudis-filter-overlay.is-open{opacity:1;}

.doudoudis-filter-drawer{
  position:fixed;
  z-index:100030;
  top:0;
  right:0;
  width:min(460px,calc(100vw - 28px));
  height:100dvh;
  overflow:auto;
  overscroll-behavior:contain;
  padding:0;
  border-left:1px solid #dce4ed;
  background:#fff;
  box-shadow:-22px 0 55px rgba(20,33,66,.18);
  transform:translate3d(102%,0,0);
  visibility:hidden;
  transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility .28s;
}

.doudoudis-filter-drawer.is-open{
  transform:translate3d(0,0,0);
  visibility:visible;
}

html.doudoudis-filter-open,
html.doudoudis-filter-open body{overflow:hidden !important;}

.doudoudis-filter-drawer__head{
  position:sticky;
  top:0;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:106px;
  padding:24px 26px 20px;
  border-bottom:1px solid #e3e8ef;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);
}

.doudoudis-filter-drawer__eyebrow{
  display:block;
  margin-bottom:5px;
  color:#ef8c00;
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
}

.doudoudis-filter-drawer__head h2{
  margin:0;
  color:#142142;
  font-size:24px;
  font-weight:900;
  line-height:1.05;
  letter-spacing:-.025em;
}

.doudoudis-filter-drawer__close{
  display:grid;
  place-items:center;
  flex:0 0 40px;
  width:40px;
  height:40px;
  padding:0;
  border:1px solid #dce4ed;
  border-radius:50%;
  background:#fff;
  color:#142142;
  cursor:pointer;
  font-size:25px;
  line-height:1;
}

.doudoudis-filter-form{padding:4px 26px 28px;}

.doudoudis-filter-section{
  padding:24px 0;
  border-bottom:1px solid #e8edf2;
}

.doudoudis-filter-section__title{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-bottom:17px;
}

.doudoudis-filter-section__title > span{
  display:grid;
  place-items:center;
  flex:0 0 30px;
  width:30px;
  height:30px;
  border-radius:9px;
  background:#f1f4f8;
  color:#142142;
  font-size:9px;
  font-weight:900;
}

.doudoudis-filter-section__title div{min-width:0;}
.doudoudis-filter-section__title strong{
  display:block;
  color:#142142;
  font-size:14px;
  font-weight:900;
  line-height:1.25;
}
.doudoudis-filter-section__title small{
  display:block;
  margin-top:3px;
  color:#7f8998;
  font-size:11px;
  line-height:1.35;
}

.doudoudis-filter-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.doudoudis-filter-field{display:block;margin:0;}
.doudoudis-filter-field > span:not(.screen-reader-text){
  display:block;
  margin:0 0 7px;
  color:#5d687a;
  font-size:10px;
  font-weight:850;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.doudoudis-filter-field input,
.doudoudis-filter-field select{
  width:100%;
  min-height:46px;
  margin:0;
  padding:0 13px;
  border:1px solid #d9e1ea;
  border-radius:11px;
  background:#fff;
  color:#142142;
  box-shadow:none;
  font-size:13px;
  font-weight:700;
  outline:none;
}

.doudoudis-filter-field input:focus,
.doudoudis-filter-field select:focus{
  border-color:#142142;
  box-shadow:0 0 0 3px rgba(20,33,66,.07);
}

.doudoudis-filter-field input:disabled{
  background:#f6f8fa;
  color:#a1a9b4;
  cursor:not-allowed;
}

.doudoudis-filter-memory{
  margin:10px 0 0;
  color:#8a94a2;
  font-size:10px;
  line-height:1.45;
}

.doudoudis-filter-actions{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  padding-top:22px;
}

.doudoudis-filter-apply,
.doudoudis-filter-reset{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  border-radius:11px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.035em;
  text-decoration:none !important;
}

.doudoudis-filter-apply{
  gap:14px;
  border:1px solid #142142;
  background:#142142;
  color:#fff;
  cursor:pointer;
}
.doudoudis-filter-apply:hover{border-color:#ef8c00;background:#ef8c00;color:#fff;}

.doudoudis-filter-reset{
  padding:0 16px;
  border:1px solid #d9e1ea;
  background:#fff;
  color:#142142 !important;
}
.doudoudis-filter-reset:hover{border-color:#142142;}

@media (max-width:767px){
  .doudoudis-filter-drawer{
    top:0 !important;
    right:0 !important;
    bottom:auto !important;
    left:auto !important;
    width:min(390px,calc(100vw - 18px)) !important;
    max-width:calc(100vw - 18px) !important;
    height:100dvh !important;
    max-height:100dvh !important;
    border-top:0 !important;
    border-left:1px solid #dce4ed !important;
    border-radius:0 !important;
    transform:translate3d(102%,0,0) !important;
  }
  .doudoudis-filter-drawer.is-open{transform:translate3d(0,0,0) !important;}
  .doudoudis-filter-drawer__head{min-height:88px;padding:20px 18px 16px;}
  .doudoudis-filter-drawer__head h2{font-size:21px;}
  .doudoudis-filter-form{padding:0 18px 22px;}
  .doudoudis-filter-section{padding:19px 0;}
  .doudoudis-filter-grid{grid-template-columns:1fr;gap:12px;}
  .doudoudis-filter-actions{position:sticky;bottom:0;margin:0 -18px -22px;padding:14px 18px 18px;background:#fff;border-top:1px solid #e8edf2;}
}

@media (max-width:420px){
  .doudoudis-filter-drawer{
    width:calc(100vw - 12px) !important;
    max-width:calc(100vw - 12px) !important;
  }
  .doudoudis-filter-actions{grid-template-columns:1fr;}
  .doudoudis-filter-reset{min-height:42px;}
}
