/*
Theme Name: Rancocas Civic
Template: twentytwentyfive
Description: Child theme for the Rancocas Civic Association website.
Version: 2.0.0
*/

/* ============================================================
   RANCOCAS CIVIC ASSOCIATION — CONTEMPORARY THEME
   Visual redesign: modern sans-serif, card UI, smooth transitions
   ============================================================ */

/* ── Google Fonts ────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ── Custom Properties ───────────────────────────────────────── */
:root {
  --rca-navy:       #8a3b1d;
  --rca-navy-dark:  #6a2a10;
  --rca-green:      #5d6b38;
  --rca-gold:       #d29a2b;
  --rca-light:      #f4ead8;
  --rca-white:      #faf6ed;
  --rca-dark:       #2a1d11;
  --rca-text:       #3a2c1c;
  --rca-muted:      #88785f;
  --rca-border:     #e8dcc8;
  --rca-border-med: #d9c9ad;

  --rca-shadow-xs:  0 1px 2px rgba(0,0,0,.06);
  --rca-shadow-sm:  0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
  --rca-shadow-md:  0 4px 14px rgba(0,0,0,.09), 0 2px 4px rgba(0,0,0,.05);
  --rca-shadow-lg:  0 12px 32px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);

  --rca-radius-sm:  6px;
  --rca-radius-md:  10px;
  --rca-radius-lg:  16px;
  --rca-radius-xl:  24px;

  --rca-transition: 0.18s ease;
}

/* ── Base Typography ─────────────────────────────────────────── */
body,
.wp-site-blocks {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif !important;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--rca-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.wp-block-heading {
  font-family: 'Inter', system-ui, sans-serif !important;
  line-height: 1.2;
  color: var(--rca-navy);
}

h1, .wp-block-heading h1 { letter-spacing: -0.03em; font-weight: 800; }
h2, .wp-block-heading h2 { letter-spacing: -0.025em; font-weight: 700; }
h3, .wp-block-heading h3 { letter-spacing: -0.015em; font-weight: 700; }
h4, .wp-block-heading h4 { font-weight: 600; }

p {
  line-height: 1.75;
  color: var(--rca-text);
}

/* ── Links ───────────────────────────────────────────────────── */
a {
  color: var(--rca-navy);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color var(--rca-transition);
}
a:hover { color: var(--rca-green); }

/* ── Smooth Scroll & Focus Accessibility ────────────────────── */
html { scroll-behavior: smooth; }

*:focus-visible {
  outline: 2px solid var(--rca-gold);
  outline-offset: 3px;
  border-radius: 3px;
}

/* ── Buttons ─────────────────────────────────────────────────── */
.wp-block-button__link,
.wp-element-button {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.01em !important;
  padding: 0.72rem 1.6rem !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: background-color var(--rca-transition),
              color var(--rca-transition),
              transform var(--rca-transition),
              box-shadow var(--rca-transition) !important;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  box-shadow: var(--rca-shadow-sm) !important;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--rca-shadow-md) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: rgba(138,59,29,0.06) !important;
}

/* ── Navigation ──────────────────────────────────────────────── */
.wp-block-navigation,
.wp-block-navigation a {
  font-family: 'Inter', system-ui, sans-serif !important;
}
.wp-block-navigation a {
  font-weight: 500 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.01em !important;
  text-decoration: none !important;
  transition: opacity var(--rca-transition) !important;
}
.wp-block-navigation a:hover { opacity: 0.75 !important; }

/* ── Site Title ──────────────────────────────────────────────── */
.wp-block-site-title,
.wp-block-site-title a {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  text-decoration: none !important;
}

/* ── Hero / Cover Block ──────────────────────────────────────── */
.home .wp-block-cover:first-of-type {
  min-height: 480px !important;
}

.wp-block-cover {
  position: relative;
}
.wp-block-cover::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(138,59,29,0.2) 0%,
    transparent 60%
  );
  pointer-events: none;
}
.wp-block-cover__inner-container {
  position: relative;
  z-index: 2;
}
.wp-block-cover h1 {
  text-shadow: 0 2px 24px rgba(0,0,0,.25) !important;
}

