/* ----------------------------------------------------------------
   Standard Forge Theme Overrides for Bootstrap 5.3
   Source: sf-colors.css (Foundation-era overrides)
----------------------------------------------------------------- */

:root {
    --sf-primary-rgb: 84, 4, 12;
    --sf-primary: rgba(var(--sf-primary-rgb), 1);
    --sf-primary-soft: rgba(var(--sf-primary-rgb), 0.9);
    --sf-primary-hover: rgba(var(--sf-primary-rgb), 0.8);
    --sf-light: #ffffff;
    --sf-text-light: #f8f8f8;
}

/* Text selection */
::-moz-selection {
    color: var(--sf-text-light);
    background: var(--sf-primary);
}

::selection {
    color: var(--sf-text-light);
    background: var(--sf-primary);
}

/* Overlay tints */
.heroColor:after,
.heroSmallColor:after,
.heroSlideColor:after {
    background: rgba(var(--sf-primary-rgb), 0.8);
}

/* Brand link color system */
a,
.error404,
.link:hover,
.coloredText,
.meta a:hover,
.blogTitle a:hover,
.tagCloud a:hover,
.bgBlack .link:hover,
#trigger-overlay:hover,
.overlayMenu ul li a:hover,
.overlayMenu ul li a:focus,
#primaryMenu ul li a:hover,
.link:hover [class^="icon-"],
.overlayMenu .overlay-close:hover,
#primaryMenu > ul > li.current > a,
#primaryMenu > ul > span > li.current > a,
.overlayMenu.overlay-slidedown.bgColor > nav > ul > span > li.current > a,
.bgBlack #primaryMenu ul li a:hover,
.bgBlack .link:hover [class^="icon-"] {
    color: var(--sf-primary);
}

#footerNav > span::after {
    content: "\02237";
}

a:active,
a:focus,
a:hover {
    color: var(--sf-primary-hover);
}

/* Utility color block used throughout templates */
.bgColor {
    background-color: var(--sf-primary);
}

/* Divider utilities */
.divider,
.dividerCenter {
    background-color: var(--sf-primary);
}

.dividerCenter.dividerBlack {
    background-color: #000;
}

/* Bootstrap 5 button theme overrides */
.btn-primary,
.btn.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--sf-primary);
    --bs-btn-border-color: var(--sf-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--sf-primary-hover);
    --bs-btn-hover-border-color: var(--sf-primary-hover);
    --bs-btn-focus-shadow-rgb: var(--sf-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--sf-primary-hover);
    --bs-btn-active-border-color: var(--sf-primary-hover);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--sf-primary);
    --bs-btn-disabled-border-color: var(--sf-primary);
}

.btn-outline-primary,
.btn.btn-outline-primary,
.btnWhite {
    --bs-btn-color: var(--sf-primary);
    --bs-btn-border-color: var(--sf-primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--sf-primary);
    --bs-btn-hover-border-color: var(--sf-primary);
    --bs-btn-focus-shadow-rgb: var(--sf-primary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--sf-primary);
    --bs-btn-active-border-color: var(--sf-primary);
    --bs-btn-disabled-color: var(--sf-primary);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--sf-primary);
}

/* Keep legacy Foundation class names working during migration */
.button,
button,
input[type="submit"] {
    background-color: var(--sf-primary);
    border: 1px solid var(--sf-primary);
    color: #fff;
}

.button:hover,
.button:focus,
.button:active,
button:hover,
button:focus,
button:active,
input[type="submit"]:hover,
input[type="submit"]:focus {
    background-color: var(--sf-primary-soft);
    border-color: var(--sf-primary-soft);
    color: #fff;
}

.button.hollow {
    border: 2px solid var(--sf-primary);
    color: var(--sf-primary);
    background-color: transparent;
}

.button.hollow:hover,
.button.hollow:focus,
.button.hollow:active {
    background-color: var(--sf-primary);
    color: #fff;
    border-color: var(--sf-primary);
}

.button.btnReveal.hollow:hover,
.button.btnReveal.hollow:focus {
    color: var(--sf-primary);
}

/* Invert submit buttons inside dark/brand sections */
.bgColor input[type="submit"] {
    background-color: #fff;
    border-color: #fff;
    color: var(--sf-primary);
}

.shareBtns a:hover {
    color: #fff;
    background-color: var(--sf-primary);
}

.bgBlack .shareBtns a:hover,
.bgColor .shareBtns a:hover {
    color: var(--sf-primary);
    background-color: #fff;
}

.tagCloud a:hover {
    border-color: var(--sf-primary);
}

div.faqNav a.is-checked {
    background: var(--sf-primary);
    color: #fff;
}

.comingSoonNav .inline-list a:hover span {
    color: var(--sf-primary);
    background: rgba(255, 255, 255, 0.4);
}

.pricing-table.popular {
    border-top: 4px solid var(--sf-primary);
}

.object {
    border-top: 2px solid var(--sf-primary);
    border-left: 2px solid var(--sf-primary);
}

.footerWidgets a:hover,
.footerWidgets a:hover [class^="icon-"] {
    color: var(--sf-primary-soft);
}

label {
    color: rgba(var(--sf-primary-rgb), 0.7);
}

@media only screen and (min-width: 64.0625em) {
    #primaryMenu ul li a.navButton,
    .bgBlack #primaryMenu ul li a.navButton {
        border: 1px solid var(--sf-primary);
        color: var(--sf-primary);
    }

    #primaryMenu ul li:hover a.navButton,
    .bgBlack #primaryMenu ul li:hover a.navButton {
        background-color: var(--sf-primary);
    }

    #primaryMenu ul ul {
        border-top: 2px solid var(--sf-primary);
    }

    .bgBlack #primaryMenu ul ul {
        background-color: rgba(42, 43, 47, 1);
        border-top: 2px solid var(--sf-primary);
    }
}