/* ==========================================================================
   Tribal Youth Justice Resource Center — Custom CSS
   ========================================================================== */

/* --------------------------------------------------------------------------
   Typography
   -------------------------------------------------------------------------- */

.tribal-font-black {
    font-weight: 800;
}

blockquote footer {
    text-align: right;
}

figure figcaption {
    margin-top: 8px;
}

blockquote footer::before {
    content: "";
}

.uk-table thead,
.uk-table thead th {
    background-color: #41563a;
    color: #ffffff;
}

/* --------------------------------------------------------------------------
   Header — Utility Nav Icons
   -------------------------------------------------------------------------- */

.tribal-icon-calendar a::before,
.tribal-icon-podcast a::before,
.tribal-icon-blog a::before,
.tribal-icon-newsletter a::before,
.tribal-icon-subscribe a::before,
.tribal-icon-contact a::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    margin-right: 5px;
}

.tribal-icon-calendar a::before {
    background-image: url('/wp-content/uploads/2021/08/header-event.svg');
}

.tribal-icon-podcast a::before {
    background-image: url('/wp-content/uploads/2021/08/header-podcasts2.svg');
}

.tribal-icon-blog a::before {
    background-image: url('/wp-content/uploads/2021/08/header-blog.svg');
}

.tribal-icon-newsletter a::before {
    background-image: url('/wp-content/uploads/2025/12/newsletter-tyrc-20x20.jpg');
}

.tribal-icon-subscribe a::before {
    background-image: url('/wp-content/uploads/2021/08/header-newspaper-20x20.jpg');
}

.tribal-icon-contact a::before {
    background-image: url('/wp-content/uploads/2021/08/header-contact.svg');
}

/* --------------------------------------------------------------------------
   Subnav — suppress active underline on ancestor-only items
   current-page-ancestor gets uk-active but is not the current page;
   only current-menu-item should show the underline.
   -------------------------------------------------------------------------- */

.uk-subnav > .current-page-ancestor:not(.current-menu-item) > a {
    border-bottom-color: transparent !important;
}

/* --------------------------------------------------------------------------
   Background color utilities
   -------------------------------------------------------------------------- */

.tribal-bg-teal-blue {
    background-color: #497b84;
}

.tribal-bg-teal-blue > div {
    background-image: none !important;
}

/* --------------------------------------------------------------------------
   Mountain frame — decorative mountain SVG at opposing corners
   -------------------------------------------------------------------------- */

.tribal-mountain-frame,
.tribal-mountain-frame-white {
    background-image: url('/wp-content/uploads/2025/06/mountain-element-white.png'), url('/wp-content/uploads/2025/06/mountain-element-white.png');
    background-size: 140px;
    background-repeat: no-repeat;
    background-position: left top, right bottom;
}

/* Below 960px section padding drops to 70px — shrink graphic (70×56) so it clears the content */
@media (max-width: 959px) {
    .tribal-mountain-frame,
    .tribal-mountain-frame-white {
        background-size: 70px;
    }
}

/* --------------------------------------------------------------------------
   Page banners — show the whole image below 960px (no crop)
   Banner = first Builder section with a Cover background image and class
   tribal-parallax or tribal-banner. For non-3:2 images, override
   aspect-ratio in that section's Advanced → CSS.
   !important beats inline min-height (YOOtheme) and background-size/position
   (UIkit parallax from js/custom.js).
   -------------------------------------------------------------------------- */

@media (max-width: 959px) {
    .tribal-parallax > .uk-background-cover,
    .tribal-banner > .uk-background-cover {
        min-height: 0 !important;
        aspect-ratio: 3 / 2;
        background-size: cover !important;
        background-position: 50% 50% !important;
    }
}

/* --------------------------------------------------------------------------
   Meeting Materials — S&F accordion (form 7558)
   -------------------------------------------------------------------------- */

.tribal-meeting-accordion > * + * {
    margin-top: 1rem !important;
}

.tribal-meeting-date {
    overflow: hidden;
    background-color: #ffffff;
}

