/* ═══════════════════════════════════════════════════
   Duhovnic · Public Design System
   Dark-first visual language matching the app surface.
   ═══════════════════════════════════════════════════ */

/* ── Palette ── */
:root {
    --bg: #0c1220;
    --surface: #111d2e;
    --surface-hover: #162538;
    --surface-soft: #15263b;
    --border: #243553;
    --border-hover: rgba(91,156,255,.32);
    --text: #dce8fa;
    --text-strong: #f0f6ff;
    --muted: #8296b5;
    --primary: #5b9cff;
    --primary-hover: #4188f0;
    --primary-soft: rgba(91,156,255,.10);
    --accent: #4dd5d5;
    --accent-soft: rgba(77,213,213,.10);
    --brand: #f0f6ff;
    --danger: #e06070;
    --danger-soft: rgba(224,96,112,.12);
    --success: #4dd58e;
    --success-soft: rgba(77,213,142,.12);
    --shadow-card: 0 1px 3px rgba(0,0,0,.35);
    --shadow-elevated: 0 8px 28px rgba(0,0,0,.45);
    --radius: .75rem;
    --radius-lg: 1rem;
    --max-w: 920px;
    --max-w-narrow: 680px;
}

/* ── Reset ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
body { font-family:"Inter","Segoe UI",Roboto,system-ui,sans-serif; background:var(--bg); color:var(--text); line-height:1.65; -webkit-font-smoothing:antialiased; }
a { color:var(--primary); }

/* ── Typography ── */
.serif, h1, h2, h3 { font-family:'Cormorant Garamond',Georgia,serif; }
h1 { color:var(--text-strong); }
h2, h3 { color:var(--text-strong); }

/* ── Layout ── */
.pub-wrap  { max-width:var(--max-w);       margin:0 auto; padding:2rem 1.5rem 4rem; }
.pub-narrow{ max-width:var(--max-w-narrow); margin:0 auto; padding:2rem 1.5rem 4rem; }

/* ════════════════ Header ════════════════ */
.pub-header {
    background: rgba(17,29,46,.82);
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--border);
    padding: .85rem 2rem;
    display: flex; align-items: center; justify-content: space-between;
    position: sticky; top: 0; z-index: 100;
}
.pub-brand { display:flex; align-items:center; gap:.55rem; text-decoration:none; }
.pub-brand img { width:28px; height:28px; filter:brightness(0) invert(1); }
.pub-brand-text {
    font-family:'Cormorant Garamond',serif; font-size:1.2rem; font-weight:700;
    color:var(--brand); letter-spacing:.08em;
}
.pub-nav { display:flex; gap:.25rem; align-items:center; }
.pub-nav a {
    text-decoration:none; font-size:.85rem; padding:.38rem .7rem;
    border-radius:.5rem; transition:all .18s; color:var(--muted);
}
.pub-nav a:hover, .pub-nav a.active { color:var(--text); background:var(--surface-soft); }
.pub-nav .cta {
    background:var(--primary); color:#fff; font-weight:600;
    padding:.4rem .9rem; border-radius:.5rem; margin-left:.15rem;
}
.pub-nav .cta:hover { background:var(--primary-hover); }
.pub-nav .cta-ghost {
    color:var(--muted); border:1px solid var(--border); padding:.35rem .8rem;
    border-radius:.5rem;
}
.pub-nav .cta-ghost:hover { border-color:var(--primary); color:var(--primary); }

/* ════════════════ Cards ════════════════ */
.card {
    background:var(--surface); border:1px solid var(--border);
    border-radius:var(--radius); padding:1.3rem 1.5rem;
    box-shadow:var(--shadow-card); transition:border-color .2s, transform .15s;
}
.card:hover { border-color:var(--border-hover); }
.card-accent { border-color:var(--accent); }
.card + .card { margin-top:.8rem; }

