/*
Theme Name: Columbia Chapter No. 1
Description: Child theme of Twenty Twenty-Five for Columbia Chapter No. 1, Royal Arch Masons, Washington D.C. Chapter red and silver branding.
Author: jsmith
Template: twentytwentyfive
Version: 1.1.0
Requires at least: 6.7
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: columbia-chapter
*/

/* -----------------------------------------------------------------------
   Base safety net — most sizing/type/color lives in theme.json. This file
   only carries what theme.json cannot express: pseudo-elements, hover
   states on specific components, and the mobile navigation overlay.
   ----------------------------------------------------------------------- */

html {
	overflow-x: hidden;
}

body {
	overflow-x: hidden;
}

img {
	max-width: 100%;
	height: auto;
}

::selection {
	background-color: var(--wp--preset--color--accent-1);
	color: var(--wp--preset--color--base);
}

:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent-1);
	outline-offset: 2px;
}

/* -----------------------------------------------------------------------
   Section labels — small-caps "eyebrow" text used above headings to evoke
   formal, lodge-notice typography without resorting to kitsch.
   ----------------------------------------------------------------------- */

.u-eyebrow {
	margin: 0 0 0.5em;
	color: var(--wp--preset--color--accent-1);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
}

.has-contrast-background-color .u-eyebrow,
.cta-band .u-eyebrow {
	color: var(--wp--preset--color--accent-6);
	opacity: 0.75;
}

/* -----------------------------------------------------------------------
   Cards — flat, bordered, no drop shadows. A hairline border reads as
   engraved/architectural rather than "floating dashboard panel."
   ----------------------------------------------------------------------- */

.u-card {
	transition: border-color 0.15s ease;
}

.u-card:hover {
	border-color: var(--wp--preset--color--accent-2);
}

/* -----------------------------------------------------------------------
   Header
   ----------------------------------------------------------------------- */

.site-header__kicker {
	margin: 0;
	color: var(--wp--preset--color--accent-2);
	letter-spacing: 0.02em;
}

@media (max-width: 600px) {
	.site-header__kicker {
		display: none;
	}
}

/* Navigation submenu popover (the "What Is the Royal Arch" dropdown) */
.wp-block-navigation__submenu-container {
	background-color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--accent-5);
	border-radius: 2px;
	padding: var(--wp--preset--spacing--20) 0;
}

.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
}

.wp-block-navigation__submenu-container .wp-block-navigation-item:hover > .wp-block-navigation-item__content {
	background-color: var(--wp--preset--color--accent-3);
}

/* Mobile navigation overlay */
.wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--wp--preset--color--contrast);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
	color: var(--wp--preset--color--accent-6);
	font-family: var(--wp--preset--font-family--heading-serif);
	font-size: var(--wp--preset--font-size--large);
	text-transform: none;
	letter-spacing: normal;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--accent-1);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-open svg {
	fill: var(--wp--preset--color--accent-6);
}

/* -----------------------------------------------------------------------
   Footer
   ----------------------------------------------------------------------- */

.site-footer a {
	color: var(--wp--preset--color--accent-6);
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-color: var(--wp--preset--color--accent-2);
}

.site-footer a:hover {
	color: var(--wp--preset--color--base);
	text-decoration-color: var(--wp--preset--color--base);
}

.site-footer__label {
	margin: 0;
	color: var(--wp--preset--color--accent-2);
}

.site-footer__rule {
	opacity: 0.6;
}

.site-footer__seal img {
	display: block;
	opacity: 0.92;
	transition: opacity 0.15s ease;
}

.site-footer__seal:hover img {
	opacity: 1;
}

/* -----------------------------------------------------------------------
   CTA band
   ----------------------------------------------------------------------- */

.cta-band {
	border-top: 3px solid var(--wp--preset--color--accent-1);
}

/* -----------------------------------------------------------------------
   FAQ accordion (core/details)
   ----------------------------------------------------------------------- */

.wp-block-details {
	border-bottom: 1px solid var(--wp--preset--color--accent-5);
	padding: var(--wp--preset--spacing--40) 0;
}

.wp-block-details:first-of-type {
	border-top: 1px solid var(--wp--preset--color--accent-5);
}

