:root{
  /* Theme colors - default sky/lav */
  font-family:'IBM Plex Sans Arabic';
  --sky:#96d7fd;--lav:#cabefe;--txt:#374151;
  --sky2:rgba(150,215,253,.22);--sky4:rgba(150,215,253,.40);
  --lav2:rgba(202,190,254,.22);--lav4:rgba(202,190,254,.40);
  --bg1:#c5e8fd;--bg2:#d8caff;--bg3:#aee4ff;
  --gb:rgba(255,255,255,.60);--gbord:rgba(255,255,255,.74);
  --gsh:0 8px 40px rgba(150,180,253,.18),0 1.5px 0 rgba(255,255,255,.85) inset;
  --r:18px;--rsm:12px;--tb:54px;--sw:278px;--swm:64px;--sb:28px;
  --ok:#0d9c6e;--bad:#d63b3b;--gold:#b87c0a;
  --fs:15px;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }

body{font-family:'IBM Plex Sans Arabic';color:var(--txt);font-size:var(--fs);display:flex;flex-direction:column;background:linear-gradient(135deg,var(--bg1) 0%,var(--bg2) 50%,var(--bg3) 100%);position:relative;transition:background .4s;
    min-height:100vh;    
}


.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
    width: 100%;
    float: right;
}

/* ===== Layout ===== */
.arkan-shell{
  display:flex;
  min-height:100vh;
}
.arkan-main{
  flex:1;
  padding: 28px 28px 40px;
  margin-right: var(--sidebar-w); /* لأن السايدبار ثابت يمين */
}
.arkan-main-footer{
  flex:1;
  margin-right: var(--sidebar-w); /* لأن السايدبار ثابت يمين */
}
@media (max-width: 991px) {
  .arkan-main-footer {
    margin-right: 0;
    flex: unset;
  }
}

@media (max-width: 980px){
  .arkan-main{ margin-right:0; padding: 22px 16px 34px; }
}


/* ===== Topbar (Mobile) ===== */
.arkan-topbar{
  display:none;
  position:sticky;
  top:0;
  z-index:50;
  padding:10px 12px;
  backdrop-filter: blur(14px);
  	background: rgba(255,255,255,.52);
  border-bottom:2px solid var(--gbord);
}
.arkan-topbar__brand{
  display:flex; align-items:center; gap:10px;
  font-weight:600;
}
@media (max-width: 980px){
  .arkan-topbar{ display:flex; align-items:center; justify-content:space-between; }
}

/* =====================================
   Mobile Logo Size – Arkan UX
===================================== */
@media (max-width: 980px){

  /* الشعار داخل القائمة الجانبية */
  .arkan-sidebar .custom-logo{
    max-width: 150px;   /* حجم مناسب للجوال */
    max-height: 60px;
  }

  /* لو فيه شعار بالـ topbar (مستقبلاً) */
  .arkan-topbar__brand img{
    max-width: 150px;
    max-height: 51px;
  }

}


/* ===== Sidebar ===== */
.arkan-sidebar .custom-logo{
  max-width: calc(var(--sidebar-w) - 40px);
  width: 150px;
  height: 60px;
  margin-right: 18px;
  object-fit: contain;
}

.arkan-sidebar{
  width: var(--sidebar-w);
  position:fixed;
  right:0; top:0; bottom:0;
  padding:18px 14px;
  z-index:60;

  	background: rgba(255,255,255,.52);
  border-left: 2px solid var(--gbord);
  box-shadow: var(--shadow);
  backdrop-filter: blur(16px);
}
.arkan-sidebar__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding: 8px 8px 14px;
}

.close-btn{
  display: none;
}

@media (max-width: 980px){
  .close-btn{
    display: inline-flex;
  }
}


