/* === Pelle Catalog Quote (Flex, RTL) === */
.pelle-cq { font-family: inherit !important; color: #222 !important; direction: rtl !important; }
.pelle-cq * { box-sizing: border-box !important; }

/* Layout */
.pelle-cq__wrap { display: flex !important; gap: 24px !important; align-items: flex-start !important; }

/* Sidebar */
.pelle-cq__sidebar { width: 260px !important; flex: 0 0 260px !important; background: #fafafa !important; border: 1px solid #eee !important; border-radius: 12px !important; padding: 16px !important; position: sticky !important; top: 16px !important; }
.pelle-cq__sidebar-title { font-weight: 600 !important; margin-bottom: 12px !important; }
.pelle-cq__cats { list-style: none !important; margin: 0 !important; padding: 0 !important; display: flex !important; flex-direction: column !important; gap: 8px !important; }
.pelle-cq__cats li { width: 100% !important; }
.pelle-cq__cat-btn { width: 100% !important; text-align: right !important; color: #000 !important; border: 1px solid #eee !important; background: #fff !important; padding: 10px 12px !important; border-radius: 10px !important; cursor: pointer !important; transition: border-color .2s ease, background .2s ease !important; }
.pelle-cq__cat-btn:hover { border-color: #ddd !important; background: #f2f2f2 !important; color: #000 !important; }
.pelle-cq__cat-btn.is-active { border-color: #1a7bbd !important; background: #eaf4fb !important; color: #000 !important; }

/* Main */
.pelle-cq__main { flex: 1 1 auto !important; min-width: 0 !important; }

/* Products flex grid (no CSS grid) */
.pelle-cq__products { display: flex !important; flex-wrap: wrap !important; gap: 16px !important; }
.pelle-cq__product {
  flex: 1 1 calc(33.333% - 16px) !important;
  max-width: calc(33.333% - 16px) !important;
  background: #fff !important; border: 1px solid #eee !important; border-radius: 14px !important; padding: 12px !important;
  display: flex !important; flex-direction: column !important; gap: 10px !important;
}

/* Product card */
.pelle-cq__thumb-btn { border: 0 !important; padding: 0 !important; background: none !important; cursor: pointer !important; position: relative !important; border-radius: 12px !important; overflow: hidden !important; display: block !important; }
.pelle-cq__thumb-wrap { display: block !important; position: relative !important; }
.pelle-cq__thumb-wrap img { width: 100% !important; height: 240px !important; object-fit: cover !important; display: block !important; }
.pelle-cq__check {
  position: absolute !important; inset-inline-start: 8px !important; inset-block-start: 8px !important;
  background: #1a7bbd !important; color: #fff !important; width: 28px !important; height: 28px !important; border-radius: 999px !important;
  display: none !important; align-items: center !important; justify-content: center !important; font-weight: bold !important; line-height: 1 !important;
}
.pelle-cq__thumb-btn.is-selected .pelle-cq__check { display: flex !important; }
.pelle-cq__thumb-btn.is-selected::after {
  content: "" !important; position: absolute !important; inset: 0 !important; border: 3px solid #1a7bbd !important; border-radius: 12px !important;
}

.pelle-cq__meta { display: flex !important; flex-direction: column !important; gap: 6px !important; }
.pelle-cq__title {font-size: 14px !important; text-align: center; line-height: 1.35 !important; margin: 0 !important; }
@media (max-width: 768px) {
    .pelle-cq__title { font-size: 11px !important; }
}
.pelle-cq__desc { text-align: center; font-size: 14px !important; color: #555 !important; }
@media (max-width: 768px) {
    .pelle-cq__desc {
    font-size: 10px !important;
   
}
}
.pelle-cq__link { align-self: flex-start !important; text-decoration: none !important; border-bottom: 1px solid #ccc !important; padding-bottom: 2px !important; font-size: 0.92em !important; color: inherit !important; }

/* Buttons */
.pelle-cq__btn { border: 1px solid #111 !important; background: #111 !important; color: #fff !important; padding: 10px 14px !important; border-radius: 10px !important; cursor: pointer !important; transition: opacity .2s ease !important; }
.pelle-cq__btn:hover { opacity: .9 !important; }
.pelle-cq__btn--ghost { background: #fff !important; color: #111 !important; border-color: #ddd !important; }
.pelle-cq__btn--primary { background: #111 !important; color: #fff !important; border-color: #111 !important; }

/* Load more */
.pelle-cq__loadmore-wrap { margin-top: 16px !important; display: flex !important; justify-content: center !important; }

/* Cart bar (sticky bottom) */
.pelle-cq__cartbar {
  position: fixed !important; inset-inline: 16px !important; inset-block-end: 16px !important;
  background: #ffffffee !important; border: 1px solid #eee !important; border-radius: 14px !important; padding: 8px 12px !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.06) !important; z-index: 999999999 !important;
}
.pelle-cq__cartbar-left { display: flex !important; align-items: center !important; gap: 8px !important; }
.pelle-cq__cart-count {
  min-width: 28px !important; height: 28px !important; border-radius: 999px !important; background: #111 !important; color: #fff !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important; font-weight: 700 !important;
}
.pelle-cq__cart-text { font-weight: 500 !important; }

/* Modal */
.pelle-cq__modal { position: fixed !important; inset: 0 !important; background: rgba(0,0,0,.45) !important; display: none !important; align-items: center !important; justify-content: center !important; z-index: 999999999 !important; padding: 16px !important; }
.pelle-cq__modal[aria-hidden="false"] { display: flex !important; }
.pelle-cq__modal-dialog {
  width: min(760px, 100%) !important; background: #fff !important; border-radius: 16px !important; border: 1px solid #eee !important; padding: 18px !important;
  display: flex !important; flex-direction: column !important; gap: 14px !important; max-height: 90vh !important; overflow: auto !important; position: relative !important;
    font-size: 12px;
}
.pelle-cq__modal-title { margin: 0 !important; font-size: 1rem !important;  }
.pelle-cq__modal-close {
    position: absolute !important;
    /* inset-inline-start: 24px !important; */
    left: 0;
    inset-block-start: 14px !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 22px !important;
    cursor: pointer !important;
    line-height: 1 !important;
    color: black !important;
        padding: 0 10px !important;
}
/* Selected list inside modal */
.pelle-cq__selected {
    display: flex !important
;
    flex-direction: column !important;
    gap: 8px !important;
    border: 1px solid #f0f0f0 !important;
    background: #fafafa !important;
    border-radius: 12px !important;
    padding: 10px !important;
    max-height: 350px;
    overflow: scroll;
}


.pelle-cq__selected::-webkit-scrollbar{
    display: none !important;
}

.pelle-cq__sel-item { display: flex !important; align-items: center !important; gap: 10px !important; }
.pelle-cq__sel-thumb { width: 48px !important; height: 48px !important; border-radius: 8px !important; object-fit: cover !important; }
.pelle-cq__sel-title { font-size: 14px !important; }
@media (max-width: 768px) {
    .pelle-cq__sel-title { font-size: 11px !important; }
}
.pelle-cq__sel-remove { margin-inline-start: auto !important; border: 1px solid #ddd !important; background: #fff !important; padding: 4px 8px !important; border-radius: 8px !important; cursor: pointer !important; }

/* Form */
.pelle-cq__form { display: flex !important; flex-direction: column !important; gap: 12px !important; }
.pelle-cq__form-row { display: flex !important; flex-direction: column !important; gap: 6px !important; }
.pelle-cq__form-row label { font-weight: 600 !important; }
.pelle-cq__form-row input { padding: 10px 12px !important; border: 1px solid #ddd !important; border-radius: 10px !important; width: 100% !important; }
.pelle-cq__form-actions { display: flex !important; justify-content: flex-start !important; gap: 8px !important; }
.pelle-cq__form-msg { margin-top: 6px !important; font-size: .95em !important; color: #111 !important; }

/* Utilities */
.pelle-cq__empty { padding: 12px !important; border: 1px dashed #ddd !important; border-radius: 10px !important; background: #fafafa !important; }
.pelle-cq--modal-open { overflow: hidden !important; }

/* ====== Mobile tweaks ====== */
@media (max-width: 640px) {
  .pelle-cq .pelle-cq__wrap { flex-direction: column !important; }
  .pelle-cq .pelle-cq__sidebar { width: 100% !important; position: static !important; top: auto !important; }

  /* קטגוריות – 4 בשורה, קומפקטי */
  .pelle-cq .pelle-cq__cats { flex-direction: row !important; flex-wrap: wrap !important; gap: 8px !important; }
  .pelle-cq .pelle-cq__cats li { width: calc(25% - 6px) !important; }
  .pelle-cq .pelle-cq__cat-btn { padding: 8px !important; font-size: 13px !important; border-radius: 8px !important; text-align: center !important; }

  /* מוצרים – 2 בעמודה */
  .pelle-cq .pelle-cq__product { flex-basis: calc(50% - 16px) !important; max-width: calc(50% - 16px) !important; }
  .pelle-cq .pelle-cq__thumb-wrap img { height: 100px !important; }
}

.page-content{
    padding: 0 !important;
}

/* --- toggle description tweaks (append) --- */
.pelle-cq .pelle-cq__desc[hidden] { display: none !important; }
.pelle-cq .pelle-cq__toggle-desc {
    align-self: center !important;
    margin-top: 4px !important;
    padding: 2px 8px !important;
    font-size: 12px !important;
}

.pelle-cq__sel-remove{
        font-size: 10px !important;
    padding: 2px 9px !important;
    color: black !important;
}


.pelle-cq__modal-title-sub{
    font-size: 12px;
}