/* CCJ theme: additions for WordPress, Contact Form 7 and Elementor on top of the design styles. */

/* Generic */
.visually-hidden,.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.screen-reader-text:focus{clip:auto;width:auto;height:auto;margin:0;padding:12px 18px;z-index:100;background:#fff;color:var(--deep)}
body.admin-bar .site-header{top:32px}
@media (max-width:782px){body.admin-bar .site-header{top:46px}}
@media (max-width:600px){body.admin-bar .site-header{top:0}}
body.ccj-no-sticky .site-header{position:relative}
.ccj-page-content>*:not(.alignfull):not(.elementor):not(section){max-width:var(--max);margin-left:auto;margin-right:auto;padding-left:clamp(20px,4vw,48px);padding-right:clamp(20px,4vw,48px)}
.ccj-page-content{padding-block:clamp(48px,7vw,96px)}
.ccj-prose-column{max-width:760px}
.ccj-heading-only{padding-bottom:0}
.ccj-notice-section,.ccj-button-section{padding-block:28px}

/* Donation amounts as links */
.amount-preview a{font-size:26px;flex:1;text-align:center;border-block:1px solid rgba(255,255,255,.35);padding:13px 5px;color:inherit;text-decoration:none;transition:background .2s}
.amount-preview a:hover,.amount-preview a:focus-visible{background:rgba(255,255,255,.12)}
@media (max-width:600px){.amount-preview a{font-size:24px}}

/* Portraits / covers with photos */
.portrait.has-photo{overflow:visible}
.portrait.has-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;z-index:1}
.post-cover.has-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.post-cover.has-image .cover-ring{z-index:1}

/* Pagination links */
.pagination a{display:inline-flex;align-items:center;gap:8px;color:var(--deep);text-decoration:none;font-weight:500}
.pagination a .icon{width:16px;height:16px}
.pagination a:hover{color:var(--teal)}
.pagination .page-next{margin-left:auto}

/* Search */
.ccj-search-bar{padding-block:32px 0}
.ccj-search-bar .search-form{display:flex;gap:10px;max-width:640px}
.ccj-search-bar .search-field{flex:1;min-height:50px;padding:11px 13px;border:1px solid rgba(22,58,99,.22);border-radius:2px;font:inherit}
.ccj-search-bar .search-submit{min-height:50px;padding:0 24px;border:0;background:var(--deep);color:#fff;font:inherit;font-weight:500;cursor:pointer}

/* Gutenberg content inside the design */
.prose-article .wp-block-image img{height:auto}
.prose-article .alignwide,.prose-article .alignfull{max-width:none}
.prose-article figure{margin:32px 0}
.prose-article figcaption{font-size:12px;color:var(--muted);margin-top:8px}
.prose-article table{width:100%;border-collapse:collapse;font-size:14px}
.prose-article th,.prose-article td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left}

