/**
 * Accessibility Fixes CSS for The Carrington at Lincolnwood.
 * WCAG 2.1 Level AA compliance.
 *
 * @package    Salient_Child
 * @subpackage Accessibility
 * @since      1.0.0
 *
 * Index:
 * 1. Skip to content
 * 2. Header navigation (keyboard, menu)
 * 3. Heading order and typography
 * 4. Color contrast
 * 5. Focus indicators
 * 6. Announcement banner
 */

/* Add focus styles */
body *:focus, body *:focus-visible {
     outline: 2px solid;
     outline-offset: 2px;
}

.slide-out-widget-area-toggle.mobile-icon a:before {
    content: '';
    display: none;
    height: 50px;
    left: 50%;
    outline: 2px solid;
    position: absolute;
    top: -25%;
    transform: translateX(-50%);
    width: 70px;
}
.slide-out-widget-area-toggle.mobile-icon a:is(:focus, :focus-visible):before {
    display: block;
}

.ti-widget.ti-goog  .ti-controls .ti-prev:is(:focus, :focus-visible), .ti-widget.ti-goog .ti-controls .ti-next:is(:focus, :focus-visible) {
    background-color: #4d4d4d !important;
    outline-color: #424242 !important;
    box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.05);
}

.ti-widget.ti-goog .ti-controls .ti-prev:is(:focus, :focus-visible):before, .ti-widget.ti-goog .ti-controls .ti-next:is(:focus, :focus-visible):before {
    border-color: #fff !important;
}


.gform_wrapper .gfield input:is(:focus, :focus-visible), .gform_wrapper .gfield select:is(:focus, :focus-visible), .gform_wrapper .gfield textarea:is(:focus, :focus-visible), .gform_wrapper .gform-footer input:is(:focus, :focus-visible) {
    outline: 2px solid #000 !important;
}

/* --- 1. Skip to content --- */

.crn-skip-link {
	position: absolute !important;
	left: -9999px !important;
	top: 0 !important;
	z-index: 999999 !important;
	padding: 0.75em 1em !important;
	background: #3f607c !important;
	color: #fff !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border: 0 !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	overflow: hidden !important;
}
.crn-skip-link:focus {
	position: fixed !important;
	left: 0.5em !important;
	top: 0.5em !important;
	clip: auto !important;
	clip-path: none !important;
	overflow: visible !important;
	outline: 2px solid #fff !important;
	outline-offset: 2px !important;
}

/* --- 2. Header navigation --- */

#header-secondary-outer nav > ul.sf-menu {
    display: flex;
    justify-content: center;
 }
 #header-secondary-outer nav > ul.sf-menu > li:not(.menu-item-social) + li.menu-item-social {
    float: none;
 }

 header .slide-out-from-right a.closed:after, header .slide-out-from-right a.open:after {
    line-height: 60px;
    left: 50%;
    transform: translateX(-50%);
    right: initial;
}

@media only screen and (min-width: 1001px) {
    #header-outer header#top .sf-menu > li:has(.sub-menu> li > a:focus) > a:after {
        backface-visibility: hidden;
        -ms-transform: scaleX(1);
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
    header#top .sf-menu > li .sub-menu:has(> li > a:focus, > li > a:focus-visible) {
        display: block !important;
        opacity: 1 !important;
        top: calc(100% + 10px) !important;
    }
    header#top .sf-menu > li .sub-menu > li > a:is(:focus, :focus-visible)::after {
        backface-visibility: hidden;
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
    }
}

@media only screen and (min-width: 801px) {
    #header-secondary-outer nav > ul.sf-menu {
        justify-content: flex-start;
     }
     #header-secondary-outer nav > ul.sf-menu > li:not(.menu-item-social) + li.menu-item-social {
        margin-left: auto;
    }
}

/* --- 3. Heading order and typography --- */