.arkan-nav{ padding: 8px; }
.arkan-menu{
  list-style:none;
  margin:0; padding:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.arkan-menu li a{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 12px 12px;
  border-radius: 14px;
  text-decoration:none;
  color: #374151;
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border: 2px solid rgba(255,255,255,.10);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.arkan-menu li a:hover{
  transform: translateY(-2px);
  background: rgba(113, 12, 236, 0.09);
  border-color: rgba(255,255,255,.16);
  color: #710cec;
}
.arkan-menu li.current-menu-item a{
  color: #3c097f;
  border-color: rgba(135,62,255,.35);
}

/* ===== Mobile Offcanvas ===== */
.arkan-overlay{
  position:fixed; inset:0;
    background: rgba(135deg, var(--bg1), var(--bg2), var(--bg3));
    box-shadow: 0 12px 40px rgba(216, 202, 255, 0.25);
  backdrop-filter: blur(6px);
  z-index:55;
}
@media (max-width: 980px){
  .arkan-sidebar{
    left: 0;
    right: auto;

    transform: translateX(-110%);
    transition: 
      transform .45s cubic-bezier(.4,0,.2,1),
      opacity .35s ease;

    opacity: .85;
  }

  body.sidebar-open .arkan-sidebar{
    transform: translateX(0);
    opacity: 1;
  }

  .close-btn{ display:inline-flex; }
}

/* ===== Buttons / Inputs (Glass + Shine) ===== */
.icon-btn{
  width:44px; height:44px;
  border-radius: 14px;
  border:2px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: var(--text);
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  backdrop-filter: blur(14px);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.icon-btn:hover{ 
    color:#3c097f;
    transform: translateY(-1px);
    background: rgba(255,255,255,.09);
    border-color: rgba(255,255,255,.18); 
}

.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.14);
  cursor:pointer;
  text-decoration:none;
  color: var(--text);
  background: rgba(255,255,255,.06);
  position:relative;
  overflow:hidden;
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.btn::before{
  content:"";
  position:absolute;
  top:-40%;
  left:-30%;
  width:60%;
  height:180%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  opacity:0;
  transition: opacity .18s ease, transform .35s ease;
}
.btn:hover{ transform: translateY(-2px); border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.08); }
.btn:hover::before{ opacity:1; transform: translateX(180%) rotate(18deg); }

.btn-primary{
  border-color: rgba(135,62,255,.40);
  background: linear-gradient(135deg, rgba(113,12,236,.32), rgba(60,9,127,.18));
}
.btn-primary:active{ transform: translateY(0); }


input,
select {
  width: 3%;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: #fff; /* افتراضي أبيض */
  outline: none;
  transition: border-color .15s ease, background .15s ease, transform .15s ease, color .15s ease;
}

textarea {
  width: 100%;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
  color: #fff; /* افتراضي أبيض */
  outline: none;
  transition: border-color .15s ease, background .15s ease, transform .15s ease, color .15s ease;
}

/* عند فتح القائمة أو التركيز */
select:focus,
input:focus {
  border-color: #f1965e;
  box-shadow: 0 0 0 3px rgba(241,150,94,.28);
  background: #faf7f3;
  transform: translateY(-1px);
  cursor: pointer;
}

textarea:focus {
  color: #374151;
  background: #fff; /* مهم عشان يبان اللون الغامق */
}


input:focus, select:focus, textarea:focus{
  border-color: rgba(135,62,255,.55);
  background: rgba(255,255,255,.07);
  transform: translateY(-1px);
}

/* ===== Cards / Sections ===== */
.glass-card{
  	border-radius:13px;
  	border:2px solid var(--gbord);
  	background: rgba(255,255,255,.52);
  box-shadow: 0 12px 40px rgba(216, 202, 255, 0.25);
  backdrop-filter: blur(14px);
  padding: 18px;
}
.card-hover{
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.card-hover:hover{
  transform: translateY(-4px);
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
}

.page-head{ margin: 14px 0 18px; }
.page-title{ 
    margin:0 0 6px;
    font-size: 22px; 
    text-align: center;
}

.muted{ color: var(--muted); margin:0; }

.grid{
  display:;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
@media (max-width: 1100px){ .grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px){ .grid{ grid-template-columns: 1fr; } }

/* ===== Links ===== */
a{ color: var(--lav0); }
a.link{ color: var(--text); }
a.link:hover{ color: var(--lav0); }


/* ===============================
   Footer – Mobile Layout Fix
================================ */

@media (max-width: 767px) {

  footer.arkan-footer .footer-nav {
    display: flex;
    justify-content: center;
    width: 100%;
  }

  footer.arkan-footer .footer-menu {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px 20px;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    width: 100%;
    max-width: 320px;
  }

  footer.arkan-footer .footer-menu li {
    display: flex;
    justify-content: center;
  }

  footer.arkan-footer .footer-menu a {
    font-size: 14px;
    text-decoration: none;
    white-space: nowrap;
  }

  footer.arkan-footer .footer-glass {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  footer.arkan-footer .footer-meta {
    margin-top: 16px;
    text-align: center;
  }
}



/* ===== Footer ===== */
.arkan-footer{ padding: 18px 18px 28px; }
.container{ max-width: 1200px; margin:0 auto; }
.footer-glass{
  border-radius: 18px;
  	border:2px solid var(--gbord);
  	background: rgba(255,255,255,.52);
  backdrop-filter: blur(14px);
  padding: 16px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.footer-menu{ list-style:none; display:flex; gap:10px; margin:0; padding:0; }
.footer-menu a{ 
    text-decoration:none; 
    color: #374151; 
}
.footer-menu a:hover{
    color: #710cec; 
}

/* ===== WooCommerce (أساسيات شكل زجاجي) ===== */
.woocommerce-cart .cart-collaterals,
.woocommerce-checkout .woocommerce-checkout{
  border-radius: 18px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.06) !important;
 
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit{
  position: relative;
  overflow: hidden;

  border-radius: 16px !important;
  border: 1px solid rgba(135,62,255,.40) !important;
 background: linear-gradient(135deg, #710cec, #3c097f) !important;
  color: #ffffff;
  padding: 12px 14px !important;
  transition: transform .15s ease !important;
}

/* عنصر اللمعة */
.woocommerce a.button::after,
.woocommerce button.button::after,
.woocommerce input.button::after,
.woocommerce #respond input#submit::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent 30%,
    rgba(255,255,255,.35),
    transparent 70%
  );
  transform: translateX(-120%);
  transition: transform .6s ease;
  pointer-events: none;
}

/* عند المرور بالماوس */
.woocommerce a.button:hover::after,
.woocommerce button.button:hover::after,
.woocommerce input.button:hover::after,
.woocommerce #respond input#submit:hover::after{
  transform: translateX(120%);
}

/* الحركة البسيطة للأعلى (تبقى مثل ما هي) */
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover{
    color: #ffffff;
  transform: translateY(-2px);
}


/* ===== Header ===== */
.arkan-header{
  position: sticky;
  top: 0;
  z-index: 40;
  padding: 14px 24px;
  background: rgba(16,21,23,.55);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

body.hidden .arkan-header{
  display: none;
}


/* ===== Article ===== */
.single-article{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.article-meta{
  display: flex;
  gap: 16px;
  font-size: 14px;
}

.article-thumbnail img{
width: 100%;
    max-height: 450px; /* يمكنك تقليل الرقم إذا أردتها أصغر، مثلاً 350px */
    object-fit: cover; /* هذه الخاصية ستقوم بقص الأطراف الزائدة بذكاء دون تشويه الصورة */
    object-position: center; /* لضمان التركيز على وسط الصورة دائماً */
    border-radius: 14px;
}

.article-content{
  line-height: 1.9;
  font-size: 16px;
}

.article-content h2,
.article-content h3{
  margin-top: 28px;
}

.article-footer{
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 14px;
}



/* ===== Cart ===== */
.wc-cart-wrapper{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.cart-actions{
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

.cart-totals-wrapper{
  margin-top: 18px;
}

.shop_table th,
.shop_table td{
  padding: 14px;
  text-align: right;
}

.shop_table .remove{
  margin-right: 10px;
  color: #ff6b6b;
}

.wc-empty-cart{
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: center;
}

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
padding: 20px;
}


/* ===== Page Loader Overlay ===== */
#page-loader {
  position: fixed;
  inset: 0;
  background: rgba(16, 21, 23, 0.35);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  transition: opacity .6s ease, visibility .6s ease;
}

/* إخفاء اللودر */
#page-loader.hide {
  opacity: 0;
  visibility: hidden;
}

/* ===== Loader Content ===== */
.loader-content img {
  width: 70px;
  height: 70px;
  animation: logo-float 1.8s ease-in-out infinite;
  filter: drop-shadow(0 0 0 rgba(113,12,236,0));
}

/* حركة طفو + توهج */
@keyframes logo-float {
  0% {
    transform: translateY(0) scale(1);
    filter: drop-shadow(0 0 0 rgba(113,12,236,0));
    opacity: .85;
  }
  50% {
    transform: translateY(-8px) scale(1.05);
    filter: drop-shadow(0 12px 25px rgba(113,12,236,.45));
    opacity: 1;
  }
  100% {
    transform: translateY(0) scale(1);
    filter: drop-shadow(0 0 0 rgba(113,12,236,0));
    opacity: .85;
  }
}

/* ===== Light Mode ===== */
body.light-mode {
  --bg0: #f5f6fa;
  --bg1: #ffffff;

  --text: #374151;
  --muted: rgba(16,21,23,.65);

  --glass: rgba(0,0,0,.04);
  --glass2: rgba(0,0,0,.06);
  --border: rgba(0,0,0,.12);

  background:
    linear-gradient(180deg, var(--bg0) 0%, var(--bg1) 100%);
}

/* تعديل البطاقات */
body.light-mode .glass-card,
body.light-mode .arkan-sidebar,
body.light-mode .footer-glass {
  background: rgba(255,255,255,.85);
  border-color: rgba(0,0,0,.1);
}

/* روابط */
body.light-mode a {
  color: #3c097f;
}

/* ===== Sidebar Quick Icons ===== */
.sidebar-quick-actions{
  display: flex;
  justify-content: center;
  gap: 10px;
  padding: 10px 8px 16px;
  margin-bottom: 6px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* تحسين حجم الأيقونات */
.sidebar-quick-actions .icon-btn{
  width: 42px;
  height: 42px;
  font-size: 18px;
}

/* Hover أنعم */
.sidebar-quick-actions .icon-btn:hover{
  transform: translateY(-2px) scale(1.03);
}


/* ================================
   Global Inputs Style (Theme + Woo)
================================ */

/* جميع الحقول */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="date"],
textarea,
select,

/* WooCommerce */
.woocommerce input.input-text,
.woocommerce textarea,
.woocommerce select {
  
  background-color: #faf7f3 !important;
  color: #374151 !important;

  border-radius: 14px !important;
  border: 1px solid rgba(16,21,23,.25) !important;

  padding: 12px 14px;
  font-family: 'IBM Plex Sans Arabic';
  font-size: 15px;

  outline: none;
  box-shadow: none;

  transition: 
    border-color .2s ease,
    box-shadow .2s ease,
    background-color .2s ease;
}
input:focus,
textarea:focus,
select:focus,
.woocommerce input.input-text:focus {
  
  border-color: #710cec !important;
  box-shadow: 0 0 0 3px rgba(113,12,236,.18);
}
::placeholder {
  color: rgba(16,21,23,.55);
}

/* =================================
   Required / Invalid Fields Color
================================= */

/* HTML Required */
input:required,
select:required,
textarea:required {
  border-color: #f1965e !important;
}

/* HTML Invalid */
input:invalid,
select:invalid,
textarea:invalid {
  border-color: #f1965e !important;
}

/* WooCommerce - الحقول غير الصحيحة */
.woocommerce-invalid input.input-text,
.woocommerce-invalid select,
.woocommerce-invalid textarea {
  border-color: #f1965e !important;
  box-shadow: 0 0 0 2px rgba(241,150,94,.25);
}

/* رسالة الخطأ تحت الحقل (Woo) */
.woocommerce-error,
.woocommerce form .form-row.woocommerce-invalid label {
  color: #374151 !important;
}

.woocommerce form .form-row.woocommerce-invalid label,
.woocommerce form .form-row.woocommerce-invalid-required-field label {
    color: #f1965e !important;
}


/* النجمة * بجانب الحقول المطلوبة */
.required,
abbr.required {
  color: #f1965e !important;
}
.woocommerce-invalid input.input-text:focus {
  box-shadow: 0 0 0 3px rgba(241,150,94,.35);
}


/* ===============================
   WooCommerce Notices – Arkan UI
================================ */

/* الإطار العام لكل الإشعارات */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {

  border-radius: 18px;
  padding: 14px 16px;
  margin-bottom: 18px;

  background: rgba(255,255,255,.85);
  backdrop-filter: blur(12px);

  color: #374151;
  border: 1px solid rgba(16,21,23,.12);

  font-size: 15px;
}

/* إزالة الشكل الافتراضي */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  display: none;
}
.woocommerce-message {
  height: 50px;
  border-right: 4px solid #5fb3a2;
  background: linear-gradient(
    135deg,
    rgba(95,179,162,.15),
    rgba(255,255,255,.85)
  );
}
.woocommerce-info {
  background: linear-gradient(
    135deg,
    rgba(113,12,236,.18),
    rgba(255,255,255,.85)
  );
}
.woocommerce-error {
  border-right: 4px solid #f1965e;
  background: linear-gradient(
    135deg,
    rgba(241,150,94,.20),
    rgba(255,255,255,.85)
  );
}
.woocommerce-message a,
.woocommerce-info a,
.woocommerce-error a {
  color: #3c097f;
  font-weight: 600;
  text-decoration: none;
}

.woocommerce-message a:hover,
.woocommerce-info a:hover,
.woocommerce-error a:hover {
  text-decoration: underline;
}
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  line-height: 1.7;
}

/* =========================================
   WooCommerce Checkout – Arkan Layout
========================================= */

/* الغلاف العام للـ Checkout */
/* شبكة حقول checkout */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

/* عمودين */
.woocommerce-checkout .form-row-first,
.woocommerce-checkout .form-row-last {
  width: calc(50% - 8px);
}

/* عرض كامل */
.woocommerce-checkout .form-row-wide {
  width: 100%;
}

/* كلمة المرور تحديدًا */
.woocommerce-checkout input#account_password {
  width: 100%;
}
.woocommerce-checkout span.optional {
  display: none !important;
}


.woocommerce-checkout form.checkout {
display: flex;
    flex-direction: column; 
    align-items: center;
    max-width: 800px;      
    margin: 0 auto;      
    gap: 20px;
}

#customer_details, 
#order_review_heading, 
#order_review {
    width: 100%;
    grid-column: unset;
}


