/* ==========================================================================
    LAYOUTS
    -------------------------------------------------------------------------
    Grid
      : Sidebars (Override/complement)

    ELEMENTS
    -------------------------------------------------------------------------
    Indicators
      : Count (New)
      : Pills (New)

    COMPONENTS
    -------------------------------------------------------------------------
    Cards
      : Articles as cards (Override/complement)
    Tables
      : Default (Override/complement)
      : First child border (Override/complement)

    WIDGETS
    -------------------------------------------------------------------------
    Search
      : Visible (New)

    MODULES
    -------------------------------------------------------------------------
    Header
    Banner
      : Extra (New)
    Footer

    PAGETYPES
    -------------------------------------------------------------------------
    Dashboard
      : Section (Override/complement)
    Search jobs
      : Cards
        : Result (Override/complement)

    UTILITIES
    -------------------------------------------------------------------------
    XXX
========================================================================== */

/*
    LAYOUTS/Grid: Sidebars (Within PAGETYPES/Dashboard: Section)
*/

.section--dashboard .grid--2--sidebar {
    column-gap: var(--t-gs--space--0);
}

/*
    ELEMENTS/Indicators: Count (New)
*/

.count {
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    border-radius: 1.5rem;
    min-inline-size: 3rem;
    block-size: 3rem;
    background-color: var(--t-gs--color--border--default--focus);
    font-size: 1.4rem;
    font-weight: 500;
    text-align: center;
    color: var(--t-gs--color--text--on--fill--brand);
}

/*
    ELEMENTS/Indicators: Pills (New)
*/

.pill {
    display: inline;
    border-start-start-radius: var(--t-gs--border--radius--l);
    border-start-end-radius: var(--t-gs--border--radius--l);
    border-end-start-radius: var(--t-gs--border--radius--l);
    border-end-end-radius: var(--t-gs--border--radius--l);
    font-size: var(--t-gs--font--size--03);
    padding-block: var(--t-gs--space--xs);
    padding-inline: var(--t-gs--space--s);
    background-color: var(--t-gs--swatch--link);
    color: var(--t-gs--swatch--link--100);
    font-weight: 400;
    vertical-align: middle;
}

/*
    COMPONENTS/Cards: Articles as cards (Within LAYOUTS/Grid: Sidebars)
*/

.grid__item--aside-right .article--card--metric {
    display: flex;
    block-size: 100%;
    justify-content: center;
}

/*
    COMPONENTS/Tables: Default (Override/complement)
*/

.table--default tbody tr>:first-child {
    border-inline-end: solid 0.1rem var(--t-tc--table--border--color);
}

.table--default tbody tr td:nth-last-child(1) {
    display: flex;
    align-items: center;
    gap: var(--t-gs--space--s);
    inline-size: unset;
    white-space: nowrap;
}

/*
    WIDGETS/Search: Visible (Override/complement)
*/

/* Media query to target only desktop */
@media all and (min-width: 1025px) {
    .section[search-type="visible"] .section__header__text {
        display: flex;
        margin-block-end: var(--t-gs--space--l);
    }
}

/*
    MODULES/Header
*/

.header__wrapper {
    block-size: 5.6rem;
}

.menu--visible .submenu__item+.submenu__item, .menu--visible .portalLanguages__item+.portalLanguages__item {
    border-block-start-width: var(--t-gs--border--width--0);
}

.toggle--menu[aria-expanded=false] .toggle__icon:before {
    inset-block-start: -.6rem;
}

.toggle--menu[aria-expanded=false] .toggle__icon:after {
    inset-block-start: .6rem;
}

.menu--toggleable .menu__panel {
    border-block-start-width: var(--t-gs--border--width--0);
    padding-inline-start: var(--t-gs--space--m);
    padding-inline-end: var(--t-gs--space--m);
}

.menu--toggleable .menu__item .submenu__list {
    top: .1rem;
}

/* Media query to target mobile and tablet */
@media all and (max-width:1024px) {
    .menu__link {
        padding-block-start: var(--t-gs--space--s2);
        padding-block-end: var(--t-gs--space--s2);
    }
}

/* Media query to target only tablet */
@media (min-width:751px) and (max-width:1024px) {
    html[menu-type="toggleable"] {
        --t-tc--menu--width: 42rem;
    }
}

/*
    MODULES/Banner
*/

.banner--main .title,
.banner--learn .title,
.banner--main .tc_formLabel,
.banner--learn .tc_formLabel {
    color: var(--t-gs--swatch--neutral--100);
}

/*
    MODULES/Banner: Extra (New)
*/

.banner--extra {
    --t-tc--banner--background--color: var(--t-gs--color--surface--tertiary);
}

.banner--extra .banner__wrapper {
    --t-tc--banner--padding--top: var(--t-gs--space--xxxl);
    --t-tc--banner--padding--bottom: var(--t-gs--space--xxxl);

    justify-content: center;
    gap: var(--t-gs--space--m);
}

/* Media query to target only mobile */
@media all and (max-width:750px) {
    .banner--extra .banner__wrapper {
        flex-direction: column;
    }

    .banner--extra .banner__button {
        inline-size: 100%;
    }

}

/*
    MODULES/Footer
*/

/* Media query to target large desktop */
@media (min-width:1025px) and (max-width:1599px) {
    .footer__wrapper {
        block-size: 6.8rem;
        align-content: center;
    }
}

/* Media query to target extra large desktop */
@media (min-width:1600px) {
    .footer__wrapper {
        block-size: 5.33rem;
        align-content: center;
    }
}

/* Media query to target only mobile */
@media (width <= 750px) {
    .footer * {
        line-height: 148%;
    }
    .footer__wrapper {
        min-block-size: 17rem;
        align-content: center;
    }
}

/*
    PAGETYPES/Dashboard: Section (Override/complement)
*/

.section--dashboard .section__header__count {
    margin-inline-end: var(--t-gs--space--s);
}

.section--dashboard .section__header__text {
    display: flex;
    align-items: baseline;
    gap: var(--t-gs--space--s);
}

/*
    PAGETYPES/Search jobs: Cards: Result (Override/complement)
*/

.section--search-jobs .article--result {
    --t-tc--result--border--radius: var(--t-gs--border--radius--0);
    --t-tc--result--padding--outers--h: var(--t-gs--space--0);
}

.section--search-jobs .article--result + .article--result {
    margin-block-start: var(--t-gs--space--0);
}

/* UTILITIES: XXX
   -------------------------------------------------------------------------- */