.wp-block-details summary {
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	font-family: var(--wp--preset--font-family--heading-serif);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::after {
	content: "+";
	flex-shrink: 0;
	font-family: var(--wp--preset--font-family--body-sans);
	font-size: 1.5em;
	line-height: 1;
	color: var(--wp--preset--color--accent-1);
}

.wp-block-details[open] summary::after {
	content: "\2212";
}

.wp-block-details summary:hover {
	color: var(--wp--preset--color--accent-1);
}

.wp-block-details p {
	margin-top: var(--wp--preset--spacing--30);
}

/* -----------------------------------------------------------------------
   Motion
   ----------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.u-card,
	.site-footer__seal img {
		transition: none;
	}
}

/*--------------------------------------------------------------
# Member Portal (cc1-portal shortcode)
--------------------------------------------------------------*/
/* Full-bleed within the portal template's main; cards flow into a
   screen-responsive grid rather than a single narrow column. */
.cc1-portal{width:100%;max-width:none;margin:0}
.cc1-portal__eyebrow{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:#b01b22;font-weight:700;margin:0 0 .25rem}
.cc1-portal__greeting{margin:0 0 .5rem}
.cc1-portal__meta{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:0 0 1.5rem}
.cc1-portal__badge{display:inline-block;background:#701114;color:#fff;font-size:.8rem;font-weight:600;padding:.2rem .7rem;border-radius:999px}
.cc1-portal__office{color:#75787b;font-size:.9rem}
.cc1-portal__cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));gap:1.25rem;align-items:start}
.cc1-portal__card{border:1px solid #e6e6e8;border-radius:6px;padding:1.5rem;margin:0;background:#fff}
.cc1-portal__card h3{margin:0 0 .75rem;font-size:1.15rem}
.cc1-portal__card--dues.cc1-portal__card--dues-expired{border-left:4px solid #b01b22}
.cc1-portal__card--dues.cc1-portal__card--dues-good{border-left:4px solid #2e7d32}
.cc1-portal__card--dues.cc1-portal__card--dues-lifetime{border-left:4px solid #b8912f}
.cc1-portal__dues-label{font-weight:600;margin:0 0 .25rem}
.cc1-portal__muted{color:#75787b}
.cc1-portal__events{list-style:none;margin:0;padding:0}
.cc1-portal__event{display:flex;gap:1rem;align-items:flex-start;padding:.6rem 0;border-bottom:1px solid #f0f0f1}
.cc1-portal__event:last-child{border-bottom:0}
.cc1-portal__date{flex:0 0 auto;text-align:center;background:#faf7f5;border:1px solid #e6e6e8;border-radius:4px;padding:.35rem .55rem;line-height:1.1;min-width:3rem}
.cc1-portal__mon{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:#b01b22;font-weight:700}
.cc1-portal__day{display:block;font-size:1.25rem;font-weight:700}
.cc1-portal__event-meta{display:block;color:#75787b;font-size:.85rem}
.cc1-portal__grid{list-style:none;margin:0 0 .75rem;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}
.cc1-portal__grid a{display:block;border:1px solid #e6e6e8;border-radius:4px;padding:.6rem .8rem;text-decoration:none;font-weight:600}
.cc1-portal__grid a:hover{border-color:#b01b22;background:#faf7f5}
.cc1-portal__link{font-weight:600}
.cc1-rsvp{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;margin:.5rem 0 0}
.cc1-rsvp__label{font-size:.8rem;color:#75787b;margin-right:.15rem}
.cc1-rsvp__btn{display:inline-block;font-size:.8rem;font-weight:700;line-height:1;padding:.35rem .7rem;border-radius:999px;border:1.5px solid #e6e6e8;text-decoration:none;color:#1c1c1e}
.cc1-rsvp__btn--yes:hover,.cc1-rsvp__btn--yes.is-active{background:#2e7d32;border-color:#2e7d32;color:#fff}
.cc1-rsvp__btn--no:hover,.cc1-rsvp__btn--no.is-active{background:#b01b22;border-color:#b01b22;color:#fff}
.cc1-portal--locked{text-align:center;max-width:34rem;padding:2rem 0}
@media(max-width:600px){.cc1-portal__grid{grid-template-columns:1fr}}