.tribal-meeting-date > .tribal-meeting-date-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #000000 !important;
    font-weight: 700;
    font-size: 1.1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #e5e5e5;
    margin: 0;
    text-decoration: none !important;
}

.tribal-meeting-caret {
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.uk-open > .tribal-meeting-date-title .tribal-meeting-caret {
    transform: rotate(180deg);
}

.tribal-meeting-date-content {
    padding: 1.25rem 1.5rem;
}

.tribal-meeting-item {
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
    border-bottom: 1px solid #f0f0f0;
}

.tribal-meeting-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.tribal-meeting-item-title a {
    text-decoration: underline;
    color: #000000 !important;
    font-weight: 600;
}

.tribal-meeting-item-title a:hover {
    color: #7a4851;
}

/* Truncate description to 3 clean lines */
.tribal-meeting-desc--collapsed {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tribal-meeting-toggle {
    display: inline-block;
    text-decoration: underline;
    color: #000000 !important;
    margin-top: 0.35rem;
    cursor: pointer;
}

.tribal-meeting-toggle:hover {
    color: #7a4851;
    text-decoration: none;
}

/* --------------------------------------------------------------------------
   Responsive embeds — classic editor / auto-embed iframes
   -------------------------------------------------------------------------- */

.tribal-embed-responsive {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}

.tribal-embed-responsive iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/* --------------------------------------------------------------------------
   Resource Library — card grid
   -------------------------------------------------------------------------- */

.tribal-resource-card {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 380px;
}

.tribal-resource-card .uk-card-media-top {
    position: absolute;
    inset: 0;
    display: block;
    overflow: hidden;
}

.tribal-resource-card .uk-card-media-top img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.tribal-resource-card .uk-card-body {
    position: relative;
    z-index: 2;
    margin-top: auto;
    display: flex;
    flex-direction: column;
    padding-top: 80px;
    background: linear-gradient(to bottom, transparent, #ffffff 35%);
}

.tribal-resource-card .uk-card-body p {
    margin-top: 0;
}

.tribal-resource-card .uk-card-body .uk-button {
    align-self: flex-start;
}

.tribal-resource-card .uk-card-title a {
    text-decoration: none;
    color: inherit;
}

.tribal-resource-card .uk-card-title a:hover {
    color: #7a4851;
}

.tribal-resource-badge {
    position: absolute;
    top: 1rem;
    left: 0;
    z-index: 1;
}

.tribal-resource-badge:nth-of-type(n+2) {
    display: none;
}

.tribal-resource-badge .uk-label {
    border-radius: 0;
    padding: 0.25em 1em;
    font-weight: 400;
    text-transform: uppercase;
    background-color: #333333;
    color: #ffffff;
    font-size: 0.7rem;
    letter-spacing: 0.05em;
}

/* --------------------------------------------------------------------------
   Search & Filter Pro — sidebar filters
   -------------------------------------------------------------------------- */

.searchandfilter h4 {
    font-family: 'Roboto', sans-serif;
}

.searchandfilter ul {
    margin: 0;
    padding: 0;
}

.searchandfilter ul li::before {
    content: none !important;
}

.sf-field-taxonomy-resource_type,
.sf-field-taxonomy-resource_issues,
.sf-field-taxonomy-resource_audience,
.sf-field-taxonomy-resource_keywords {
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}

.sf-field-sort_order .sf-input-select .sf-level-0 {
    display: block;
}

.searchandfilter select.sf-input-select {
    max-width: 170px;
}

/* S&F text/select field labels — block so inputs fill full width */
.searchandfilter .sf-field-search label,
.searchandfilter .sf-field-sort_order label,
.searchandfilter label:has(select) {
    display: block;
    width: 100%;
}

/* S&F form inputs — match UIkit3 uk-input / uk-select styles */
.searchandfilter input[type="text"],
.searchandfilter input[type="search"] {
    box-sizing: border-box;
    max-width: 100% !important;
    width: 100% !important;
    height: 40px;
    padding: 0 10px;
    border: 0 none;
    border-radius: 0;
    background: #f8f8f8;
    color: #000;
    font: inherit;
    vertical-align: middle;
    transition: background-color 0.2s ease-in-out;
    -webkit-appearance: none;
}
.searchandfilter input[type="text"]:focus,
.searchandfilter input[type="search"]:focus {
    outline: 0;
    background-color: #ebebeb;
}
.searchandfilter select {
    box-sizing: border-box;
    max-width: 100% !important;
    width: 100% !important;
    height: 40px;
    padding: 0 10px;
    border: 0 none;
    border-radius: 0;
    background: #f8f8f8;
    color: #000;
    font: inherit;
    vertical-align: middle;
    transition: background-color 0.2s ease-in-out;
}
.searchandfilter select:focus {
    outline: 0;
    background-color: #ebebeb;
}

.search-filter-reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 500px;
    border: 1px solid #333333;
    background-color: transparent;
    color: #333333;
    padding: 0 0.75rem;
    line-height: 38px;
    font-size: 14px;
    cursor: pointer;
    text-decoration: none;
    transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, border-color 0.1s ease-in-out;
}

.search-filter-reset:hover {
    background-color: #41563a;
    border-color: #41563a;
    color: #ffffff;
}

/* --------------------------------------------------------------------------
   Gravity Forms — match theme button-default style
   -------------------------------------------------------------------------- */

.gform_button.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 500px;
    border: 1px solid #333333;
    background-color: #333333;
    color: #ffffff;
    padding: 0 0.75rem;
    line-height: 38px;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 400;
    text-decoration: none;
    cursor: pointer;
    transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, border-color 0.1s ease-in-out;
}

.gform_button.button:hover,
.gform_button.button:focus {
    background-color: #41563a;
    border-color: #41563a;
    color: #212121;
    text-decoration: none;
}

/* --------------------------------------------------------------------------
   Footer — Zigzag border
   -------------------------------------------------------------------------- */

.tm-footer {
    position: relative;
}

.tm-footer::before {
    content: '';
    position: absolute;
    top: -19px;
    left: 0;
    right: 0;
    height: 20px;
    background: url('/wp-content/themes/yootheme-tribal/img/border-triangle-pattern-headerbar-top-sm.svg') repeat-x center;
    z-index: 1;
}

/* --------------------------------------------------------------------------
   The Events Calendar — theme overrides
   -------------------------------------------------------------------------- */

.tribe-common,
.tribe-events {
    --tec-color-text-disabled: #5d5d5d;
    --tec-color-border-default: #5d5d5d;
    --tec-color-icon-disabled: #5d5d5d;
    --tec-color-background-events-bar: rgba(255, 255, 255, 0.3);
    --tec-color-background-view-selector: var(--tec-color-background-events-bar);
}

/* Datepicker — prevent global thead yellow bleeding into year header row */
.datepicker thead {
    background-color: transparent !important;
}

/* Datepicker — kill TEC's outline custom property at source */
.datepicker {
    --tec-outline-active-default: none;
}

/* Datepicker — active/current month pill: yellow instead of TEC blue */
.datepicker .month.active,
.datepicker .month.active:hover,
.datepicker .month.focused.active {
    background-color: #41563a !important;
    color: #212121 !important;
    outline: none !important;
}

/* Font family */
.tribe-common,
.tribe-common .tribe-common-h1,
.tribe-common .tribe-common-h2,
.tribe-common .tribe-common-h3,
.tribe-common .tribe-common-h4,
.tribe-common .tribe-common-h5,
.tribe-common .tribe-common-h6,
.tribe-common .tribe-common-h7,
.tribe-common .tribe-common-h8,
.tribe-common .tribe-common-b1,
.tribe-common .tribe-common-b2,
.tribe-common .tribe-common-b3,
.tribe-common .tribe-common-c-btn,
.tribe-common a.tribe-common-c-btn,
.tribe-common .tribe-common-c-btn-border,
.tribe-common a.tribe-common-c-btn-border {
    font-family: 'Roboto', sans-serif !important;
}

/* Primary buttons → yellow */
.tribe-common .tribe-common-c-btn,
.tribe-common a.tribe-common-c-btn,
.tribe-common--breakpoint-medium.tribe-common .tribe-common-c-btn,
.tribe-common--breakpoint-medium.tribe-common a.tribe-common-c-btn {
    background-color: #41563a;
    color: #fff;
    border-radius: 500px;
    text-transform: uppercase;
    font-weight: 700;
}
.tribe-common .tribe-common-c-btn:hover,
.tribe-common a.tribe-common-c-btn:hover {
    background-color: #e6be00;
    color: #fff;
}

/* TEC list view — align event row to container (fix -24px gutter overflow) */
.tribe-events-calendar-list .tribe-common-g-row {
    margin-left: 0 !important;
}

/* TEC — remove focus outline on mouse press only; keyboard focus keeps it (Section 508 fix 2026-10-10) */
.tribe-events .tribe-events-c-view-selector--labels .tribe-events-c-view-selector__button:focus:not(:focus-visible),
.tribe-events .tribe-events-c-view-selector--labels button.tribe-events-c-view-selector__button:focus:not(:focus-visible),
.tribe-common--breakpoint-medium.tribe-events .tribe-events-c-view-selector__list-item-link:focus:not(:focus-visible),
.tribe-events .tribe-events-c-nav__prev:focus:not(:focus-visible),
.tribe-events .tribe-events-c-nav__next:focus:not(:focus-visible),
.tribe-events .tribe-events-c-nav__today:focus:not(:focus-visible),
.tribe-common .tribe-common-c-btn:focus:not(:focus-visible),
.tribe-common a.tribe-common-c-btn:focus:not(:focus-visible),
.tribe-common button.tribe-common-c-btn:focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
}