.wpb_text_column.h3 .wpb_wrapper p, .wpb_text_column.h3 .wpb_wrapper h2 {
    font-family: museo-sans, sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 22px;
    line-height: 20px;
    text-transform: uppercase;

    color: #3f607c;
}
.wpb_text_column.h3.black .wpb_wrapper p, .wpb_text_column.h3.black .wpb_wrapper h2  {
    color: #000;
}

.wpb_text_column.h4 .wpb_wrapper h2, .wpb_text_column.h4 .wpb_wrapper h3 {
    font-family: Source Sans Pro;
    letter-spacing: 1px;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.25em;
}
.wpb_text_column.h4.marine-background .wpb_wrapper h2, .wpb_text_column.h4.marine-background .wpb_wrapper h3 {
    background-color: #001e4e;
    color: #fff;
    padding: 20px 10px;
    border-radius: 6px 6px 0 0;
}



.gform_wrapper h2.gform_title[data-heading-fixed="true"] {
    font-family: museo-sans, sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 24px;
    line-height: 1em;
    text-transform: uppercase;

    color: #3f607c;
    padding-top: 30px;
    padding-bottom: 10px;
}

.wpb_text_column h1 + p:has(+h2) {
    font-size: 22px;
    font-family: Source Sans Pro;
    font-weight: 300;
}

.wpb_text_column h1 + p:has(+h2) strong {
    font-weight: 100;
}

.yarpp-related h2 {
    font-size: 30px;
    margin: 20px 0 10px;
}

body .portfolio-items .work-item .work-info p {
    font-family: museo-sans, sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 22px;
    line-height: 20px;

    color: #02173B;
    padding: 5px;
}
.portfolio-items .work-item .work-info p:after {
    background: rgb(255 255 255 / 60%);
    content: '';
    border-radius: 2px;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}


.portfolio-items .work-meta p.title.residence-name {
    font-size: 19px;
    font-family: Source Sans Pro;
    font-size: 19px;
    font-weight: 700;
    line-height: 22px;

    margin-bottom: -2px;
    padding: 0;
    position: relative;
    top: -2px;
}


body.single-post .post-content .content-inner h2 {
    font-family: museo-sans, sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 22px;
    line-height: 20px;
    text-transform: uppercase;
    margin-bottom: 1em;
}

body.single-post .post-content .content-inner ul li h3 {
    color: #000;
    font-family: Source Sans Pro;
    letter-spacing: 0;
    font-size: 22px;
    font-weight: 300;
    line-height: 1.25em;
    margin-bottom: 8px;
    text-transform: none;
}

/* --- 4. Color contrast --- */
.single #single-below-header > span {
	color: #545454;
}

/* Share trigger: real button (replaces a[href="#"]) so 4.1.2 is satisfied; match link styling */
.single #single-meta ul li.meta-share-count > button {
	border: inherit;
	background: transparent;
	font: inherit;
	color: inherit;
	cursor: pointer;
	padding: 0;
	margin: 0;
	-webkit-appearance: none;
	appearance: none;
}

/* When theme adds .social-hovered on hover, hide trigger so only nectar-social shows (theme only hides .meta-share-count > a).
   Keep button visible when it has focus so Shift+Tab back shows what is focused.
   Only on viewports larger than tablet (1025px+); on tablet and below both stay visible. */
@media (min-width: 1025px) {
	.single #single-meta.social-hovered ul li.meta-share-count > button:not(:focus):not(:focus-visible),
	#project-meta.social-hovered ul li.meta-share-count > button:not(:focus):not(:focus-visible) {
		opacity: 0 !important;
		transition: opacity 0.25s ease;
	}
}