/* ── Page-header navy bands ──────────────────────────────────── */
/* Inner page hero strips with navy background */
.wp-block-group[style*="background-color:#8a3b1d"],
.wp-block-group.has-civic-navy-background-color {
  position: relative;
  overflow: hidden;
}
.wp-block-group[style*="background-color:#8a3b1d"]::before,
.wp-block-group.has-civic-navy-background-color::before {
  content: '';
  position: absolute;
  right: -80px;
  top: -80px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: rgba(255,255,255,.04);
  pointer-events: none;
}
.wp-block-group[style*="background-color:#8a3b1d"]::after,
.wp-block-group.has-civic-navy-background-color::after {
  content: '';
  position: absolute;
  left: -40px;
  bottom: -100px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(210,154,43,.06);
  pointer-events: none;
}

/* Text inside navy bands */
.wp-block-group[style*="background-color:#8a3b1d"] h1,
.wp-block-group[style*="background-color:#8a3b1d"] h2,
.wp-block-group.has-civic-navy-background-color h1,
.wp-block-group.has-civic-navy-background-color h2 {
  letter-spacing: -0.025em !important;
}

/* ── Light Background Section Cards ─────────────────────────── */
/* The 3-column quick-link grid on the home page */
.wp-block-group.has-civic-light-background-color > .wp-block-columns > .wp-block-column,
.wp-block-group[style*="background-color:#f4ead8"] > .wp-block-columns > .wp-block-column {
  background: var(--rca-white);
  border-radius: var(--rca-radius-lg) !important;
  box-shadow: var(--rca-shadow-sm);
  border: 1px solid var(--rca-border);
  transition: box-shadow var(--rca-transition), transform var(--rca-transition);
  overflow: hidden;
}
.wp-block-group.has-civic-light-background-color > .wp-block-columns > .wp-block-column:hover,
.wp-block-group[style*="background-color:#f4ead8"] > .wp-block-columns > .wp-block-column:hover {
  box-shadow: var(--rca-shadow-lg);
  transform: translateY(-4px);
}

/* Colored top accent per card */
.wp-block-group.has-civic-light-background-color > .wp-block-columns > .wp-block-column:nth-child(1),
.wp-block-group[style*="background-color:#f4ead8"] > .wp-block-columns > .wp-block-column:nth-child(1) {
  border-top: 3px solid var(--rca-navy) !important;
}
.wp-block-group.has-civic-light-background-color > .wp-block-columns > .wp-block-column:nth-child(2),
.wp-block-group[style*="background-color:#f4ead8"] > .wp-block-columns > .wp-block-column:nth-child(2) {
  border-top: 3px solid var(--rca-green) !important;
}
.wp-block-group.has-civic-light-background-color > .wp-block-columns > .wp-block-column:nth-child(3),
.wp-block-group[style*="background-color:#f4ead8"] > .wp-block-columns > .wp-block-column:nth-child(3) {
  border-top: 3px solid var(--rca-gold) !important;
}

/* ── Tables ──────────────────────────────────────────────────── */
.wp-block-table {
  margin: 1.5rem 0;
}
.wp-block-table table {
  border-collapse: collapse;
  width: 100%;
  border-radius: var(--rca-radius-md);
  overflow: hidden;
  box-shadow: var(--rca-shadow-sm);
  border: 1px solid var(--rca-border);
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.95rem;
}
.wp-block-table th {
  background: var(--rca-navy) !important;
  color: #ffffff !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 0.85rem 1.25rem !important;
  text-align: left !important;
  border: none !important;
}
.wp-block-table td {
  padding: 0.8rem 1.25rem !important;
  border: none !important;
  border-bottom: 1px solid var(--rca-border) !important;
  color: var(--rca-text) !important;
  vertical-align: middle;
}
.wp-block-table tbody tr:last-child td {
  border-bottom: none !important;
}
.wp-block-table tbody tr:nth-child(even) td {
  background: #faf5ea !important;
}
.wp-block-table tbody tr:hover td {
  background: #f7ecd8 !important;
  transition: background var(--rca-transition);
}
.wp-block-table figcaption {
  font-size: 0.85rem;
  color: var(--rca-muted);
  margin-top: 0.5rem;
  font-style: italic;
}

/* ── Separators ──────────────────────────────────────────────── */
.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
  border: none !important;
  height: 1px !important;
  background: var(--rca-border) !important;
  opacity: 1 !important;
  margin: 2rem auto !important;
}