/* Find Events button hover — override TEC's CSS custom property */
.tribe-events .tribe-events-c-search__button:hover,
.tribe-events .tribe-events-c-search__button:focus {
    background-color: #e6be00 !important;
    color: #fff !important;
    border-radius: 500px !important;
}

/* Accent color — icons, links */
.tribe-common .tribe-common-c-svgicon {
    color: #41563a !important;
}
.tribe-common .tribe-common-anchor-thin-alt {
    color: #333333;
    border-color: #333333;
}
.tribe-common .tribe-common-anchor-thin-alt:hover {
    color: #41563a;
    border-color: #41563a;
}
.tribe-events .tribe-events-c-ical__link,
.tribe-common .tribe-common-c-btn-border,
.tribe-common a.tribe-common-c-btn-border {
    border-color: #333333 !important;
    color: #333333 !important;
}
.tribe-events .tribe-events-c-ical__link:hover,
.tribe-common .tribe-common-c-btn-border:hover,
.tribe-common a.tribe-common-c-btn-border:hover {
    background-color: #41563a !important;
    border-color: #41563a !important;
    color: #212121 !important;
}

/* Date-tag square in list view */
.tribe-events .tribe-events-calendar-list__event-date-tag {
    display: none;
}
@media (min-width: 768px) {
    .tribe-events .tribe-events-calendar-list__event-date-tag {
        display: block;
        background-color: #333333;
        max-height: 6rem;
        max-width: 6rem;
        color: #ffffff;
        margin-right: 1rem;
    }
    .tribe-events .tribe-events-calendar-list__event-date-tag .tribe-common-h4--min-medium {
        font-size: 1rem !important;
        text-transform: uppercase;
        color: #ffffff !important;
    }
}
.tribe-events .tribe-events-calendar-list__event-date-tag-weekday {
    color: #ffffff !important;
}
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-date-tag-datetime {
    justify-content: center;
}

