/* === Skin مطابق لصفحة الحساب (مع سقوط بدائل إن لم تُحقن المتغيرات) === */
:root{
  --shz-us-primary: #1e73be;
  --shz-us-accent:  #ff6b6b;
  --shz-us-bg:      #ffffff;
  --shz-us-text:    #222222;
  --shz-us-font:    Tajawal, Arial, sans-serif;
  --shz-us-radius:  14px;
  --shz-us-gap:     .10rem;
}

/* الغلاف */
#shazar-checkout{
  max-width: 720px;           /* نفس صفحة الحساب (يمكنك رفعها لـ 720 إن رغبت) */
  margin: 1rem auto;
  padding: 1.25rem;
  background: var(--shz-us-bg, #fff);
  color: var(--shz-us-text, #222);
  font-family: var(--shz-us-font, Arial, sans-serif);
  border: 0;                  /* نحذف الإطار ونستخدم ظلًّا ناعمًا مثل الحساب */
  border-radius: var(--shz-us-radius, 14px);
  box-shadow: 0 6px 24px rgba(0,0,0,.06);
}
#shazar-checkout h2{
  margin: .1rem .1rem 1rem;
  text-align:center;
  padding: .5rem 1rem;
  color: var(--shz-btn-active, #B2905F) !important;
}

#shazar-checkout.shz-rtl{ direction: rtl; }

/* الحقول (نفس .shz-us-field) */
#shazar-checkout .shz-us-field{
margin: .1rem .1rem 1rem;
display: flex;
padding: .5rem 1rem;
  flex-direction: column;
  gap: .5rem;
}
#shazar-checkout .shz-us-field label{
  font-weight: 600;
  font-size: .6rem;
  margin: .1rem .1rem 1rem;
display: flex;
padding: .5rem 1rem;
  flex-direction: column;
  gap: .5rem;
}


#shazar-checkout select{
  width: 100%;
display: flex;
  flex-direction: column;
  gap: .1rem;
  box-sizing: border-box;
  padding: .30rem .40rem;
  border-radius: var(--shz-us-radius, 14px);
  background: #fff;
  font-size: .6rem;
  outline: none;
}


/* === SHZ Checkout — Gold titles to match Cart === */
#shazar-checkout h1,
#shazar-checkout h2,
#shazar-checkout h3{
  color: var(--shz-btn-active, #B2905F) !important;
}

/* "حسابات المتجر" تأتي داخل <strong> */
#shazar-transfer-area > p > strong{
  color: var(--shz-btn-active, #B2905F) !important;
}



/* الإدخالات (نفس .shz-us-input) — نطبّق على الكلاسات وعلى النوعيات مباشرة لضمان التطابق حتى لو ما أضفت الكلاسات */
#shazar-checkout .shz-us-input,
#shazar-checkout input[type="text"],
#shazar-checkout input[type="tel"],
#shazar-checkout input[type="email"],
#shazar-checkout textarea
{
  width: 100%;
  margin: .1rem .1rem 1rem;
display: flex;
  flex-direction: column;
  gap: .1rem;
  box-sizing: border-box;
  padding: .30rem .40rem;
  border-radius: var(--shz-us-radius, 14px);
  background: #fff;
  font-size: .6rem;
  outline: none;
}
#shazar-checkout .shz-us-input:focus,
#shazar-checkout input[type="text"]:focus,
#shazar-checkout input[type="tel"]:focus,
#shazar-checkout input[type="email"]:focus,
#shazar-checkout textarea:focus,
#shazar-checkout select:focus{
  border-color: var(--shz-us-primary, #1e73be);
  box-shadow: 0 0 0 3px rgba(30,115,190,.08);
}

/* تباعد بين الحقول مثل الحساب */
#shazar-checkout .shz-us-field + .shz-us-field{ margin-top: .2rem; }
#shazar-checkout .shz-us-hint{ font-size:.85rem; color:#666; }

/* الأزرار (نفس .shz-us-btn) */
#shazar-checkout .shz-us-actions{
  display:flex; align-items:center; gap:.2rem; margin-top:.5rem;
}
#shazar-checkout .shz-us-btn,
#shazar-checkout button{
  border-radius: var(--shz-us-radius, 14px);
  padding: .5rem 2rem;
  font-weight: 700;
  border: none;
  cursor: pointer;
}
#shazar-checkout .shz-us-btn.primary,
#shazar-checkout button.primary{
  background: var(--shz-us-primary, #1e73be);
  color:#fff;
}
#shazar-checkout .shz-us-btn.alt,
#shazar-checkout button.alt{
  background:#f4f6f8;
  color:#111;
  border:1px solid #e6e6e6;
}

/* مودال الخريطة */
#shazar-map-modal{ display:none; }
#shazar-map-modal #shazar-map-canvas{ height:70vh; width:100%; }

