@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800;900&display=swap');

:root{
  --bg:#ffffff; --text:#0e0e0e; --muted:#6b6b6b;
  --gold:#D4AF37; --border:#eaeaea; --radius:14px;
  --shadow:0 6px 24px rgba(0,0,0,.06);
}

*{box-sizing:border-box}
html{direction:rtl}
body{
  margin:0;
  font-family:'Cairo', system-ui, -apple-system, 'Segoe UI', 'Noto Sans Arabic', Arial, sans-serif;
  background:var(--bg); color:var(--text)
}

/* ✅ إلغاء الأزرق الافتراضي للروابط وتوحيد السلوك */
a{ color:inherit; text-decoration:none; }
a:visited{ color:inherit; }
a:hover{ color:var(--gold); }

/* حاوية عامة */
.container{max-width:1200px;margin:0 auto;padding:20px}

/* الهيدر */
.header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--border);z-index:10}
.header .inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 20px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.brand img{width:52px;height:52px;object-fit:contain}
.brand .title{font-weight:900;letter-spacing:.4px}
.brand small{color:var(--muted)}
nav a{margin-inline:10px;text-decoration:none;color:var(--text);font-weight:700}
nav a.active{color:var(--gold)}

.spacer{height:12px}

/* تبويبات المتجر */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 8px}
.tab{padding:10px 14px;border:1px solid var(--border);border-radius:999px;background:#fff;cursor:pointer;font-weight:700}
.tab.active{border-color:var(--gold);box-shadow:0 2px 10px rgba(0,0,0,.05)}

/* شبكة البطاقات */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){.grid{grid-template-columns:repeat(2,1fr)}}

/* بطاقة المنتج (الكل رابط) */
.card{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .15s ease, box-shadow .15s ease; color:var(--text)}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(0,0,0,.08)}
.card img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#fff;display:block}
.card .info{padding:12px 14px;display:flex;flex-direction:column;gap:4px}

/* عنوان العطر */
.card .name{font-weight:800;line-height:1.2;color:var(--text);text-decoration:none}
.card:hover .name,
.card:focus .name{color:var(--gold);text-decoration:underline;text-underline-offset:3px}

/* سطر تحت العنوان */
.card .meta{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-weight:700}
.card .from{font-weight:900;color:#000}

/* تحسين الوصول عند التركيز بالكيبورد */
.card:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:12px}

/* الفوتر */
.footer{padding:22px;border-top:1px solid var(--border);color:var(--muted);text-align:center}

/* مسارات التنقل */
.breadcrumbs{display:flex;gap:6px;align-items:center;color:var(--muted);font-size:.95rem;margin:12px 0}
.breadcrumbs a{text-decoration:none;color:inherit}

/* صفحة المنتج */
.product-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:28px}
@media (max-width:900px){.product-wrap{grid-template-columns:1fr}}
.product-gallery img{width:100%;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);background:#fff}

.product-title{margin:4px 0 2px;font-size:28px;font-weight:900}
.brandtext{color:var(--muted);font-weight:700}
.price{font-size:24px;font-weight:900;margin:8px 0}

/* خيارات الحجم */
.options{margin:14px 0;display:flex;flex-wrap:wrap;gap:10px}
.option{border:1px solid var(--border);padding:10px 14px;border-radius:14px;cursor:pointer;user-select:none;font-weight:800;transition:border .15s, box-shadow .15s}
.option.active{border-color:var(--gold);box-shadow:var(--shadow)}

/* الكمية */
.qty{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:14px;overflow:hidden}
.qty button{all:unset;display:grid;place-items:center;width:40px;height:40px;cursor:pointer;background:#fff}
.qty input{width:56px;text-align:center;border:0;outline:0;font-weight:900}
.qty button:hover{background:#faf7ee}

/* زر الشراء */
.buy-btn{--g1:#E4C766;--g2:#D4AF37;display:inline-flex;align-items:center;gap:8px;padding:14px 18px;border-radius:14px;border:0;background:linear-gradient(180deg,var(--g1),var(--g2));color:#000;font-weight:900;cursor:pointer;box-shadow:0 6px 16px rgba(212,175,55,.3);transition:transform .1s ease, box-shadow .2s ease}
.buy-btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(212,175,55,.38)}
.buy-btn:active{transform:translateY(0) scale(.98)}

/* عناوين الأقسام */
.section-title{margin:20px 0 12px;font-weight:900}

/* صفحات السلة/الدفع */
.checkout{display:grid;grid-template-columns:1.1fr .9fr;gap:28px}
@media (max-width:900px){.checkout{grid-template-columns:1fr}}
.box{border:1px solid var(--border);border-radius:var(--radius);padding:16px;background:#fff;box-shadow:var(--shadow)}
.box h3{margin:0 0 12px;font-weight:900}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
@media (max-width:700px){.form-row{grid-template-columns:1fr}}
label{display:block;font-weight:800;margin-bottom:6px}
input,select,textarea{width:100%;padding:12px;border-radius:12px;border:1px solid var(--border);background:#fff;font-size:1rem}
.note{color:var(--muted);font-size:.95rem;margin-top:8px}
.summary-line{display:flex;justify-content:space-between;margin:8px 0;font-weight:700}
.total{font-size:20px;font-weight:900}

/* شارة السلة */
.cart-link{position:relative; text-decoration:none; font-weight:800}
.badge{position:absolute; top:-6px; inset-inline-end:-10px; background:#D4AF37; color:#000; border-radius:999px; padding:2px 6px; font-size:.8rem; box-shadow:0 2px 8px rgba(212,175,55,.4)}

/* جداول */
.table{width:100%;border-collapse:collapse}
.table th,.table td{border:1px solid var(--border);padding:10px}
.table th{background:#faf7ee;text-align:right}
.empty{padding:16px;border:1px dashed var(--border);border-radius:12px;text-align:center}

/* نجاح */
.success{padding:16px;border:1px solid #cbe5cb;background:#f6fffa;border-radius:12px;margin-top:12px}

/* فرض خط Cairo في كل العناصر */
body, button, input, select, textarea, label, a, .title, nav a, .buy-btn,
h1,h2,h3,h4,h5,h6, .name, .brandtext, .price, .tab, .option, .breadcrumbs,
.table, .summary-line, .footer, .note, .box, small{
  font-family:'Cairo', system-ui, -apple-system, 'Segoe UI', 'Noto Sans Arabic', Arial, sans-serif !important;
}