#order_review {
    background: rgba(113, 12, 236, 0.05); /* تلوين خفيف بهوية أركان */
    border: 1px solid rgba(113, 12, 236, 0.2);
    border-radius: 18px;
    padding: 25px;
}

/* بطاقات الحقول */
#customer_details .woocommerce-billing-fields {
  border-radius: 18px;
  padding: 18px;
}



/* عنوان ملخص الطلب */
#order_review_heading {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 600;
}

/* صندوق ملخص الطلب */
#order_review {
  border-radius: 18px;
  padding: 18px;
  background: rgba(96, 21, 196, 0.10);

}

/* جدول الطلب */
#order_review table.shop_table {
  border: none;
  margin-bottom: 16px;
}

#order_review table th,
#order_review table td {
  padding: 10px 0;
  border: none;
  text-align: right;
  font-size: 14px;
}

/* الإجمالي */
#order_review .order-total td,
#order_review .order-total th {
  font-size: 16px;
  font-weight: 700;
  border-top: 1px dashed #faf7f3;
  padding-top: 12px;
}
/* طرق الدفع */
#payment {
  background: transparent;
}

#payment ul.payment_methods {
  padding: 0;
  margin: 14px 0;
  border: none;
}

#payment ul.payment_methods li {
  padding: 10px 0;
}

/* سياسة الخصوصية والشروط */
.woocommerce-privacy-policy-text,
.woocommerce-terms-and-conditions-wrapper {
  font-size: 13px;
  color: #374151;
  margin: 12px 0;
}
/* زر تأكيد الطلب */
#place_order,
.woocommerce_checkout_place_order button {
  width: 100%;
  padding: 16px 18px;
  font-size: 17px;
  font-weight: 600;
  border-radius: 20px;

  background: linear-gradient(
    135deg,
    rgba(113,12,236,.85),
    rgba(60,9,127,.85)
  ) !important;

  color: #fff !important;
  border: none !important;

  transition: transform .15s ease, box-shadow .15s ease;
}

/* Hover */
#place_order:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(113,12,236,.45);
}
@media (max-width: 980px) {
  .woocommerce-checkout form.checkout {
    grid-template-columns: 1fr;
  }

  #customer_details,
  #order_review_heading,
  #order_review {
    grid-column: 1;
  }
}


/* ======================================
   WooCommerce Cart – Full Width Layout
====================================== */

/* الحاوية الرئيسية للسلة */
.woocommerce-cart .woocommerce {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

/* نموذج السلة */
.woocommerce-cart .woocommerce-cart-form {
    width: 100%;
}

/* إجمالي السلة */
.woocommerce-cart .cart-collaterals {
    width: 50%;
    padding: 18px;
    margin-top: 24px;
    margin: 24px auto 0; /* توسيط أفقي */
}

.woocommerce-cart .cart-collaterals .cart_totals {
    width: 100%;
    padding: 18px;
    border-radius: 18px;
    box-sizing: border-box;
}

/* زر إتمام الطلب */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    width: 100%;
    border-radius: 14px;
    padding: 14px;
    font-size: 16px;
}

/* ======================================
   Responsive – Mobile & Tablet
====================================== */

@media (max-width: 991px) {
    .woocommerce-cart .cart-collaterals {
        margin-top: 20px;
    }
.woocommerce-cart .cart-collaterals {
    width: 100%;
    padding: 18px;
    margin-top: 24px;
}
}

/* ======================================
   Coupon Input Fix
====================================== */

.input-text-coupon {
    width: 100px;
}

/* ======================================
   Inline Error Messages (Forms)
====================================== */

#add_payment_method .checkout .checkout-inline-error-message,
.woocommerce-cart .checkout .checkout-inline-error-message,
.woocommerce-checkout .checkout .checkout-inline-error-message {
    color: #faf7f3 !important;
    font-size: 13px !important;
    font-weight: 500;
    line-height: 1.6;
}