/* استجابة */
@media (max-width:600px){
  #shazar-checkout{ padding:.9rem; }
}

 

:root{
    --shazar-primary: #0B69A3;   /* أزرق هادئ */
    --shazar-accent: #F6A623;    /* برتقالي لامع */
    --shazar-bg: #ffffff;
    --shazar-muted: #6b6b6b;
    --shazar-border: #e6e9ee;
    --shazar-success: #2ecc71;
    --shazar-danger: #e74c3c;
    --shazar-radius: 10px;
    --shazar-shadow: 0 6px 18px rgba(11,105,163,0.08);
}

/* Basic reset for plugin HTML */
.shazar-container, #shazar-shipping-estimate, .shazar-summary, .shazar-invoice {
    font-family: 'Tajawal', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    color: #222;
    direction: rtl;             /* RTL for Arabic */
    text-align: right;
    box-sizing: border-box;
    line-height: 1.45;
}

/* Container style */
.shazar-container {
    background: var(--shazar-bg);
    padding: 18px;
    border: 1px solid var(--shazar-border);
    border-radius: var(--shazar-radius);
    box-shadow: var(--shazar-shadow);
    max-width: 900px;
    margin: 8px auto;
}

/* Summary block */
.shazar-summary {
    padding: 10px 12px;
    font-size: 10px;
    color: #222;
}
.shazar-summary p {
    margin: 8px 0;
}
.shazar-summary hr {
    border: 0;
    border-top: 1px dashed var(--shazar-border);
    margin: 12px 0;
}

/* Price wrapper (used for converted price + base price under it) */
.shazar-price-wrapper {
    display: inline-block;
    text-align: right;
    vertical-align: middle;
    direction: rtl;
    min-width: 120px;
}

/* Converted price (the main visible) */
.shazar-price-converted {
    font-weight: 700;
    font-size:10px;
    color: var(--shazar-primary);
    letter-spacing: 0.4px;
}

/* Base price (small under the converted) */
.shazar-price-base {
    display: block;
    font-size:9px;
    color: var(--shazar-muted);
    margin-top: 2px;
}

/* If same currency -> hide base price (class toggled by JS / PHP) */
.shazar-same-currency .shazar-price-base,
body.shazar-same-currency .shazar-price-base {
    display: none !important;
}

/* Buttons and links inside plugin UI */
.shazar-button {
    background: var(--shazar-primary);
    color: #fff;
    border: none;
    padding: 8px 14px;
    border-radius: 8px;
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
}
.shazar-button.secondary {
    background: #fff;
    border: 1px solid var(--shazar-border);
    color: var(--shazar-primary);
}

/* Invoice styles */
.shazar-invoice {
    background: #fff;
    padding: 16px;
    border-radius: 8px;
    border: 1px solid var(--shazar-border);
    max-width: 900px;
    margin: 12px auto;
}
.shazar-invoice .invoice-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
    direction: rtl;
}
.shazar-invoice .invoice-header .logo {
    font-weight: 800;
    font-size: 18px;
    color: var(--shazar-primary);
}
.shazar-invoice .invoice-meta {
    text-align: right;
    font-size: 13px;
    color: var(--shazar-muted);
}
.shazar-invoice table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}
.shazar-invoice table th,
.shazar-invoice table td {
    padding: 10px;
    border-bottom: 1px solid var(--shazar-border);
    text-align: right;
    vertical-align: middle;
    font-size: 14px;
}
.shazar-invoice table th {
    background: #fafafa;
    font-weight: 600;
    color: #333;
}
.shazar-invoice .totals {
    margin-top: 12px;
    text-align: right;
}
.shazar-invoice .totals p {
    font-size: 15px;
    margin: 4px 0;
}

/* Small screens responsiveness */
@media (max-width: 720px) {
    .shazar-container, .shazar-invoice { padding: 10px; margin: 8px; }
    .shazar-price-wrapper { min-width: 20px; }
    .shazar-price-converted { font-size: 15px; }
}

/* Utility classes */
.text-muted { color: var(--shazar-muted); }
.text-success { color: var(--shazar-success); }
.text-danger { color: var(--shazar-danger); }

