/*
Theme Name: Unity Fellowship
Theme URI: https://unity.rayevision.co.za
Author: Rayevision
Author URI: https://www.rayevision.co.za
Description: A modern, fully editable Full Site Editing (FSE) block theme built for Unity Fellowship Church. Gold & navy brand palette taken from the church logo, elegant Playfair Display + Inter typography, and section patterns a non-technical admin can edit entirely from the WordPress Site Editor — no code, no Bootstrap, no page-builder bloat.
Version: 1.5.5
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: unity-fellowship
Tags: full-site-editing, block-patterns, custom-colors, custom-logo, custom-menu, editor-style, featured-images, threaded-comments, translation-ready, wide-blocks
*/

/* ==========================================================================
   Unity Fellowship — light progressive enhancements.
   The bulk of styling lives in theme.json (colors, typography, spacing,
   element styles) so it stays editable in the Site Editor. This file only
   adds transitions and a few layout niceties that theme.json can't express.
   ========================================================================== */

:root {
  --uf-transition: 220ms cubic-bezier(.4, 0, .2, 1);
}

/* Real brand logo in header */
.site-header .custom-logo{height:auto;max-height:56px;width:auto}

/* Adore-style slim top utility bar */
.site-header .header-topbar{border-bottom:1px solid rgba(27,27,111,.10)}
.site-header .header-topbar .uf-social .wp-block-social-link{margin:0 2px}
.site-header .header-topbar .uf-quicklinks{color:var(--wp--preset--color--muted);letter-spacing:.02em}
.site-header .header-topbar .uf-quicklinks a{color:var(--wp--preset--color--primary-deep);text-decoration:none;font-weight:600}
.site-header .header-topbar .uf-quicklinks a:hover{color:var(--wp--preset--color--secondary)}

/* Main bar nav — uppercase Adore feel */
.site-header .header-main .uf-nav a{color:var(--wp--preset--color--primary-deep)}
.site-header .header-main .uf-nav .current-menu-item > a{color:var(--wp--preset--color--secondary)}
.site-header .header-main{box-shadow:0 1px 0 rgba(27,27,111,.06)}

/* Dropdown submenus (Media, Get Involved) — navy panel with light text */
.site-header .header-main .uf-nav .wp-block-navigation__submenu-container{
  background:var(--wp--preset--color--primary-deep);
  border:none;border-radius:6px;padding:6px 0;min-width:215px;
  box-shadow:0 20px 44px -18px rgba(18,18,63,.55)}
.site-header .header-main .uf-nav .wp-block-navigation__submenu-container a,
.site-header .header-main .uf-nav .wp-block-navigation__submenu-container a:visited{color:var(--wp--preset--color--cream)}
.site-header .header-main .uf-nav .wp-block-navigation__submenu-container a:hover{color:var(--wp--preset--color--secondary-light)}
.site-header .header-main .uf-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content{padding:9px 20px}

/* Keep button labels on one line (fixes "Give Now" wrapping on mobile) */
.wp-block-button__link {
  white-space: nowrap;
}

/* ===== Mobile menu — clean full-screen modal: centered links, X top-right ===== */
.site-header .wp-block-navigation__responsive-container.is-menu-open{
  background:linear-gradient(160deg,#1B1B6F 0%,#12123F 100%)!important;padding:0}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content{
  width:100%;height:100%;align-items:center;justify-content:flex-start;padding:84px 24px 40px;overflow-y:auto}
.site-header .is-menu-open .wp-block-navigation__container{
  flex-direction:column;align-items:center;gap:0;width:100%;max-width:520px;margin:0 auto}
.site-header .is-menu-open .wp-block-navigation-item{width:100%;text-align:center;border-bottom:1px solid rgba(255,255,255,.08)}
.site-header .is-menu-open .wp-block-navigation-item__content{
  display:block;width:100%;padding:15px 10px;font-family:'Playfair Display',Georgia,serif;font-size:1.3rem;font-weight:600;
  color:#fff!important;letter-spacing:.01em;text-transform:none}
.site-header .is-menu-open .wp-block-navigation-item__content:hover,
.site-header .is-menu-open .current-menu-item>.wp-block-navigation-item__content{color:var(--wp--preset--color--secondary-light)!important}
/* sub-menu items shown flat & lighter under their parent */
.site-header .is-menu-open .wp-block-navigation__submenu-container{
  position:static!important;opacity:1!important;visibility:visible!important;transform:none!important;
  background:transparent!important;border:none!important;box-shadow:none!important;padding:0!important;margin:0!important;width:100%}
.site-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item{border-bottom:none}
.site-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  font-family:'Inter',sans-serif;font-size:.95rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--wp--preset--color--secondary-light)!important;padding:9px 10px}
.site-header .is-menu-open .wp-block-navigation-submenu__toggle{display:none!important}
.site-header .is-menu-open .wp-block-navigation__submenu-icon{display:none!important}
/* big gold X close, top-right */
.site-header .is-menu-open .wp-block-navigation__responsive-container-close{
  top:22px;right:22px;width:48px;height:48px;color:var(--wp--preset--color--secondary-light)!important}