/* Hide venue / virtual labels */
.tribe-events .tribe-events-calendar-list__event-venue,
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-venue,
.tribe-events.tribe-events-widget .tribe-events-virtual-virtual-event,
.tribe-events-virtual-single-marker,
.tribe-events-virtual-hybrid-event__icon,
.tribe-events-virtual-virtual-event__icon {
    display: none !important;
}

/* Remove top padding on list container */
.tribe-events .tribe-events-l-container {
    padding-top: 0 !important;
}

/* Widget/shortcode list — hide datetime text above title (date shown in date-tag) */
.tribe-events-widget-events-list__event-datetime-wrapper {
    display: none !important;
}

/* Month view — remove inherited thead yellow from day-name header row */
.tribe-events-calendar-month__header {
    background-color: transparent;
}

/* Month view — separator line below day-name header row */
.tribe-events-calendar-month__body tr:first-child .tribe-events-calendar-month__day {
    border-top: 1px solid #e4e4e4 !important;
}

/* Month view — current day yellow */
.tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date,
.tribe-events .tribe-events-calendar-month__day--current .tribe-events-calendar-month__day-date-link {
    color: #41563a !important;
}
.tribe-events .tribe-events-calendar-month__mobile-events-icon--event {
    background-color: #41563a !important;
}