/* Accessibility: ensure color contrast for converted price */
.shazar-price-converted { color: #064a73; }

/* optional small print */
.shazar-small { font-size: 12px; color: var(--shazar-muted); }

/* invoice print tweaks */
@media print {
    .shazar-invoice { box-shadow: none; border: none; }
    .shazar-button, .shazar-map-modal, .shazar-ui-controls { display: none !important; }
}





/* ==========================================================
   SHZ — Fixes & Tweaks (Invoices / User Tracking / Public Tracking)
   ========================================================== */

/* =========== 1) جدول فواتير المستخدمين (.shzac-user-invoices) =========== */

/* حاوية الجدول: طبقة سفلية بزوايا مدوّرة + منع أي تداخل */
.shzac-user-invoices .shzac-table-wrap{
  position: relative;
  border:1px solid var(--shz-border, #084F5D);
  border-radius:14px;
  background:#fff;
  overflow:hidden;            /* يمنع التداخل في بداية الجدول */
  box-shadow: 0 6px 18px rgba(0,0,0,.04);
}

/* رأس الجدول: طبقة علوية بزوايا "محدّبة" أعلى فقط */
.shzac-user-invoices .shzac-thead{
  background: var(--shz-muted, #F2DBAD);
}
.shzac-user-invoices .shzac-thead .shzac-col{
  padding:1px 1px !important;          /* تقليل الهوامش الداخلية */
  text-align:center !important;          /* محاذاة وسط */
  font-weight:700;
}
/* حواف عليا للرأس (يمين/يسار) */
.shzac-user-invoices .shzac-thead .shzac-col:first-child{ border-top-right-radius:14px; }
.shzac-user-invoices .shzac-thead .shzac-col:last-child { border-top-left-radius:14px; }

/* جسم الجدول: محاذاة وسط وتقليل الحشوات */
.shzac-user-invoices .shzac-table{
  border-collapse: separate;
  border-spacing: 0;
  width:100%;
}
.shzac-user-invoices .shzac-table .shzac-cell,
.shzac-user-invoices .shzac-table th,
.shzac-user-invoices .shzac-table td{
  padding:1px 1px !important;          /* تقليل الهوامش */
  text-align:center !important;          /* محاذاة وسط الخلايا */
  border-bottom:1px solid rgba(0,0,0,.06);
}
/* زوايا سفلية لأخر صف */
.shzac-user-invoices .shzac-table tr:last-child .shzac-cell:first-child{ border-bottom-right-radius:14px; }
.shzac-user-invoices .shzac-table tr:last-child .shzac-cell:last-child { border-bottom-left-radius:14px; }
.shzac-user-invoices .shzac-table tr:last-child .shzac-cell{ border-bottom:none; }

/* زر "عرض الفاتورة" — تصغير الخط والحجم */
.shzac-user-invoices a.button,
.shzac-user-invoices button.button,
.shzac-user-invoices .button{
  background:transparent !important;
  color:var(--shz-btn, #084F5D) !important;
  border:2px solid var(--shz-btn, #084F5D) !important;
  border-radius:14px !important;
  padding:2px 2px !important;          /* أصغر */
  font-size:9px !important;            /* أصغر */
  line-height:1.25 !important;
  box-shadow:none !important;
  font-weight:700 !important;
  text-decoration:none !important;
  transition:all .15s ease-in-out !important;
}
.shzac-user-invoices .button:hover{
  color:var(--shz-btn-active, #B2905F) !important;
  border-color:var(--shz-btn-active, #B2905F) !important;
}

/* الفواتير المخفية ضمن القائمة — كل المحتوى والأزرار "داخل" العنصر */
.shzac-user-invoices .shzac-hidden,
.shzac-user-invoices .shzac-hidden-list,
.shzac-user-invoices .shzac-archive{
  display:block;
}

.shzac-user-invoices .shzac-hidden-list{
  padding:2px 2px !important;
  margin:2px 0 !important;
   width:100% !important;
}

.shzac-user-invoices .shzac-hidden-item{
  border:1px solid var(--shz-border, #084F5D) !important;
  border-radius:14px !important;
  background:#fff !important;
  padding:2px 2px !important;
  margin:2px 0 !important;
}
.shzac-user-invoices .shzac-hidden-item .button,
.shzac-user-invoices .shzac-hidden-item a.button{
  display:block !important;
  width:100% !important;
  text-align:center !important;
  margin-top:2px !important;
  padding:2px 2px !important;
  font-size:8px !important;
}

/* =========== 2) تتبّع طلبات المستخدم (داخل الحساب) =========== */
.shazar-user-tracking table.shazar-user-orders{
  width:100%;
  border:1px solid var(--shz-border, #084F5D);
  border-radius:14px;
  border-collapse:separate;
  background:#fff;
  overflow:hidden;
}
.shazar-user-tracking table.shazar-user-orders thead th{
  background: var(--shz-muted, #F2DBAD);
  color: var(--shz-text, #084F5D);
  text-align:center;                          /* وسط */
  padding:2px 2px !important;                /* تقليل الهوامش */
  font-weight:700;
}
.shazar-user-tracking table.shazar-user-orders tbody td{
  text-align:center;                          /* وسط */
  padding:2px 2px !important;                /* تقليل الهوامش */
  border-bottom:1px solid rgba(0,0,0,.06);
}
.shazar-user-tracking table.shazar-user-orders tbody tr:last-child td{
  border-bottom:none;
}

/* حالة الطلب — ليست زرًا: نحول أي button داخل الخلية إلى شِبه نص/بادج */
.shazar-user-tracking td .button{
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  color:var(--shz-btn, #084F5D) !important;
  font-weight:700 !important;
  pointer-events:none !important;   /* غير قابل للنقر لو كان مجرد عرض حالة */
  cursor:default !important;
}
/* بادج حالة خفيف (إن وُجدت هذه الفئة) */
.shazar-user-tracking .shz-status-badge{
  display:inline-block;
  border:2px solid var(--shz-btn, #084F5D);
  color:var(--shz-btn, #084F5D);
  border-radius:999px;
  padding:2px 8px !important;       /* أصغر */
  font-weight:700;
  background:rgba(8,79,93,.06);
  line-height:1.2;
}

/* =========== 3) صفحة تتبّع الطلب العامة (.shzar-order-tracking) =========== */


/* SHZ: إخفاء صندوق نتيجة التتبّع حتى تظهر نتيجة فعلية */
.shzar-order-tracking .shz_track_result { 
  display: none; 
}

/* عندما يُضَخّ فيه محتوى نصبح بحاجة لعرضه */
.shzar-order-tracking .shz_track_result.is-visible { 
  display: block; 
}

/* كحماية إضافية: لو بقي فارغ فعلاً، لا تُظهِره */
.shzar-order-tracking .shz_track_result:empty { 
  display: none; 
}



/* تنسيق عام أبقى عليه موحدًا مع الإتمام */
.shzar-order-tracking input[type="text"],
.shzar-order-tracking input[type="tel"],
.shzar-order-tracking input[type="email"],
.shzar-order-tracking select,
.shzar-order-tracking textarea{
  border:1.5px solid var(--shz-border, #084F5D) !important;
  border-radius:14px !important;
  background:#fff !important;
  outline:none !important;
  min-height:38px;
  padding:8px 10px;
  box-sizing:border-box;
}
.shzar-order-tracking .shz_track_go{
  background:transparent !important;
  color:var(--shz-btn, #084F5D) !important;
  border:2px solid var(--shz-btn, #084F5D) !important;
  border-radius:14px !important;
  box-shadow:none !important;
  padding:10px 16px !important;
  font-weight:700 !important;
  text-decoration:none !important;
  transition:all .15s ease-in-out !important;
  cursor:pointer;
  margin-top: 12px !important;       /* ازاحة بسيطة للأسفل */
  display: inline-block !important;   /* يضمن فعالية الـmargin داخل سياقات inline/inline-flex */
  vertical-align: top;  
}
.shzar-order-tracking .shz_track_go:hover{
  color:var(--shz-btn-active, #B2905F) !important;
  border-color:var(--shz-btn-active, #B2905F) !important;
}

@media (min-width: 768px){
  .shzar-order-tracking .shz_track_go{
    margin-top: 16px !important;      /* زيادة طفيفة على الشاشات الكبيرة */
  }
}
/* نتيجة التتبّع كبطاقة */
.shzar-order-tracking .shz_track_result,
.shzar-order-tracking .shzar-status-box{
  border:1px solid var(--shz-border, #084F5D);
  border-radius:14px;
  background:#fff;
  padding:12px;
}

/* تنبيهات */
.shzar-order-tracking .shazar-alert{
  border:1px solid var(--shz-border, #084F5D);
  border-radius:14px;
  background:#fff8e6;
  color: var(--shz-text, #084F5D);
  padding:10px 12px;
}
.shzar-order-tracking .shazar-alert--error{
  border-color:#d33; background:#fee; color:#a40000;
}

/* === SHZ — Palette Bridge (checkout follows cart palette) === */
#shazar-checkout{
  --shz-us-primary: var(--shz-btn, #084F5D);
  --shz-us-accent:  var(--shz-btn-active, #B2905F);
  --shz-us-bg:      var(--shz-bg, #FFFFFF);
  --shz-us-text:    var(--shz-text, #084F5D);
  --shz-us-radius:  var(--shz-radius, 14px);
}



/* إخفاء خيار الدفع عند الاستلام افتراضيًا — JS سيُظهره عند "أمانة العاصمة" */
#shazar-checkout .cod-option{ display:none; }

/* مودال الخريطة: خلفية معتمة وصندوق داخلي */
#shazar-map-modal{
  position:fixed !important; inset:0;
  background:rgba(0,0,0,.35) !important;
  display:none; align-items:center; justify-content:center;
  padding:1rem; z-index:9999;
}
#shazar-map-canvas{
  width:min(100%, 900px); height:70vh;
  background:#fff;
  border-radius:var(--shz-us-radius, 14px);
  box-shadow:0 8px 28px rgba(0,0,0,.18);
}
#shazar-map-close{
  position:absolute; top:12px; inset-inline-end:12px;
}