/* Public content palette. Keep shared Bootstrap tokens and CMS colors intact. */
body.public-charcoal {
    --charcoal-bg: #22211e;
    --charcoal-surface: #2d2b26;
    --charcoal-hover: #39352e;
    --charcoal-heading: #f5eee3;
    --charcoal-text: #c3b9a9;
    --charcoal-border: #494238;
    --charcoal-control-border: #857b6d;
    --charcoal-orange: #f9a931;
    --charcoal-on-orange: #292018;
    --charcoal-danger: #ff9292;
    --charcoal-success: #80d7a5;
    background-color: var(--charcoal-bg);
}

/* Preserve the original backing for the translucent navigation. */
body.public-charcoal .public-header-shell { background-color: #fff; }
body.public-charcoal.public-home .navbar.navbar-light { background-color: #4e4e4e !important; }
body.public-charcoal .navbar.sticky-top.navbar-light .navbar-nav .nav-link { color: #fff; }
body.public-charcoal .navbar.sticky-top.navbar-light .navbar-nav .nav-link:is(.active,:hover) { color: #ffc56d; }

body.public-charcoal .charcoal-content {
    background-color: var(--charcoal-bg);
    color: var(--charcoal-text);
    color-scheme: dark;
}
body.public-charcoal .charcoal-content:is(.bg-white,.bg-light) { background-color: var(--charcoal-bg) !important; }
body.public-charcoal .charcoal-content :is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.text-dark,.text-black,.text-body) {
    color: var(--charcoal-heading) !important;
}
body.public-charcoal .charcoal-content .text-muted { color: var(--charcoal-text) !important; }
body.public-charcoal .charcoal-content :is(.text-primary,.text-warning,.link-primary) { color: var(--charcoal-orange) !important; }
body.public-charcoal .charcoal-content .text-secondary { color: var(--charcoal-text) !important; }
body.public-charcoal .charcoal-content .text-danger { color: var(--charcoal-danger) !important; }
body.public-charcoal .charcoal-content .text-success { color: var(--charcoal-success) !important; }
body.public-charcoal .charcoal-content a:not(.btn):not(.page-link):not(.collection-card) { color: var(--charcoal-orange); }
body.public-charcoal .charcoal-content a:not(.btn):not(.page-link):not(.collection-card):is(:hover,:focus-visible) { color: #ffc46b; }
body.public-charcoal .charcoal-content :is(.border,.border-top,.border-bottom,.border-start,.border-end) { border-color: var(--charcoal-border) !important; }
body.public-charcoal .charcoal-content hr { color: var(--charcoal-control-border); }

/* Match existing surfaces, including content inserted after page load. */
body.public-charcoal .charcoal-content :is(.bg-white,.bg-light,.card,.service-item,.feature-item,.blog-item,.collections-empty,.accordion-item,.accordion-button) {
    background-color: var(--charcoal-surface) !important;
    color: var(--charcoal-text);
}
body.public-charcoal .charcoal-content :is(.card,.list-group-item,.accordion-item,.collections-custom,.collections-product-grid article) { border-color: var(--charcoal-border); }
body.public-charcoal .charcoal-content :is(.card-header,.card-footer,.list-group-item) {
    background-color: var(--charcoal-surface);
    color: var(--charcoal-text);
    border-color: var(--charcoal-border);
}
body.public-charcoal .charcoal-content .list-group-item-action:is(:hover,:focus) {
    background-color: var(--charcoal-hover);
    color: var(--charcoal-heading);
}
body.public-charcoal .charcoal-content .list-group-item.active {
    background-color: var(--charcoal-orange);
    color: var(--charcoal-on-orange);
    border-color: var(--charcoal-orange);
}
body.public-charcoal .charcoal-content .list-group-item:is(.disabled,:disabled) {
    background-color: var(--charcoal-bg);
    color: var(--charcoal-text);
}
body.public-charcoal .charcoal-content .collection-card,
body.public-charcoal .charcoal-content .collection-card:hover { color: var(--charcoal-heading); }
body.public-charcoal .charcoal-content :is(.collection-card,.collections-product-grid article a):focus-visible { outline-color: var(--charcoal-orange); }
body.public-charcoal .charcoal-content .collection-breadcrumb a { color: var(--charcoal-orange); }

/* Preserve button geometry and semantic action colors. */
body.public-charcoal .charcoal-content :is(.btn-primary,.bg-primary),
body.public-charcoal .charcoal-content .btn-primary:is(:hover,:focus,:active,.active),
body.public-charcoal .charcoal-content .btn-check:checked + .btn-primary {
    background-color: var(--charcoal-orange);
    border-color: var(--charcoal-orange);
    color: var(--charcoal-on-orange) !important;
}
body.public-charcoal .charcoal-content :is(.btn-primary,.bg-primary) :is(h1,h2,h3,h4,h5,h6,p,.h1,.h2,.h3,.h4,.h5,.h6,.text-white,.text-dark,.text-primary,.text-muted) {
    color: var(--charcoal-on-orange) !important;
}
body.public-charcoal .charcoal-content .btn-primary:hover { background-color: #ffc46b; }
body.public-charcoal .charcoal-content :is(.btn-outline-secondary,.btn-outline-dark,.btn-light) {
    background-color: var(--charcoal-surface);
    border-color: var(--charcoal-control-border);
    color: var(--charcoal-heading) !important;
}
body.public-charcoal .charcoal-content :is(.btn-outline-secondary,.btn-outline-dark,.btn-light):is(:hover,:focus-visible) {
    background-color: var(--charcoal-hover);
    border-color: var(--charcoal-text);
    color: var(--charcoal-heading) !important;
}
body.public-charcoal .charcoal-content .btn-outline-primary {
    color: var(--charcoal-orange);
    border-color: var(--charcoal-orange);
}
body.public-charcoal .charcoal-content .btn-outline-primary:is(:hover,:active,.active),
body.public-charcoal .charcoal-content .btn-check:checked + .btn-outline-primary {
    background-color: var(--charcoal-orange);
    border-color: var(--charcoal-orange);
    color: var(--charcoal-on-orange);
}
body.public-charcoal .charcoal-content .btn-outline-danger { color: var(--charcoal-danger); border-color: var(--charcoal-danger); }
body.public-charcoal .charcoal-content .btn-outline-danger:is(:hover,:active) { background-color: var(--charcoal-danger); color: var(--charcoal-on-orange); }
body.public-charcoal .charcoal-content .btn:is(.disabled,:disabled) { color: var(--charcoal-text) !important; background-color: var(--charcoal-hover); border-color: var(--charcoal-control-border); }
body.public-charcoal .charcoal-content .varian-btn.active { background-color: var(--charcoal-hover); border-color: var(--charcoal-orange) !important; color: var(--charcoal-orange) !important; }
body.public-charcoal .charcoal-content .varian-btn:not(.active) { border-color: var(--charcoal-control-border) !important; }
body.public-charcoal .charcoal-content .btn:focus,
body.public-charcoal .charcoal-content .btn-check:focus + .btn { box-shadow: 0 0 0 .25rem #f9a93159; }

body.public-charcoal .charcoal-content :is(.form-control,.form-select,.input-group-text) {
    color: var(--charcoal-heading);
    background-color: var(--charcoal-bg);
    border-color: var(--charcoal-control-border);
}
body.public-charcoal .charcoal-content :is(.form-control,.form-select) { color-scheme: dark; }
body.public-charcoal .charcoal-content .form-control::placeholder { color: var(--charcoal-text); opacity: 1; }
body.public-charcoal .charcoal-content .form-floating > .form-control::placeholder { color: transparent; }
body.public-charcoal .charcoal-content :is(.form-control,.form-select):focus {
    color: var(--charcoal-heading);
    background-color: var(--charcoal-bg);
    border-color: var(--charcoal-orange);
    box-shadow: 0 0 0 .25rem #f9a93140;
}
body.public-charcoal .charcoal-content :is(.form-control,.form-select):is(:disabled,[readonly]) {
    background-color: var(--charcoal-hover);
    color: var(--charcoal-text);
}
body.public-charcoal .charcoal-content .form-select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='12' viewBox='0 0 16 12'%3E%3Cpath fill='none' stroke='%23f5eee3' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 3 6 6 6-6'/%3E%3C/svg%3E"); }
body.public-charcoal .charcoal-content .form-floating > label { color: var(--charcoal-text); }
body.public-charcoal .charcoal-content .form-floating > .form-control:is(:focus,:not(:placeholder-shown)) ~ label,
body.public-charcoal .charcoal-content .form-floating > .form-select ~ label { opacity: 1; }
body.public-charcoal .charcoal-content .form-control:-webkit-autofill { -webkit-text-fill-color: var(--charcoal-heading); box-shadow: 0 0 0 1000px var(--charcoal-bg) inset; caret-color: var(--charcoal-heading); }
body.public-charcoal .charcoal-content .form-check-input { background-color: var(--charcoal-bg); border-color: var(--charcoal-control-border); }
body.public-charcoal .charcoal-content .form-check-input:checked { background-color: var(--charcoal-orange); border-color: var(--charcoal-orange); }
body.public-charcoal .charcoal-content .form-check-input:focus { border-color: var(--charcoal-orange); box-shadow: 0 0 0 .25rem #f9a93140; }
body.public-charcoal .charcoal-content :is(.is-invalid,.was-validated .form-control:invalid,.was-validated .form-select:invalid) { border-color: var(--charcoal-danger); }
body.public-charcoal .charcoal-content .invalid-feedback { color: var(--charcoal-danger); }

body.public-charcoal .charcoal-content .page-link {
    background-color: var(--charcoal-surface);
    color: var(--charcoal-heading);
    border-color: var(--charcoal-control-border);
}
body.public-charcoal .charcoal-content .page-link:is(:hover,:focus) { background-color: var(--charcoal-hover); color: var(--charcoal-orange); }
body.public-charcoal .charcoal-content .page-link:focus { box-shadow: 0 0 0 .25rem #f9a93140; }
body.public-charcoal .charcoal-content .page-item.active .page-link { background-color: var(--charcoal-orange); border-color: var(--charcoal-orange); color: var(--charcoal-on-orange); }
body.public-charcoal .charcoal-content .page-item.disabled .page-link { background-color: var(--charcoal-bg); color: #a69c8e; border-color: var(--charcoal-control-border); }
body.public-charcoal .charcoal-content .table { color: var(--charcoal-text); border-color: var(--charcoal-border); }
body.public-charcoal .charcoal-content .table > :not(caption) > * > * { background-color: var(--charcoal-surface); color: var(--charcoal-text); border-color: var(--charcoal-border); }

/* Retain the template's existing decorative and hover surfaces. */
body.public-charcoal .charcoal-content :is(.team-item,.testimonial-item)::before { background-color: var(--charcoal-surface); }
body.public-charcoal .charcoal-content .team-item { isolation: isolate; }
body.public-charcoal .charcoal-content .team-item:hover {
    --charcoal-text: var(--charcoal-on-orange);
    color: var(--charcoal-on-orange);
}
body.public-charcoal .charcoal-content .team-item:hover :is(h3,h4,p) { color: var(--charcoal-on-orange) !important; }
body.public-charcoal .charcoal-content .team-item:hover .team-icon a { background-color: var(--charcoal-bg); color: var(--charcoal-orange); }
body.public-charcoal .charcoal-content .team-item:hover .team-icon a:hover { background-color: var(--charcoal-hover); color: var(--charcoal-heading); }
body.public-charcoal .charcoal-content :is(.testimonial-quote-left,.testimonial-quote-right) { background-color: var(--charcoal-surface); color: var(--charcoal-orange); }
body.public-charcoal .charcoal-content .testimonial-img img { border-color: var(--charcoal-surface); }
body.public-charcoal .charcoal-content.testimonial .testimonial-title .fa-star[style] { color: var(--charcoal-control-border) !important; }
body.public-charcoal .charcoal-content.testimonial .owl-nav :is(.owl-prev,.owl-next) { color: var(--charcoal-on-orange); }
body.public-charcoal .charcoal-content.testimonial .owl-nav :is(.owl-prev,.owl-next):hover { background-color: var(--charcoal-hover); color: var(--charcoal-orange); }
body.public-charcoal .charcoal-content .blog-item .blog-title a,
body.public-charcoal .charcoal-content .blog-item .blog-title a:hover { color: var(--charcoal-on-orange) !important; }
body.public-charcoal .charcoal-content .blog-item .blog-img::after { background-color: #f9a9311a; }
body.public-charcoal .charcoal-content .accordion-button { color: var(--charcoal-heading); }
body.public-charcoal .charcoal-content .accordion-button:not(.collapsed) { color: var(--charcoal-orange); }
body.public-charcoal .charcoal-content .accordion-button:focus { border-color: var(--charcoal-orange); box-shadow: 0 0 0 .25rem #f9a93140; }
body.public-charcoal .charcoal-content .accordion-button::after { filter: brightness(0) invert(1); }

/* Text formatting saved in the CMS must not force a light color scheme. */
body.public-charcoal .charcoal-content .public-rich-content :is([style*="color:" i],[style*="color :" i],font[color]) { color: var(--charcoal-text) !important; }
body.public-charcoal .charcoal-content .public-rich-content :is([style*="background-color" i],[style*="background:" i],[style*="background :" i]):not(img):not(svg) { background-color: transparent !important; }
body.public-charcoal .charcoal-content .public-rich-content :is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6)[style] { color: var(--charcoal-heading) !important; }

/* Keep dark customer logos readable without changing logo pixels or layout. */
body.public-charcoal .charcoal-content .trusted-logo { background-color: #f5f2ed; }

/* Overlays are attached outside the content containers. */
body.public-charcoal #portfolio-lightbox,
body.public-charcoal .modal-content,
body.public-charcoal .swal2-popup {
    background-color: var(--charcoal-surface);
    color: var(--charcoal-heading);
    color-scheme: dark;
}
body.public-charcoal :is(.portfolio-lightbox-header,.modal-header,.modal-footer) { border-color: var(--charcoal-border); }
body.public-charcoal #portfolio-lightbox .portfolio-lightbox-header h2,
body.public-charcoal .modal-content :is(.modal-title,.text-dark),
body.public-charcoal :is(.swal2-title,.swal2-html-container) { color: var(--charcoal-heading); }
body.public-charcoal #portfolio-lightbox :is(#lightbox-caption,.portfolio-lightbox-counter) { color: var(--charcoal-text); }
body.public-charcoal #portfolio-lightbox :is(.portfolio-lightbox-close,.portfolio-lightbox-navigation button) {
    background-color: var(--charcoal-hover);
    color: var(--charcoal-heading);
    border-color: var(--charcoal-control-border);
}
body.public-charcoal #portfolio-lightbox :is(.portfolio-lightbox-close,.portfolio-lightbox-navigation button):hover:not(:disabled) { background-color: var(--charcoal-border); color: var(--charcoal-heading); }
body.public-charcoal #portfolio-lightbox :is(.portfolio-lightbox-close,.portfolio-lightbox-navigation button):focus-visible { outline-color: var(--charcoal-orange); }
body.public-charcoal .modal-content .btn-close { filter: invert(1) grayscale(100%) brightness(2); }
body.public-charcoal .swal2-styled.swal2-confirm { background-color: var(--charcoal-orange) !important; color: var(--charcoal-on-orange) !important; }
body.public-charcoal .swal2-styled.swal2-cancel { background-color: var(--charcoal-hover) !important; color: var(--charcoal-heading) !important; }
body.public-charcoal .swal2-popup :is(.swal2-input,.swal2-textarea,.swal2-select) { background-color: var(--charcoal-bg); color: var(--charcoal-heading); border-color: var(--charcoal-control-border); }
body.public-charcoal .swal2-icon.swal2-success :is([class^="swal2-success-circular-line"],.swal2-success-fix) { background-color: var(--charcoal-surface) !important; }