/* Hide sub-nav on single event */
.tribe-events-single .tribe-events-sub-nav {
    display: none;
}


/* TEC meta grid — brand yellow links */
.tec-event-meta a {
    color: #41563a;
    text-decoration: none;
}
.tec-event-meta a:hover {
    text-decoration: underline;
}

/* Single event "This event has passed." notice */
.tribe-events-notices {
    margin-bottom: 1rem;
}
.tribe-events-notices ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.tribe-events-notices ul li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #fff8e1;
    border: 1px solid #f0c040;
    border-radius: 4px;
    font-size: 0.875rem;
    font-weight: 500;
    color: #7a5c00;
}
.tribe-events-notices ul li::before {
    content: "⚠";
    font-size: 1em;
}

/* Single event / venue / organizer titles */
.single-tribe_events .uk-article-title,
.single-tribe_venue .uk-article-title,
.single-tribe_organizer .uk-article-title {
    color: #000;
}

/* Single event prev/next nav */
.tec-event-nav a {
    display: flex;
    align-items: center;
    gap: 4px;
    color: inherit;
    text-decoration: none;
}
.tec-event-nav a:hover {
    text-decoration: underline;
}
.tec-event-nav__title {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.tec-event-nav__next a {
    justify-content: flex-end;
}


/* --------------------------------------------------------------------------
   Blockquote — tribal-quote-block
   Apply to any container or blockquote element in Builder.
   -------------------------------------------------------------------------- */

.tribal-quote-block {
    position: relative;
    background: #e19e05;
    padding: 4rem 3.5rem 3.5rem;
    border-radius: 6px;
    overflow: hidden;
}

.tribal-quote-block::before {
    content: '\201C';
    position: absolute;
    top: 0.5rem;
    left: 2rem;
    font-family: 'EB Garamond', Georgia, serif;
    font-size: 10rem;
    font-weight: 800;
    line-height: 1;
    color: #7a4851;
    opacity: 0.25;
    pointer-events: none;
    user-select: none;
}

.tribal-quote-block blockquote,
.tribal-quote-block.blockquote {
    margin: 0;
    padding: 0;
    border: none;
    background: none;
    font-family: 'EB Garamond', Georgia, serif;
    font-size: 1.5rem;
    font-style: italic;
    line-height: 1.6;
    color: #333333;
}

.tribal-quote-block blockquote footer,
.tribal-quote-block footer {
    margin-top: 1.25rem;
    font-family: 'Roboto', sans-serif;
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #7a4851;
}

/* --------------------------------------------------------------------------
   Gravity Forms — UIkit3 normalization
   Scoped to .gform_wrapper so it applies site-wide to all GF forms.
   -------------------------------------------------------------------------- */

.gform_wrapper .gfield {
    margin-bottom: 16px;
}

.gform_wrapper .gfield_label {
    display: block;
    margin-bottom: 6px;
    font-family: 'Roboto', sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    color: #333333;
}

.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="url"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="password"],
.gform_wrapper input[type="search"],
.gform_wrapper textarea,
.gform_wrapper select {
    display: block;
    width: 100%;
    height: 40px;
    padding: 0 10px !important;
    background: #f8f8f8;
    color: #000;
    border: 0 none;
    border-radius: 0;
    font-family: inherit;
    font-size: 1rem !important;
    box-sizing: border-box;
    outline: 0;
    box-shadow: none;
    transition: .2s ease-in-out;
    transition-property: color, background-color, border-color, box-shadow;
}

