:root{
  --bar:#6fa6de;
  --bar2:#5f9fda;
  --bg:#eef5fc;
  --panel:#ffffff;
  --stroke: rgba(0,0,0,.08);
  --ink:#0e2b4a;
  --muted:#4c6a86;
  --shadow: 0 10px 30px rgba(0,0,0,.10);
  --primary:#2b79d3;
  --primary2:#6fb6ff;
  --soft: rgba(111,166,222,.18);
}

/* Force light theme overrides */
body{
  background: linear-gradient(180deg, var(--bg), #eaf2fb 60%, #e8f0fa) !important;
  color: var(--ink) !important;
}

/* Navbar -> light blue like your screenshot */
.glass-nav{
  background: linear-gradient(180deg, var(--bar), var(--bar2)) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.12) !important;
}

.navbar-dark .navbar-brand,
.navbar-dark .nav-link{
  color:#fff !important;
}

.brand-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:34px !important;
  height:34px !important;
  border-radius:12px !important;
  background:#ffffff !important;
  color:#1b5f96 !important;
  font-weight:900 !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.12) !important;
}

/* Cards */
.hero-card,
.glass-card,
.mock-card,
.step-card,
.price-card{
  background: rgba(255,255,255,.92) !important;
  border: 1px solid var(--stroke) !important;
  box-shadow: var(--shadow) !important;
}

/* Text */
.text-muted{ color: var(--muted) !important; }

/* Pill */
.pill{
  border: 1px solid rgba(43,121,211,.20) !important;
  background: rgba(43,121,211,.08) !important;
  color:#1b5f96 !important;
}

/* Buttons */
.btn-brand{
  background: linear-gradient(135deg, var(--primary), var(--primary2)) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow: 0 12px 22px rgba(43,121,211,.20) !important;
}
.btn-soft{
  background:#fff !important;
  border:1px solid rgba(43,121,211,.24) !important;
  color:#1b5f96 !important;
}
.btn-outline-light{
  border: 1px solid rgba(14,43,74,.18) !important;
  color: #0e2b4a !important;
  background: rgba(255,255,255,.92) !important;
}

/* PWA Popup (لو عندك نفس IDs) */
.pwa-modal{ position:fixed !important; inset:0 !important; z-index:9999 !important; }
.pwa-backdrop{ position:absolute !important; inset:0 !important; background: rgba(0,0,0,.15) !important; }
.pwa-sheet{
  position:absolute !important;
  left:50% !important;
  top:130px !important;
  transform: translateX(-50%) !important;
  width: min(420px, calc(100% - 22px)) !important;
  border-radius:18px !important;
  padding:14px 14px 16px !important;
  background: rgba(255,255,255,.96) !important;
  border:1px solid var(--stroke) !important;
  box-shadow: var(--shadow) !important;
}

.ads-strip{
  padding: 14px 0 8px;
  background: transparent;
}

.ads-carousel{
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
  background: rgba(255,255,255,.75);
}

.ads-link{
  position: relative;
  display:block;
  text-decoration:none;
}

.ads-img{
  height: 160px;
  object-fit: cover;
  filter: saturate(1.05) contrast(1.02);
}

@media (min-width: 768px){
  .ads-img{ height: 210px; }
}

.ads-caption{
  position:absolute;
  inset: auto 12px 12px 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(0,0,0,.08);
  backdrop-filter: blur(6px);
}

.ads-title{
  font-weight: 900;
  color: #0e2b4a;
  font-size: 16px;
  line-height: 1.3;
}

.ads-sub{
  margin-top: 4px;
  color: #4c6a86;
  font-size: 13px;
  line-height: 1.4;
}

.carousel-indicators{
  margin-bottom: 8px;
}
.carousel-indicators [data-bs-target]{
  width: 8px; height: 8px; border-radius: 999px;
}

/* ✅ PWA Popup style */
.pwa-modal{
  position: fixed;
  inset: 0;
  z-index: 99999;
}
.pwa-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.18);
}
.pwa-card{
  position: absolute;
  left: 50%;
  top: 110px;
  transform: translateX(-50%);
  width: min(420px, calc(100% - 22px));
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,.14);
  padding: 14px 14px 16px;
}
.pwa-x{
  position:absolute;
  top:8px;
  left:10px;
  width:34px;height:34px;
  border-radius: 10px;
  border:0;
  background: rgba(111,166,222,.18);
  color:#1b4e7c;
  font-size:22px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pwa-center{ text-align:center; }
.pwa-logo-wrap{
  width:86px;height:86px;
  margin: 6px auto 8px;
  border-radius: 18px;
  background:#fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 8px 20px rgba(0,0,0,.10);
  display:flex;
  align-items:center;
  justify-content:center;
}
.pwa-logo{
  width:64px;height:64px;
  object-fit: contain;
}
.pwa-title{
  margin: 6px 0 4px;
  font-weight: 900;
  color: #2b6ea6;
  font-size: 20px;
}
.pwa-sub{
  margin: 0;
  color: #4c6a86;
  font-size: 14px;
}