/* ── Query Loop / Post Cards ─────────────────────────────────── */
.wp-block-post-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
}
.wp-block-post-title a {
  color: var(--rca-navy) !important;
  text-decoration: none !important;
  transition: color var(--rca-transition) !important;
}
.wp-block-post-title a:hover { color: var(--rca-green) !important; }

.wp-block-post-date,
.wp-block-post-date time {
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  color: var(--rca-muted) !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  font-family: 'Inter', system-ui, sans-serif !important;
}

.wp-block-post-excerpt p,
.wp-block-post-excerpt__excerpt {
  font-size: 0.95rem !important;
  color: #6b5d4d !important;
  line-height: 1.65 !important;
}

/* ── Latest Posts Block ──────────────────────────────────────── */
.wp-block-latest-posts {
  padding: 0 !important;
}
.wp-block-latest-posts li {
  border-radius: var(--rca-radius-md);
  background: var(--rca-white);
  box-shadow: var(--rca-shadow-sm);
  border: 1px solid var(--rca-border);
  transition: box-shadow var(--rca-transition), transform var(--rca-transition);
  overflow: hidden;
  list-style: none;
  margin-bottom: 1rem;
}
.wp-block-latest-posts li:hover {
  box-shadow: var(--rca-shadow-lg);
  transform: translateY(-2px);
}
.wp-block-latest-posts__post-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  color: var(--rca-navy) !important;
  text-decoration: none !important;
}
.wp-block-latest-posts__post-title:hover { color: var(--rca-green) !important; }

/* ── The Events Calendar (TEC) ───────────────────────────────── */
.tribe-common,
.tribe-events,
.tribe-events * {
  font-family: 'Inter', system-ui, sans-serif !important;
}

/* List-view event cards */
.tribe-events-calendar-list__event-article {
  border-radius: var(--rca-radius-md) !important;
  border: 1px solid var(--rca-border) !important;
  box-shadow: var(--rca-shadow-sm) !important;
  transition: box-shadow var(--rca-transition), transform var(--rca-transition) !important;
  margin-bottom: 1.25rem !important;
  overflow: hidden !important;
  background: var(--rca-white) !important;
}
.tribe-events-calendar-list__event-article:hover {
  box-shadow: var(--rca-shadow-md) !important;
  transform: translateY(-2px) !important;
}

/* Event title */
.tribe-events-calendar-list__event-title-link {
  color: var(--rca-navy) !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  text-decoration: none !important;
}
.tribe-events-calendar-list__event-title-link:hover {
  color: var(--rca-green) !important;
}

/* Date badge */
.tribe-events-calendar-list__event-date-tag-datetime,
.tribe-events-calendar-list__event-date-tag-daynum {
  background: var(--rca-navy) !important;
  color: #ffffff !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 700 !important;
  border-radius: var(--rca-radius-sm) !important;
}

/* TEC navigation */
.tribe-events-c-nav__next,
.tribe-events-c-nav__prev,
.tribe-events-c-nav__next-text,
.tribe-events-c-nav__prev-text {
  color: var(--rca-navy) !important;
  font-weight: 600 !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  transition: color var(--rca-transition) !important;
}
.tribe-events-c-nav__next:hover,
.tribe-events-c-nav__prev:hover {
  color: var(--rca-green) !important;
}

/* TEC header */
.tribe-events-header__title,
.tribe-events-pro-photo__header-title {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  color: var(--rca-navy) !important;
}

/* TEC event meta (time, location) */
.tribe-events-calendar-list__event-datetime,
.tribe-event-url {
  font-size: 0.9rem !important;
  color: var(--rca-muted) !important;
}