/* رسائل خطأ الكوبون */
#add_payment_method table.cart td.actions .coupon .coupon-error-notice,
.woocommerce-cart table.cart td.actions .coupon .coupon-error-notice,
.woocommerce-checkout table.cart td.actions .coupon .coupon-error-notice {
    color: #924758 !important;
    font-size: 16px !important;
    font-weight: 500;
    line-height: 1.6;
}

/* ======================================
   Cart Notices – Full Width (FINAL)
====================================== */

/* حاوية الإشعارات */
.woocommerce-cart .woocommerce-notices-wrapper {
    width: 100%;
    margin-bottom: 24px;
}

/* الإشعار نفسه */
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-error {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;

    border-radius: 18px;
    padding: 14px 16px;

    background: linear-gradient(
        135deg,
        rgba(113,12,236,.18),
        rgba(255,255,255,.85)
    );
    backdrop-filter: blur(12px);

    color: #374151;
    border: 1px solid rgba(16,21,23,.12);

    font-size: 15px;
    line-height: 1.6;
}

/* الجوال */
@media (max-width: 767px) {
    .woocommerce-cart .woocommerce-message,
    .woocommerce-cart .woocommerce-info,
    .woocommerce-cart .woocommerce-error {
        border-radius: 14px;
        font-size: 14.5px;
    }
}


.woocommerce div.product div.images img {
    display: block;
    width: 100%;
    height: auto;
    box-shadow: none;
    border-radius:13px;
}

/* =================================
   FORCE Woo Product Price – Arkan
================================= */

body.woocommerce div.product p.price,
body.woocommerce div.product span.price,
body.woocommerce ul.products li.product .price {
  color: #f1965e !important;
  font-weight: 700;
  font-size: 20px;
}

/* =====================================
   Woo Tabs – Hide Titles, Show Content
   Desktop + Mobile (Force)
===================================== */

/* إخفاء عناوين التبويبات في كل الحالات */
.woocommerce-tabs ul.tabs,
.woocommerce-tabs ul.tabs.wc-tabs {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* بعض الثيمات تعرض العنوان كـ accordion */
.woocommerce-tabs .wc-tab-title,
.woocommerce-tabs .woocommerce-Tabs-panel__title {
  display: none !important;
}

/* إجبار محتوى التبويبات على الظهور */
.woocommerce-tabs .panel,
.woocommerce-tabs .woocommerce-Tabs-panel {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  padding-top: 0;
}

/* تحسين المسافة بعد إلغاء التبويبات */
.woocommerce-tabs {
  margin-top: 28px;
}


/* ===== My Account Navigation (Glass Style) ===== */
.woocommerce-MyAccount-navigation {
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border:2px solid var(--gbord);
  border-radius: 20px;
  padding: 14px;
}

/* القائمة */
.woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* العنصر */
.woocommerce-MyAccount-navigation-link {
  border-radius: 14px;
  transition: all .25s ease;
}

/* الرابط */
.woocommerce-MyAccount-navigation-link a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-radius: 14px;
  color: #374151;
  text-decoration: none;
  background: transparent;
  position: relative;
}

/* Hover */
.woocommerce-MyAccount-navigation-link a:hover {
    color: #710cec;
  background: rgba(113,12,236,.15);
  transform: translateX(4px);
}

/* العنصر النشط */
.woocommerce-MyAccount-navigation-link.is-active a {
  background: #e3d8ff;
  border: 1px solid #710cec;
  color: #710cec;
  font-weight: 600;
}

/* لمسة زجاجية نشطة */
.woocommerce-MyAccount-navigation-link.is-active a::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 14px;
  background: linear-gradient(
    120deg,
    rgba(255,255,255,.25),
    rgba(255,255,255,0)
  );
  opacity: .35;
  pointer-events: none;
}

/* أيقونة افتراضية */
.woocommerce-MyAccount-navigation-link a::after {
  content: "›";
  margin-inline-start: auto;
  opacity: .35;
  transition: transform .25s ease, opacity .25s ease;
}

/* تحريك السهم */
.woocommerce-MyAccount-navigation-link a:hover::after,
.woocommerce-MyAccount-navigation-link.is-active a::after {
  transform: translateX(4px);
  opacity: .8;
}

/* ===== Mobile ===== */
/* ===== My Account - Mobile Vertical List ===== */
@media (max-width: 768px) {

  .woocommerce-MyAccount-navigation {
    padding: 12px;
    border-radius: 16px;
  }

  .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  /* عنصر القائمة */
  .woocommerce-MyAccount-navigation-link {
    width: 100%;
  }

  /* الرابط */
  .woocommerce-MyAccount-navigation-link a {
    width: 100%;
    padding: 14px 18px;
    font-size: 15px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
      background: transparent;
  }

  /* Hover / Tap */
  .woocommerce-MyAccount-navigation-link a:active {
    background: rgba(113,12,236,.18);
  }

  /* العنصر النشط */
  .woocommerce-MyAccount-navigation-link.is-active a {
  background: #e3d8ff;
  border: 1px solid #710cec;
  color: #710cec;
  }

  /* سهم توضيحي */
  .woocommerce-MyAccount-navigation-link a::after {
    content: "›";
    opacity: .5;
    font-size: 18px;
  }

  .woocommerce-MyAccount-navigation-link.is-active a::after {
    opacity: .9;
  }

  /* إلغاء أي تأثيرات أفقية */
  .woocommerce-MyAccount-navigation-link a:hover {
    transform: none;
  }
}

/* ===============================
   Add to Cart – CTA Button
================================ */

.woocommerce div.product form.cart .button {
  width: 100%;
  padding: 16px 22px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 18px;
  font-family:'IBM Plex Sans Arabic';
  border: none;
  cursor: pointer;

  /* ألوان أركان */
  background: linear-gradient(
    135deg,
    #710cec,
    #3c097f
  );
  color: #fff;

  /* تأثير زجاجي خفيف */


  transition: 
    transform .15s ease,
    box-shadow .15s ease,
    filter .15s ease;
}

/* Hover */
.woocommerce div.product form.cart .button:hover {
  transform: translateY(-2px);

}

/* Active (عند النقر) */
.woocommerce div.product form.cart .button:active {
  transform: translateY(0);
  box-shadow:
    0 6px 18px rgba(113, 12, 236, 0.35);
}

/* Disabled */
.woocommerce div.product form.cart .button:disabled {
  opacity: .6;
  cursor: not-allowed;
  box-shadow: none;
}

/* حاوية تأكيد كلمة المرور */
.wpfda-password-confirm {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 18px;
}

/* العنوان */
.wpfda-password-confirm label {
  font-size: 14px;
  color: rgba(255,255,255,0.85);
  font-weight: 500;
}

/* حقل الإدخال */
.wpfda-password-confirm input[type="password"] {
  width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(113,12,236,.45);
  background: rgba(255,255,255,.06);
  color: #fff;
  font-size: 14px;
  transition: all .25s ease;
}

/* عند التركيز */
.wpfda-password-confirm input[type="password"]:focus {
  outline: none;
  border-color: #710cec;
  box-shadow: 0 0 0 2px rgba(113,12,236,.25);
  background: rgba(255,255,255,.08);
}
/* حاوية الزر */
.wpfda-submit {
  margin-top: 20px;
}

/* زر الحذف */
.wpfda-submit button {
  width: 100%;
  padding: 13px 16px;
  border-radius: 16px;
  border: 1px solid rgba(255,80,80,.45);
  background: linear-gradient(
    135deg,
    rgba(255,80,80,.25),
    rgba(160,20,20,.35)
  );
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all .25s ease;
}

