/* ============================================================
   Site-wide dark theme
   Loaded after main.css (via include/headlinks.php).
   page  #202020 (matches the logo bar in header.php)
   panel #111111   text #d6d6d6 / headings #f4f4f4   brand #f6214b
   Uses !important in places because several pages carry inline
   colour styles (color:#000000, background:#fff) that would
   otherwise stay light.
   ============================================================ */

/* ---------- Base ---------- */
body {
  background: #202020;
  color: #d6d6d6;
}

hr { border-top-color: #333333 !important; }

/* Everything in the main content column reads light on the dark ground,
   regardless of inline colours. */
.offer-area, .offer-area p, .offer-area li, .offer-area span, .offer-area div,
.offer-area td, .offer-area em, .offer-area small, .offer-area blockquote,
.generic-banner, .generic-banner p, .generic-banner span,
.single-definition, .single-definition *,
.single-definition-red, .single-definition-red *,
.price-offer, .price-offer *,
.single-price, .single-price * {
  color: #d6d6d6 !important;
}

/* Headings + bold emphasis a touch brighter */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
.offer-area h1, .offer-area h2, .offer-area h3, .offer-area h4, .offer-area h5, .offer-area h6,
.offer-area strong, .offer-area b,
.single-definition h1, .single-definition h2, .single-definition h3, .single-definition h4, .single-definition h5,
.single-definition-red h1, .single-definition-red h2, .single-definition-red h3, .single-definition-red h4, .single-definition-red h5,
.single-definition strong, .single-definition b,
.single-definition-red strong, .single-definition-red b,
.title h1, .title h2, .title h3 {
  color: #f4f4f4 !important;
}
.title p { color: #cfcfcf !important; }

/* Links */
a { color: #ff6b81; }
a:hover, a:focus { color: #ffffff; }
.offer-area a, .single-definition a, .single-definition-red a,
.footer-area a { color: #ff6b81 !important; }
.offer-area a:hover, .footer-area a:hover { color: #ffffff !important; }

/* Buttons keep white text on their coloured fills */
.primary-btn, .primary-btn *,
.genric-btn, .genric-btn *,
.price-btn, .price-btn *,
.price-offer .price-btn, .single-price .price-btn,
a.primary-btn, a.primary-btn * {
  color: #ffffff !important;
}
/* ...except the white "outline" secondary CTAs (inline background-color:#fff) */
.primary-btn[style*="#fff"],
.primary-btn[style*="#fff"] * {
  background-color: transparent !important;
  color: #ff6b81 !important;
  border-color: #f6214b !important;
}

/* Section separators */
.section-top-border { border-top-color: #333333; }

/* ---------- Header / navigation ---------- */
#header { background-color: #202020; }
#header hr { border-color: #333333; }
.header-top span { color: #ffffff; }
.nav-menu a { color: #e8e8e8; }
.nav-menu > .menu-active > a,
.nav-menu li:hover > a { color: #f6214b; }
.nav-menu ul { background: #1a1a1a; }
.nav-menu ul li a { color: #dddddd; }
.nav-menu ul li:hover > a { color: #f6214b; }

/* ---------- White content panels -> matte black with red under-glow ---------- */
.single-definition,
.single-definition-red,
.price-offer,
.single-price,
.button-area,
.single-price .top-sec, .single-price .bottom-sec, .single-price .end-sec,
.price-offer .top-sec, .price-offer .bottom-sec, .price-offer .end-sec {
  background-color: #111111;
}
.single-definition,
.single-definition-red,
.price-offer,
.single-price {
  border: none;
  box-shadow: none;
  position: relative;
}
.single-definition::after,
.single-definition-red::after,
.price-offer::after,
.single-price::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -10px;
  height: 22px;
  background: rgba(246, 33, 75, 0.5);
  filter: blur(16px);
  pointer-events: none;
}
.single-price .top-sec, .single-price .bottom-sec,
.price-offer .top-sec, .price-offer .bottom-sec {
  border-bottom-color: #2a2a2a;
}
.price-offer .price-btn, .single-price .price-btn { background: #f6214b; }

/* ---------- Forms ---------- */
.form-control,
input.form-control, textarea.form-control,
.navbar-form .form-control,
.single-footer-widget .navbar-form .form-control,
.convert-wrap .form-control {
  background-color: #1b1b1b;
  border-color: #333333;
  color: #eeeeee;
}
.form-control::placeholder { color: #8a8a8a; }
.form-control:focus { border-color: #f6214b; background-color: #1f1f1f; color: #ffffff; }
.nice-select { background-color: #1b1b1b; color: #eeeeee; border-color: #333333; }
.nice-select .list { background-color: #1b1b1b; }
.nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus { background-color: #2a2a2a; }

/* ---------- Partner-logo strip (black artwork -> keep on a light band) ---------- */
#brand-logos { background-color: #ffffff; padding-top: 30px; padding-bottom: 30px; }

/* ---------- Third-party reviews widget (cross-origin iframe, black text) ----------
   Keep it on a light panel until the widget itself is set to dark in Shapo. */
.offer-area .reviews-panel { background: #f2f2f2 !important; }
.offer-area .reviews-panel h2,
.offer-area .reviews-panel h3 { color: #111111 !important; }

/* ---------- Footer ---------- */
.footer-area { background-color: #1a1a1a; }
.footer-area h4 { color: #f4f4f4 !important; }
.footer-area p, .footer-area .single-footer-widget p,
.footer-area .footer-bottom, .footer-area .footer-bottom p { color: #cfcfcf !important; }
.footer-area .footer-bottom .footer-social a { background: #2a2a2a; }