/* Theme Name: Neve Child - PCASL Theme URI: https://plattecanyonadultsoftballleague.com/ Description: Clean, minimalist refresh for the Platte Canyon Adult Softball League. Child theme of Neve. Layers modern styling on top of Neve + Elementor without touching page content. Author: PCASL Template: neve Version: 2.1.0 Text Domain: neve-child-pcasl */ /* ========================================================================= Fonts ========================================================================= */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@600;700;800&display=swap'); /* ========================================================================= Design tokens (brand palette pulled from the PCASL logo) ========================================================================= */ :root { --pc-green: #1f6b3b; /* forest pines */ --pc-green-dark: #144d2a; --pc-green-soft: #eaf3ec; --pc-red: #e2431e; /* PCASL lettering / stitching */ --pc-red-dark: #b8330f; --pc-charcoal: #1f2933; /* body text */ --pc-slate: #52606d; /* muted text */ --pc-cream: #faf9f6; /* page background */ --pc-white: #ffffff; --pc-line: #e7e7e2; /* hairline borders */ --pc-radius: 14px; --pc-radius-sm: 8px; --pc-shadow: 0 1px 2px rgba(16,24,32,.04), 0 8px 24px rgba(16,24,32,.06); --pc-shadow-lg: 0 12px 40px rgba(16,24,32,.12); --pc-maxw: 1120px; } /* ========================================================================= Global base ========================================================================= */ /* Cream lives on so the fixed logo watermark (below) can show through the transparent body/content wrappers. */ html { background-color: var(--pc-cream); scroll-behavior: smooth; } /* One-page scrolling: space each section, and offset anchor jumps so the sticky header doesn't cover the section heading. */ .pc-anchor { scroll-margin-top: 90px; padding: 2.5rem 0; } body, .nv-content-wrap, .site-content { background-color: transparent !important; color: var(--pc-charcoal); font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size: 17px; line-height: 1.65; -webkit-font-smoothing: antialiased; } /* Full-page logo watermark — faint, centered, on every page (like the live home page). */ body::before { content: ""; position: fixed; inset: 0; z-index: -1; /* behind all content, above the cream background */ pointer-events: none; background-image: url("/wp-content/uploads/2024/03/PCASL_Color-1024x890.jpg"); background-repeat: no-repeat; background-position: center 44%; background-size: min(660px, 78vw); opacity: 0.06; } h1, h2, h3, h4, h5, .elementor-heading-title, .entry-title { font-family: 'Poppins', 'Inter', sans-serif; color: var(--pc-charcoal); line-height: 1.15; letter-spacing: -0.01em; font-weight: 700; } h1, .entry-title { font-size: clamp(2rem, 4vw, 3rem); } h2 { font-size: clamp(1.6rem, 3vw, 2.25rem); } h3 { font-size: clamp(1.25rem, 2vw, 1.6rem); } a { color: var(--pc-green); text-decoration: none; transition: color .15s ease; } a:hover { color: var(--pc-red); } .container, .nv-content-wrap { max-width: var(--pc-maxw); } /* Subtle entrance polish for main content */ .nv-single-post-wrap, .neve-main > .container { padding-top: 1rem; } /* ========================================================================= Header / navigation (Neve markup) ========================================================================= */ .header--row, .site-header, #masthead { background: var(--pc-white) !important; box-shadow: 0 1px 0 var(--pc-line), 0 4px 18px rgba(16,24,32,.04); } /* Sticky header is handled by JavaScript (see functions.php → pcasl_sticky_header). It toggles position:fixed on the
as you scroll, which — unlike CSS position:sticky — does NOT depend on ancestor overflow, so it works reliably on real iOS/Safari devices where CSS sticky was silently failing (older Safari ignores `overflow: clip`). The .pc-fixed-header class + its styles live in functions.php so the whole feature is self-contained. */ .builder-item--logo img, .site-logo img, .custom-logo-link img { max-height: 66px; width: auto; transition: transform .2s ease; } .builder-item--logo a:hover img { transform: scale(1.03); } /* Nav links */ .nv-navbar .menu > li > a, .header-menu-sidebar .menu > li > a, .primary-menu-ul > li > a { font-family: 'Inter', sans-serif; font-weight: 600; font-size: 15px; letter-spacing: .01em; color: var(--pc-charcoal); padding: 8px 14px; border-radius: var(--pc-radius-sm); transition: color .15s ease, background .15s ease; } .nv-navbar .menu > li > a:hover, .primary-menu-ul > li > a:hover, .primary-menu-ul > li.current-menu-item > a { color: var(--pc-green); background: var(--pc-green-soft); } /* Nav hover — replace Neve's grey with the soft-green row hover (like the standings tables), for BOTH the mobile/hamburger sidebar and the desktop primary menu. High specificity + !important to beat Neve's Customizer- generated hover color, and background-image:none kills any hover overlay. */ .header-menu-sidebar-bg .nav-ul li:hover, .header-menu-sidebar-bg .nav-ul li:focus-within, .header-menu-sidebar-bg .nav-ul li.current-menu-item, .header-menu-sidebar .nav-ul li:hover > .wrap, .header-menu-sidebar .nav-ul li:focus-within > .wrap, .header-menu-sidebar .nav-ul li:hover > .wrap > a, .header-menu-sidebar .nav-ul li:hover > .wrap > .caret-wrap, .header-menu-sidebar .nav-ul li:hover > .wrap button, .header-menu-sidebar .nav-ul li.current-menu-item > .wrap > a, .nv-nav-wrap .primary-menu-ul li:hover, .nv-nav-wrap .primary-menu-ul li:hover > .wrap, .nv-nav-wrap .primary-menu-ul li:hover > .wrap > a, .nv-nav-wrap .primary-menu-ul li.current-menu-item > .wrap > a { background-color: var(--pc-green-soft) !important; background-image: none !important; color: var(--pc-green) !important; } .nav-ul li > .wrap { padding: 0px; } .header-menu-sidebar .nav-ul li:not([class*=block]) > .wrap > a { padding: 15px 4px; } /* Centered tagline pill — the HTML element pasted into the header's center slot */ .hdr__tagline { display: inline-block; text-transform: uppercase; letter-spacing: .12em; font-size: 13px; font-weight: 700; line-height: 1; color: var(--pc-green); background: var(--pc-green-soft); padding: 8px 16px; border-radius: 999px; white-space: nowrap; } /* On mobile the Neve header collapses to logo + hamburger and pushes any center element onto its own row. Hide the decorative tagline there so the header stays a clean single row (the logo already carries the brand). */ @media (max-width: 782px) { .hdr__tagline { display: none !important; } } /* ========================================================================= Buttons (Elementor, WPForms, Neve, and PCASL custom) ========================================================================= */ .elementor-button, .wp-block-button__link, .button, button.button, input[type="submit"], .wpforms-submit, .pc-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; background: var(--pc-red) !important; color: #fff !important; font-family: 'Inter', sans-serif; font-weight: 600; font-size: 16px; line-height: 1; padding: 15px 30px !important; border: 0 !important; border-radius: 999px !important; box-shadow: 0 6px 16px rgba(226,67,30,.28); cursor: pointer; transition: transform .12s ease, box-shadow .12s ease, background .15s ease; } .elementor-button:hover, .wp-block-button__link:hover, .button:hover, input[type="submit"]:hover, .wpforms-submit:hover, .pc-btn:hover { background: var(--pc-red-dark) !important; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(226,67,30,.34); color:#fff !important; } .pc-btn--green { background: var(--pc-green) !important; box-shadow: 0 6px 16px rgba(31,107,59,.28); } .pc-btn--green:hover { background: var(--pc-green-dark) !important; box-shadow: 0 10px 24px rgba(31,107,59,.34);} .pc-btn--ghost { background: transparent !important; color: var(--pc-green) !important; box-shadow: inset 0 0 0 2px var(--pc-green); } .pc-btn--ghost:hover { background: var(--pc-green) !important; color:#fff !important; } /* White button for use on colored bands (e.g. the green/dark CTA sections) */ .pc-btn--white { background: #fff !important; color: var(--pc-red) !important; box-shadow: 0 6px 16px rgba(16,24,32,.18); } .pc-btn--white:hover { background: #fff !important; color: var(--pc-red-dark) !important; } /* ========================================================================= PCASL custom components (used by the paste-ready snippets) ========================================================================= */ /* --- Hero --- */ .pc-hero { text-align: center; padding: 3rem 1.25rem 2.5rem; } .pc-hero__logo img { max-width: 260px; height: auto; } .pc-hero__eyebrow { display:inline-block; text-transform: uppercase; letter-spacing: .14em; font-size: 13px; font-weight: 700; color: var(--pc-green); background: var(--pc-green-soft); padding: 6px 14px; border-radius: 999px; margin-bottom: 1rem; } .pc-hero h1 { margin: .25rem 0 .5rem; } .pc-hero__sub { color: var(--pc-slate); font-size: 1.15rem; max-width: 640px; margin: 0 auto 1.5rem; } /* --- Full-width CTA band --- */ .pc-cta { background: linear-gradient(135deg, var(--pc-green) 0%, var(--pc-green-dark) 100%); color: #fff; border-radius: var(--pc-radius); padding: 2.5rem 1.5rem; text-align: center; box-shadow: var(--pc-shadow); margin: 2.5rem auto; max-width: var(--pc-maxw); } .pc-cta h2 { color:#fff; margin:0 0 .5rem; } .pc-cta p { color: rgba(255,255,255,.9); margin: 0 auto 1.4rem; max-width: 560px; } /* --- Contact details (email / phone) — cleanly centered, aligned rows --- */ .pc-contact { display: flex; flex-direction: column; align-items: center; gap: .55rem; margin: 0 auto 1.5rem; } .pc-contact a { display: inline-flex; align-items: center; gap: .55rem; color: #fff !important; font-size: 1.1rem; text-decoration: none; word-break: break-word; text-align: center; } .pc-contact a:hover { text-decoration: underline; } /* --- Section heading --- */ .pc-section-title { text-align:center; margin: 2.5rem 0 1.75rem; } .pc-section-title .eyebrow { text-transform: uppercase; letter-spacing:.14em; font-size:13px; font-weight:700; color: var(--pc-red); } .pc-section-title h2 { margin:.35rem 0 0; } /* ========================================================================= Standings — two-division layout ========================================================================= */ .pc-standings { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; max-width: var(--pc-maxw); margin: 0 auto; } .pc-division { background: var(--pc-white); border: 1px solid var(--pc-line); border-radius: var(--pc-radius); box-shadow: var(--pc-shadow); overflow: hidden; } .pc-division__head { display:flex; align-items:center; gap:.6rem; padding: 1rem 1.25rem; color:#fff; font-family:'Poppins',sans-serif; font-weight:700; font-size:1.05rem; letter-spacing:.02em; } .pc-division--wed .pc-division__head { background: var(--pc-green); } .pc-division--thu .pc-division__head { background: var(--pc-red); } .pc-division__tag { font-size:11px; text-transform:uppercase; letter-spacing:.12em; background: rgba(255,255,255,.22); padding:3px 9px; border-radius:999px; font-weight:700; } /* Standings table */ .pc-standings table, table.pc-standings-table { width:100%; border-collapse: collapse; font-size: 15px; } .pc-standings th, .pc-standings-table th { text-align:left; text-transform:uppercase; letter-spacing:.08em; font-size:11px; color: var(--pc-slate); font-weight:700; padding: .7rem 1.25rem; background: #f6f6f2; border-bottom:1px solid var(--pc-line); } .pc-standings td, .pc-standings-table td { padding: .7rem 1.25rem; border-bottom: 1px solid var(--pc-line); vertical-align:middle; } .pc-standings tr:last-child td { border-bottom: 0; } .pc-standings tbody tr:hover { background: var(--pc-green-soft); } .pc-rank { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:#eef0f2; color:var(--pc-slate); font-weight:700; font-size:13px; margin-right:.4rem; } .pc-division--wed tbody tr:first-child .pc-rank, .pc-division--thu tbody tr:first-child .pc-rank { background: var(--pc-red); color:#fff; } .pc-team { font-weight:600; } .pc-record { font-variant-numeric: tabular-nums; font-weight:600; text-align:right; } /* ========================================================================= Generic table styling (auto-beautifies any existing Elementor tables) ========================================================================= */ .entry-content table, .elementor-widget-text-editor table { width:100%; border-collapse: collapse; background: var(--pc-white); border:1px solid var(--pc-line); border-radius: var(--pc-radius); overflow:hidden; box-shadow: var(--pc-shadow); font-size:15px; } .entry-content table th { background: var(--pc-green); color:#fff; text-align:left; padding:.7rem 1rem; font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.05em; } .entry-content table td { padding:.65rem 1rem; border-bottom:1px solid var(--pc-line); } .entry-content table tr:nth-child(even) td { background:#faf9f6; } /* ========================================================================= Schedule & Results — interactive, grouped by week (see one-page snippet JS). All selectors scoped under .pc-sched so nothing else on the site is affected. ========================================================================= */ .pc-sched { max-width: var(--pc-maxw); margin: 0 auto; } /* Team filter */ .pc-sched__controls { display:flex; gap:.6rem; align-items:center; justify-content:center; margin-bottom:1.5rem; } .pc-sched__controls label { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--pc-slate); } .pc-sched select { font-family:'Inter',sans-serif; font-weight:600; font-size:14px; color:var(--pc-charcoal); padding:10px 16px; border:1px solid var(--pc-line); border-radius:999px; background:var(--pc-white); box-shadow:var(--pc-shadow); cursor:pointer; min-width:220px; } /* Week accordion */ .pc-sched .week { margin-bottom:.85rem; border:1px solid var(--pc-line); border-radius:var(--pc-radius); background:var(--pc-white); box-shadow:var(--pc-shadow); overflow:hidden; } .pc-sched .week-head { width:100%; text-align:left; border:0; background:transparent; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:.6rem; padding:.9rem 1.15rem; font-family:'Poppins',sans-serif; font-weight:700; font-size:1.05rem; color:var(--pc-charcoal); } .pc-sched .week-head:hover { background:var(--pc-green-soft); } .pc-sched .week-head .meta { display:flex; align-items:center; gap:.6rem; font-family:'Inter',sans-serif; font-weight:700; font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--pc-slate); } .pc-sched .pill { padding:2px 9px; border-radius:999px; } .pc-sched .pill.now { background:var(--pc-red); color:#fff; } .pc-sched .pill.upc { background:var(--pc-green-soft); color:var(--pc-green); } .pc-sched .pill.fin { background:#eef0f2; color:var(--pc-slate); } .pc-sched .caret { transition:transform .2s ease; color:var(--pc-slate); font-size:.9rem; } .pc-sched .week.open .caret { transform:rotate(90deg); } .pc-sched .week-body { padding:0 1.15rem 1rem; display:none; } /* Divisions side by side (Div 1 left, Div 2 right) with a vertical divider. */ .pc-sched .week.open .week-body { display:grid; grid-template-columns:1fr 1fr; } /* Day + games */ .pc-sched .day { padding:.85rem 0; border-top:0; } .pc-sched .day:nth-child(odd):not(:last-child) { padding-right:1.75rem; border-right:1px solid var(--pc-line); } .pc-sched .day:nth-child(even) { padding-left:1.75rem; } .pc-sched .day-head { display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin-bottom:.4rem; } .pc-sched .day-date { font-family:'Poppins',sans-serif; font-weight:700; color:var(--pc-charcoal); font-size:.95rem; } .pc-sched .chip { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; padding:3px 9px; border-radius:999px; background:var(--pc-green-soft); color:var(--pc-green); white-space:nowrap; } .pc-sched .chip.thu { background:#fdeae4; color:var(--pc-red); } .pc-sched .chip.sun { background:#eef0f2; color:var(--pc-slate); } .pc-sched .chip.po { background:var(--pc-red); color:#fff; } .pc-sched .game { display:flex; align-items:center; gap:.75rem; padding:.35rem 0; font-variant-numeric:tabular-nums; font-size:.95rem; } .pc-sched .time { color:var(--pc-slate); min-width:62px; font-size:.85rem; } .pc-sched .match { flex:1; } .pc-sched .win { color:var(--pc-green); font-weight:700; } .pc-sched .lose { color:var(--pc-slate); } .pc-sched .sc { font-weight:700; } .pc-sched .at { color:#9aa5b1; font-size:.82rem; margin:0 .15rem; } .pc-sched .tag-final { font-size:10px; font-weight:700; color:#9aa5b1; text-transform:uppercase; letter-spacing:.05em; } .pc-sched .tag-upc { font-size:10px; font-weight:700; color:var(--pc-green); text-transform:uppercase; letter-spacing:.05em; } .pc-sched .gnote { color:var(--pc-red); font-size:.8rem; font-style:italic; margin-left:.4rem; } .pc-sched .bye { color:var(--pc-slate); font-style:italic; font-size:.83rem; padding-top:.35rem; } .pc-sched .tbd .match { font-weight:600; } .pc-sched__empty { text-align:center; color:var(--pc-slate); padding:2rem; font-style:italic; } /* ========================================================================= Sponsor showcase ========================================================================= */ .pc-sponsors { display:grid; grid-template-columns: repeat(3, 1fr); gap:1.25rem; max-width: var(--pc-maxw); margin: 0 auto; } .pc-sponsor { background: var(--pc-white); border:1px solid var(--pc-line); border-radius: var(--pc-radius); box-shadow: var(--pc-shadow); display:flex; align-items:center; justify-content:center; padding: 1.5rem; min-height: 150px; transition: transform .15s ease, box-shadow .15s ease; } .pc-sponsor:hover { transform: translateY(-3px); box-shadow: var(--pc-shadow-lg); } .pc-sponsor img { max-width:100%; max-height:110px; width:auto; height:auto; object-fit:contain; } /* ========================================================================= Registration form (WPForms) — clean, on-brand styling. Applies to the standalone Registration page AND the one-page form section. ========================================================================= */ .wpforms-container { max-width: 940px; width: 100%; /* Center the whole form block under the heading (fields stay left-aligned inside). !important + float:none overrides WPForms/Elementor left-align. */ margin-left: auto !important; margin-right: auto !important; float: none !important; background: var(--pc-white); border: 1px solid var(--pc-line); border-radius: var(--pc-radius); box-shadow: var(--pc-shadow); padding: 2rem 2.25rem; } /* Let the fields fill the centered container so it looks balanced, not left-heavy */ .wpforms-container .wpforms-field, .wpforms-container .wpforms-field-row { max-width: 100% !important; } .wpforms-form .wpforms-field { padding: .55rem 0; } .wpforms-form .wpforms-field-label { font-family: 'Inter', sans-serif; font-weight: 600; color: var(--pc-charcoal); font-size: 15px; margin-bottom: .4rem; } .wpforms-form .wpforms-required-label { color: var(--pc-red); } .wpforms-form input[type=text], .wpforms-form input[type=email], .wpforms-form input[type=tel], .wpforms-form input[type=number], .wpforms-form input[type=url], .wpforms-form select, .wpforms-form textarea { width: 100%; border: 1px solid var(--pc-line); border-radius: var(--pc-radius-sm); padding: .6rem .8rem; font-size: 15px; font-family: 'Inter', sans-serif; background: #fff; color: var(--pc-charcoal); transition: border-color .15s ease, box-shadow .15s ease; } .wpforms-form input:focus, .wpforms-form select:focus, .wpforms-form textarea:focus { outline: none; border-color: var(--pc-green); box-shadow: 0 0 0 3px var(--pc-green-soft); } .wpforms-form .wpforms-field-radio ul, .wpforms-form .wpforms-field-checkbox ul { list-style: none; margin: 0; padding: 0; } .wpforms-form .wpforms-field-radio li, .wpforms-form .wpforms-field-checkbox li { margin-bottom: .35rem; } .wpforms-form .wpforms-field-label-inline { font-weight: 500; } .wpforms-form .wpforms-field-description { color: var(--pc-slate); font-size: 13px; } /* ========================================================================= Photo gallery ========================================================================= */ .pc-gallery { display:grid; grid-template-columns: repeat(3,1fr); gap: .85rem; max-width: var(--pc-maxw); margin:0 auto; } .pc-gallery a, .pc-gallery figure { margin:0; } .pc-gallery img { width:100%; aspect-ratio: 4/3; object-fit:cover; border-radius: var(--pc-radius-sm); box-shadow: var(--pc-shadow); transition: transform .2s ease, box-shadow .2s ease; display:block; } .pc-gallery img:hover { transform: scale(1.02); box-shadow: var(--pc-shadow-lg); } /* Beautify Elementor / WP native galleries automatically */ .wp-block-gallery .wp-block-image img, .elementor-widget-image-gallery .gallery-item img, .e-gallery-image { border-radius: var(--pc-radius-sm) !important; box-shadow: var(--pc-shadow); } /* ========================================================================= Footer — hidden entirely (the one-page layout has its own Contact section) ========================================================================= */ #colophon, .site-footer, .nv-footer, .footer--row, .hfg_footer { display: none !important; } /* ========================================================================= About — key facts checklist ========================================================================= */ .pc-facts { list-style: none; margin: 0 auto; padding: 1.5rem 1.75rem; max-width: var(--pc-maxw); background: var(--pc-white); border: 1px solid var(--pc-line); border-radius: var(--pc-radius); box-shadow: var(--pc-shadow); display: grid; grid-template-columns: 1fr 1fr; gap: .7rem 2rem; } .pc-facts li { position: relative; padding-left: 1.9rem; line-height: 1.5; } .pc-facts li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--pc-green-soft); color: var(--pc-green); font-size: 13px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; } /* ========================================================================= Rules — grouped cards (masonry columns) ========================================================================= */ .pc-rules__intro { max-width: 760px; margin: 0 auto 1.75rem; text-align: center; color: var(--pc-slate); } .pc-rules { max-width: var(--pc-maxw); margin: 0 auto; columns: 2; column-gap: 1.25rem; } .pc-rulegroup { break-inside: avoid; margin: 0 0 1.25rem; background: var(--pc-white); border: 1px solid var(--pc-line); border-radius: var(--pc-radius); box-shadow: var(--pc-shadow); padding: 1.25rem 1.5rem; } .pc-rulegroup h3 { margin: 0 0 .6rem; color: var(--pc-green); font-size: 1.1rem; } .pc-rulegroup ul { margin: 0; padding-left: 1.15rem; } .pc-rulegroup li { margin-bottom: .45rem; line-height: 1.5; font-size: 15px; } /* ========================================================================= Responsive ========================================================================= */ @media (max-width: 880px) { .pc-standings { grid-template-columns: 1fr; } .pc-sponsors { grid-template-columns: repeat(2, 1fr); } .pc-gallery { grid-template-columns: repeat(2, 1fr); } .pc-facts { grid-template-columns: 1fr; } .pc-rules { columns: 1; } } /* Schedule: stack the two divisions vertically on narrower screens */ @media (max-width: 700px) { .pc-sched .week.open .week-body { grid-template-columns: 1fr; } .pc-sched .day:nth-child(odd):not(:last-child) { padding-right:0; border-right:0; } .pc-sched .day:nth-child(even) { padding-left:0; } .pc-sched .day + .day { border-top:1px solid var(--pc-line); } } @media (max-width: 520px) { body { font-size: 16px; } .pc-sponsors, .pc-gallery { grid-template-columns: 1fr; } .elementor-button, .wpforms-submit, .pc-btn { width:100%; } /* Schedule: give games room, drop the Final/Upcoming tags on small screens */ .pc-sched__controls select { width:100%; min-width:0; } .pc-sched .game { flex-wrap: wrap; gap:.35rem .6rem; } .pc-sched .tag-final, .pc-sched .tag-upc { display:none; } }