/* Hover */
.wpfda-submit button:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(255,80,80,.25);
}

/* Active */
.wpfda-submit button:active {
  transform: translateY(0);
}
/* رسالة تحذير الإدارة */


/* رسالة الخطأ */
.wpfda-error {
  margin-top: 10px;
  font-size: 13px;
  color: #ff6b6b;
}
.wpfda-password-confirm::after {
  content: "سيتم حذف حسابك وجميع بياناتك نهائيًا";
  font-size: 13px;
  color: rgba(255,255,255,.6);
}

/* توحيد نماذج Woo */
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
  background: transparent;
  box-shadow: none;
  border: none;
}

.woocommerce-account form.login {
  background: rgba(255,255,255,.05);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 22px;
  padding: 28px;
  max-width: 460px;
  margin: 0 auto;
}
.woocommerce-account form.login input[type="text"],
.woocommerce-account form.login input[type="password"] {
  width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(113,12,236,.45);
  background: rgba(255,255,255,.06);
  color: #fff;
  font-size: 14px;
  transition: all .25s ease;
}

.woocommerce-account form.login input:focus {
  outline: none;
  border-color: #710cec;
  box-shadow: 0 0 0 2px rgba(113,12,236,.25);
}
.woocommerce-account form.login button[type="submit"] {
  width: 100%;
  padding: 13px 16px;
  border-radius: 16px;
  border: 1px solid rgba(135,62,255,.40);
  background: linear-gradient(
    135deg,
    rgba(113,12,236,.45),
    rgba(60,9,127,.35)
  );
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  transition: all .25s ease;
}

.woocommerce-account form.login button:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(113,12,236,.35);
}
.woocommerce-account .woocommerce-form-login__rememberme {
  color: #384152;
  font-size: 16px;
}

.woocommerce-account .woocommerce-LostPassword a {
  color: #a88bff;
  font-size: 16px;
  text-decoration: none;
}

.woocommerce-account .woocommerce-LostPassword a:hover {
  text-decoration: underline;
}

.woocommerce table.shop_table,
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}
.woocommerce .woocommerce-customer-details address {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.woocommerce-account fieldset {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* الحاوية العامة لنموذج التسجيل */
.user-registration.ur-frontend-form {
  max-width: 560px;
  margin: 0 auto;
  padding: 28px;
  background: rgba(255,255,255,.05);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 22px;
}
/* صفوف الحقول */
.ur-form-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

/* الأعمدة */
.ur-form-grid {
  width: 100% !important;
}
.user-registration label.ur-label {
  font-size: 14px;
  font-weight: 500;
  color: rgba(255,255,255,.85);
  margin-bottom: 6px;
  display: block;
}

.user-registration abbr.required {
  color: #ff6b6b;
  text-decoration: none;
}
.user-registration input[type="text"],
.user-registration input[type="email"],
.user-registration input[type="password"] {
  width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(113,12,236,.45);
  background: rgba(255,255,255,.06);
  color: #fff;
  font-size: 14px;
  transition: all .25s ease;
}

/* Focus */
.user-registration input:focus {
  outline: none;
  border-color: #710cec;
  box-shadow: 0 0 0 2px rgba(113,12,236,.25);
  background: rgba(255,255,255,.08);
}
.user-registration .password-input-group {
  width: 100%;
}

.user-registration .input-form-field-icons {
  background: transparent;
}
/* حاوية الكابتشا */
#ur-recaptcha-node {
  margin: 20px 0;
  display: flex;
  justify-content: center;
}

/* إزالة الخلفيات البيضاء */
#ur-recaptcha-node iframe {
  background: transparent !important;
}
.user-registration .ur-button-container {
  margin-top: 24px;
}

.user-registration button.ur-submit-button {
  width: 100%;
  padding: 14px 18px;
  border-radius: 16px;
  border: 1px solid rgba(135,62,255,.40);
  background: linear-gradient(
    135deg,
    rgba(113,12,236,.45),
    rgba(60,9,127,.35)
  );
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all .25s ease;
}

.user-registration button.ur-submit-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(113,12,236,.35);
}

@media (max-width: 768px) {
  .ur-form-row {
    flex-direction: column;
  }
}

/* عناوين الحقول */
.user-registration.ur-frontend-form label.ur-label,
.user-registration.ur-frontend-form .ur-label {
  color: #384152 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
/* كسر العرض inline */
.user-registration.ur-frontend-form .ur-form-grid {
  width: 100% !important;
  flex: 1 1 0 !important;
}

/* صفوف الحقول */
.user-registration.ur-frontend-form .ur-form-row {
  display: flex !important;
  gap: 16px !important;
  margin-bottom: 18px !important;
}
@media (max-width: 768px) {
  .user-registration.ur-frontend-form .ur-form-row {
    flex-direction: column !important;
  }
}
.user-registration input[type="text"],
.user-registration input[type="email"],
.user-registration input[type="password"] {
  width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(113,12,236,.45);
  background: rgba(255,255,255,.06);
  color: #ffffff;
  font-size: 14px;
  transition: all .25s ease;
}

.user-registration input:focus {
  outline: none;
  border-color: #710cec;

  background: rgba(255,255,255,.08);
}

/* زر التسجيل */
.user-registration.ur-frontend-form button.ur-submit-button,
.user-registration.ur-frontend-form .ur-button-container button {
  width: 100% !important;
  padding: 14px 18px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(135,62,255,.40) !important;
  background: linear-gradient(
    135deg,
    rgba(113,12,236,.45),
    rgba(60,9,127,.35)
  ) !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all .25s ease !important;
}

/* Hover */
.user-registration.ur-frontend-form button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 28px rgba(113,12,236,.35) !important;
}
.user-registration.ur-frontend-form .input-wrapper,
.user-registration.ur-frontend-form .form-row {
  width: 100% !important;
}

/* رسائل الخطأ - مطلوب */
.user-registration-error {
  color: #ff9f43 !important; /* برتقالي هادئ */
  font-size: 13px;
  font-weight: 500;
}

/* حاوية صفحة استعادة كلمة المرور */
#user-registration .ur-frontend-form.login {
  max-width: 460px;
  margin: 0 auto;
  padding: 28px;
  background: rgba(255,255,255,.05);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-radius: 22px;
}
/* عنوان الصفحة */
.ur-lost-password-title {
  color: #ffffff !important;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
  text-align: center;
}

/* الوصف */
.ur-lost-password-message {
  color: #384152;
  font-size: 14px;
  text-align: center;
  margin-bottom: 22px;
}
/* عناوين الحقول */
.user-registration label {
  color: #384152 !important;
  font-size: 14px;
  font-weight: 500;
}
/* حاوية الإدخال مع الأيقونة */
.ur-input-with-icon {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(113,12,236,.45);
  border-radius: 14px;
  padding: 10px 14px;
  transition: all .25s ease;
}

/* الأيقونة */
.ur-input-with-icon svg {
  stroke: rgba(255,255,255,.6) !important;
}

/* حقل الإدخال */
.ur-input-with-icon input {
  border: none !important;
  background: transparent !important;
  color: #ffffff !important;
  width: 100%;
  font-size: 14px;
}

/* Focus */
.ur-input-with-icon:focus-within {
  border-color: #710cec;
  box-shadow: 0 0 0 2px rgba(113,12,236,.25);
}
/* زر استعادة كلمة المرور */
.user-registration .ur-reset-password-btn {
  width: 100% !important;
  padding: 14px 18px;
  border-radius: 16px;
  border: 1px solid rgba(135,62,255,.40);
  background: linear-gradient(
    135deg,
    rgba(113,12,236,.45),
    rgba(60,9,127,.35)
  );
  color: #ffffff !important;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all .25s ease;
}