/* Tablet 1024px and below: share count and share buttons always visible (no hover/click toggle) */
@media (max-width: 1024px) {
    body.single-post .blog-title #single-meta ul li:last-child {
        display: inline-flex;
        gap: 10px;
    }
    .single #single-meta ul li.meta-share-count .nectar-social {
        position: initial;
    }
	.single #single-meta ul li.meta-share-count > button,
	#project-meta ul li.meta-share-count > button {
		opacity: 1 !important;
	}
	.single #single-meta ul li.meta-share-count .nectar-social,
	#project-meta ul li.meta-share-count .nectar-social {
		display: block !important;
		opacity: 1 !important;
		visibility: visible !important;
		right: 0 !important;
		left: auto !important;
	}
	.single [data-tab-pos="fullwidth"] #single-meta ul li.meta-share-count .nectar-social,
	.single [data-tab-pos="fullwidth_centered"] #single-meta ul li.meta-share-count .nectar-social {
		left: 0 !important;
		right: auto !important;
	}
	.single #single-meta ul li.meta-share-count .nectar-social a,
	#project-meta ul li.meta-share-count .nectar-social a {
		opacity: 1 !important;
		left: 0 !important;
	}
}

/* Hide visually hidden .nectar-social from accessibility tree
   When display:none or opacity:0, JS adds aria-hidden="true" */
.nectar-social[aria-hidden="true"] {
	pointer-events: none;
}

 .single #single-meta ul li.meta-share-count > a:is(:hover, :focus, :focus-visible),
 .single #single-meta ul li.meta-share-count > button:is(:hover, :focus, :focus-visible) {
    border-color: #021e4d !important;
}
 .single #single-meta ul li.meta-share-count span {
    color: #545454;
}
.single .blog-title #single-meta ul li i {
	color: #545454 !important;
 }
 .single #single-meta ul li.meta-share-count .nectar-social a:is(:hover, :focus, :focus-visible) {
    color: #021e4d !important;
}
 .single #single-meta ul li.meta-share-count .nectar-social a:is(:hover, :focus, :focus-visible) i {
    color: #021e4d !important;
}

/* Show count next to Facebook/Twitter share buttons (parent theme hides .nectar-social a span) */
.single #single-meta ul li.meta-share-count .nectar-social a span.count,
#project-meta ul li.meta-share-count .nectar-social a span.count {
	display: inline !important;
	opacity: 1 !important;
}

.main-content .ti-widget.ti-goog .ti-widget-container .ti-date {
	color: #525252 ;
}

/* Trustindex read more: outer span never focusable/interactive, only inner button */
.ti-widget .ti-read-more {
	pointer-events: none !important;
}
.ti-widget .ti-read-more .ti-read-more-active {
	pointer-events: auto !important;
}

/* (Empty Gravity Forms description paragraphs removed via JS in accessibility-fixes.js) */

.main-content table.cost-calculator-results th, .main-content table.cost-calculator-results td {
    border: 0;
}
.main-content table.cost-calculator-results th {
    padding-bottom: 0;
}
.main-content table.cost-calculator-results td {
    padding-top: 0;
}
.main-content table.cost-calculator-results td h2 {
    border-color: #a51b00;
    color: #a51b00;
}
.main-content table.cost-calculator-results span.h2 {
    font-family: museo-sans, sans-serif;
    font-size: 34px;
    font-weight: 300;
    font-style: normal;
    letter-spacing: 0px;
    text-transform: uppercase;


    display: inline-block;
    text-align: center;
    width: 80px;
    height: 80px;
    line-height: 80px;
    margin: 0 auto;
    border: 2px solid #a51b00;
    color: #a51b00;
    background-color: #fff;
    border-radius: 50%;
}


.main-content table.cost-calculator-results span.h3 {
    font-family: museo-sans, sans-serif;
    font-size: 3.4em;
    font-weight: 300;
    font-style: normal;
    letter-spacing: 0px;
    line-height: 0.8em;

    color: #40607B;
    display: inline-block;    
    margin-bottom: 7px;
}
.main-content table.cost-calculator-results h4 {
    color: #a51b00;
}
.main-content table.cost-calculator-results span.h4 {
    font-family: Source Sans Pro;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0px;
    line-height: 32px;

    color: #a51b00;
    display: inline-block;
    margin-bottom: 7px;
}

.main-content .nectar_single_testimonial span.title {
    color: #000000a6;
}

.nectar-button.regular-button.extra-color-3 {
    color: #000;
}