.gform_wrapper textarea {
    height: auto;
    padding: 10px;
}

.gform_wrapper input[type="text"]:focus,
.gform_wrapper input[type="email"]:focus,
.gform_wrapper input[type="tel"]:focus,
.gform_wrapper input[type="url"]:focus,
.gform_wrapper input[type="number"]:focus,
.gform_wrapper input[type="password"]:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
    outline: 0;
    background-color: #ebebeb;
    color: #000;
}

.gform_wrapper .gfield-choice-input {
    accent-color: #0a5d80;
    width: 16px;
    height: 16px;
    margin-right: 6px;
    vertical-align: middle;
    cursor: pointer;
}

.gform_wrapper .gform_button {
    display: inline-block;
    padding: 0 24px;
    height: 38px;
    background: transparent;
    color: #333333;
    border: 1px solid #333333;
    border-radius: 500px;
    font-family: 'Roboto', sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background-color 0.1s ease, border-color 0.1s ease, color 0.1s ease;
}

.gform_wrapper .gform_button:hover {
    background: #41563a;
    border-color: #41563a;
    color: #212121;
}

.gform_wrapper .gfield_required_asterisk {
    color: #7a4851;
    margin-left: 2px;
}

.gform_wrapper .validation_message,
.gform_wrapper .gfield_error .gfield_label {
    color: #7a4851;
    font-size: 0.8rem;
}

.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error textarea,
.gform_wrapper .gfield_error select {
    border-color: #7a4851;
}

.uk-light .gform_wrapper .gfield_label,
.uk-light .gform_wrapper .gfield_required_asterisk,
.uk-light .gform_wrapper .gform_description {
    color: #fff;
}

.uk-light .gform_wrapper .gform_button {
    color: #fff;
    border-color: #fff;
}

/* --------------------------------------------------------------------------
   Tiles
   -------------------------------------------------------------------------- */

.uk-tile-secondary {
    clip-path: polygon(90% 0, 100% 20%, 100% 100%, 0 100%, 0 0);
}

/* --------------------------------------------------------------------------
   Theme My Login — Grantee Portal login form
   UIkit classes injected via functions.php tml_render_form_field hook.
   -------------------------------------------------------------------------- */

.tml-login .form-group {
    margin-bottom: 16px;
}

.tml-login .tml-label {
    display: block;
    margin-bottom: 6px;
    font-weight: 700;
    font-size: 0.875rem;
}

.tml-login .tml-label[for="rememberme"] {
    display: inline;
    font-weight: 400;
}

.tml-login .tml-checkbox {
    accent-color: #0a5d80;
    vertical-align: middle;
    margin-right: 6px;
}

.tml-login .tml-links a,
.tml-login a {
    color: #0a5d80;
    font-size: 0.875rem;
}

/* --------------------------------------------------------------------------
   Search & Filter Pro — Resource Library filter panel
   -------------------------------------------------------------------------- */

/* Panel container */
form.searchandfilter {
    background: #ffffff;
    padding: 30px;
    border: 1px solid #e0e0e0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
    border-radius: 10px;
}

/* Field headings */
form.searchandfilter h4 {
    font-size: 0.8125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #555555;
    margin-bottom: 10px;
    margin-top: 0;
}

/* List resets */
form.searchandfilter ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Spacing between fields */
form.searchandfilter > ul > li + li {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
}

/* Issue Areas — cap height, thin scrollbar (checkbox taxonomy field) */
form.searchandfilter li[data-sf-field-input-type="checkbox"] > ul {
    max-height: 260px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #cccccc transparent;
    background: #f2f4f1;
    border-radius: 6px;
    padding: 20px;
    padding-right: 20px;
}
form.searchandfilter li[data-sf-field-input-type="checkbox"] > ul::-webkit-scrollbar {
    width: 4px;
}
form.searchandfilter li[data-sf-field-input-type="checkbox"] > ul::-webkit-scrollbar-thumb {
    background: #cccccc;
    border-radius: 4px;
}

