/* =========================================
   REVONJ Filters – final clean stylesheet
   ========================================= */

/* === Genel === */
.revonj-filters-bar{ margin:10px 0; }

/* === Filtrele (pill) === */
.revonj-filter-toggle{
  border-radius:9999px; padding:.6rem 1.1rem; line-height:1;
  background:#111; color:#fff; border:0; font-weight:700;
}

/* =======================================================
   SIRALA + FİLTRELE aynı satır (masaüstü = iki sütun eşit)
   ======================================================= */
#revonj-controls.revonj-controls{
  display:grid;
  grid-template-columns: 1fr 1fr;     /* ikisi de yarım satır kaplar */
  align-items:center;
  gap:12px;
  margin:8px 0 14px;
}
#revonj-controls #revonj-sort{ justify-self:start; }     /* solda */
#revonj-controls .revonj-filters-bar{ justify-self:end; }/* sağda */

/* Eski ordering float’larını bastır */
.woocommerce .woocommerce-ordering{ position:relative; float:none !important; overflow:visible !important; }

/* === SIRALA (native select) – her koşulda pill === */
.woocommerce .woocommerce-ordering select.orderby{
  -webkit-appearance:none !important; -moz-appearance:none !important; appearance:none !important;
  background:#111 !important; color:#fff !important;
  border:0 !important; border-radius:9999px !important;
  padding:.6rem 2.2rem .6rem 1rem !important;
  font-weight:700 !important; line-height:1 !important; cursor:pointer !important;
  min-height:38px; width:100% !important;
}
.woocommerce .woocommerce-ordering::after{
  content:"▾";
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  pointer-events:none; color:#fff; font-size:14px;
}

/* === SIRALA (select2 / nice-select) da pill kalsın === */
.woocommerce .woocommerce-ordering .select2-selection--single,
.woocommerce .woocommerce-ordering .nice-select{
  border-radius:9999px !important;
  background:#111 !important; color:#fff !important; border:0 !important;
  padding:.45rem 1rem !important; min-height:38px;
}
.woocommerce .woocommerce-ordering .select2-selection__rendered{ color:#fff !important; }

/* =======================
   DRAWER (masaüstü)
   ======================= */
.revonj-filter-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.35);
  z-index:99997;
}
.revonj-filter-backdrop[hidden]{ display:none !important; pointer-events:none !important; opacity:0 !important; }

.revonj-filter-drawer{
  position:fixed; top:0; bottom:0;
  /* right/left değeri PHP inline ile veriliyor (open/close için) */
  width:420px; max-width:92vw;
  background:#fff; z-index:99998;
  box-shadow:0 10px 30px rgba(0,0,0,.2);
  overflow:auto; display:flex; flex-direction:column;
}
.revonj-filter-header{
  position:sticky; top:0; background:#fff; z-index:1;
  text-align:center; padding:16px 48px; border-bottom:1px solid #eee;
}
.revonj-filter-header strong{ font-size:1rem; }
.revonj-filter-close{ border-radius:9999px; width:36px; height:36px; position:absolute; right:8px; top:8px; }
.revonj-grip{
  position:absolute; left:50%; transform:translateX(-50%);
  top:8px; width:44px; height:4px; border-radius:999px; background:#e5e5e5;
}
.revonj-filter-body{ padding:12px 16px; }
.revonj-filter-footer{
  margin-top:auto; padding:12px 16px; border-top:1px solid #eee;
  background:#fff; position:sticky; bottom:0;
}
.revonj-apply{ background:#111; color:#fff; border:0; padding:.6rem 1rem; border-radius:10px; }
.revonj-clear{ margin-left:.5rem; padding:.5rem .8rem; border-radius:10px; }

/* Bölümler */
.revonj-filter-section{ margin-bottom:8px; }
.revonj-details > summary{
  list-style:none; cursor:pointer; font-weight:700; padding:10px 2px;
}
.revonj-details > summary::-webkit-details-marker{ display:none; }

/* Liste – chip/pill item'lar */
.revonj-scroll{ border:none; padding:4px 2px; }
.revonj-scroll label{
  display:inline-flex; align-items:center; gap:.4rem;
  margin:6px; padding:.55rem .95rem;
  border:1.5px solid #ddd; border-radius:9999px;
  background:#fff; font-size:.95rem; cursor:pointer; user-select:none;
  position:relative;
}
.revonj-scroll label input{ position:absolute; opacity:0; pointer-events:none; }
.revonj-scroll label:has(input:checked){
  background:#111; color:#fff; border-color:#111;
}

/* =======================
   MOBİL: kontroller + drawer
   ======================= */
@media (max-width: 768px){
  /* Kontroller: Sırala solda tam genişlik, Filtrele sağda */
  #revonj-controls.revonj-controls{
    grid-template-columns: 1fr auto;
    gap:12px; padding:0 16px; margin:8px 0 14px;
    justify-content:initial;
  }
  #revonj-controls .woocommerce-ordering{ width:100% !important; margin:0 !important; }
  #revonj-controls .woocommerce-ordering select.orderby{ width:100% !important; min-height:44px; }
  .revonj-filter-toggle{ min-height:44px; }

  /* Çekmece: alttan sheet gibi açılsın */
  .revonj-filter-drawer{
    left:0 !important; right:0 !important; /* inline offset'i bastır */
    top:auto; bottom:-100%;
    width:100%; height:85vh;
    border-top-left-radius:18px; border-top-right-radius:18px;
    box-shadow:0 -20px 40px rgba(0,0,0,.15);
    transition:bottom .28s ease-in-out;
  }
  .revonj-filter-drawer.open{ bottom:0; }
  .revonj-filter-header{ border-bottom:0; }
}

/* Sonuç sayacı / alttaki metinler tamamen gizlensin */
.woocommerce-result-count{ display:none !important; }

/* =======================
   Custom Sort (pill + menu)
   ======================= */
.revonj-sort{ position:relative; z-index:10001; }
.revonj-sort-toggle{
  display:inline-flex; align-items:center; gap:.55rem;
  background:#111; color:#fff; border:0; cursor:pointer;
  border-radius:9999px; font-weight:700;
  padding:.6rem 1.1rem;
  line-height:1;
  width:100%;
}
.revonj-sort-caret{ font-size:14px; line-height:1; }
.revonj-sort-menu{
  position:absolute; top:calc(100% + 6px); left:0;
  min-width:260px; max-width:80vw;
  background:#111; color:#fff;
  border-radius:12px; padding:6px; z-index:10002;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.revonj-sort-item{
  display:block; width:100%; text-align:left;
  background:transparent; color:#fff; border:0;
  padding:.65rem .8rem; border-radius:10px; cursor:pointer;
}
.revonj-sort-item:hover{ background:rgba(255,255,255,.08); }
.revonj-sort-item.is-active{ background:rgba(255,255,255,.16); font-weight:700; }

/* Mobilde menü genişliği */
@media (max-width:768px){
  .revonj-sort-toggle{ min-height:44px; justify-content:space-between; }
  .revonj-sort-menu{ min-width:100%; }
}

/* Bazı temalar ordering kapsayıcısına overflow:hidden veriyor; iptal */
.woocommerce .woocommerce-ordering{ overflow:visible !important; }