:root {
  --primary: #1d4f86 !important;
  --primary-dark: #163d69 !important;
  --yd-navy: #1d4f86;
  --yd-navy-dark: #163d69;
  --yd-sky: #cfe0f5;
  --yd-sky-2: #b7d0ef;
  --yd-sky-line: #a9c5ea;
  --yd-bg: #f3f7fc;
  --yd-text: #13294b;
}
html:not([data-theme="dark"]) { --bg: var(--yd-bg); }
html:not([data-theme="dark"]) body { background: var(--yd-bg); color: var(--yd-text); }

/* Navbar */
.navbar.sticky-top { background: #fff !important; border-bottom: 1px solid #e3ebf5 !important; box-shadow: 0 2px 14px rgba(29,79,134,.06); }
.navbar-brand, .navbar-brand.text-success { color: var(--yd-navy) !important; font-weight: 800; letter-spacing: -.5px; font-size: 1.5rem; }
.navbar .nav-link { color: #2a3f5f !important; font-weight: 500; }
.navbar .nav-link:hover { color: var(--yd-navy) !important; }
.navbar .btn-success { background: var(--yd-navy) !important; border-color: var(--yd-navy) !important; border-radius: 8px; font-weight: 600; }
.navbar .btn-outline-secondary { background: var(--yd-sky); border-color: var(--yd-sky-line); color: var(--yd-navy-dark); border-radius: 8px; }
.navbar .btn-outline-secondary:hover { background: var(--yd-sky-2); border-color: var(--yd-sky-line); color: var(--yd-navy-dark); }
.navbar .btn-group .btn { border-radius: 6px !important; margin: 0 1px; }
@media (max-width: 991.98px) {
  .navbar > .container { position: relative; justify-content: center; min-height: 48px; }
  .navbar-toggler { position: absolute; left: 12px; top: 8px; border: none; box-shadow: none !important; padding: 6px; }
  .navbar-brand { margin: 0 auto; }
}

/* Hero */
.hero {
  position: relative;
  color: #fff;
  padding: 44px 0 10px !important;
  margin-bottom: 18px !important;
  background:
    radial-gradient(ellipse at 85% 10%, rgba(255,255,255,.35), transparent 45%) top / 100% 250px no-repeat,
    linear-gradient(115deg, #17406e 0%, #2c66a8 45%, #8fb6e6 100%) top / 100% 250px no-repeat,
    var(--yd-bg) !important;
}
html[data-theme="dark"] .hero { background-color: var(--bg) !important; }
.hero h1 { font-weight: 600 !important; font-size: clamp(1.6rem, 3.2vw, 2.4rem); letter-spacing: -.3px; text-shadow: 0 2px 12px rgba(0,0,0,.15); }

/* Search box */
.search-box {
  background: rgba(207,224,245,.92) !important;
  border: 1px solid var(--yd-sky-line);
  border-radius: 16px !important;
  padding: 14px !important;
  box-shadow: 0 12px 32px rgba(23,64,110,.18) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.search-box .form-select, .search-box .form-control {
  background-color: #fff; border: 1px solid #c6d8ef; border-radius: 10px; height: 42px; color: var(--yd-text);
}
.search-box .form-select:focus, .search-box .form-control:focus { border-color: var(--yd-navy); box-shadow: 0 0 0 3px rgba(29,79,134,.15); }
.search-box [data-bs-target="#idxAdvModal"] { border: 1px solid #c6d8ef !important; border-radius: 10px !important; height: 42px !important; color: var(--yd-navy-dark) !important; }
.search-box .btn-success { background: var(--yd-navy) !important; border-color: var(--yd-navy) !important; border-radius: 10px; height: 42px; padding: 0 18px; font-weight: 600; }
.search-box .btn-success:hover { background: var(--yd-navy-dark) !important; }
@media (max-width: 767.98px) {
  .hero { padding-top: 30px !important; background-size: 100% 210px, 100% 210px, auto !important; }
  .search-box { gap: 8px !important; }
  .search-box > select,
  .search-box > input,
  .search-box > span,
  .search-box > button { width: calc(50% - 4px) !important; flex: 0 0 calc(50% - 4px) !important; }
  .search-box > span > select { width: 100% !important; }
  .search-box > button { justify-content: center; }
}

/* Category tiles */
.hero-cats { margin-top: 22px !important; gap: 10px !important; }
.hcat {
  background: var(--yd-sky) !important;
  border: 1px solid var(--yd-sky-line) !important;
  color: var(--yd-navy-dark) !important;
  border-radius: 12px !important;
  padding: 14px 8px !important;
  font-size: 12px !important;
  box-shadow: 0 4px 12px rgba(29,79,134,.08);
}
.hcat-icon { background: transparent !important; color: var(--yd-navy); font-size: 24px !important; }
.hcat:first-child, .hcat:hover { background: var(--yd-navy) !important; border-color: var(--yd-navy) !important; color: #fff !important; }
.hcat:first-child .hcat-icon, .hcat:hover .hcat-icon { color: #fff; background: transparent !important; }
html[data-theme="dark"] .hcat:not(:first-child):not(:hover) { background: #22324a !important; border-color: #2f4566 !important; color: #cfe0f5 !important; }

/* Section titles */
.container > .d-flex h2.h4, h2.h4 { color: var(--yd-navy-dark); font-weight: 700; }
html[data-theme="dark"] h2.h4 { color: #cfe0f5; }

/* Listing cards */
.listing-card,
.listing-card.premium,
.listing-card.vip,
.listing-card.promote {
  border: 1px solid #e1e9f4 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(23,64,110,.08) !important;
}
.listing-card:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(23,64,110,.16) !important; }
.listing-card.premium { box-shadow: 0 0 0 2px rgba(29,79,134,.35), 0 6px 18px rgba(23,64,110,.12) !important; }
.listing-card .img-wrap { margin: 8px 8px 0; border-radius: 10px; }
.listing-card .img-wrap .badge-deal {
  background: rgba(255,255,255,.92) !important; color: var(--yd-navy-dark) !important;
  border-radius: 999px !important; font-weight: 700; font-size: 11px !important; padding: 4px 11px !important;
}
.listing-card .img-wrap .badge-premium {
  background: var(--yd-navy) !important; color: #fff !important;
  border-radius: 999px !important; box-shadow: 0 2px 8px rgba(29,79,134,.4) !important;
}
.listing-card .img-wrap .badge-vip { border-radius: 999px !important; }
.listing-card .img-wrap .badge-promote { border-radius: 999px !important; }
.listing-card .img-wrap .fav-btn { box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.lc-price { color: var(--yd-text) !important; font-size: 18px !important; }
.lc-title { color: #4b5d78 !important; }
.sp { background: #eef4fb !important; border-color: #dbe7f5 !important; color: #3d5577 !important; }
.lc-loc i { color: var(--yd-navy) !important; }
html[data-theme="dark"] .lc-price { color: #e8eef7 !important; }
html[data-theme="dark"] .lc-title { color: #a9b6c9 !important; }

/* FAQ */
.seo-faq-item { border-color: #dbe7f5 !important; border-radius: 14px !important; box-shadow: 0 2px 10px rgba(23,64,110,.05); }
.seo-faq-item summary::after { color: var(--yd-navy) !important; }

/* Mobile bottom nav */
.mobile-bottom-nav { border-top: 1px solid #e3ebf5 !important; box-shadow: 0 -4px 18px rgba(23,64,110,.08) !important; }
.mobile-bottom-nav a.active { color: var(--yd-navy) !important; }
.mobile-bottom-nav a.add-btn .icon-circle {
  background: var(--yd-navy) !important; color: #fff !important;
  box-shadow: 0 6px 16px rgba(29,79,134,.4) !important;
}

/* Generic accents */
.btn-success { background-color: var(--yd-navy) !important; border-color: var(--yd-navy) !important; }
.btn-success:hover { background-color: var(--yd-navy-dark) !important; border-color: var(--yd-navy-dark) !important; }
.btn-outline-success { color: var(--yd-navy) !important; border-color: var(--yd-navy) !important; }
.btn-outline-success:hover { background: var(--yd-navy) !important; color: #fff !important; }
.text-success { color: var(--yd-navy) !important; }
.form-check-input:checked { background-color: var(--yd-navy); border-color: var(--yd-navy); }

/* Hero desktop */
@media (min-width: 992px) {
  .hero {
    padding: 56px 0 44px !important;
    margin-bottom: 26px !important;
    background:
      linear-gradient(90deg, rgba(8,24,60,.82) 0%, rgba(10,32,78,.55) 38%, rgba(10,32,78,.15) 70%, rgba(10,32,78,0) 100%),
      linear-gradient(180deg, rgba(8,24,60,0) 55%, rgba(8,24,60,.55) 100%),
      url("../img/hero-baku.jpg") center 62% / cover no-repeat !important;
  }
  .hero h1 {
    font-size: 2.6rem !important;
    font-weight: 800 !important;
    letter-spacing: -.5px;
    margin-bottom: 6px !important;
    text-shadow: 0 2px 16px rgba(0,0,0,.35);
  }
  .hero h1 .hero-accent { color: #ffc72c; text-transform: capitalize; }
  .hero-sub { font-size: 1.15rem; color: rgba(255,255,255,.92); margin: 0 0 6px; text-shadow: 0 1px 8px rgba(0,0,0,.3); }
  .hero h1 + .hero-sub + a { font-size: .9rem; margin-bottom: 22px !important; }

  .hero-tabs {
    display: inline-flex;
    gap: 6px;
    background: #fff;
    padding: 10px 12px 0;
    border-radius: 14px 14px 0 0;
    position: relative;
    z-index: 2;
  }
  .hero-tab {
    border: none;
    background: transparent;
    color: #1f2a44;
    font-weight: 700;
    font-size: 14px;
    padding: 9px 30px;
    border-radius: 10px;
    margin-bottom: 8px;
    transition: background .15s, color .15s;
  }
  .hero-tab:hover { background: #eef3fb; }
  .hero-tab.active { background: #1a73e8; color: #fff; box-shadow: 0 4px 12px rgba(26,115,232,.35); }

  .hero .search-box {
    background: #fff !important;
    border: none !important;
    border-radius: 0 16px 16px 16px !important;
    padding: 14px !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: 0 18px 40px rgba(5,20,50,.35) !important;
  }
  .hero .search-box > select[name="deal_type"] { display: none !important; }
  .hero .search-box > select,
  .hero .search-box > span > select,
  .hero .search-box > input {
    height: 50px !important;
    border: 1px solid #dfe5ee !important;
    border-radius: 10px !important;
    font-size: 14px;
    color: #1f2a44;
  }
  .hero .search-box > select[name="category_id"],
  .hero .search-box > select[name="city_id"] {
    flex: 1 1 200px !important;
    width: auto !important;
    padding-left: 44px !important;
    background-repeat: no-repeat, no-repeat !important;
    background-position: 14px center, right .85rem center !important;
    background-size: 20px 20px, 16px 12px !important;
  }
  .hero .search-box > select[name="category_id"] {
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a73e8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='1.5'/%3E%3Cpath d='M8 7h2M14 7h2M8 11h2M14 11h2M8 15h2M14 15h2M10 21v-3h4v3'/%3E%3C/svg%3E"),
      var(--bs-form-select-bg-img) !important;
  }
  .hero .search-box > select[name="city_id"] {
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8541a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-7-6.2-7-11.5A7 7 0 0 1 19 9.5C19 14.8 12 21 12 21z'/%3E%3Ccircle cx='12' cy='9.5' r='2.5'/%3E%3C/svg%3E"),
      var(--bs-form-select-bg-img) !important;
  }
  .hero .search-box > span { flex: 1 1 160px !important; width: auto !important; }
  .hero .search-box > span > select { width: 100% !important; }
  .hero .search-box > input[name="min_price"],
  .hero .search-box > input[name="max_price"] { flex: 0 1 140px !important; width: auto !important; padding-left: 14px; }
  .hero .search-box > input[name="min_price"] { margin-right: -10px; border-radius: 10px 0 0 10px !important; }
  .hero .search-box > input[name="max_price"] { border-radius: 0 10px 10px 0 !important; }
  .hero .search-box [data-bs-target="#idxAdvModal"] {
    flex: 0 1 170px !important;
    height: 50px !important;
    background: #f3f6fa !important;
    border: 1px solid #e3e9f1 !important;
    border-radius: 10px !important;
    color: #1f2a44 !important;
    font-weight: 600 !important;
    justify-content: flex-start;
    padding: 0 16px !important;
  }
  .hero .search-box [data-bs-target="#idxAdvModal"]::after {
    content: "";
    margin-left: auto;
    width: 12px; height: 12px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  .hero .search-box > button[type="submit"] {
    flex: 0 0 180px !important;
    height: 50px !important;
    background: #f97316 !important;
    border-color: #f97316 !important;
    border-radius: 10px !important;
    font-size: 16px;
    font-weight: 700;
    box-shadow: 0 6px 16px rgba(249,115,22,.35);
  }
  .hero .search-box > button[type="submit"]:hover { background: #ea580c !important; border-color: #ea580c !important; }

  .hero .hero-cats { margin-top: 24px !important; }
  .hero .hcat:not(:first-child):not(:hover) {
    background: rgba(255,255,255,.14) !important;
    border-color: rgba(255,255,255,.28) !important;
    color: #fff !important;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    box-shadow: none;
  }
  .hero .hcat:not(:first-child):not(:hover) .hcat-icon { color: #fff; }
  .hero .hcat:first-child, .hero .hcat:hover { background: #1a73e8 !important; border-color: #1a73e8 !important; }
}