.site-header .is-menu-open .wp-block-navigation__responsive-container-close svg{width:32px;height:32px;fill:currentColor}

/* Mobile header: centered logo + Give Now, hamburger pinned to the right */
@media (max-width: 781px) {
  .site-header .header-topbar {
    justify-content: center;
    text-align: center;
  }
  .site-header .header-main {
    position: relative;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    row-gap: 12px;
    padding-top: 0.85rem;
    padding-bottom: 0.95rem;
  }
  .site-header .header-main > .wp-block-site-logo {
    order: 1;
    margin: 0;
  }
  .site-header .header-main > .wp-block-group {
    order: 2;
    width: auto;
    justify-content: center;
  }
  .site-header .header-main .wp-block-buttons {
    justify-content: center;
  }
  /* Hamburger pinned top-right. NOTE: never use transform/filter here — it would
     create a containing block and trap the fixed full-screen menu overlay. */
  .site-header .header-main .wp-block-navigation {
    position: absolute;
    top: 1.05rem;
    right: 0.6rem;
    margin: 0;
    z-index: 130;
  }
  .site-header .header-main .wp-block-navigation__responsive-container-open {
    padding: 6px;
  }
}

/* Smooth, modern interactions */
a,
.wp-block-button__link,
.wp-block-image img,
.uf-card {
  transition: color var(--uf-transition), background-color var(--uf-transition),
    border-color var(--uf-transition), transform var(--uf-transition),
    box-shadow var(--uf-transition);
}

.wp-block-button__link:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px -10px rgba(18, 18, 63, .45);
}

/* Sticky, subtly elevated header.
   NOTE: do NOT add backdrop-filter/filter/transform here — it creates a
   containing block that traps the mobile menu's fixed full-screen overlay. */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 1px 0 rgba(18, 18, 63, .06);
  background: rgba(255, 255, 255, .96);
}

.header-main {
  box-shadow: 0 6px 24px -18px rgba(18, 18, 63, .55);
}

/* Navigation link underline-on-hover (gold) */
.site-header .wp-block-navigation .wp-block-navigation-item__content {
  font-weight: 500;
  padding-bottom: 2px;
  border-bottom: 2px solid transparent;
}
.site-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.site-header .wp-block-navigation .current-menu-item .wp-block-navigation-item__content {
  border-bottom-color: var(--wp--preset--color--secondary);
}

/* Feature / info cards lift on hover */
.uf-card {
  height: 100%;
}
.uf-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 22px 40px -24px rgba(18, 18, 63, .55);
}

/* Hero: ensure cover text sits comfortably on tall screens */
.uf-hero.wp-block-cover {
  min-height: 78vh;
}
@media (max-width: 781px) {
  .uf-hero.wp-block-cover {
    min-height: 70vh;
  }
}

/* A thin gold rule used as a section eyebrow accent */
.uf-eyebrow {
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 600;
}

/* Decorative gold divider under headings (optional utility) */
.uf-divider::after {
  content: "";
  display: block;
  width: 64px;
  height: 3px;
  margin: 1rem auto 0;
  background: var(--wp--preset--color--secondary);
  border-radius: 3px;
}
.uf-divider.has-text-align-left::after {
  margin-left: 0;
}

/* Footer link hover */
.site-footer a:hover {
  color: var(--wp--preset--color--secondary-light) !important;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
  }
}