.cost-calculator-form  .gfield.step-one > .progressbar .arrow p, .cost-calculator-form  .gfield.step-two > .progressbar .arrow:is(.second, .third) p, .cost-calculator-form  .gfield.step-three > .progressbar .arrow.third p {
    color: #363636;
}

.row >.progressbar .arrow p:first-child, .wpb_wrapper >.progressbar .arrow p:first-child {
    font-size: 19px;
    font-family: museo-sans, sans-serif;
    font-weight: 300;
    font-style: normal;
    line-height: 20px;
    text-transform: uppercase;
    
    color: #363636 !important;
    margin: 0 0 8px;
    padding: 0;
    visibility: visible;
}
.row >.progressbar .arrow.intro p:first-child, .wpb_wrapper >.progressbar .arrow.intro p:first-child {
    position: relative;
    top: 10px;
}
.row >.progressbar .arrow.intro p:last-child, .wpb_wrapper >.progressbar .arrow.intro p:last-child {
    visibility: hidden;
}

.row >.progressbar .arrow p + p:last-child, .wpb_wrapper >.progressbar .arrow p + p:last-child {
    color: #363636;
}


.row .col.light p a {
    color: inherit;
    text-decoration: underline;
}
.row .col.light p a:is(:hover, :focus, :focus-visible) {
    color: inherit;
    text-decoration: none;
}

@media only screen and (max-width: 710px) {

    .main-content table.cost-calculator-results thead tr {
        display: flex;
        flex-direction: column;
    }
    .main-content table.cost-calculator-results span.h3 {
        font-size: 2.4em;
    }
}

@media only screen and (max-width: 690px) {
    .main-content table.cost-calculator-results span.h2 {
        font-size: 25.5px;

    }
    .main-content table.cost-calculator-results span.h4 {
        font-size: 16.2px;
        line-height: 25.2px;
    }

    body.single-post .post-content .content-inner ul li h3 {
        font-size: 16.2px;
        line-height: 25.2px;
    }
}

/* --- 5. Focus indicators --- */

body[data-header-color="custom"]:not(.material) #header-secondary-outer nav >ul >li >a:is(:hover, :focus, :focus-visible) {
    box-shadow: inset 0px -3px 0 0 currentColor;
}

.portfolio-items .col .work-item .work-info-bg:has(+.work-info a.default-link:focus, + .work-info a.default-link:focus-visible) {
    opacity: 0.9 !important;
}
.portfolio-items .col .work-item .work-info:has(a.default-link:is(:focus, :focus-visible)) {
    opacity: 1 !important;
}
.portfolio-items .col .work-item .work-info a.default-link:is(:focus, :focus-visible) {
    opacity: 1 !important;
}


.mfp-gallery .mfp-container .mfp-figure button.mfp-close {
    align-items: center;
    background: #000;
    border-radius: 50%;
    padding: 2px 0;
    display: inline-flex;
    justify-content: center;
    outline: 2px solid #000;
    width: 30px !important;
    height: 30px;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}
.mfp-gallery .mfp-container .mfp-figure button.mfp-close:is(:hover, :focus, :focus-visible) {
    border: 2px solid #fff;
}


.mfp-gallery .mfp-container .mfp-arrow-right {
    background: #000;
    border-color: #fff;
}
.mfp-gallery .mfp-container .mfp-arrow-right:is(:focus, :focus-visible) {
    outline: 2px solid;
}
.mfp-gallery .mfp-container .mfp-arrow-right:is(:focus, :focus-visible):before {
    transform: translateX(9px);
    -webkit-transform: translateX(9px);
}
.mfp-gallery .mfp-container .mfp-arrow-right:is(:focus, :focus-visible):after {
    opacity: 1;
    transform: translateX(-1px);
    -webkit-transform: translateX(-1px);
}
.mfp-gallery .mfp-container .mfp-arrow-left {
    background: #000;
    border-color: #fff;
}
.mfp-gallery .mfp-container .mfp-arrow-left:is(:focus, :focus-visible) {
    outline: 2px solid;
}
.mfp-gallery .mfp-container .mfp-arrow-left:is(:focus, :focus-visible):before {
    transform: translateX(-9px);
    -webkit-transform: translateX(-9px);
}
.mfp-gallery .mfp-container .mfp-arrow-left:is(:focus, :focus-visible):after {
    opacity: 1;
    transform: translateX(-58px);
    -webkit-transform: translateX(-58px);
}
.mfp-gallery .mfp-counter {
    color: #fff;
    font-size: 14px;
}