/* Hover */
.user-registration .ur-reset-password-btn:hover {
  transform: translateY(-2px);
}
/* رسائل الخطأ */
.user-registration-error,
.user-registration-message-container {
  color: #ff9f43 !important;
  font-size: 13px;
  margin-top: 10px;
}

@media (max-width: 768px) {
  #user-registration .ur-frontend-form.login {
    padding: 22px;
  }
}
/* إزالة أي خلفية أو إطار من الحاوية الرئيسية */
#user-registration {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
/* توسيط نموذج استعادة كلمة المرور */
#ur-frontend-form {
  max-width: 460px;
  margin: 0 auto !important;
}
/* نص الوصف */
.ur-lost-password-message {
  color: #ffffff !important;
  font-size: 16px !important;
  line-height: 1.6;
  text-align: center;
  margin-bottom: 24px;
}
.ur-lost-password-title {
  color: #ffffff !important;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 10px;
}
/* إزالة تنسيق الحاوية القديمة */
.ur-input-with-icon {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

/* حقل البريد – نفس تنسيق أركان */
.user-registration input[type="text"],
.user-registration input[type="email"] {
  width: 100% !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(113,12,236,.45) !important;
  background-color: #faf7f3 !important;
  color: #000 !important;
  font-size: 14px !important;
  transition: all .25s ease !important;
}

/* Focus */
.user-registration input[type="text"]:focus,
.user-registration input[type="email"]:focus {
  outline: none !important;
  border-color: #710cec !important;
  box-shadow: 0 0 0 2px rgba(113,12,236,.25) !important;
  background-color: #ffffff !important;
}

.user-registration .ur-reset-password-btn {
  width: 100% !important;
  padding: 14px 18px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(135,62,255,.40) !important;
  background: linear-gradient(135deg, #710cec, #3c097f) !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 600;
  cursor: pointer;
  transition: all .25s ease !important;
}

.user-registration .ur-reset-password-btn:hover {
  transform: translateY(-2px);
}

/* إخفاء عنوان استعادة كلمة المرور */
.ur-lost-password-title {
  display: none !important;
}

/* إزالة تنسيق الحاوية القديمة */
.ur-input-with-icon {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

/* إخفاء أيقونة البريد */
.ur-input-with-icon svg {
  display: none !important;
}

.user-registration {
  max-width: 520px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* =====================================
   Subscription Products – Desktop Layout
===================================== */

.woocommerce.columns-4{
  display: flex;
  justify-content: center;
}

.woocommerce ul.products.columns-4{
  display: flex !important;
  justify-content: center;
  gap: 28px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
}
.woocommerce ul.products.columns-4 li.product{
  width: 100% !important;
  max-width: 100%;
  float: none !important;
  background: rgba(255,255,255,.52);
  border:2px solid var(--gbord);
  border-radius:13px;
}
.product_cat-subscriptions{
  background: rgba(255,255,255,.52);
  border:2px solid var(--gbord);
  border-radius:13px;
  padding: 28px 24px;
  text-align: center;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size: 20px !important;
}

.product_cat-subscriptions .woocommerce-loop-product__title{
  font-size: 20px;
  font-weight: 800;
  margin-bottom: 12px;
  color: #710cec;
}
.product_cat-subscriptions .price{
  font-size: 20px;
  font-weight: bold;
  color: #f1965e;
  margin-bottom: 20px;
  display: block;
}
.woocommerce ul.products li.product .price{
  font-size: 20px !important;
}

.product_cat-subscriptions .button{
  width: 100%;
  padding: 14px 18px;
  font-size: 16px;
  font-weight: 700;
  border-radius: 18px;

  background: linear-gradient(
    135deg,
    #710cec,
    #3c097f
  ) !important;

  color: #fff !important;
}
@media (max-width: 768px){

  .woocommerce ul.products.columns-4{
    flex-direction: column !important;
    align-items: center;
  }

  .woocommerce ul.products.columns-4 li.product{
    width: 100% !important;
    max-width: 100% !important;
    background: rgba(255,255,255,.52);
    border:2px solid var(--gbord);
  }

  .product_cat-subscriptions{
    padding: 24px 18px;
  }

  .product_cat-subscriptions .woocommerce-loop-product__title{
    font-size: 20px;
  }

}





/* زر بيسك */
li.product.post-833 .button{
    background: linear-gradient(135deg, #710cec, #3c097f) !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.35);
    color: #ffffff !important;
    border: none !important;
    border-radius: 18px;
    font-weight: 600;
    transition: all .25s ease;
    font-family:'IBM Plex Sans Arabic';
}


/* زر بلس */
li.product.post-1453 .button{
  background: linear-gradient(135deg, #710cec, #3c097f) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  font-family:'IBM Plex Sans Arabic';
}


/* زر برو */
li.product.post-1452 .button{
  background: linear-gradient(135deg, #710cec, #3c097f) !important;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
  font-family:'IBM Plex Sans Arabic';
}
li.product.post-1452 .button:hover{
    transform: translateY(-2px);
}



#user-registration p {
    color: #384152 !important;
    opacity: .92;
}

.user-registration-Button,
.ur-submit-button {
    width: 100%;
    padding: 14px 18px;
    border-radius: 20px;
    border: none !important;
    background: linear-gradient(
        135deg,
        rgba(113,12,236,.65),
        rgba(60,9,127,.55)
    );
    color: #ffffff !important;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: all .25s ease;
}
.user-registration-Button:hover,
.ur-submit-button:hover {
    transform: translateY(-2px);
    box-shadow:
        0 12px 28px rgba(113,12,236,.35),
        inset 0 0 0 1px rgba(255,255,255,.15);
    background: linear-gradient(
        135deg,
        rgba(113,12,236,.85),
        rgba(60,9,127,.75)
    );
}
#user-registration,
#user-registration * {
    font-family:"IBM Plex Sans Arabic";
}

/* الحقول العادية */
input:not([type="checkbox"]):not([type="radio"]),
select {
    width: 100%;
}

/* checkbox و radio بدون تأثير */
input[type="checkbox"],
input[type="radio"] {
    width: auto !important;
    min-width: 18px;
    min-height: 18px;
}

/* =====================================
   Global input-text – Arkan Style
===================================== */

input.input-text,
textarea.input-text {
    background-color: #faf7f3 !important;
    color: #374151;
    border-radius: 16px;
    border: 1px solid rgba(16,21,23,.15);
    padding: 12px 14px;
    transition: all .25s ease;
}
input.input-text:focus,
textarea.input-text:focus {
    outline: none;
    border-color: #710cec;
    box-shadow: 0 0 0 2px rgba(113,12,236,.18);
    background-color: #faf7f3;
}

/* ======================================
   Cart Checkout Button = Checkout Page
====================================== */

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-checkout button#place_order {
    width: 100%;
    padding: 15px 18px;
    border-radius: 18px;

    background: linear-gradient(
        135deg,
        #710cec,
        #3c097f
    ) !important;

    color: #ffffff !important;
    font-size: 16px;
    font-weight: 600;
    text-align: center;

    border: none !important;
    cursor: pointer;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);



    transition: all .25s ease;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-checkout button#place_order:hover {
    transform: translateY(-2px);

    background: linear-gradient(
        135deg,
        #7d1bff,
        #4a0fb3
    ) !important;

  
}

.sidebar-quick-actions{
  display: flex;
  gap: 10px;
  padding: 12px;
  justify-content: center;
}

.icon-btn{
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: #873eff;
  font-size: 18px;
  transition: all .2s ease;
  text-decoration: none;
}

.icon-btn:hover{
  color: #3c097f;
  background: rgba(255,255,255,.10);
  transform: translateY(-2px);
    	border:2px solid var(--gbord);
}

.woocommerce-cart table.cart td.actions button[name="update_cart"],
.woocommerce-cart table.cart td.actions input[name="update_cart"] {
    display: none !important;
}

.button-container {
    text-align: center;
    margin: 20px 0;
}

.arkaan-btn br {
    display: none !important;
}
.arkaan-btn {
    display: inline-block;
    padding: 12px 35px;
      background: linear-gradient(135deg, #710cec, #3c097f) !important;
    color: #ffffff !important;
      text-shadow: 0 1px 2px rgba(0,0,0,.35);
    font-size: 19px;
    text-decoration: none !important;
    border-radius: 18px;
    transition: all 0.3s ease;
}

.arkaan-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(113, 12, 236, 0.3);
}


.woocommerce-result-count, 
.woocommerce-ordering {
    display: none !important;
}

.woocommerce-products-header__title.page-title {
    display: none !important;
}

/* تنسيق شارة التخفيض */
.woocommerce span.onsale {
    background: linear-gradient(135deg, #f1965f, #ca6325) !important; 
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    padding: 5px 15px !important;
    min-height: auto !important;
    min-width: auto !important;
    line-height: 1.5 !important;
    border-radius: 50px !important; /* زوايا دائرية ناعمة */
    border: 1px solid rgba(255, 255, 255, 0.2) !important; /* إطار أبيض شفاف جداً لمظهر زجاجي */
    top: 10px !important; /* تحريك مكانها لتكون متناسقة */
    right: 10px !important; /* لمتصفحات العربي */
    left: auto !important;
}

.wcmamtx-banner-counter, .wcmamtx-banner-counter-sidebar {
    background: #f1965f;
    color: #ffffff;
}

.woocommerce-cart .cart-collaterals .cart_totals {
    border-radius: 18px;
    padding: 18px;
    background: rgba(96, 21, 196, 0.10);
}

/* توسيط محتوى بطاقة المنتج في صفحات المتجر والأقسام */
ul.products li.product {
    text-align: center;
}

/* تنسيق وتوسيط الوصف المختصر الذي أضفناه */
.arkan-product-short-desc {
    text-align: center;
    margin: 10px 0;
    font-size: 16px; /* تصغير الخط قليلاً لتمييزه عن العنوان */
    color: #384152; /* لون رمادي هادئ */
    line-height: 1.5;
}

/* التأكد من توسيط زر الإضافة للسلة */
ul.products li.product .button {
    display: inline-block;
    margin: 10px auto 0;
}

/* التأكد من توسيط السعر */
ul.products li.product .price {
    justify-content: center; /* في حال كان ووكومرس يستخدم Flexbox للسعر */
    display: flex;
    font-size: 20px;
      
}

/* 1. إزالة الخط الذي يظهر تحت السعر المخفض الجديد */
.price ins,
.arkan-product-price ins {
    text-decoration: none !important;
}

/* 2. السعر القديم: خط واحد يتوسط النص */
.price del,
.arkan-product-price del {
    text-decoration: line-through !important; /* تطبيق الخط هنا فقط */
    color: #4e5b7d !important;
    opacity: 0.8;
    font-size: 0.8em;
    margin-right: 8px;
}

/* 3. منع تكرار الخطين وضمان تلوين الرقم والعملة بنفس اللون */
.price del *,
.arkan-product-price del * {
    text-decoration: none !important; /* منع الخط الإضافي */
    color: #4e5b7d !important; /* توحيد اللون */
}

/* =========================================
   1. إعداد الشبكة الأساسية (4 مقالات في الصف)
========================================= */
.grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin-top: 20px;
    align-items: start; /* يمنع تمدد الكروت بشكل غير متساوي إذا اختلف طول النص */
}

/* =========================================
   2. تنسيق البطاقة وتأثير مرور الماوس (Glass Effect)
========================================= */
.archive-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    padding: 0 !important;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

.card-hover:hover {
    background-color: rgba(255, 255, 255, 0.25) !important; /* زيادة البياض عند مرور الماوس */
    transform: translateY(-5px); /* رفع البطاقة للأعلى قليلاً */
}

/* =========================================
   3. تنسيق حاوي الصورة
========================================= */
.card-image {
    width: 100%;
    height: 200px;
    overflow: hidden;
}

.card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.card-hover:hover .card-image img {
    transform: scale(1.05); /* تقريب الصورة قليلاً عند مرور الماوس */
}

/* =========================================
   4. تنسيق المحتوى النصي (التوسيط والمسافات)
========================================= */
.card-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    align-items: center; /* توسيط العناصر أفقياً */
    text-align: center;  /* توسيط النصوص */
}

/* تنسيق العنوان (حذف الخط ومقاس 19px) */
.card-title {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 19px !important; 
}

.card-title .title-link {
    text-decoration: none !important;
    background-image: none !important;
    box-shadow: none !important;
}

/* إضافة مسافة تحت الخلاصة */
.excerpt-text {
    margin-bottom: 25px; 
}

/* =========================================
   5. تنسيق رابط (اقرأ المزيد)
========================================= */
.text-link {
    margin-top: auto; /* لإبقاء الرابط في أسفل البطاقة دائماً */
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #3c097f; /* اللون الافتراضي */
    font-weight: bold;
    text-decoration: none;
    transition: all 0.3s ease;
}

.text-link:hover {
    color: #710cec; /* اللون عند مرور الماوس */
}

.text-link i {
    transition: transform 0.3s ease;
}

.text-link:hover i {
    transform: translateX(-5px); /* تحريك السهم لليسار */
}

/* =========================================
   6. التجاوب مع الشاشات (الجوال والتابلت)
========================================= */
@media (max-width: 1024px) {
    .grid {
        grid-template-columns: repeat(2, 1fr); /* مقالان في التابلت */
    }
}

@media (max-width: 768px) {
    .grid {
        grid-template-columns: 1fr; /* مقال واحد في الجوال */
    }
    .card-image {
        height: 250px; /* زيادة ارتفاع الصورة في الجوال لتكون أوضح */
    }
}

/* =========================================
   تنسيق زر (عرض المزيد) بهوية أركان الأصلية
========================================= */
#load-more-btn {
    display: inline-block;
    padding: 10px 25px;
    background: linear-gradient(135deg, #710cec, #3c097f) !important;
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    font-size: 17px;
    font-family: 'IBM Plex Sans Arabic', sans-serif; /* نفس خط الموقع */
    font-weight: 600;
    text-decoration: none !important;
    border: none;
    border-radius: 18px; /* نفس انحناء أزرار أركان */
    cursor: pointer;
    transition: all 0.3s ease;
}

/* التأثير عند مرور الماوس (Hover) */
#load-more-btn:hover {
    transform: translateY(-2px); /* رفع الزر للأعلى */
    box-shadow: 0 6px 20px rgba(113, 12, 236, 0.3); /* توهج بنفسجي يتناسب مع الهوية */
}

/* التأثير عند النقر (Active) */
#load-more-btn:active {
    transform: translateY(0); /* عودة الزر لمكانه */
    box-shadow: 0 2px 5px rgba(113, 12, 236, 0.2);
}