/* Contact Form 7 */
.wpcf7 .static-form{display:grid;gap:24px}
.wpcf7 .wpcf7-form-control-wrap{display:block}
.wpcf7 .checkbox-field .wpcf7-form-control-wrap{display:inline}
.wpcf7 .checkbox-field .wpcf7-list-item{margin:0}
.wpcf7 .checkbox-field .wpcf7-list-item-label{display:none}
.wpcf7 .wpcf7-not-valid{border-color:var(--red)!important}
.wpcf7 .wpcf7-not-valid-tip{font-size:11px;color:#b3261e;margin-top:6px}
.wpcf7 form .wpcf7-response-output{margin:20px 0 0;padding:18px;font-size:12px;border:0;border-left:3px solid var(--teal);background:var(--tint-teal);color:var(--deep)}
.wpcf7 form.invalid .wpcf7-response-output,.wpcf7 form.unaccepted .wpcf7-response-output,.wpcf7 form.failed .wpcf7-response-output,.wpcf7 form.spam .wpcf7-response-output{border-left-color:var(--red);background:#fdeeee}
.wpcf7 .form-submit{display:inline-flex;align-items:center;justify-content:center;gap:24px;cursor:pointer}
.wpcf7 .form-submit:disabled{opacity:.6;cursor:wait}
.wpcf7 form .wpcf7-spinner{display:none}
.wpcf7 form.submitting .wpcf7-spinner{display:block;margin:12px auto 0}
.wpcf7 .wpcf7-form-control-wrap textarea,.wpcf7 .wpcf7-form-control-wrap select,.wpcf7 .wpcf7-form-control-wrap input:not([type=checkbox]){display:block}
.wpcf7 .checkbox-field .wpcf7-form-control-wrap,.wpcf7 .checkbox-field .wpcf7-acceptance,.wpcf7 .checkbox-field .wpcf7-list-item{display:block;line-height:0}
.wpcf7 form .hidden-fields-container{display:none;border:0;padding:0;margin:0}
.wpcf7 .membership-notice[hidden]{display:none}
.wpcf7 .membership-notice button{cursor:pointer}

/* Elementor: full-bleed sections inside containers */
.elementor .elementor-widget[class*="elementor-widget-ccj-"]{width:100%}
.elementor .elementor-widget[class*="elementor-widget-ccj-"]>.elementor-widget-container{margin:0;padding:0}
.e-con.ccj-flush,.e-con.ccj-flush>.e-con-inner{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;--gap:0px;--row-gap:0px;--column-gap:0px;--width:100%;--content-width:100%;max-width:none}
.elementor-editor-active .home-welcome{min-height:560px}

/* Canvas */
body.ccj-canvas main{min-height:100vh}

/* Accessibility: small teal text uses a darker teal (WCAG AA 4.5:1 on white and the brand tints). */
:root{--teal-text:#1f7873}
.post-nav a>span,.resource-domain,.mc-role,.tl-when{color:var(--teal-text)}
/* Profile column titles are h2 (correct heading order) styled like the design's h3. */
.profile-cols h2.profile-col-title{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:600;letter-spacing:.14em;line-height:1.12;text-transform:uppercase;color:var(--navy);margin:0 0 22px;padding-bottom:14px;border-bottom:2px solid;border-image:var(--grad-logo) 1}
.profile-cols h2.profile-col-title .icon{width:17px;height:17px;color:var(--teal)}

/* CCJ-ELEMENTOR-IMG:START (generated by tools/gen-elementor-img.py) */
.elementor .brand img{width:216px;height:auto}
.elementor .scene-photo>img{width:100%;height:100%;object-fit:cover;object-position:44% center}
.elementor .scene-logo img{width:100%;height:auto}
.elementor .scene-city img{width:100%;height:100%;object-fit:cover;object-position:center 65%}
.elementor .about-image>img{width:100%;height:485px;object-fit:cover;border-radius:210px 210px 0 0;object-position:42% center}
.elementor .footer-brand img{width:140px;height:auto}
.elementor .page-hero-image img{width:100%;height:335px;object-fit:cover;border-radius:150px 150px 2px 2px}
.elementor .hero-mark img{width:185px;height:185px;object-fit:contain;border-radius:50% 50% 50% 2px}
@media(max-width:1250px){.elementor .brand img{width:194px}}
@media(max-width:1100px){.elementor .about-image>img{height:480px}}
@media(max-width:1100px){.elementor .page-hero-image img{height:320px}}
@media(max-width:1100px){.elementor .hero-mark img{width:170px;height:170px}}
@media(max-width:800px){.elementor .about-image>img{height:465px}}
@media(max-width:800px){.elementor .page-hero-image img{height:300px;border-radius:120px 120px 2px 2px}}
@media(max-width:800px){.elementor .hero-mark img{width:135px;height:135px}}
@media(max-width:600px){.elementor .brand img{width:184px}}
@media(max-width:600px){.elementor .about-image>img{height:370px;border-radius:155px 155px 0 0}}
@media(max-width:600px){.elementor .footer-brand img{width:135px}}
@media(max-width:600px){.elementor .page-hero-image img{height:265px;border-radius:140px 140px 2px 2px}}
.elementor .contact-emails a{text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:4px}
.elementor .prose-article p a,.elementor .prose-article li a,.elementor .faq-answer a{text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:4px}
.elementor .author-box img{width:56px;height:56px;border-radius:50%}
.elementor .empty-state a{text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:4px}
.elementor .event-card dd a{text-decoration:underline;text-decoration-color:var(--teal);text-underline-offset:4px}
.elementor .hero-media img{width:100%;object-fit:cover;border-radius:18px 120px 18px 18px}
@media(max-width:800px){.elementor .hero-media img{border-radius:14px 80px 14px 14px}}
.elementor .welcome-photo img{width:100%;height:100%;object-fit:cover;object-position:58% center}
@media(max-width:700px){.elementor .welcome-photo img{object-position:center 60%}}
/* CCJ-ELEMENTOR-IMG:END */

/* Stripe Donations inside the design */
.ccj-donation-form .sdn-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.ccj-donation-form .form-feedback p{margin:0}
.ccj-donation-form .form-submit:disabled{opacity:.6;cursor:wait}
