/* ============================================================
   KINGDOM SEEKERS - Ministry Theme
   Palette is driven by CSS variables set from Admin > Settings.
   ============================================================ */

:root {
  --ks-primary: #1e3a5f;
  --ks-primary-dark: #14273f;
  --ks-accent: #c9a227;
  --ks-accent-dark: #a9861d;
  --ks-bg: #faf8f4;
  --ks-text: #24354b;
  --ks-muted: #5a6b80;
  --bs-body-font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

body {
  background-color: var(--ks-bg);
  color: var(--ks-text);
  overflow-x: hidden;
}

h1, h2, h3, h4, .ks-brand-name {
  font-family: 'Playfair Display', Georgia, serif;
  color: var(--ks-primary);
}

a { color: var(--ks-primary); }

/* ---------- Header ---------- */
.ks-header {
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(10px);
  box-shadow: 0 2px 18px rgba(20, 39, 63, .08);
}
.navbar-brand { padding-top: 0; padding-bottom: 0; }
.ks-logo { border-radius: 12px; object-fit: contain; }
.ks-brand-name { font-size: 1.25rem; line-height: 1.1; letter-spacing: .02em; }
.ks-brand-tag { font-size: .66rem; color: var(--ks-muted); letter-spacing: .06em; text-transform: uppercase; }
.navbar-nav .nav-link {
  font-weight: 600;
  font-size: .95rem;
  color: var(--ks-text);
  border-radius: 999px;
  padding-inline: .85rem;
}
.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active { color: var(--ks-primary); background: rgba(30, 58, 95, .07); }
@media (max-width: 991.98px) {
  .navbar-collapse { background: #fff; margin: .5rem -.75rem 0; padding: 1rem; border-radius: 0 0 16px 16px; box-shadow: 0 14px 30px rgba(20,39,63,.12); }
}

/* ---------- Buttons ---------- */
.btn { font-weight: 600; }
.btn-accent, .btn-accent:hover, .btn-accent:focus {
  background-color: var(--ks-accent);
  border-color: var(--ks-accent);
  color: #fff;
  box-shadow: 0 6px 18px rgba(201, 162, 39, .35);
}
.btn-accent:hover { filter: brightness(.96); color: #fff; }
.btn-light-outline {
  background: rgba(255,255,255,.12);
  border: 1.5px solid rgba(255,255,255,.65);
  color: #fff;
  backdrop-filter: blur(2px);
}
.btn-light-outline:hover { background: rgba(255,255,255,.22); color: #fff; }
.btn-primary { --bs-btn-bg: var(--ks-primary); --bs-btn-border-color: var(--ks-primary); --bs-btn-hover-bg: var(--ks-primary-dark); --bs-btn-hover-border-color: var(--ks-primary-dark); }
.btn-outline-primary { --bs-btn-color: var(--ks-primary); --bs-btn-border-color: var(--ks-primary); --bs-btn-hover-bg: var(--ks-primary); --bs-btn-hover-border-color: var(--ks-primary); }

/* ---------- Hero ---------- */
.ks-hero {
  min-height: clamp(480px, 72vh, 760px);
  background-size: cover;
  background-position: center bottom;
  position: relative;
}
.ks-hero::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(20,39,63,.78) 0%, rgba(20,39,63,.55) 45%, rgba(20,39,63,.82) 100%);
}
.ks-hero .container { position: relative; z-index: 1; }
.ks-hero-title { color: #fff; font-size: clamp(2.1rem, 6vw, 3.6rem); font-weight: 800; }
.ks-hero-sub { max-width: 640px; font-size: clamp(1rem, 2.4vw, 1.25rem); opacity: .92; }
.ks-hero-kicker {
  letter-spacing: .35em; text-transform: uppercase; font-weight: 700;
  font-size: .8rem; color: var(--ks-accent); margin-bottom: .75rem;
}

/* ---------- Sections / kickers ---------- */
.ks-section { scroll-margin-top: 90px; }
.ks-kicker { color: var(--ks-accent-dark); font-weight: 700; letter-spacing: .22em; font-size: .8rem; margin-bottom: .35rem; }
.ks-icon-accent { color: var(--ks-accent); }
.ks-verse-band { background: linear-gradient(120deg, var(--ks-primary) 0%, #2c5083 60%, var(--ks-primary-dark) 100%); }
.ks-cta-band { background: linear-gradient(120deg, var(--ks-primary-dark), var(--ks-primary)); }
.ks-page-hero { background: linear-gradient(120deg, var(--ks-primary-dark), var(--ks-primary) 55%, #2c5083); }

/* ---------- Cards ---------- */
.card { border-radius: 18px; }
.ks-card {
  border-radius: 18px;
  transition: transform .25s ease, box-shadow .25s ease;
}
.ks-card-img { height: 190px; object-fit: cover; border-radius: 17px 17px 0 0; }
.ks-card-img-tall { height: 260px; }
.ks-card:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(20,39,63,.14) !important; }
.ks-list .list-group-item:first-child { border-top-left-radius: 14px; border-top-right-radius: 14px; }
.ks-list .list-group-item:last-child { border-bottom-left-radius: 14px; border-bottom-right-radius: 14px; }
.ks-play-badge {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  color: #fff; text-shadow: 0 2px 14px rgba(0,0,0,.5); transition: transform .2s ease;
}
.sermon-card:hover .ks-play-badge { transform: scale(1.15); }
.ks-chip-scripture { background: rgba(201,162,39,.14); color: #8a6d13; font-weight: 600; }

/* ---------- Event date block ---------- */
.ks-event-date { background: linear-gradient(160deg, var(--ks-primary), var(--ks-primary-dark)); color: #fff; min-width: 86px; }
.ks-event-day { font-family: 'Playfair Display', serif; font-size: 1.7rem; font-weight: 800; line-height: 1; }
.ks-event-month { font-size: .72rem; letter-spacing: .2em; opacity: .85; }

/* ---------- LIVE indicators ---------- */
.ks-dot {
  display: inline-block; width: 10px; height: 10px; border-radius: 50%;
  vertical-align: middle;
}
.ks-dot-danger { background: #ff4d4f; box-shadow: 0 0 0 rgba(255,77,79,.6); animation: ksPulse 1.6s infinite; }
.ks-dot-white { background: #fff; }
@keyframes ksPulse {
  0% { box-shadow: 0 0 0 0 rgba(255,77,79,.55); }
  70% { box-shadow: 0 0 0 9px rgba(255,77,79,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,77,79,0); }
}
.ks-badge-live { letter-spacing: .08em; }
.ks-live-flag {
  display: inline-flex; align-items: center; gap: .5rem;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.35);
  color: #fff; font-weight: 800; letter-spacing: .18em; font-size: .82rem;
  padding: .45em 1.1em; border-radius: 999px;
}
.ks-live-card {
  background: linear-gradient(135deg, #7e1523 0%, #a41e31 55%, #57101b 100%);
  box-shadow: 0 18px 44px rgba(126,21,35,.35);
}
#live-section .ks-live-card p, #live-section .ks-live-card h2 { color: #fff; }
#dashboard .ks-live-card h2 { color: #fff; }

/* ---------- Countdown ---------- */
.ks-countdown { display: flex; justify-content: center; gap: .6rem; flex-wrap: wrap; }
.ks-countdown-box {
  background: #fff; border: 1px solid #e8e2d6; border-radius: 14px;
  min-width: 74px; padding: .65rem .5rem .55rem; text-align: center;
  box-shadow: 0 6px 16px rgba(20,39,63,.07);
}
.ks-countdown-num { display: block; font-family: 'Playfair Display', serif; font-weight: 800; font-size: 1.5rem; color: var(--ks-primary); line-height: 1.1; }
.ks-countdown-label { display: block; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ks-muted); }
.ks-countdown-sm .ks-countdown-box { min-width: 52px; padding: .35rem .4rem; border-radius: 10px; }
.ks-countdown-sm .ks-countdown-num { font-size: 1rem; }
.ks-countdown-sm .ks-countdown-label { font-size: .55rem; }

/* ---------- Avatars ---------- */
.ks-avatar-initials {
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(150deg, var(--ks-primary), #2c5083);
  color: #fff; font-weight: 700; font-size: .9rem;
  width: 36px; height: 36px; border-radius: 50%;
}
.ks-avatar-img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; }
.ks-bell { border: 1px solid #eee; }

/* ---------- Footer ---------- */
.ks-footer { background: var(--ks-primary-dark); color: #cfd8e4; margin-top: auto; }
.ks-footer h6, .ks-footer strong { color: #fff; }
.ks-footer-title { letter-spacing: .16em; font-size: .74rem; color: var(--ks-accent) !important; }
.ks-footer a { color: #cfd8e4; text-decoration: none; }
.ks-footer a:hover { color: #fff; }
.ks-socials a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(255,255,255,.09); color: #fff !important; font-size: 1.1rem;
  transition: background .2s ease;
}
.ks-socials a:hover { background: var(--ks-accent); }
.ks-socials-dark a { background: rgba(30,58,95,.08); color: var(--ks-primary) !important; }
.ks-socials-dark a:hover { background: var(--ks-accent); color: #fff !important; }
.ks-footer-bottom { background: rgba(0,0,0,.22); font-size: .85rem; color: #9fb0c4; }

/* ---------- Auth pages ---------- */
.ks-auth-section { background: linear-gradient(180deg, transparent 0%, rgba(30,58,95,.05) 100%); }
.ks-toggle-pw { text-decoration: none; }

/* ---------- Notifications menu ---------- */
.ks-notif-menu { width: min(360px, 92vw) !important; max-height: 420px; overflow-y: auto; }
.ks-notif-unread { background: rgba(201,162,39,.07); border-left: 3px solid var(--ks-accent); }
.ks-notif-item strong { font-size: .86rem; }
.ks-notif-item p { margin: 0; font-size: .8rem; color: var(--ks-muted); }

/* ---------- Jitsi / media frames ---------- */
.ratio-16x9 { --bs-aspect-ratio: 56.25%; }
.ks-jitsi-frame { border-radius: 18px; overflow: hidden; background: #10233c; box-shadow: 0 16px 40px rgba(16,35,60,.28); }
.ks-jitsi-frame iframe { border: 0; width: 100%; height: 100%; }
.ks-media-frame { border-radius: 0; background: #000; }
video.ks-media-frame { max-height: 520px; }
@media (max-width: 767.98px) {
  .ks-jitsi-frame { border-radius: 12px; }
  .ratio-16x9.ks-mobile-tall { --bs-aspect-ratio: 130%; }
}
.ks-ended-overlay {
  position: absolute; inset: 0; background: rgba(16,35,60,.94);
  display: flex; align-items: center; justify-content: center;
  color: #fff; z-index: 20; border-radius: 18px;
}

/* ---------- Forms ---------- */
.form-control:focus, .form-select:focus {
  border-color: var(--ks-accent);
  box-shadow: 0 0 0 .2rem rgba(201,162,39,.18);
}
textarea { resize: vertical; }

/* ---------- Misc ---------- */
.text-truncate-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
img[loading="lazy"] { transition: opacity .3s ease; }
::selection { background: rgba(201,162,39,.3); }