/* ==================================================
   تخصيص نماذج Fluent Forms (الخطوط، التنبيهات، وتنسيق الزر)
================================================== */

/* تطبيق خط IBM Plex Sans Arabic على الحقول، العناوين، والتنبيهات/رسائل الخطأ */
.fluentform input,
.fluentform textarea,
.fluentform select,
.fluentform label,
.fluentform .ff-el-form-control,
.fluentform .text-danger,
.fluentform .error,
.fluentform .ff-errors-in-stack {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
}

/* تخصيص زر الإرسال (الخط، الانحناء، حجم النص، والأبعاد الداخلية) */
.fluentform .ff-btn-submit {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
    border-radius: 13px !important;
    font-size: 17px !important;
    padding: 10px !important; /* الأبعاد الداخلية للزر */
}

/* ==================================================
   تخصيص رسائل نجاح/فشل الإرسال في نماذج Fluent Forms
================================================== */

.fluentform .ff-message-success,
.fluentform .ff-message-error,
.ff-message {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
    font-size: 17px !important;
    border-radius: 13px !important;
    
    /* خلفية بيضاء شفافة وتأثير زجاجي */
    background: rgba(255, 255, 255, 0.65) !important; 
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    
    color: #374151 !important; /* لون النص داكن ليكون واضحاً على الأبيض */
    padding: 16px !important; /* مسافة داخلية مريحة للعين */
    text-align: center !important; /* توسيط النص ليكون شكله أرتب */
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.05) !important; /* ظل خفيف جداً يعطي عمق */
}

