/* ===========================================================================
   RishtaSetu — custom theme over Bootstrap 5
   Palette: maroon #8C1D40 · gold #D4AF37 · ivory #FFF8F0 · charcoal #1F2933
            teal #0E7C7B (success/active)
   Fonts:  Poppins (display/headings) · Inter (body)
   =========================================================================== */
:root {
  --rs-maroon: #8C1D40;
  --rs-maroon-dark: #6d1531;
  --rs-gold: #D4AF37;
  --rs-gold-soft: #efdcaa;
  --rs-ivory: #FFF8F0;
  --rs-ivory-2: #fdf2e6;
  --rs-charcoal: #1F2933;
  --rs-teal: #0E7C7B;
  --rs-muted: #6b7280;
  --rs-line: #efe4d8;
  --rs-card-shadow: 0 10px 30px rgba(31, 41, 51, .08);
  --rs-card-shadow-hover: 0 16px 40px rgba(140, 29, 64, .16);
  --bs-primary: #8C1D40;
}

* { -webkit-font-smoothing: antialiased; }

body {
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  color: var(--rs-charcoal);
  background: var(--rs-ivory);
  background-image:
    radial-gradient(1200px 400px at 100% -10%, rgba(212,175,55,.10), transparent 60%),
    radial-gradient(900px 360px at -10% 0%, rgba(140,29,64,.06), transparent 55%);
  min-height: 100vh;
}

h1, h2, h3, h4, h5, .display-font, .navbar-brand {
  font-family: "Poppins", "Inter", sans-serif;
  font-weight: 600;
  letter-spacing: -.01em;
  color: var(--rs-charcoal);
}

a { color: var(--rs-maroon); text-decoration: none; }
a:hover { color: var(--rs-maroon-dark); }
.text-maroon { color: var(--rs-maroon) !important; }
.text-charcoal { color: var(--rs-charcoal) !important; }
.text-gold { color: var(--rs-gold) !important; }
.text-teal { color: var(--rs-teal) !important; }
.text-muted-2 { color: var(--rs-muted) !important; }
.bg-ivory { background: var(--rs-ivory) !important; }

/* ---- Brand mark ---------------------------------------------------------- */
.brand-logo { display: inline-flex; align-items: center; gap: .55rem; }
.brand-logo svg { width: 34px; height: 34px; flex: 0 0 auto; }
.brand-logo .brand-name {
  font-family: "Poppins", sans-serif; font-weight: 700; font-size: 1.3rem;
  color: var(--rs-maroon); line-height: 1;
}
.brand-logo .brand-name b { color: var(--rs-gold); font-weight: 700; }

