/*
 * Tameside MBC — Connect branded styles.
 * Brand primary #0090D2 (fills use --primary-solid, tuned for AA vs white while staying close to brand).
 * Accent / secondary #007859.
 */

/* ------------------------------------------------------------------------- */
/* Design tokens                                                             */
/* ------------------------------------------------------------------------- */

:root {
    --primary: #0090d2;
    --primary-rgb: 0, 144, 210;
    --primary-solid: #0079b2;
    --primary-foreground: #fff;
    --primary-light: #e3f4fc;
    --primary-light-foreground: var(--primary-solid);
    --primary-lightest: #f2fafd;
    --secondary: #e0f5ef;
    --secondary-foreground: #007859;
    --secondary-solid: #007859;
    --primary-filter: invert(42%) sepia(93%) saturate(1400%) hue-rotate(173deg) brightness(96%) contrast(101%);
}

/* ------------------------------------------------------------------------- */
/* Surfaces & lead generation                                                */
/* ------------------------------------------------------------------------- */

.bg-grey-lightest {
    background-color: var(--primary-lightest) !important;
}

.bg-lead-generation {
    background-color: var(--primary-light) !important;
}

.lead-generation-background {
    background-color: var(--primary-lightest) !important;
}

.bg-main-accent {
    background-color: var(--primary-solid) !important;
}

/* ------------------------------------------------------------------------- */
/* Navigation                                                                */
/* ------------------------------------------------------------------------- */

.nav-secondary {
    background: var(--primary-solid) !important;
}

.nav-item-secondary-link {
    color: var(--primary-foreground) !important;
}

.nav-item.active .nav-item-link,
.nav-item-link:hover {
    border-color: var(--primary);
}

.ea-plus .nav-item.active .nav-item-link,
.ea-plus .nav-item-link:hover {
    background-color: var(--primary-solid) !important;
    color: var(--primary-foreground) !important;
}

/* ------------------------------------------------------------------------- */
/* Tabs                                                                      */
/* ------------------------------------------------------------------------- */

.tabs-horizontal.tabs-line .tabs-trigger[aria-selected="true"] {
    border-bottom: solid 2px var(--primary) !important;
    color: var(--primary-solid) !important;
}

/* ------------------------------------------------------------------------- */
/* Buttons                                                                   */
/* ------------------------------------------------------------------------- */

.btn-primary {
    background-color: var(--primary-solid) !important;
    border-color: var(--primary-solid) !important;
    color: var(--primary-foreground) !important;
}

.btn-primary.banner-btn {
    border-color: #2a6539 !important;
    background-color: #2a6539 !important;
    color: #fff !important;
}

.btn-outline-primary:hover {
    background-color: var(--primary-solid) !important;
    border-color: var(--primary-solid) !important;
    color: var(--primary-foreground) !important;
}

.btn-secondary {
    background-color: var(--secondary) !important;
    border-color: transparent !important;
    color: var(--secondary-foreground) !important;
}

.btn-outline-secondary {
    border-color: var(--secondary-solid) !important;
    color: var(--secondary-solid) !important;
}

.btn-outline-secondary:hover {
    background-color: var(--secondary-solid) !important;
    border-color: var(--secondary-solid) !important;
    color: #fff !important;
}

/* ------------------------------------------------------------------------- */
/* Toggles                                                                   */
/* ------------------------------------------------------------------------- */

.btn-reset.btn-toggle.active {
    background-color: var(--secondary) !important;
    color: var(--secondary-foreground) !important;
}

.btn-toggle.btn-toggle-tab[aria-selected="true"] {
    background-color: var(--secondary) !important;
    color: var(--secondary-foreground) !important;
}

.btn-toggle:focus-visible {
    box-shadow: 0 0 0 3px var(--primary) !important;
}

/* ------------------------------------------------------------------------- */
/* Links & lists                                                             */
/* ------------------------------------------------------------------------- */

.advanced-search-link.text-primary,
.burial-list-action-button.text-primary,
.btn-text.underline {
    color: #26272b !important;
}

a.underline:not(.nav-item-secondary-link) {
    color: #26272b !important;
}

a.text-primary:not(.btn):not(.nav-item-secondary-link) {
    color: #26272b !important;
}

.underline {
    text-decoration-color: var(--primary) !important;
}

.list-reset svg {
    color: var(--primary-solid);
}

/* ------------------------------------------------------------------------- */
/* Branding                                                                  */
/* ------------------------------------------------------------------------- */

.custom-logo {
    content: url(./images/tameside-logo.png);
    padding-top: 8px;
    padding-bottom: 8px;
    width: auto;
}

.landingslider {
    background: url(./images/tameside-background.png) no-repeat;
    background-position: 50% 65%;
    background-size: cover;
}

/* ------------------------------------------------------------------------- */
/* Date picker                                                               */
/* ------------------------------------------------------------------------- */

.datepicker td.active,
.datepicker td.active:hover {
    background-color: var(--primary-solid) !important;
}

/* ------------------------------------------------------------------------- */
/* Obituaries                                                                */
/* ------------------------------------------------------------------------- */

.obituary-list-card .obituary-information__container {
    border-bottom: solid 1px var(--primary);
}

.obituary-list-card .obituary-event-date__container .obituary-event-date .ms-event-date-bgcolor {
    background-color: var(--primary-solid) !important;
}

.obituary-list-card .fa-regular {
    color: var(--primary-solid) !important;
}

/* ------------------------------------------------------------------------- */
/* Homepage marketing icons                                                  */
/* ------------------------------------------------------------------------- */

.explore-icon,
.ask-icon,
.discover-icon {
    filter: var(--primary-filter);
}

/* ------------------------------------------------------------------------- */
/* Footer                                                                    */
/* ------------------------------------------------------------------------- */

#footer-container {
    background-color: var(--primary-solid) !important;
}

.footer-link a {
    color: inherit;
}

#footer-container * {
    color: var(--primary-foreground) !important;
}

#footer-container #pb-footer-logo {
    filter: brightness(0) invert(1);
}
