/* Add custom CSS styles below */ 
/* Add custom CSS styles below */

/* ========== palette ========== */
:root{
  --bg-dark-1:#0f172a;
  --bg-dark-2:#0b1f2e;
  --bg-accent:#0ea5e9;
  --text-main:#e6edf5;
  --text-muted:#b7c2d0;
  --card-bg:rgba(255,255,255,0.06);
  --border-subtle:rgba(255,255,255,0.10);
}

/* background & base text */
html,body{height:100%}
body{
  background:
    radial-gradient(1200px 800px at 80% 30%, rgba(14,165,233,.25) 0%, transparent 60%),
    linear-gradient(135deg, var(--bg-dark-1) 0%, #142036 45%, var(--bg-dark-2) 100%);
  color:var(--text-main);
  font-family:"Tahoma","Arial",sans-serif;
}

/* make top areas transparent so the gradient shows through */
header,.header,.site-header,.topbar,.navbar,.nav,.top-nav,
.footer,.page-header,.breadcrumb,.breadcrumbs,.nav-tabs{
  background:transparent !important;
}

/* —— fix the thin white line under policy links/navbar —— */
header,.header,.site-header,.navbar,.topbar,.page-header,
.navbar-area,.nav-wrapper,.nav-tabs,.menu,.menu>li,
.breadcrumb,.breadcrumbs,.tabs,.tabs__list,.tabbar,.tab-container{
  border:0 !important;
  box-shadow:none !important;
}
.nav,.menu,.nav-tabs,.tabs__list,.menu>li>a,.nav a{
  border-bottom:1px solid var(--border-subtle) !important;
}
hr,.divider,.section-divider,
.header-line,.nav-shadow,.header-separator,.navbar-separator{
  border:0 !important;
  height:1px;
  background:var(--border-subtle) !important;
  opacity:1 !important;
}

/* cards/boxes */
.card,.box,.panel,.section-box,.product,.product-card,
.store-description,.faq-card,.feature-card{
  background:var(--card-bg);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  border-radius:14px;
  border:1px solid var(--border-subtle);
  box-shadow:0 6px 16px rgba(0,0,0,.25);
}

/* headings & text */
h1,h2,h3,.title,.section-title{color:#8bd3ff;font-weight:700}
p,.text-muted,small,.meta{color:var(--text-muted)}

/* buttons & links */
button,.btn,.salla-button,.button,.btn-primary{
  background:linear-gradient(90deg,#06b6d4,var(--bg-accent));
  color:#fff !important;border:0;border-radius:10px;
  padding:10px 18px;transition:transform .25s ease,opacity .25s ease
}
button:hover,.btn:hover,.salla-button:hover,.button:hover,.btn-primary:hover{
  transform:translateY(-1px) scale(1.02);opacity:.92
}
a{color:#7cc9ff} a:hover{color:#b0e1ff}

/* store description block (your Arabic text) */
.store-description{padding:20px;text-align:center;line-height:1.9;font-size:18px}