/**
 * Greek Beach Theme — Wedding
 * ─────────────────────────────────────────────────────────────────────────────
 * Loaded after style.css on every page.
 * Palette:
 *   Sky blue   #66b5eb  — accents, buttons, borders, interactive
 *   Deep sea   #0d3d5e  — overlays, sticky nav background
 *   Mid blue   #1a5c87  — headings, section titles
 *   Seafoam    #f0f7fd  — light section / preloader background
 * ─────────────────────────────────────────────────────────────────────────────
 */

/* ── Text selection ─────────────────────────────────────────────────────── */
::selection {
  background-color: #66b5eb;
  color: #fff;
}
::-moz-selection {
  background-color: #66b5eb;
  color: #fff;
}

/* ── Preloader ───────────────────────────────────────────────────────────── */
#preloader {
  background: #f0f7fd;
  color: #1a5c87;
}
/* Heart draw animation — sky blue stroke (style.css already carries this
   after the global colour swap, but re-stated here for clarity) */
.loading-heart {
  color: #1a5c87; /* name text inherits this via currentColor */
}

/* ── Sticky navigation ───────────────────────────────────────────────────── */
/* Deep-sea navy when scrolled — applies to all pages.
   index.html overrides this to transparent in its own <style>. */
.nav-section.light.sticky {
  background: rgba(13, 61, 94, 0.96) !important; /* #0d3d5e at 96% */
  box-shadow: 0 2px 12px rgba(13, 61, 94, 0.25) !important;
}

/* Nav links — white on dark sticky background */
.nav-section.light.sticky .navbar .nav a,
.nav-section.light.sticky .navbar .nav li > a {
  color: rgba(255, 255, 255, 0.88) !important;
}
.nav-section.light.sticky .navbar .nav a:hover,
.nav-section.light.sticky .navbar .nav li > a:hover {
  color: #fff !important;
}
.nav-section.light.sticky .navbar .nav a.active,
.nav-section.light.sticky .navbar .nav li.active > a,
.nav-section.light.sticky .navbar .nav li.active > a:focus {
  color: #66b5eb !important;
}

/* Logo text colour in sticky state */
.nav-section.light.sticky .nav-logo a,
.nav-section.light.sticky .logo-name {
  color: #fff !important;
}

/* Dropdown menus */
.nav-section.light.sticky .dropdown-menu {
  background: rgba(13, 61, 94, 0.97);
  border-color: rgba(102, 181, 235, 0.3);
}
.nav-section.light.sticky .dropdown-menu li > a {
  color: rgba(255, 255, 255, 0.85) !important;
}
.nav-section.light.sticky .dropdown-menu li > a:hover {
  background: rgba(102, 181, 235, 0.15);
  color: #fff !important;
}

/* ── Active nav link (non-sticky / light hero state) ─────────────────────── */
/* Only top-level menu items should turn white over the transparent hero.
   Dropdown-menu active links sit on a white panel and must stay blue. */
.nav-section.light .navbar .nav > li > a.active,
.nav-section.light .navbar .nav > li.active > a {
  color: #fff;
}

.nav-section.light .navbar .dropdown-menu > li > a.active,
.nav-section.light .navbar .dropdown-menu > li > a:hover,
.nav-section.light .navbar .dropdown-menu > li > a:focus {
  color: #66b5eb;
  background-color: #fff;
}

/* Fix contrast on Your Stay dropdown hover state */
.nav-section.light .navbar .dropdown-menu > li > a:hover,
.nav-section.light .navbar .dropdown-menu > li > a:focus,
.nav-section.light.sticky .navbar .dropdown-menu > li > a:hover,
.nav-section.light.sticky .navbar .dropdown-menu > li > a:focus {
  color: #66b5eb !important;
  background-color: #fff !important;
}

/* ── Section headings — Mediterranean blue ───────────────────────────────── */
h2.section-title,
.section-title {
  color: #1a5c87;
}

/* ── Horizontal rules & dividers ─────────────────────────────────────────── */
hr.colored,
.neela-divider,
.divider-heart .line {
  border-color: #66b5eb;
  background-color: #66b5eb;
}

/* ── bg-color sections (footer, dark bands) ──────────────────────────────── */
/* After the global color swap, .bg-color is already #66b5eb (sky blue).
   Give footers a deeper feel with the dark navy so text is always readable. */
footer.bg-color,
#footer-onepage.bg-color {
  background-color: #0d3d5e;
}

/* ── Buttons — ensure the decorative corner lines match the new colour ────── */
.btn.btn-primary,
.btn.btn-primary:link,
.btn.btn-primary:visited {
  color: #66b5eb;
  border-color: #66b5eb;
}
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-primary:active {
  color: #fff;
  background-color: #66b5eb;
  border-color: #66b5eb;
}

/* ── Form focus rings ────────────────────────────────────────────────────── */
.form-control:focus {
  border-color: #66b5eb;
  box-shadow: 0 0 0 0.2rem rgba(102, 181, 235, 0.25);
}
.form-check-input:checked {
  background-color: #66b5eb;
  border-color: #66b5eb;
}
.form-check-input:focus {
  border-color: #66b5eb;
  box-shadow: 0 0 0 0.2rem rgba(102, 181, 235, 0.25);
}

/* ── Blockquotes ─────────────────────────────────────────────────────────── */
blockquote.neela-quote {
  border-left-color: #66b5eb;
  color: #3d7faa;
}

/* ── Timeline dots / connector ───────────────────────────────────────────── */
.timeline-item .date-circle,
.timeline .circle {
  border-color: #66b5eb;
  color: #1a5c87;
}

/* ── Owl carousel dots ───────────────────────────────────────────────────── */
.owl-dot.active span,
.owl-dot:hover span {
  background: #66b5eb !important;
}

/* ── Scroll-to-top button ────────────────────────────────────────────────── */
#scrolltop {
  background: #0d3d5e;
}
#scrolltop:hover {
  background: #66b5eb;
}

/* ── Alert / form success ────────────────────────────────────────────────── */
.alert-success {
  border-color: #66b5eb;
}