/* ---- Buttons ------------------------------------------------------------- */
.btn { border-radius: 10px; font-weight: 500; padding: .55rem 1.15rem; }
.btn-lg { padding: .8rem 1.6rem; border-radius: 12px; }
.btn-maroon, .btn-primary {
  background: linear-gradient(135deg, var(--rs-maroon), var(--rs-maroon-dark));
  border: none; color: #fff;
  box-shadow: 0 6px 18px rgba(140,29,64,.28);
}
.btn-maroon:hover, .btn-primary:hover { color: #fff; filter: brightness(1.06); transform: translateY(-1px); }
.btn-gold {
  background: linear-gradient(135deg, #e7c75a, var(--rs-gold));
  border: none; color: #4a3a06; font-weight: 600;
  box-shadow: 0 6px 18px rgba(212,175,55,.32);
}
.btn-gold:hover { color: #4a3a06; filter: brightness(1.05); transform: translateY(-1px); }
.btn-outline-maroon { border: 1.5px solid var(--rs-maroon); color: var(--rs-maroon); background: #fff; }
.btn-outline-maroon:hover { background: var(--rs-maroon); color: #fff; }
.btn-teal { background: var(--rs-teal); border: none; color: #fff; }
.btn-teal:hover { background: #0a6463; color: #fff; }

/* ---- Cards --------------------------------------------------------------- */
.card {
  border: 1px solid var(--rs-line);
  border-radius: 18px;
  box-shadow: var(--rs-card-shadow);
  background: #fff;
}
.card-soft { border-radius: 18px; border: 1px solid var(--rs-line); box-shadow: var(--rs-card-shadow); }

/* Profile card (match feed) */
.profile-card { overflow: hidden; transition: transform .18s ease, box-shadow .18s ease; }
.profile-card:hover { transform: translateY(-4px); box-shadow: var(--rs-card-shadow-hover); }
.profile-card .photo-wrap {
  position: relative; aspect-ratio: 4 / 3; background: var(--rs-ivory-2);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.profile-card .photo-wrap img { width: 100%; height: 100%; object-fit: cover; }
.profile-card .photo-locked {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  color: var(--rs-muted); gap: .4rem; font-size: .85rem;
}
.profile-card .name-row { font-family: "Poppins", sans-serif; font-weight: 600; }

/* Match score chip */
.match-chip {
  position: absolute; top: 10px; right: 10px;
  background: rgba(255,255,255,.94); border: 1px solid var(--rs-line);
  border-radius: 999px; padding: .2rem .6rem; font-weight: 700; font-size: .8rem;
  color: var(--rs-maroon); box-shadow: 0 4px 12px rgba(0,0,0,.08);
}
.match-chip .dot { color: var(--rs-teal); }

.guna-chip {
  display: inline-flex; align-items: center; gap: .35rem;
  background: var(--rs-ivory-2); border: 1px solid var(--rs-gold);
  color: #7a5c0a; border-radius: 999px; padding: .15rem .55rem; font-size: .78rem; font-weight: 600;
}

/* Verified badge */
.verified-badge {
  display: inline-flex; align-items: center; gap: .25rem;
  color: var(--rs-teal); font-weight: 600; font-size: .8rem;
}
.badge-soft { background: var(--rs-ivory-2); color: var(--rs-maroon); border: 1px solid var(--rs-line); font-weight: 600; }

/* ---- Navbar -------------------------------------------------------------- */
.navbar.rs-nav {
  background: rgba(255,248,240,.86); backdrop-filter: saturate(160%) blur(10px);
  border-bottom: 1px solid var(--rs-line);
}
.rs-nav .nav-link { color: var(--rs-charcoal); font-weight: 500; border-radius: 8px; padding: .4rem .7rem; }
.rs-nav .nav-link:hover, .rs-nav .nav-link.active { color: var(--rs-maroon); background: rgba(140,29,64,.06); }
.bell-wrap { position: relative; }
.bell-wrap .badge {
  position: absolute; top: -4px; right: -6px; font-size: .62rem; padding: .2em .4em;
  background: var(--rs-maroon);
}

/* ---- Hero ---------------------------------------------------------------- */
.hero {
  background:
    linear-gradient(135deg, rgba(140,29,64,.92), rgba(109,21,49,.92)),
    radial-gradient(circle at 80% 20%, rgba(212,175,55,.4), transparent 45%);
  color: #fff; border-radius: 26px; overflow: hidden; position: relative;
}
.hero h1 { color: #fff; font-size: clamp(1.9rem, 4vw, 3.1rem); }
.hero .lead { color: rgba(255,255,255,.9); }
.hero .stat b { font-family: "Poppins", sans-serif; font-size: 1.6rem; color: var(--rs-gold); display:block; }
.hero .stat span { font-size: .82rem; color: rgba(255,255,255,.82); }

/* ---- Paywall ------------------------------------------------------------- */
.paywall-card { border: 1px solid var(--rs-gold); border-radius: 22px; overflow: hidden; }
.paywall-price { font-family: "Poppins", sans-serif; font-size: 3rem; font-weight: 700; color: var(--rs-maroon); }
.unlock-list li { padding: .35rem 0; display: flex; gap: .6rem; align-items: flex-start; }
.unlock-list .tick { color: var(--rs-teal); flex: 0 0 auto; margin-top: .15rem; }
.trust-row { display:flex; gap: 1rem; flex-wrap: wrap; color: var(--rs-muted); font-size: .85rem; }

/* ---- Forms --------------------------------------------------------------- */
.form-control, .form-select {
  border-radius: 10px; border: 1px solid #e3d8cb; padding: .6rem .8rem; background:#fff;
}
.form-control:focus, .form-select:focus {
  border-color: var(--rs-maroon); box-shadow: 0 0 0 .2rem rgba(140,29,64,.12);
}
.form-label { font-weight: 500; font-size: .9rem; color: #44515c; }
.auth-card { max-width: 460px; margin: 0 auto; }
.completeness .progress { height: 10px; border-radius: 999px; background: var(--rs-ivory-2); }
.completeness .progress-bar { background: linear-gradient(90deg, var(--rs-gold), var(--rs-maroon)); }

/* ---- Chat ---------------------------------------------------------------- */
.chat-shell { height: 70vh; min-height: 460px; }
.chat-list-pane { border-right: 1px solid var(--rs-line); overflow-y: auto; }
.chat-item { padding: .8rem 1rem; border-bottom: 1px solid var(--rs-line); cursor: pointer; display:flex; gap:.7rem; }
.chat-item:hover, .chat-item.active { background: var(--rs-ivory-2); }
.chat-item .avatar, .avatar {
  width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: 0 0 auto;
  background: var(--rs-ivory-2); display:flex; align-items:center; justify-content:center;
  color: var(--rs-maroon); font-weight:600;
}
.chat-thread { display:flex; flex-direction: column; height: 100%; }
.chat-messages { flex: 1; overflow-y: auto; padding: 1rem; background: var(--rs-ivory); }
.msg { max-width: 72%; padding: .55rem .8rem; border-radius: 14px; margin-bottom: .5rem; font-size: .92rem; line-height: 1.35; }
.msg.them { background: #fff; border: 1px solid var(--rs-line); border-bottom-left-radius: 4px; align-self: flex-start; }
.msg.me { background: linear-gradient(135deg, var(--rs-maroon), var(--rs-maroon-dark)); color: #fff; border-bottom-right-radius: 4px; align-self: flex-end; }
.msg .meta { font-size: .68rem; opacity: .7; margin-top: .2rem; }
.typing-ind { font-size: .8rem; color: var(--rs-muted); height: 1.1rem; padding: 0 1rem; }
.chat-input { border-top: 1px solid var(--rs-line); padding: .6rem; background:#fff; }

/* ---- Misc ---------------------------------------------------------------- */
.section-title { position: relative; display:inline-block; }
.section-title::after { content:""; display:block; width: 48px; height: 3px; border-radius: 3px; background: var(--rs-gold); margin-top: .4rem; }
.footer { background: var(--rs-charcoal); color: #cfd6dd; }
.footer a { color: #e7d9c4; }
.footer a:hover { color: var(--rs-gold); }
.empty-state { text-align:center; padding: 3rem 1rem; color: var(--rs-muted); }
.empty-state svg { opacity: .5; margin-bottom: .6rem; }
.kv { display:flex; justify-content: space-between; padding: .45rem 0; border-bottom: 1px dashed var(--rs-line); }
.kv .k { color: var(--rs-muted); }
.kv .v { font-weight: 500; text-align:right; }
.reason-pill { background: var(--rs-ivory-2); border:1px solid var(--rs-line); border-radius:999px; padding:.2rem .6rem; font-size:.78rem; color:#5b4a3a; display:inline-block; margin:.15rem .15rem 0 0; }
.demo-banner { background: repeating-linear-gradient(45deg, #fff7e6, #fff7e6 10px, #fdf0d6 10px, #fdf0d6 20px); border:1px solid var(--rs-gold); color:#7a5c0a; border-radius:12px; }
.locked-veil { filter: blur(7px); pointer-events:none; user-select:none; }