/* ════════════════ Buttons ════════════════ */
.btn {
    display:inline-flex; align-items:center; gap:.5rem;
    padding:.65rem 1.5rem; border-radius:var(--radius);
    font-size:.92rem; font-weight:600; text-decoration:none;
    cursor:pointer; border:none; transition:all .2s; font-family:inherit;
}
.btn-primary      { background:var(--primary); color:#fff; }
.btn-primary:hover{ background:var(--primary-hover); transform:translateY(-1px); }
.btn-outline      { border:1px solid var(--border); background:transparent; color:var(--text); }
.btn-outline:hover{ border-color:var(--primary); color:var(--primary); }
.btn-ghost        { background:transparent; color:var(--primary); padding:.45rem .75rem; }
.btn-ghost:hover  { background:var(--primary-soft); }
.btn-lg           { padding:.8rem 2rem; font-size:1rem; border-radius:var(--radius-lg); }
.btn-accent       { background:var(--accent); color:var(--bg); }
.btn-accent:hover { filter:brightness(1.1); transform:translateY(-1px); }

/* ════════════════ Pills / Tags ════════════════ */
.pill {
    display:inline-flex; align-items:center; gap:.3rem;
    padding:.22rem .6rem; border-radius:999px; font-size:.78rem;
    border:1px solid var(--border); background:rgba(255,255,255,.03);
    color:var(--muted); text-decoration:none; transition:all .2s;
}
a.pill:hover       { border-color:var(--primary); color:var(--primary); }
.pill-fast         { border-color:var(--danger); color:var(--danger); }
.pill-feast        { border-color:var(--accent); color:var(--accent); }
.pill-holiday      { border-color:#f0c040; color:#f0c040; }

/* ════════════════ Section titles ════════════════ */
.section-title {
    font-size:.88rem; text-transform:uppercase; letter-spacing:.1em;
    color:var(--muted); margin-bottom:.75rem; padding-bottom:.4rem;
    border-bottom:1px solid var(--border);
    font-family:"Inter",sans-serif; font-weight:600;
}

/* ════════════════ Footer ════════════════ */
.pub-footer {
    text-align:center; padding:2.5rem 2rem; color:var(--muted);
    font-size:.82rem; border-top:1px solid var(--border); margin-top:3rem;
}
.pub-footer a { color:var(--primary); text-decoration:none; }
.pub-footer a:hover { text-decoration:underline; }
.pub-footer .legal { margin-top:.5rem; font-size:.76rem; opacity:.7; }
.social-row { display:flex; justify-content:center; gap:.45rem; margin-bottom:1rem; }
.social-icon {
    display:inline-flex; align-items:center; justify-content:center;
    width:32px; height:32px; border:1px solid var(--border); border-radius:999px;
    background:transparent; color:var(--muted); text-decoration:none; transition:all .2s;
}
.social-icon svg { width:14px; height:14px; }
.social-icon:hover { border-color:var(--primary); color:var(--primary); transform:translateY(-1px); }

/* ════════════════ Hero (landing) ════════════════ */
.hero { text-align:center; padding:5rem 2rem 4rem; }
.hero h1 { font-size:2.8rem; line-height:1.15; margin-bottom:1rem; }
.hero h1 em { font-style:italic; color:var(--accent); }
.hero p { font-size:1.1rem; color:var(--muted); max-width:540px; margin:0 auto 2rem; }
.hero-actions { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }

/* ════════════════ Feature grid ════════════════ */
.features-section { max-width:var(--max-w); margin:0 auto; padding:0 2rem 4rem; }
.features-section h2 { text-align:center; font-size:1.7rem; margin-bottom:2rem; color:var(--text-strong); }
.features-grid {
    display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1rem;
}
.feature-card .icon { font-size:1.5rem; margin-bottom:.5rem; }
.feature-card h3 { font-size:.98rem; margin-bottom:.3rem; font-family:"Inter",sans-serif; color:var(--text-strong); }
.feature-card p   { color:var(--muted); font-size:.87rem; }

/* ════════════════ Calendar ════════════════ */
.cal-hero h1 { font-size:1.9rem; margin-bottom:.35rem; }
.cal-hero p  { color:var(--muted); font-size:.92rem; }
.cal-date    { font-weight:700; font-size:.85rem; color:var(--primary); margin-bottom:.25rem; }
.cal-date a  { color:var(--primary); text-decoration:none; }
.cal-date a:hover { text-decoration:underline; }
.cal-summary { color:var(--text); font-size:.92rem; margin-bottom:.5rem; }
.cal-tags    { display:flex; flex-wrap:wrap; gap:.4rem; }
.cal-flags   { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.5rem; }
.cal-list    { list-style:none; padding:0; }
.cal-list li {
    background:var(--surface); border:1px solid var(--border);
    border-radius:.65rem; padding:.75rem 1rem; margin-bottom:.5rem;
    transition:border-color .2s;
}
.cal-list li:hover { border-color:var(--border-hover); }
.cal-list a  { color:var(--primary); text-decoration:none; font-weight:600; }
.cal-list a:hover { text-decoration:underline; }
.cal-section { margin-bottom:1.8rem; }
.cal-user-card {
    background:var(--surface); border:1px solid var(--accent);
    border-radius:var(--radius); padding:1rem 1.3rem;
    margin-bottom:1.5rem; display:flex; align-items:center;
    justify-content:space-between; flex-wrap:wrap; gap:.5rem;
}
.cal-user-card .info { color:var(--text); font-size:.9rem; }
.cal-user-card .info strong { color:var(--accent); }
.cal-user-card a { color:var(--primary); text-decoration:none; font-weight:600; font-size:.86rem; }
.cal-user-card a:hover { text-decoration:underline; }

/* ════════════════ Auth ════════════════ */
.auth-shell { min-height:100vh; padding:2rem 1rem; display:grid; place-items:center; }
.auth-card  { width:min(100%,460px); border-radius:var(--radius-lg); padding:1.6rem; }
.auth-brand { display:flex; align-items:center; gap:.9rem; margin-bottom:1.25rem; text-decoration:none; color:inherit; }
.auth-brand img { width:48px; height:48px; filter:brightness(0) invert(1); }
.auth-wordmark  { font-family:'Cormorant Garamond',serif; font-size:1.4rem; letter-spacing:.1em; color:var(--brand); }
.auth-brand small { display:block; margin-top:.2rem; color:var(--muted); font-size:.82rem; }
.auth-subtitle { margin:0 0 1rem; color:var(--muted); line-height:1.5; font-size:.93rem; }
.auth-form  { display:grid; gap:.85rem; }
.auth-field { display:grid; gap:.3rem; }
.auth-field label { font-size:.86rem; font-weight:600; color:var(--text); }
.auth-field input {
    width:100%; border:1px solid var(--border); border-radius:var(--radius);
    padding:.82rem 1rem; font-size:.93rem; color:var(--text);
    background:var(--surface-soft); font-family:inherit;
}
.auth-field input:focus { outline:2px solid rgba(91,156,255,.18); border-color:var(--primary); }
.auth-check { display:flex; align-items:center; gap:.6rem; color:var(--muted); font-size:.88rem; }
.auth-check input { width:16px; height:16px; accent-color:var(--primary); }
.auth-submit {
    border:none; border-radius:var(--radius); background:var(--primary); color:#fff;
    padding:.82rem 1rem; font-size:.95rem; font-weight:700;
    cursor:pointer; transition:all .2s; font-family:inherit;
}
.auth-submit:hover { background:var(--primary-hover); transform:translateY(-1px); }
.auth-links { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1rem; font-size:.88rem; }
.auth-links a { color:var(--primary); text-decoration:none; font-weight:600; }
.auth-links a:hover { text-decoration:underline; }
.auth-alert { border-radius:var(--radius); padding:.7rem .9rem; margin-bottom:1rem; font-size:.88rem; }
.auth-alert.error   { background:var(--danger-soft); border:1px solid rgba(224,96,112,.3); color:#f4a0aa; }
.auth-alert.success { background:var(--success-soft); border:1px solid rgba(77,213,142,.3); color:#80e8b0; }
.auth-footer {
    margin-top:1.2rem; padding-top:1rem; border-top:1px solid var(--border);
    color:var(--muted); font-size:.8rem; line-height:1.5;
}
.auth-footer strong {
    color:var(--brand); font-family:'Cormorant Garamond',serif;
    font-size:1rem; letter-spacing:.08em;
}

/* ════════════════ Today / Reflection ════════════════ */
.today-meta { display:flex; align-items:center; gap:.6rem; margin-bottom:.8rem; flex-wrap:wrap; }
.today-meta .date-pill {
    background:var(--accent); color:var(--bg); font-size:.73rem;
    font-weight:700; padding:.18rem .65rem; border-radius:999px;
}
.today-meta .liturgical { font-size:.82rem; color:var(--muted); }
.today-card .verse {
    font-family:'Cormorant Garamond',serif; font-style:italic;
    font-size:1.1rem; color:var(--accent); margin-bottom:1rem;
    border-left:3px solid var(--accent); padding-left:1rem; line-height:1.55;
}
.today-card .reflection { font-size:.92rem; margin-bottom:1rem; line-height:1.7; }
.today-card .practice {
    background:var(--surface-soft); border-radius:var(--radius);
    padding:.8rem 1rem; font-size:.85rem; color:var(--muted);
}
.today-card .practice strong { color:var(--text); }

/* ════════════════ Blog / Posts ════════════════ */
.blog-item { margin-bottom:.6rem; }
.blog-item .blog-date {
    font-size:.76rem; font-weight:600; color:var(--accent);
    text-transform:uppercase; letter-spacing:.04em;
}
.blog-item h3 { font-size:1rem; margin-top:.1rem; font-family:"Inter",sans-serif; }
.blog-item h3 a { color:var(--text-strong); text-decoration:none; }
.blog-item h3 a:hover { color:var(--primary); }
.blog-item .excerpt { font-size:.86rem; color:var(--muted); margin-top:.2rem; }

/* ════════════════ Trust bar ════════════════ */
.trust-bar {
    text-align:center; padding:2.5rem 2rem;
    border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.trust-bar p { color:var(--muted); font-size:.9rem; max-width:600px; margin:0 auto; }
.trust-bar strong { color:var(--text-strong); }

/* ════════════════ Structured data helper ════════════════ */
.sr-only {
    position:absolute; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip:rect(0,0,0,0); border:0;
}

/* ════════════════ Utilities ════════════════ */
.text-center { text-align:center; }
.text-muted  { color:var(--muted); }
.empty-state { color:var(--muted); font-style:italic; font-size:.86rem; padding:.5rem 0; }
.back-link   { display:inline-flex; align-items:center; gap:.35rem; color:var(--primary); text-decoration:none; font-size:.86rem; font-weight:600; }
.back-link:hover { text-decoration:underline; }
.mb-1 { margin-bottom:.5rem; }
.mb-2 { margin-bottom:1rem; }
.mb-3 { margin-bottom:1.5rem; }
.mt-2 { margin-top:1rem; }

/* ════════════════ Churches / Harta / Biserici ════════════════ */
.btn-sm { padding:.3rem .75rem; font-size:.82rem; }

.judete-nav { margin: 1.5rem 0; }
.judete-grid { display:flex; flex-wrap:wrap; gap:.4rem; }

.biserici-breadcrumb {
    font-size:.8rem; color:var(--muted); margin-bottom:1rem;
    display:flex; align-items:center; gap:.35rem; flex-wrap:wrap;
}
.biserici-breadcrumb a { color:var(--primary); text-decoration:none; }
.biserici-breadcrumb a:hover { text-decoration:underline; }
.biserici-breadcrumb span { color:var(--muted); }

.biserici-desc { color:var(--muted); font-size:.92rem; margin:.3rem 0 1.2rem; }
.biserici-desc a { color:var(--primary); text-decoration:none; }
.biserici-desc a:hover { text-decoration:underline; }

.biserici-form {
    display:flex; gap:.5rem; flex-wrap:wrap; align-items:center;
    margin-bottom:1.25rem;
}
.biserici-search,
.biserici-judet-select {
    background:var(--surface); border:1px solid var(--border);
    color:var(--text); border-radius:.5rem; padding:.45rem .75rem;
    font-size:.88rem; font-family:inherit; outline:none;
    transition:border-color .18s;
}
.biserici-search:focus,
.biserici-judet-select:focus { border-color:var(--primary); }
.biserici-search { min-width:180px; flex:1; }

.rezultate-count { font-size:.85rem; color:var(--muted); margin-bottom:.9rem; }
.rezultate-count strong { color:var(--text); }

.church-list { list-style:none; padding:0; display:flex; flex-direction:column; gap:.45rem; }
.church-card {
    background:var(--surface); border:1px solid var(--border);
    border-radius:var(--radius); padding:.75rem 1rem;
    display:flex; align-items:center; justify-content:space-between;
    flex-wrap:wrap; gap:.4rem; transition:border-color .18s;
}
.church-card:hover { border-color:var(--border-hover); }
.church-card-main { display:flex; flex-direction:column; gap:.1rem; flex:1; min-width:0; }
.church-name {
    color:var(--text-strong); text-decoration:none; font-weight:600; font-size:.93rem;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.church-name:hover { color:var(--primary); }
.church-judet { color:var(--muted); font-size:.8rem; }
.church-card-meta {
    display:flex; align-items:center; gap:.35rem; flex-wrap:wrap;
    flex-shrink:0;
}
.church-score {
    font-size:.75rem; color:var(--muted); border:1px solid var(--border);
    border-radius:999px; padding:.1rem .45rem;
}
.church-claimed { border-color:var(--accent); color:var(--accent); }

.no-results { text-align:center; padding:2rem; color:var(--muted); }

.pagination {
    display:flex; align-items:center; justify-content:center;
    gap:.35rem; flex-wrap:wrap; margin-top:2rem;
}
.pagination-btn {
    display:inline-flex; align-items:center; justify-content:center;
    min-width:2rem; height:2rem; padding:0 .55rem;
    border:1px solid var(--border); border-radius:.45rem;
    font-size:.85rem; color:var(--text); text-decoration:none;
    background:var(--surface); transition:all .18s;
}
.pagination-btn:hover { border-color:var(--primary); color:var(--primary); }
.pagination-current {
    background:var(--primary); border-color:var(--primary);
    color:#fff; font-weight:700; pointer-events:none;
}
.pagination-ellipsis { color:var(--muted); padding:0 .2rem; }

/* ════════════════ Church Profile ════════════════ */
.profil-hero {
    position: relative; margin: 1rem 0 1.5rem;
    border-radius: var(--radius-lg); overflow: hidden;
    max-height: 400px; background: var(--surface);
}
.profil-hero img {
    width: 100%; height: 100%; max-height: 400px;
    object-fit: cover; display: block;
}
.profil-hero-credit {
    position: absolute; bottom: .5rem; right: .75rem;
    font-size: .72rem; color: rgba(255,255,255,.8);
    background: rgba(0,0,0,.45); padding: .15rem .55rem;
    border-radius: 999px; pointer-events: none;
}
.profil-title-row {
    display: flex; align-items: center; gap: .6rem;
    flex-wrap: wrap; margin-bottom: .4rem;
}
.profil-title-row h1 { margin: 0; }
.profil-badge {
    font-size: .73rem; font-weight: 600; padding: .2rem .65rem;
    border-radius: 999px; border: 1px solid; flex-shrink: 0;
}
.profil-badge-confession { border-color: var(--accent); color: var(--accent); }
.profil-meta {
    color: var(--muted); font-size: .88rem; margin-bottom: 1.25rem;
    display: flex; gap: .35rem .6rem; flex-wrap: wrap; align-items: center;
}
.profil-meta a { color: var(--primary); text-decoration: none; }
.profil-meta a:hover { text-decoration: underline; }
.profil-descriere p { margin-bottom: .75rem; line-height: 1.7; }
.profil-info-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: .75rem 1.5rem;
    margin-top: .5rem;
}
.profil-info-item { display: flex; flex-direction: column; gap: .15rem; }
.profil-info-label {
    font-size: .76rem; text-transform: uppercase; letter-spacing: .06em;
    color: var(--muted); font-weight: 600;
}
.profil-program-text {
    font-family: inherit; font-size: .87rem; white-space: pre-wrap;
    color: var(--text); margin: 0;
}
.profil-map-container {
    height: 300px; border-radius: var(--radius); overflow: hidden;
    border: 1px solid var(--border); margin: 1.5rem 0;
}
.profil-nearby { margin: 2rem 0; }
.profil-nearby-title {
    font-size: 1.1rem; margin-bottom: .75rem; color: var(--text-strong);
    font-family: 'Cormorant Garamond', serif;
}
.profil-nearby-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: .45rem;
}
.profil-nearby-item {
    background: var(--surface); border: 1px solid var(--border);
    border-radius: var(--radius); padding: .65rem 1rem;
    text-decoration: none; display: block; transition: border-color .2s;
}
.profil-nearby-item:hover { border-color: var(--border-hover); }
.profil-nearby-name { color: var(--text-strong); font-weight: 600; font-size: .88rem; }
.profil-nearby-judet { color: var(--muted); font-size: .77rem; margin-top: .1rem; }
.profil-cta {
    background: var(--primary-soft); border: 1px solid rgba(91,156,255,.3);
    border-radius: var(--radius-lg); padding: 1.75rem 1.5rem;
    text-align: center; margin: 2rem 0;
}
.profil-cta h3 {
    font-family: 'Cormorant Garamond', serif; font-size: 1.4rem;
    margin-bottom: .5rem; color: var(--text-strong);
}
.profil-cta p { color: var(--muted); font-size: .9rem; margin-bottom: 1.25rem; }
@media(max-width: 600px) {
    .profil-info-grid { grid-template-columns: 1fr; }
    .profil-nearby-grid { grid-template-columns: 1fr 1fr; }
}
@media(max-width: 380px) {
    .profil-nearby-grid { grid-template-columns: 1fr; }
    .profil-cta { padding: 1.25rem 1rem; }
}

/* ════════════════ Responsive ════════════════ */
@media(max-width:768px){
    .pub-header { padding:.75rem 1rem; }
    .pub-nav .hide-sm { display:none; }
    .hero { padding:3rem 1.2rem 2.5rem; }
    .hero h1 { font-size:2rem; }
    .pub-wrap, .pub-narrow { padding:1.5rem 1rem 3rem; }
    .features-grid { grid-template-columns:1fr; }
    .features-section { padding:0 1.2rem 3rem; }
    .cal-hero h1 { font-size:1.5rem; }
}
@media(max-width:480px){
    .hero h1 { font-size:1.65rem; }
    .hero p  { font-size:.93rem; }
    .pub-nav .hide-xs { display:none; }
}