@media only screen and (max-width: 1024px) {
    .mfp-gallery .mfp-container .mfp-figure button.mfp-close {
        right: 5px !important;
    }
    .mfp-gallery .mfp-container .mfp-arrow-right {
        right: 5px !important;
    }
    .mfp-gallery .mfp-container .mfp-arrow-left {
        left: 5px !important;
    }
}

/* Lightbox: prevent scroll inside so focus on close/arrows does not shift viewport */
.mfp-wrap.mfp-ready,
.mfp-wrap.mfp-ready .mfp-container {
    overflow: hidden !important;
}

/* Lightbox image: wrapper so we can show focus ring inset from edges (hugs content, not full image box) */
.mfp-wrap.mfp-ready .crn-lightbox-img-wrap {
    position: relative;
    display: inline-block;
    line-height: 0;
}
.mfp-wrap.mfp-ready .crn-lightbox-img-wrap img {
    display: block;
}
.mfp-wrap.mfp-ready .crn-lightbox-img-wrap img:focus {
    outline: none;
}
/* Ring ::before: height from --crn-focus-ring-height (set by JS from image height minus trim), vertically centered */
.mfp-wrap.mfp-ready .crn-lightbox-img-wrap::before {
    background: #000;
    content: '';
    position: absolute;
    left: -5px;
    right: -5px;
    top: 50%;
    transform: translateY(-50%);
    height: calc(var(--crn-focus-ring-height, 90%) + 20px);
    pointer-events: none;
    opacity: 0;
    box-shadow: inset 0 0 0 2px #fff;
    z-index: -1;
}
.mfp-wrap.mfp-ready .crn-lightbox-img-wrap:focus-within::before {
    opacity: 1;
}

/* Lightbox open: lock background scroll so content behind does not move */
body.crn-lightbox-open {
    overflow: hidden !important;
}


/* --- 6. Announcement banner --- */

.crn-announcement {
    position: relative;
}

/* Close button hidden by default (visible only at ≤1000px via media query below) */
.crn-announcement-close {
    display: none;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    border-radius: 4px;
    opacity: 0.85;
}
.crn-announcement-close:hover,
.crn-announcement-close:focus {
    opacity: 1;
}
.crn-announcement-close:focus {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* Dismissed state: hide banner (used by JS for viewport ≤1000px only) */
.crn-announcement.crn-announcement--dismissed {
    display: none !important;
}

@media only screen and (max-width: 1000px) {
    div#header-outer {
        padding-top: 0 !important;
    }

    header#top .crn-announcement p {
        --wpa-font-size: clamp(18px, 1.2rem, 36px);
    }

    /* Show close button only at 1000px or less */
    .crn-announcement-close {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

@media only screen and (max-width: 768px) {
    header#top .crn-announcement .container {
        padding: 0;
    }
}


/* Fix text too small */
body sup {
    font-size: 0.8em;
}
.gm-style .gm-style-cc button {
    font-size: 12px;
}

.gm-style .gm-style-cc span {
    font-size: 12px;
}

.gm-style .gm-style-cc a {
    font-size: 12px;
}

/* Fix Underlined Text */
.single-post .yarpp-related abbr {
    text-decoration: none;
}


/* Add missing styles for the theme */
@media (min-width: 768px) {
    .wpb_column.vc_col-sm-8 {
        width: 66.66666667%;
    }
    .wpb_column.vc_col-sm-4 {
        width: 33.33333333%;
    }
}