/* Option rows — js moves input inside label; row just needs spacing */
form.searchandfilter ul li {
    padding: 0;
}

form.searchandfilter li[data-sf-depth] {
    list-style: none;
    padding: 0;
}

/* Label — force flex; reset UIkit's base label overrides (uppercase, letter-spacing, font) */
/* padding: 0 overrides a 10px padding-left injected by UIkit/S&F that causes box-sizing overflow */
form.searchandfilter label.uk-flex {
    display: flex !important;
    align-items: flex-start;
    width: 100%;
    gap: 8px;
    cursor: pointer;
    font-size: 0.9rem;
    text-transform: none;
    letter-spacing: normal;
    font-weight: normal;
    font-family: inherit;
    color: inherit;
    margin-bottom: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Text + badge wrapper — fills remaining space; badge flows inline with last word */
form.searchandfilter .sf-label-text {
    flex: 1;
    min-width: 0;
}

/* Reset uk-checkbox's margin-top: -4px; nudge down to align with first text line */
form.searchandfilter label.uk-flex .uk-checkbox,
form.searchandfilter label.uk-flex .uk-radio {
    flex-shrink: 0;
    margin-top: 2px;
}

/* Override S&F's .searchandfilter .sf-count { display: inline-block; padding-left: 5px } */
form.searchandfilter label.uk-flex .uk-badge {
    display: inline-flex !important;
    padding: 0 5px;
    flex-shrink: 0;
    align-self: flex-start;
}


/* ==========================================================================
   Section 508 / WCAG 2.1 AA fixes — 2026-10-10 (SkyHighVisions)
   From the 2026-10-09 axe check, items 1–5. Approved by Laura Smith 2026-10-09
   with one exception: the homepage "If Not Now, When?" heading keeps its
   original teal (#069494) — see pin at the end of item 3.
   ========================================================================== */

/* 1. Top tan bar links: #333 on #a38b6f was 3.89:1 → #1a1a1a is 5.37:1.
      Hover was white on tan (3:1); now black + underline. */
.tm-headerbar-top .uk-subnav > * > :first-child {
    color: #1a1a1a;
}
.tm-headerbar-top .uk-subnav > * > a:hover {
    color: #000;
    text-decoration: underline;
}

/* 2. Keyboard focus: two-tone ring (dark outline + white inner ring) that shows
      on tan, maroon, beige and white. :focus-visible only, so mouse clicks look
      the same as before. */
:focus-visible,
.uk-dropbar :focus-visible,
.uk-navbar-dropdown :focus-visible,
.uk-dropdown :focus-visible {
    outline: 3px solid #1a1a1a !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px #fff !important;
}

/* 3. Low-contrast theme colours, darkened slightly.
      Teal #069494 → #047676 (links on white 3.7 → 5.44:1; large headings on tan
      2.35 → 3.46:1). Same selectors/specificity as theme.css, so contextual
      colours (light sections etc.) still win. */
.uk-heading-small,
.uk-heading-medium,
.uk-heading-large,
.uk-heading-xlarge,
.uk-heading-2xlarge,
.uk-heading-3xlarge,
.uk-description-list>dt,
.uk-icon-overlay:hover,a:hover .uk-icon-overlay,
.uk-form-label,
.uk-button-default.uk-active,.uk-button-default:active,
.uk-button-text,
.uk-button-text:hover,
.uk-button-link,
.uk-card-overlay .uk-card-title,
.uk-totop:active,
.uk-article-title,
.uk-nav-default>li.uk-active>a,
.uk-nav-default .uk-nav-header,
.uk-nav-default .uk-nav-sub li.uk-active>a,
.uk-nav-primary>li.uk-active>a,
.uk-nav-primary .uk-nav-header,
.uk-nav-primary .uk-nav-sub li.uk-active>a,
.uk-nav-secondary>li>a,
.uk-nav-secondary>li>a:hover,
.uk-nav-secondary>li.uk-active>a,
.uk-nav-secondary>li.uk-active>a .uk-nav-subtitle,
.uk-nav-secondary .uk-nav-header,
.uk-nav-secondary .uk-nav-sub li.uk-active>a,
.uk-navbar-dropdown-nav .uk-nav-header,
.uk-navbar-dropdown-nav .uk-nav-sub li.uk-active>a,
.uk-tab>.uk-active>a,
.uk-dropdown-nav .uk-nav-header,
.uk-text-lead,
.uk-logo,
.uk-logo:hover {
    color: #047676;
}

.uk-list-emphasis>::marker,
.uk-text-emphasis {
    color: #047676 !important;
}

/* Exception requested by Laura Smith (2026-10-09): keep the homepage
   "If Not Now, When?" heading in the original teal. */
body.home .uk-heading-medium.uk-text-emphasis.tribal-font-black.uk-text-italic {
    color: #069494 !important;
}

/* Resource Library filter count badges: white on orange was 2.3:1 → dark text
   on the same orange, 7.31:1. */
.uk-badge,
.uk-badge:hover,
a.uk-badge:hover {
    color: #1d1d1b !important; /* theme.css sets #fff !important */
}

/* Grey resource tags: white on #868686 was 3.64:1 → #707070, 4.95:1. */
.uk-label {
    background: #707070;
}

/* Grey meta text on beige: #5d5d5d was 4.19:1 → #4d4d4d, 5.38:1. */
.uk-text-meta,
.uk-text-meta > a {
    color: #4d4d4d;
}
.tribe-common,
.tribe-events {
    --tec-color-text-disabled: #4d4d4d;
    --tec-color-text-secondary: #4d4d4d; /* e.g. "Previous Events" link on the calendar */
}

/* 4. Events Calendar yellow buttons ("Find Events" etc.): white on #e6be00 was
      1.79:1 → dark text, 9.43:1. Overrides the hover rules above. */
.tribe-common .tribe-common-c-btn:hover,
.tribe-common a.tribe-common-c-btn:hover,
.tribe-events .tribe-events-c-search__button:hover,
.tribe-events .tribe-events-c-search__button:focus {
    color: #1d1d1b !important;
}

/* 5. Phone menu links: 50% white on #333 was 4.43:1 → 75% white, 7.87:1.
      (Menu name is set in js/custom.js; the duplicate search widget was removed
      from the dialog-mobile widget area.) */
#tm-dialog-mobile .uk-nav > li > a,
#tm-dialog-mobile .uk-nav-sub a {
    color: rgba(255, 255, 255, 0.75);
}
#tm-dialog-mobile .uk-nav > li > a:hover,
#tm-dialog-mobile .uk-nav-sub a:hover,
#tm-dialog-mobile .uk-nav li.uk-active > a {
    color: #fff;
}