/* ── WPForms ─────────────────────────────────────────────────── */
.wpforms-container {
  font-family: 'Inter', system-ui, sans-serif !important;
}
.wpforms-container label,
.wpforms-form label {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  color: #3a2c1c !important;
  display: block !important;
  margin-bottom: 0.35rem !important;
  letter-spacing: 0.01em !important;
}
.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="tel"],
.wpforms-container input[type="url"],
.wpforms-container input[type="number"],
.wpforms-container textarea,
.wpforms-container select {
  font-family: 'Inter', system-ui, sans-serif !important;
  border: 1.5px solid var(--rca-border-med) !important;
  border-radius: var(--rca-radius-sm) !important;
  padding: 0.68rem 0.875rem !important;
  font-size: 0.95rem !important;
  color: var(--rca-text) !important;
  background: #ffffff !important;
  width: 100% !important;
  transition: border-color var(--rca-transition), box-shadow var(--rca-transition) !important;
}
.wpforms-container input:focus,
.wpforms-container textarea:focus,
.wpforms-container select:focus {
  border-color: var(--rca-navy) !important;
  box-shadow: 0 0 0 3px rgba(138,59,29,.1) !important;
  outline: none !important;
}
.wpforms-container textarea { min-height: 130px; resize: vertical; }
.wpforms-container .wpforms-submit-container { margin-top: 1rem; }
.wpforms-container .wpforms-submit,
button[type="submit"].wpforms-submit {
  background: var(--rca-navy) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: var(--rca-radius-sm) !important;
  padding: 0.72rem 2rem !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.01em !important;
  cursor: pointer !important;
  transition: background var(--rca-transition), transform var(--rca-transition), box-shadow var(--rca-transition) !important;
  box-shadow: var(--rca-shadow-sm) !important;
}
.wpforms-container .wpforms-submit:hover {
  background: var(--rca-green) !important;
  transform: translateY(-1px) !important;
  box-shadow: var(--rca-shadow-md) !important;
}

/* ── Social Links ────────────────────────────────────────────── */
.wp-block-social-links .wp-block-social-link {
  transition: opacity var(--rca-transition), transform var(--rca-transition);
}
.wp-block-social-links .wp-block-social-link:hover {
  opacity: 0.8;
  transform: translateY(-2px);
}

/* ── Lists ───────────────────────────────────────────────────── */
.wp-block-list li,
ul li, ol li {
  font-family: 'Inter', system-ui, sans-serif;
  line-height: 1.75;
  color: var(--rca-text);
  margin-bottom: 0.3rem;
}

/* ── Paragraphs in content ───────────────────────────────────── */
.entry-content p,
.wp-block-post-content p {
  max-width: 70ch;
}

/* ── Green Remind Banner ─────────────────────────────────────── */
.wp-block-group[style*="background-color:#5d6b38"] h3 {
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}
.wp-block-group[style*="background-color:#5d6b38"] p {
  line-height: 1.65 !important;
}

/* ── Footer ──────────────────────────────────────────────────── */
.wp-block-group[style*="background-color:#8a3b1d"] .wp-block-navigation a {
  font-size: 0.88rem !important;
  opacity: 0.85;
}
.wp-block-group[style*="background-color:#8a3b1d"] .wp-block-navigation a:hover {
  opacity: 1;
}
.wp-block-group[style*="background-color:#8a3b1d"] h4 {
  font-size: 0.8rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,.6) !important;
  font-weight: 600 !important;
  margin-bottom: 0.75rem !important;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .wp-block-columns {
    gap: 1rem !important;
  }
  .wp-block-group.has-civic-light-background-color > .wp-block-columns > .wp-block-column {
    margin-bottom: 0.75rem;
  }
  .home .wp-block-cover:first-of-type {
    min-height: 360px !important;
  }
}

@media (max-width: 480px) {
  h1 { font-size: 1.9rem; }
  h2 { font-size: 1.45rem; }
}

/* ── Upcoming Events (homepage shortcode) ───────────────────── */
.rca-upcoming-events {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.9rem;
}
li.rca-upcoming-event {
  margin: 0;
  padding: 1.05rem 1.3rem;
  background: var(--rca-white);
  border: 1px solid var(--rca-border);
  border-left: 4px solid var(--rca-navy);
  border-radius: var(--rca-radius-sm);
  box-shadow: var(--rca-shadow-xs);
  transition: box-shadow var(--rca-transition), transform var(--rca-transition);
}
li.rca-upcoming-event:hover {
  box-shadow: var(--rca-shadow-md);
  transform: translateY(-2px);
}
.rca-upcoming-date {
  display: block;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--rca-gold);
  margin-bottom: 0.25rem;
}
.rca-upcoming-title {
  display: block;
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 700;
  font-size: 1.02rem;
  color: var(--rca-navy);
  text-decoration: none;
  line-height: 1.35;
}
.rca-upcoming-title:hover {
  color: var(--rca-green);
}