/* ============================================================
   CFC — EVENTS.HTML PAGE STYLES
   ============================================================ */

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    html { scroll-behavior:smooth; }
    
    body {
      font-family: 'Lato', sans-serif;
      color: #f0e8d0;
      overflow-x: hidden;
      background-color: #0D1B3E;
      background-position: center top;
      position: relative;
    }
    /* Overlay to control fade intensity */
    body::before {
      content: '';
      position: fixed;
      inset: 0;
      background-color: rgba(8, 15, 36, 0.93);
      pointer-events: none;
      z-index: 0;
    }
    /* Ensure all direct children sit above the overlay */
    body > * { position: relative; z-index: 1; }
    :root { --navy:#0D1B3E; --royal:#4B0082; --gold:#C9A84C; --gold-l:#E2C06A; }

    #navbar { position:fixed; top:0; left:0; right:0; z-index:1000; background:rgba(8,15,36,.97); box-shadow:0 2px 20px rgba(201,168,76,.2); transition:background .4s,box-shadow .4s; }
    #navbar.scrolled { background:rgba(5,10,26,1); box-shadow:0 2px 24px rgba(201,168,76,.25); }

    .gold-text   { color:var(--gold); }
    .gold-border { border:1px solid var(--gold); }
    .gold-divider { width:80px; height:3px; background:linear-gradient(90deg,transparent,var(--gold),transparent); margin:1rem auto; }

    .nav-link { font-family:'Cinzel',serif; font-size:.8rem; letter-spacing:.08em; color:#f0e8d0; transition:color .2s; padding:.25rem 0; position:relative; }
    .nav-link::after { content:''; position:absolute; bottom:-2px; left:0; right:0; height:2px; background:var(--gold); transform:scaleX(0); transition:transform .25s; }
    .nav-link:hover,
    .nav-link.active  { color:var(--gold); }
    .nav-link:hover::after,
    .nav-link.active::after { transform:scaleX(1); }

    .btn-gold { display:inline-block; padding:.75rem 2rem; background:linear-gradient(135deg,var(--gold-l),var(--gold)); color:#0D1B3E; font-family:'Cinzel',serif; font-weight:700; letter-spacing:.05em; border-radius:4px; transition:transform .2s,box-shadow .2s; }
    .btn-gold:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(201,168,76,.4); }
    .btn-gold-sm { display:inline-flex; align-items:center; gap:5px; padding:.5rem 1.1rem; background:linear-gradient(135deg,var(--gold-l),var(--gold)); color:#0D1B3E; font-family:'Cinzel',serif; font-weight:700; font-size:.72rem; letter-spacing:.06em; border-radius:4px; transition:transform .2s; }
    .btn-gold-sm:hover { transform:translateY(-2px); }
    .btn-outline { display:inline-block; padding:.75rem 2rem; border:2px solid var(--gold); color:var(--gold); font-family:'Cinzel',serif; font-weight:700; letter-spacing:.05em; border-radius:4px; transition:background .2s,color .2s,transform .2s; }
    .btn-outline:hover { background:var(--gold); color:#0D1B3E; transform:translateY(-2px); }
    .btn-outline-sm { display:inline-flex; align-items:center; gap:5px; padding:.5rem 1.1rem; border:1.5px solid var(--gold); color:var(--gold); font-family:'Cinzel',serif; font-weight:700; font-size:.72rem; letter-spacing:.06em; border-radius:4px; transition:background .2s,color .2s; }
    .btn-outline-sm:hover { background:var(--gold); color:#0D1B3E; }

    #mobile-menu { display:none; }
    #mobile-menu.open { display:block; }

    /* ── Page hero with faded photo background ── */
    .page-hero {
      padding-top:130px; padding-bottom:80px;
      position:relative; overflow:hidden;
      background-color: #080f24;
    }
    /* Real photo layer — faded */
    .page-hero::before {
      content:'';
      position:absolute; inset:0;
      background-image: url('../../../images/events/hero/hero-bg.jpg');
      background-position: center center;
      opacity: 0.65;
      filter: grayscale(5%);
    }
    /* Gradient overlay on top of photo */
    .page-hero::after {
      content:'';
      position:absolute; inset:0;
      background: linear-gradient(
        to bottom,
        rgba(8,15,36,.55) 0%,
        rgba(75,0,130,.35) 50%,
        rgba(8,15,36,.65) 100%
      );
    }
    /* All children must sit above the overlays */
    .page-hero > * { position:relative; z-index:2; }

    .reveal { opacity:0; transform:translateY(30px); transition:opacity .65s ease,transform .65s ease; }
    .reveal.visible { opacity:1; transform:translateY(0); }
    .pattern-bg { background-image:radial-gradient(circle at 1px 1px,rgba(201,168,76,.06) 1px,transparent 0); background-size:32px 32px; }

    /* ── Weekly Programs Table ── */
    .programs-table { width:100%; border-collapse:separate; border-spacing:0; }
    .programs-table th { font-family:'Cinzel',serif; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); padding:.8rem 1.2rem; text-align:left; border-bottom:2px solid rgba(201,168,76,.3); }
    .programs-table td { padding:.9rem 1.2rem; vertical-align:middle; border-bottom:1px solid rgba(255,255,255,.05); font-size:.875rem; }
    .programs-table tr:last-child td { border-bottom:none; }
    .programs-table tbody tr { transition:background .2s; }
    .programs-table tbody tr:hover { background:rgba(201,168,76,.05); }

    .day-badge { display:inline-block; padding:.25rem .75rem; border-radius:999px; font-family:'Cinzel',serif; font-weight:700; font-size:.65rem; letter-spacing:.1em; }
    .day-sunday    { background:rgba(201,168,76,.15); color:var(--gold); border:1px solid rgba(201,168,76,.35); }
    .day-monday    { background:rgba(59,130,246,.12); color:#93c5fd; border:1px solid rgba(59,130,246,.25); }
    .day-tuesday   { background:rgba(168,85,247,.12); color:#d8b4fe; border:1px solid rgba(168,85,247,.25); }
    .day-wednesday { background:rgba(34,197,94,.1);  color:#86efac; border:1px solid rgba(34,197,94,.25); }
    .day-thursday  { background:rgba(249,115,22,.1);  color:#fdba74; border:1px solid rgba(249,115,22,.25); }
    .day-friday    { background:rgba(239,68,68,.1);   color:#fca5a5; border:1px solid rgba(239,68,68,.25); }
    .day-saturday  { background:rgba(234,179,8,.1);   color:#fde047; border:1px solid rgba(234,179,8,.25); }

    .ministry-tag { display:inline-block; padding:.15rem .6rem; border-radius:4px; font-size:.65rem; letter-spacing:.06em; }

    /* ── Event Calendar Cards ── */
    .event-card { background:linear-gradient(145deg,rgba(75,0,130,.18),rgba(13,27,62,.9)); border:1px solid rgba(201,168,76,.2); border-radius:14px; overflow:hidden; transition:transform .3s,box-shadow .3s,border-color .3s; display:flex; flex-direction:column; }
    .event-card:hover { transform:translateY(-6px); box-shadow:0 16px 40px rgba(0,0,0,.4),0 0 20px rgba(201,168,76,.1); border-color:rgba(201,168,76,.5); }
    .event-date-block { padding:1.25rem 1.5rem; display:flex; align-items:center; gap:1rem; border-bottom:1px solid rgba(201,168,76,.15); }
    .date-num { font-family:'Cinzel',serif; font-weight:900; font-size:3rem; line-height:1; color:var(--gold); }
    .event-card-body { padding:1.25rem 1.5rem; flex:1; display:flex; flex-direction:column; gap:.75rem; }
    .event-meta { display:flex; align-items:center; gap:6px; font-size:.75rem; color:#9ca3af; }
    .event-meta i { color:var(--gold); width:14px; text-align:center; }

    /* ── Featured event card ── */
    .event-card-featured { border-color:rgba(201,168,76,.5); background:linear-gradient(145deg,rgba(75,0,130,.3),rgba(13,27,62,.95)); }
    .event-card-featured .date-num { font-size:3.5rem; }

    /* ── Calendar embed placeholder ── */
    .calendar-embed { width:100%; min-height:500px; border-radius:16px; overflow:hidden; border:1px solid rgba(201,168,76,.3); background:linear-gradient(145deg,#1a003a,#0d1b3e); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; }

    /* ── Ticker ── */
    @keyframes tickerScroll { from{transform:translateX(100%)} to{transform:translateX(-100%)} }
    .ticker-inner { animation:tickerScroll 30s linear infinite; white-space:nowrap; }
    .ticker-inner:hover { animation-play-state:paused; }

    /* ── Countdown ── */
    .countdown-box { text-align:center; }
    .countdown-num { font-family:'Cinzel',serif; font-weight:900; font-size:2.2rem; color:var(--gold); line-height:1; }
    .countdown-lbl { font-size:.6rem; color:#9ca3af; letter-spacing:.1em; text-transform:uppercase; margin-top:.25rem; }

.countdown-box-glass {
      width: 72px; height: 72px;
      display: flex; align-items: center; justify-content: center;
      border-radius: 14px;
      background: rgba(255,255,255,.1);
      border: 1px solid rgba(201,168,76,.4);
      backdrop-filter: blur(8px);
      box-shadow: 0 4px 20px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.15);
    }
    @media (min-width: 768px) {
      .countdown-box-glass { width: 90px; height: 90px; border-radius: 18px; }
    }
    .countdown-num {
      font-family: 'Cinzel', serif;
      font-weight: 900;
      font-size: 1.8rem;
      color: var(--gold);
      line-height: 1;
      text-shadow: 0 0 20px rgba(201,168,76,.5);
    }
    @media (min-width: 768px) { .countdown-num { font-size: 2.2rem; } }
    .countdown-lbl {
      font-size: .6rem;
      color: rgba(240,232,208,.7);
      letter-spacing: .12em;
      text-transform: uppercase;
    }
  

      .cal-month { background:linear-gradient(145deg,rgba(75,0,130,.18),rgba(13,27,62,.92)); border:1px solid rgba(201,168,76,.2); border-radius:16px; overflow:hidden; transition:transform .3s,box-shadow .3s,border-color .3s; }
      .cal-month:hover { transform:translateY(-4px); box-shadow:0 14px 40px rgba(0,0,0,.35),0 0 18px rgba(201,168,76,.1); border-color:rgba(201,168,76,.45); }
      .cal-month-header { padding:.9rem 1.25rem; display:flex; align-items:center; gap:12px; background:linear-gradient(90deg,rgba(201,168,76,.15),transparent); border-bottom:1px solid rgba(201,168,76,.2); }
      .cal-month-num { width:38px; height:38px; border-radius:10px; flex-shrink:0; background:linear-gradient(135deg,var(--gold-l),var(--gold)); display:flex; align-items:center; justify-content:center; font-family:'Cinzel',serif; font-weight:900; font-size:.85rem; color:#0D1B3E; }
      .cal-month-name { font-family:'Cinzel',serif; font-weight:700; font-size:1rem; color:#fff; }
      .cal-events { padding:.85rem 1.25rem; }
      .cal-event { display:flex; align-items:flex-start; gap:10px; padding:.55rem 0; border-bottom:1px solid rgba(255,255,255,.05); }
      .cal-event:last-child { border-bottom:none; }
      .cal-event-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; margin-top:5px; }
      .cal-event-date { font-family:'Cinzel',serif; font-size:.65rem; color:var(--gold); letter-spacing:.08em; flex-shrink:0; min-width:32px; }
      .cal-event-name { font-size:.8rem; color:#e5e7eb; line-height:1.4; flex:1; }
      .cal-event-tag { display:inline-block; padding:.15rem .55rem; border-radius:999px; font-size:.6rem; letter-spacing:.06em; flex-shrink:0; margin-left:auto; white-space:nowrap; }
      .dot-service{background:var(--gold)} .dot-special{background:#a78bfa} .dot-outreach{background:#34d399}
      .dot-youth{background:#f472b6} .dot-women{background:#e879f9} .dot-men{background:#60a5fa}
      .dot-prayer{background:#fb923c} .dot-admin{background:#94a3b8}
      .tag-service{background:rgba(201,168,76,.12);color:var(--gold);border:1px solid rgba(201,168,76,.3)}
      .tag-special{background:rgba(167,139,250,.12);color:#a78bfa;border:1px solid rgba(167,139,250,.3)}
      .tag-outreach{background:rgba(52,211,153,.1);color:#34d399;border:1px solid rgba(52,211,153,.25)}
      .tag-youth{background:rgba(244,114,182,.1);color:#f472b6;border:1px solid rgba(244,114,182,.25)}
      .tag-women{background:rgba(232,121,249,.1);color:#e879f9;border:1px solid rgba(232,121,249,.25)}
      .tag-men{background:rgba(96,165,250,.1);color:#60a5fa;border:1px solid rgba(96,165,250,.25)}
      .tag-prayer{background:rgba(251,146,60,.1);color:#fb923c;border:1px solid rgba(251,146,60,.25)}
      .tag-admin{background:rgba(148,163,184,.1);color:#94a3b8;border:1px solid rgba(148,163,184,.25)}
    
  
    /* ── Event cards photo backgrounds ── */
    .event-card {
      position: relative;
      overflow: hidden;
    }
    .event-card::before {
      content: '';
      position: absolute;
      inset: 0;
      background-position: center;
      opacity: 0.12;
      filter: grayscale(20%);
      z-index: 0;
      transition: opacity .4s;
    }
    .event-card:hover::before { opacity: 0.2; }
    .event-card > * { position: relative; z-index: 1; }

    /* Assign photo to each card */
    .event-card:nth-child(1)::before { background-image: url('../../../images/events/cards/card-youth.jpeg'); }
    .event-card:nth-child(2)::before { background-image: url('../../../images/events/cards/card-general.jpg'); }
    .event-card:nth-child(3)::before { background-image: url('../../../images/events/cards/card-prayer.jpg'); }
    .event-card:nth-child(4)::before { background-image: url('../../../images/events/cards/card-outreach.jpg'); }
    .event-card:nth-child(5)::before { background-image: url('../../../images/events/cards/card-general.jpg'); }
    .event-card:nth-child(6)::before { background-image: url('../../../images/events/cards/card-youth.jpeg'); }