/* إخفاء الأيقونة الافتراضية إذا كانت تتعارض مع التنسيق (اختياري) */
.fluentform .ff-message-success:before,
.fluentform .ff-message-error:before {
    margin-left: 8px !important;
}

/* =========================================
   تخصيص سلة ووكومرس (إخفاء الصورة والكمية وتوسيط الكوبون)
========================================= */

/* 1. إخفاء عمود صورة المنتج وعمود الكمية بالكامل */
.woocommerce-cart table.cart th.product-thumbnail,
.woocommerce-cart table.cart td.product-thumbnail,
.woocommerce-cart table.cart th.product-quantity,
.woocommerce-cart table.cart td.product-quantity {
    display: none !important;
}

/* 2. توسيط محتوى الجدول المتبقي (المنتج، السعر، الإجمالي) */
.woocommerce-cart table.cart th,
.woocommerce-cart table.cart td {
    text-align: center !important;
}

/* 3. تنسيق منطقة الكوبون لتكون في المنتصف أسفل المنتجات */
.woocommerce-cart table.cart td.actions {
    text-align: center !important;
    padding-top: 30px !important; /* مساحة علوية لفصل الكوبون عن المنتجات */
}

.woocommerce-cart table.cart td.actions .coupon {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px; /* المسافة بين حقل الإدخال وزر التطبيق */
    width: 100%;
    float: none !important;
}

/* 4. التحكم في عرض حقل إدخال الكوبون وزر التطبيق */
.woocommerce-cart table.cart td.actions .coupon .input-text {
    width: 200px !important; /* يمكنك تغييرها إلى 100px إذا أردت */
    min-width: unset !important;
    text-align: center;
}

.woocommerce-cart table.cart td.actions .coupon .button {
    width: 110px !important; /* توحيد عرض الزر مع الحقل لشكل أرتب */
    margin: 0 !important;
}



/* =========================================
   توسيط وتنسيق الكوبون في صفحة إتمام الطلب (بدون تعارض مع الفتح والإغلاق)
========================================= */

/* الحاوية الرئيسية لنموذج الكوبون */
.woocommerce-checkout form.checkout_coupon {
    text-align: center;
    margin: 0 auto 30px auto !important;
    padding: 20px !important; 
    border:2px solid var(--gbord);
    border-radius: 15px; 
    background: rgba(255,255,255,.52);
    max-width: 400px; /* للتحكم في عرض الصندوق بشكل أرتب */
}

/* إلغاء الـ float الافتراضي وجعل الحقول كتل (Blocks) تتوسط الصفحة */
.woocommerce-checkout form.checkout_coupon .form-row-first,
.woocommerce-checkout form.checkout_coupon .form-row-last,
.woocommerce-checkout form.checkout_coupon p {
    float: none !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto 12px auto !important; /* 12px مسافة بين الحقل والزر */
}

/* إزالة المسافة من أسفل الزر الأخير */
.woocommerce-checkout form.checkout_coupon .form-row-last {
    margin-bottom: 0 !important;
}

/* التحكم في عرض حقل إدخال الكوبون وتوسيطه */
.woocommerce-checkout form.checkout_coupon .form-row-first input.input-text {
    width: 200px !important;
    min-width: unset !important;
    margin: 0 auto !important; /* توسيط الحقل داخل السطر */
    display: inline-block !important;
    text-align: center;
}

/* التحكم في عرض زر التطبيق وتوسيطه */
.woocommerce-checkout form.checkout_coupon .form-row-last button.button {
    width: 110px !important;
    margin: 0 auto !important; /* توسيط الزر داخل السطر */
    display: inline-block !important;
}

/* =========================================
   تخصيص رسالة خطأ الكوبون في صفحة إتمام الطلب
========================================= */

.woocommerce-checkout form.checkout_coupon .coupon-error-notice,
.woocommerce-checkout form.checkout_coupon .woocommerce-error,
.woocommerce-checkout form.checkout_coupon .woocommerce-error li,
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-checkout .woocommerce-notices-wrapper .woocommerce-error li {
    color: #924758 !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.6;
    background: transparent !important; /* لإزالة أي خلفية مزعجة إن وجدت */
    border: none !important; /* لإزالة الإطار الافتراضي إن وجد */
    box-shadow: none !important;
}

/* =========================================
   إخفاء زر (عرض السلة / متابعة) من إشعار نجاح الإضافة
========================================= */

.woocommerce-message a.button,
.woocommerce-message .button {
    display: none !important;
}

.glass-card-none {
  border-radius:13px;
  border:2px solid var(--gbord);
  background: rgba(255,255,255,.52);
  box-shadow: 0 12px 40px rgba(216, 202, 255, 0.25);
  backdrop-filter: blur(14px);
  padding: 18px;
}


/* باقة بيسك داخل صفحة القسم */
.woocommerce ul.products li.product.post-57 {
    border: 2px solid #ceb6ff;
    border-radius: 14px;
    position: relative;
    overflow: hidden;
}

/* تغيير خلفية جميع العناصر الداخلية الأساسية */
.woocommerce ul.products li.product.post-57,
.woocommerce ul.products li.product.post-57 .product-inner,
.woocommerce ul.products li.product.post-57 .product-wrapper,
.woocommerce ul.products li.product.post-57 .mf-product-thumbnail,
.woocommerce ul.products li.product.post-57 .mf-product-details,
.woocommerce ul.products li.product.post-57 .content-product {
    background: linear-gradient(135deg, #faf7ff 10%, #efe6ff 30%, #e3d8ff 100%);
}

/* الشريط العلوي */
.woocommerce ul.products li.product.post-57::before {
    content: "ابدأ مجانًا";
    position: absolute;
    top: 10px;
    right: 15px;
    background: #710cec;
    color: #fff;
    padding: 5px 12px;
    font-size: 14px;
    border-radius: 20px;
    font-weight: bold;
    z-index: 5;
}

/* الزر */
.woocommerce ul.products li.product.post-57 .button {
    background: #710cec;
    color: #fff;
    border-radius: 8px;
}