/* ========== HA Simple Wishlist – Clean Vertical ========== */

/* أساسيات زر القلب */
.ha-wl-btn{
  display:inline-flex; align-items:center !important; gap:6px;
  padding:8px 15px;
  border-radius:7px;
  background:#ffebef; color:#d61f45;
  cursor:pointer; line-height:1; font-size:14px; font-weight:600;
  box-shadow:0 2px 8px rgba(214,31,69,.08);
  transition: transform .14s ease, box-shadow .14s ease, background-color .14s ease, opacity .14s ease;
}
.ha-wl-btn:hover{ transform: translateY(-1px); box-shadow:0 4px 12px rgba(214,31,69,.15); }
.ha-wl-btn.is-in{ background:#ffe2e8; }
.ha-wl-btn.is-busy{ opacity:.6; pointer-events:none; }
.ha-wl-heart{ font-size:16px; }
.ha-wl-sign{ font-size:14px; font-weight:600; transform:translateY(-1px); }

/* —— حاوية “تحت السلة” موحّدة (أرشيف + ويشليست + منتج مفرد) —— */
.ha-wl-undercart{
  display:flex; flex-direction:column; gap:8px; align-items:flex-start; border-radius:10px;
  margin-top:8px; 
}
.ha-wl-uc-cart .button,
.ha-wl-uc-cart .added_to_cart{
  display:inline-flex; align-items:center; justify-content:center;
  padding:8px 12px; border-radius:10px;
}
.ha-wl-uc-wishlist{ /* مجرد حاوية للزر */ }

/* ——— صفحة الويشليست: قائمة وبطاقات ——— */
.ha-wl-page{ position:relative; }
.ha-wl-list{
  list-style:none; margin:0; padding:0;
  display:grid; gap:16px; grid-template-columns: 1fr;
}
@media (min-width:640px){
  .ha-wl-list{ grid-template-columns: repeat(2, minmax(0,1fr)); gap:18px; }
}
.ha-wl-item{
  display:grid; grid-template-columns: 110px 1fr;
  gap:12px; padding:14px; background:#fff;
  border:1px solid #e8ece9; border-radius:14px;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.ha-wl-item:hover{ transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.08); border-color:#dae5de; }
.ha-wl-thumb img{ width:100%; height:auto; display:block; border-radius:10px; object-fit:cover; }
.ha-wl-info .ha-wl-title{ margin:0 0 6px; font-size:16px; line-height:1.3; }


/* ——— ترقيم الصفحات ——— */
.ha-wl-pager{
  display:flex; flex-wrap:wrap; gap:8px; justify-content:center; align-items:center;
  margin:20px 0 8px;
}
.ha-wl-pager .btn, .ha-wl-pager .num{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:40px; height:40px; padding:0 12px;
  border:1px solid #d7e0da; border-radius:12px;
  background:#fff; color:#0b3b33; text-decoration:none; cursor:pointer;
  box-shadow:0 1px 4px rgba(0,0,0,.05);
  font-size:15px; font-weight:700; line-height:1;
  transition: transform .14s ease, box-shadow .14s ease, background-color .14s ease, color .14s ease, border-color .14s ease;
}
.ha-wl-pager .btn:hover, .ha-wl-pager .num:hover{
  transform: translateY(-1px);
  box-shadow:0 4px 10px rgba(0,0,0,.08);
  border-color:#c9d6cf;
}
.ha-wl-pager .num.is-active{
  background:#0b3b33; color:#fff; border-color:#0b3b33;
  box-shadow:0 4px 12px rgba(11,59,51,.18); pointer-events:none;
}
.ha-wl-pager .btn.is-disabled,
.ha-wl-pager .btn[aria-disabled="true"]{ opacity:.45; pointer-events:none; }
.ha-wl-pager .dots{ padding:0 6px; color:#6b7280; user-select:none; font-weight:700; }
.ha-wl-pager-meta{ text-align:center; color:#4b5563; font-size:13px; margin-bottom:16px; }

/* ——— حالة التحميل (AJAX) ——— */
.ha-wl-loading .ha-wl-loading-skel{
  display:block; width:100%; padding:16px;
  border:1px dashed #d7e0da; border-radius:12px; text-align:center; font-size:14px; opacity:.9;
}

/* ——— RTL ——— */
html[dir="rtl"] .ha-wl-list{ direction: rtl; }
html[dir="rtl"] .ha-wl-undercart{ align-items: flex-end; }



/* تغليف الأزرار تحت الكارت */
.ha-wl-undercart{
  display:flex;
  flex-direction:column;
  align-items:center;   /* يوسّط الأزرار أفقيًا */
  gap:12px;             /* مسافة بين الأزرار */
  margin-top:12px;
  border-radius:10px;
}









/* ===== Modal (Login/Register) ===== */
.ha-wl-modal{position:fixed;inset:0;display:none;z-index:99999}
.ha-wl-modal[aria-hidden="false"]{display:block}
.ha-wl-modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.ha-wl-modal__box{
  position:relative;max-width:680px;margin:5vh auto;background:#fff;color:#111;
  border-radius:14px;box-shadow:0 10px 40px rgba(0,0,0,.25);padding:18px 18px 22px;overflow:auto;max-height:90vh
}

  width:36px;height:36px;border-radius:10px;cursor:pointer;font-size:20px;line-height:1}
.ha-wl-modal__head{margin-bottom:12px}
.ha-wl-modal__title{margin:0 0 6px;font-size:20px}
.ha-wl-modal__subtitle{margin:0;color:#666}

.ha-wl-modal__tabs{display:flex;gap:8px;margin:12px 0 14px}
.ha-wl-tab{
  border:1px solid #ddd;background:#f8f8f8;border-radius:10px;padding:8px 12px;cursor:pointer
}
.ha-wl-tab.is-active{background:#111;color:#fff;border-color:#111}

.ha-wl-pane{display:block}
.ha-wl-pane:not(.is-active){display:none}


/* ===== Tabs white bg + white text (with outline for readability) ===== */
.ha-wl-modal__tabs{display:flex;gap:8px;margin:12px 0 14px}

.ha-wl-tab{
  background:#fff;              /* خلفية بيضاء */
  color:#19621e;                   /* نص أبيض */
  border-radius:12px;
  padding:10px 14px;
  cursor:pointer;
  user-select:none;
}

.ha-wl-tab:hover{
  border-color:#999;
  box-shadow:0 0 0 3px rgba(0,0,0,.06) inset;
}

.ha-wl-tab.is-active{
  border-color:#111;            /* الحالة المفعلة أكثر وضوحًا */
  box-shadow:0 0 0 3px rgba(0,0,0,.10) inset;
}

.ha-wl-tab:active{ transform:scale(.98); }

/* لو حابب تضبط تباعد النص ثنائي اللغة */
.ha-wl-tab{ line-height:1.15; }


.ha-wl-modal__close{
  position:absolute;
  top:5px;
  right:5px;   
  padding: 10px;
  border:0;
  border-radius:5px;
  background:#fff;
  color:#111;
  font-size:24px;
  transition:all .2s;
}
.ha-wl-modal__close:hover{
  background:#111;
  color:#fff;
  transform:scale(1.1);
}
.ha-wl-modal__close:focus{
  outline:2px solid #111;
  outline-offset:2px;
}