:root {
    --samaj-primary: #8b1e3f;
    --samaj-primary-2: #6d1631;
    --samaj-primary-rgb: 139, 30, 63;
    --samaj-accent: #f59e0b;
    --samaj-accent-2: #f97316;
    --samaj-success: #15803d;
    --samaj-info: #2563eb;
    --samaj-ink: #1f2937;
    --samaj-muted: #64748b;
    --samaj-bg: #fff7ed;
    --samaj-bg-2: #f8fafc;
    --samaj-card: rgba(255,255,255,.92);
    --samaj-border: rgba(148,163,184,.28);
    --samaj-shadow-sm: 0 10px 28px rgba(30,41,59,.08);
    --samaj-shadow: 0 22px 55px rgba(30,41,59,.12);
    --samaj-radius: 22px;
    --samaj-radius-lg: 30px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 8% 8%, rgba(245,158,11,.18), transparent 28%),
        radial-gradient(circle at 92% 10%, rgba(139,30,63,.14), transparent 28%),
        linear-gradient(180deg, #fffaf3 0%, #f8fafc 48%, #fff 100%);
    color: var(--samaj-ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
}

a { color: var(--samaj-primary); }
a:hover { color: var(--samaj-primary-2); }
main { min-height: calc(100vh - 220px); }

/* Bootstrap theme overrides */
.btn { border-radius: 999px; font-weight: 700; letter-spacing: -.01em; }
.btn-primary {
    --bs-btn-bg: var(--samaj-primary);
    --bs-btn-border-color: var(--samaj-primary);
    --bs-btn-hover-bg: var(--samaj-primary-2);
    --bs-btn-hover-border-color: var(--samaj-primary-2);
    --bs-btn-active-bg: var(--samaj-primary-2);
    --bs-btn-active-border-color: var(--samaj-primary-2);
}
.btn-outline-primary {
    --bs-btn-color: var(--samaj-primary);
    --bs-btn-border-color: rgba(var(--samaj-primary-rgb), .38);
    --bs-btn-hover-bg: var(--samaj-primary);
    --bs-btn-hover-border-color: var(--samaj-primary);
}
.text-primary { color: var(--samaj-primary) !important; }
.bg-primary { background-color: var(--samaj-primary) !important; }
.progress { border-radius: 999px; height: .58rem; background: #f1e6da; }
.progress-bar { background: linear-gradient(90deg, var(--samaj-primary), var(--samaj-accent)); }
.form-control, .form-select {
    border-radius: 16px;
    border-color: rgba(148,163,184,.42);
    padding: .72rem .95rem;
}
.form-control:focus, .form-select:focus {
    border-color: rgba(var(--samaj-primary-rgb), .48);
    box-shadow: 0 0 0 .22rem rgba(var(--samaj-primary-rgb), .12);
}
.form-label { font-weight: 700; color: #334155; font-size: .92rem; }
.table { --bs-table-hover-bg: rgba(245,158,11,.08); }
.table thead th { background: #fff7ed; color: #7c2d12; font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; border-bottom: 0; }
.alert { border-radius: 18px; border: 0; box-shadow: var(--samaj-shadow-sm); }
.badge { border-radius: 999px; padding: .48em .7em; font-weight: 700; }

/* Header */
.bg-samaj { background: linear-gradient(90deg, var(--samaj-primary-2), var(--samaj-primary), #b45309); }
.app-navbar {
    backdrop-filter: blur(16px);
    box-shadow: 0 10px 30px rgba(17,24,39,.16);
}
.navbar-brand { letter-spacing: -.025em; }
.brand-mark {
    width: 42px; height: 42px; border-radius: 16px;
    background: linear-gradient(135deg, #fff, #fde68a);
    color: var(--samaj-primary);
    display: inline-flex; align-items: center; justify-content: center;
    font-weight: 900;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.5), 0 10px 25px rgba(0,0,0,.16);
}
.navbar .nav-link { border-radius: 999px; padding: .55rem .8rem !important; font-weight: 650; opacity: .94; }
.navbar .nav-link:hover, .navbar .nav-link.active { background: rgba(255,255,255,.14); opacity: 1; }
.dropdown-menu {
    border: 0;
    border-radius: 20px;
    box-shadow: var(--samaj-shadow);
    padding: .55rem;
}
.dropdown-item { border-radius: 14px; padding: .6rem .78rem; font-weight: 600; }
.dropdown-item:hover { background: #fff7ed; color: var(--samaj-primary); }
.user-pill {
    display: inline-flex; align-items: center; gap: .45rem;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.18);
    color: #fff; padding: .48rem .72rem; border-radius: 999px;
    font-weight: 700;
}

/* Layout helpers */
.page-section { padding: 2.5rem 0; }
.page-title-wrap { margin-bottom: 1.5rem; }
.eyebrow {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .35rem .7rem; border-radius: 999px;
    background: rgba(var(--samaj-primary-rgb), .08);
    color: var(--samaj-primary);
    font-size: .82rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em;
}
.page-title { font-weight: 900; letter-spacing: -.035em; }
.page-subtitle { color: var(--samaj-muted); max-width: 780px; }

.hero-section, .hero-card, .modern-hero {
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(109,22,49,.96), rgba(139,30,63,.93) 45%, rgba(194,65,12,.88)),
        url('../images/hero-pattern.svg');
    color: #fff;
    border-radius: var(--samaj-radius-lg);
    padding: clamp(2.4rem, 5vw, 5rem);
    box-shadow: var(--samaj-shadow);
}
.hero-section::before, .hero-card::before, .modern-hero::before {
    content: "";
    position: absolute; inset: auto -120px -160px auto;
    width: 360px; height: 360px; border-radius: 50%;
    background: rgba(255,255,255,.14);
}
.hero-section > *, .hero-card > *, .modern-hero > * { position: relative; z-index: 1; }
.hero-stat-mini {
    background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.18);
    border-radius: 22px; padding: 1rem; backdrop-filter: blur(12px);
}

.soft-card, .feature-card, .modern-card {
    background: var(--samaj-card);
    border: 1px solid rgba(255,255,255,.78);
    border-radius: var(--samaj-radius);
    box-shadow: var(--samaj-shadow-sm);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.soft-card:hover, .feature-card:hover, .modern-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--samaj-shadow);
    border-color: rgba(var(--samaj-primary-rgb), .16);
}
.card-plain-hover:hover { transform: none; box-shadow: var(--samaj-shadow-sm); }
.card-header-soft { background: rgba(255,247,237,.72); border-bottom: 1px solid rgba(148,163,184,.18); border-radius: var(--samaj-radius) var(--samaj-radius) 0 0 !important; }

.icon-circle, .metric-icon, .action-icon {
    width: 52px; height: 52px; border-radius: 18px;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #fff7ed, #ffedd5);
    color: var(--samaj-primary);
    font-weight: 900; font-size: 1.25rem;
    box-shadow: inset 0 0 0 1px rgba(245,158,11,.16);
}
.icon-circle.success, .metric-icon.success { background: #ecfdf5; color: #15803d; }
.icon-circle.info, .metric-icon.info { background: #eff6ff; color: #2563eb; }
.icon-circle.warning, .metric-icon.warning { background: #fffbeb; color: #b45309; }
.icon-circle.dark, .metric-icon.dark { background: #f1f5f9; color: #334155; }

.stat-card, .dashboard-stat {
    position: relative; overflow: hidden;
    border-left: 0 !important;
}
.stat-card::after, .dashboard-stat::after {
    content: ""; position: absolute; right: -35px; top: -35px;
    width: 110px; height: 110px; border-radius: 50%;
    background: rgba(var(--samaj-primary-rgb), .07);
}
.stat-value { font-weight: 900; letter-spacing: -.04em; font-size: clamp(2rem, 4vw, 3rem); line-height: 1; }
.stat-label { color: var(--samaj-muted); font-weight: 700; }

.quick-action-card { text-decoration: none; color: inherit; display: block; height: 100%; }
.quick-action-card:hover { color: inherit; }
.quick-action-card .small { color: var(--samaj-muted); }

.member-card { overflow: hidden; }
.member-card::before {
    content: ""; display: block; height: 5px;
    background: linear-gradient(90deg, var(--samaj-primary), var(--samaj-accent));
}
.profile-photo { width: 104px; height: 104px; object-fit: cover; border-radius: 28px; border: 4px solid #fff; box-shadow: 0 14px 28px rgba(0,0,0,.18); }
.mini-profile-photo { width: 62px; height: 62px; object-fit: cover; border-radius: 20px; border: 3px solid #fff; box-shadow: 0 8px 20px rgba(15,23,42,.14); }
.avatar-circle { width: 62px; height: 62px; border-radius: 20px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #fff7ed, #fde68a); color: var(--samaj-primary); font-weight: 900; border: 1px solid rgba(123,30,30,.15); box-shadow: 0 8px 20px rgba(15,23,42,.1); }
.avatar-lg { width: 104px; height: 104px; font-size: 1.9rem; border-radius: 30px; }
.filter-chip, .skill-chip {
    display: inline-flex; gap: .25rem; align-items: center;
    padding: .32rem .62rem; background: #fff7ed;
    border: 1px solid #fed7aa; border-radius: 999px; font-size: .84rem;
    color: #7c2d12; font-weight: 700;
}
.offer-chip { color: #166534; background: #ecfdf5; border-color: #bbf7d0; }
.ask-chip { color: #1d4ed8; background: #eff6ff; border-color: #bfdbfe; }

.filter-panel { position: sticky; top: 92px; }
.filter-panel .card-body { padding: 1rem; }
.result-toolbar { background: rgba(255,255,255,.78); border: 1px solid rgba(255,255,255,.72); border-radius: 18px; padding: .85rem 1rem; box-shadow: var(--samaj-shadow-sm); }

.event-date-box {
    min-width: 72px; text-align: center; border-radius: 18px;
    background: linear-gradient(135deg, var(--samaj-primary), var(--samaj-accent-2));
    color: #fff; padding: .65rem .5rem; box-shadow: 0 12px 28px rgba(var(--samaj-primary-rgb), .24);
}
.event-date-box .day { font-size: 1.55rem; font-weight: 900; line-height: 1; }
.event-date-box .month { font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }

.activity-cover, .listing-cover { height: 200px; object-fit: cover; width: 100%; }
.placeholder-cover {
    height: 200px; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #fff7ed, #fde68a);
    color: var(--samaj-primary); font-size: 2rem; font-weight: 900;
}
.donation-progress-wrap { background: #fff7ed; border-radius: 18px; padding: 1rem; }

.empty-state {
    text-align: center; border: 1px dashed rgba(148,163,184,.55); border-radius: 24px;
    padding: 2.2rem; background: rgba(255,255,255,.62);
}
.empty-state i { font-size: 2.4rem; color: var(--samaj-primary); }

.required::after { content: " *"; color: #dc3545; }
.page-actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.footer-modern { background: #111827; color: #e5e7eb; }
.footer-modern a { color: #fef3c7; text-decoration: none; }
.footer-modern a:hover { color: #fff; }
.footer-brand-card { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: 24px; padding: 1.2rem; }

@media (max-width: 991.98px) {
    .navbar .nav-link { padding: .68rem .85rem !important; }
    .navbar-collapse { padding-top: .85rem; }
    .filter-panel { position: static; }
    .page-title { font-size: 2rem; }
}
@media (max-width: 575.98px) {
    body { font-size: 15px; }
    .hero-section, .hero-card, .modern-hero { border-radius: 24px; padding: 2rem 1.2rem; }
    .container { padding-left: 1rem; padding-right: 1rem; }
    .btn-lg { padding: .75rem 1rem; font-size: 1rem; }
    .stat-value { font-size: 2rem; }
    .soft-card, .feature-card, .modern-card { border-radius: 18px; }
    .mobile-full { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    * { scroll-behavior: auto !important; transition: none !important; }
}

/* Phase UI-2: Home Offering Exchange + Professional Network */
.exchange-section {
    position: relative;
}
.exchange-section::before {
    content: "";
    position: absolute;
    inset: -18px -10px auto -10px;
    min-height: 200px;
    border-radius: 30px;
    background: linear-gradient(135deg, rgba(255,247,237,.86), rgba(239,246,255,.72));
    z-index: -1;
}
.exchange-card-shell {
    overflow: hidden;
    border-color: rgba(var(--samaj-primary-rgb), .1);
}
.exchange-card-shell::before {
    content: "";
    display: block;
    height: 6px;
}
.offer-shell::before { background: linear-gradient(90deg, #16a34a, #86efac); }
.ask-shell::before { background: linear-gradient(90deg, #2563eb, #93c5fd); }
.exchange-mini-card {
    background: rgba(255,255,255,.86);
    border: 1px solid rgba(148,163,184,.22);
    border-radius: 22px;
    padding: 1rem;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .05);
}
.professional-network-card {
    display: block;
    height: 100%;
    background: rgba(255,255,255,.86);
    border: 1px solid rgba(255,255,255,.88);
    border-radius: 24px;
    padding: 1.15rem;
    box-shadow: var(--samaj-shadow-sm);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.professional-network-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--samaj-shadow);
    border-color: rgba(var(--samaj-primary-rgb), .18);
}
.profession-count {
    min-width: 58px;
    height: 42px;
    padding: 0 .8rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    font-weight: 900;
    color: var(--samaj-primary);
    background: #fff7ed;
    border: 1px solid #fed7aa;
}
.profession-role-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: .45rem;
}
.profession-role-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    color: #475569;
    font-size: .9rem;
}
.profession-role-list li span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.profession-role-list li strong {
    color: #111827;
    font-weight: 900;
}
.min-w-0 { min-width: 0; }
@media (max-width: 575.98px) {
    .exchange-mini-card { padding: .85rem; border-radius: 18px; }
    .profession-count { min-width: 48px; height: 38px; font-size: 1.12rem; }
}

/* Phase-Lang Hindi support */
html[lang="hi"] body {
    font-family: "Noto Sans Devanagari", "Nirmala UI", "Mangal", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: 0;
}
html[lang="hi"] .fw-black,
html[lang="hi"] .fw-bold {
    letter-spacing: 0;
}
.language-switcher .dropdown-item.active {
    background: rgba(245, 158, 11, .18);
    color: #7c2d12;
    font-weight: 700;
}
.language-switcher .nav-link {
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    padding-left: .75rem !important;
    padding-right: .75rem !important;
}
@media (max-width: 991.98px) {
    .language-switcher .nav-link {
        display: inline-flex;
        margin: .25rem 0;
    }
}

/* Phase-M Matrimonial */
.avatar-xl { width: 150px; height: 150px; font-size: 2.5rem; }
.matrimonial-card { transition: transform .2s ease, box-shadow .2s ease; }
.matrimonial-card:hover { transform: translateY(-3px); box-shadow: 0 1rem 2rem rgba(17,24,39,.12); }
.privacy-note { border-left: 4px solid var(--bs-warning); background: #fff8e1; }