/* 2026-10-11 — Members access notice inside Events Calendar views (list/day/past lists).
   TEC's reset (.tribe-common a / div / p in common-skeleton.css + common-full.css,
   specificity 0,1,1) beats UIkit's .uk-button-primary / .uk-button-small / .uk-alert (0,1,0),
   so the "Log in to the Grantee Portal" button rendered as a plain text link and the
   alert lost its padding. Re-assert the UIkit values, scoped to TEC containers only. */
.tribe-common .tribal-access-notice.uk-alert {
    padding: 15px 29px 15px 15px;
}
.tribe-common .tribal-access-notice p.uk-margin-small-top {
    margin-top: 10px;
}
.tribe-common .tribal-access-notice a.uk-button.uk-button-primary,
.tribe-common .tribal-access-notice a.uk-button.uk-button-primary:visited,
.tribe-common .tribal-access-notice a.uk-button.uk-button-primary:focus {
    display: inline-block;
    padding: 0 15px;
    border: 1px solid transparent;
    border-radius: 500px;
    background-color: #41563a;
    color: #fff;
    font-size: 0.875rem;
    line-height: 28px;
    text-decoration: none;
}
.tribe-common .tribal-access-notice a.uk-button.uk-button-primary:hover {
    background-color: #354730;
    color: #fff;
}
.tribe-common .tribal-access-notice a.uk-button.uk-button-primary:active {
    background-color: #2a3825;
    color: #fff;
}
