.crittex-header-account {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 0;
}

.crittex-header-tools .crittex-header-link {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    width: 54px;
    height: 54px;
    min-width: 54px;
    padding: 0 !important;
    box-sizing: border-box;
    line-height: 1 !important;
    text-indent: 0 !important;
    border: 1px solid rgba(68, 190, 239, .35);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(30, 12, 49, .94), rgba(62, 25, 90, .86));
    color: #e6f8ff;
    box-shadow: 0 0 12px rgba(28, 173, 238, .12), inset 0 1px 0 rgba(255, 255, 255, .07);
    text-decoration: none;
}

.crittex-header-tools .crittex-header-link:hover,
.crittex-header-tools .crittex-header-link:focus-visible {
    border-color: #52d3ff;
    color: #fff;
    box-shadow: 0 0 18px rgba(38, 185, 243, .28);
}

.crittex-header-tools .crittex-header-link:focus-visible {
    outline: 2px solid #52d3ff;
    outline-offset: 3px;
}

header.header-main > .container .header-row .header-actions-col .crittex-header-tools .crittex-header-link > .crittex-header-link-icon {
    position: static !important;
    display: block !important;
    flex: 0 0 24px;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    inset: auto !important;
    transform: none !important;
    translate: none !important;
    filter: none !important;
    vertical-align: middle;
}

/* Keep the native account dropdown intact while placing the added links in
   the action row: Telegram, search, customer number, account, cart, Trello. */
header.header-main > .container .header-row .header-actions-col > .row.g-0 > .col-auto:has(> .account-menu > .crittex-header-tools),
header.header-main > .container .header-row .header-actions-col > .row.g-0 > .col-auto > .account-menu:has(> .crittex-header-tools),
header.header-main > .container .header-row .crittex-header-tools,
header.header-main > .container .header-row .crittex-header-account {
    display: contents !important;
}

header.header-main > .container .header-row .crittex-header-tools > .crittex-header-link,
header.header-main > .container .header-row .crittex-header-tools > .dropdown,
header.header-main > .container .header-row .crittex-header-account > .crittex-customer-number,
header.header-main > .container .header-row .crittex-header-account > .dropdown {
    flex: 0 0 auto;
}

header.header-main > .container .header-row .crittex-header-link-telegram {
    order: 0 !important;
}

header.header-main > .container .header-row .header-actions-col > .row.g-0 > .col-auto:has(> .search-toggle) {
    order: 1 !important;
}

header.header-main > .container .header-row .crittex-customer-number {
    order: 2 !important;
}

header.header-main > .container .header-row .crittex-header-tools > .dropdown,
header.header-main > .container .header-row .crittex-header-account > .dropdown {
    order: 3 !important;
}

header.header-main > .container .header-row .header-actions-col > .row.g-0 > .col-auto:has(> .header-cart) {
    order: 4 !important;
}

header.header-main > .container .header-row .crittex-header-link-casting {
    order: 5 !important;
}

header.header-main > .container .header-row .header-cart {
    overflow: visible !important;
}

header.header-main > .container .header-row .header-actions-col .header-cart-btn {
    position: relative !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 1px !important;
    width: auto !important;
    min-width: 80px !important;
    height: 54px !important;
    padding: 2px 6px !important;
    overflow: visible !important;
}

header.header-main > .container .header-row .header-cart-btn .header-cart-icon,
header.header-main > .container .header-row .header-cart-btn .header-cart-icon > .icon,
header.header-main > .container .header-row .header-cart-btn .header-cart-icon > .icon-feather {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 24px;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1;
}

header.header-main > .container .header-row .header-cart-btn .header-cart-icon svg {
    position: static !important;
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    inset: auto !important;
    margin: 0 !important;
    transform: none !important;
}

header.header-main > .container .header-row .header-cart-btn > .header-cart-badge {
    top: 2px !important;
    right: 2px !important;
    bottom: auto !important;
    left: auto !important;
    width: auto !important;
    min-width: 14px !important;
    max-width: none !important;
    height: 14px !important;
    padding: 0 3px !important;
    font-size: .5rem;
}

header.header-main > .container .header-row .header-cart-total {
    display: block !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    white-space: nowrap;
    font-size: .7rem;
    font-weight: 600;
    line-height: 1.1 !important;
}

.crittex-customer-number-label-short {
    display: none;
}

.crittex-header-account .crittex-customer-number {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    position: relative;
    gap: .18rem;
    min-height: 54px;
    max-width: 13rem;
    padding: .55rem .85rem;
    border: 1px solid rgba(68, 190, 239, .58);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(30, 12, 49, .94), rgba(62, 25, 90, .86));
    color: #f3eaff;
    box-shadow: 0 0 12px rgba(28, 173, 238, .16),
        inset 0 1px 0 rgba(255, 255, 255, .07),
        inset 0 -1px 0 rgba(103, 42, 151, .2);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    line-height: 1.2;
    text-decoration: none;
    overflow-wrap: anywhere;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.crittex-header-account .crittex-customer-number:hover,
.crittex-header-account .crittex-customer-number:focus-visible {
    border-color: #52d3ff;
    background: linear-gradient(135deg, rgba(37, 15, 61, .96), rgba(76, 31, 110, .9));
    color: #fff;
    box-shadow: 0 0 18px rgba(38, 185, 243, .28),
        0 0 24px rgba(130, 54, 206, .12),
        inset 0 1px 0 rgba(255, 255, 255, .09);
    text-decoration: none;
}

.crittex-header-account .crittex-customer-number:focus-visible {
    outline: 2px solid #52d3ff;
    outline-offset: 3px;
}

.crittex-header-account .crittex-customer-number-label {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .64rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #c5b3de;
}

.crittex-header-account .crittex-customer-number-value {
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .035em;
    font-variant-numeric: tabular-nums;
    color: #e6f8ff;
    text-shadow: 0 0 10px rgba(47, 184, 250, .24);
}

@media (max-width: 575.98px) {
    .crittex-header-account {
        gap: .35rem;
    }

    .crittex-header-account .crittex-customer-number {
        max-width: 9rem;
        padding: .4rem .6rem;
    }

    .crittex-header-account .crittex-customer-number-label {
        font-size: .6rem;
    }

    .crittex-header-account .crittex-customer-number-value {
        font-size: .75rem;
    }
}

/* The theme's header scripts reserve 42px above the action row. On mobile,
   place the selectors alongside the centered logo instead of reserving a row. */
@media (max-width: 767.98px) {
    header.header-main > .container .header-row {
        position: relative !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        row-gap: 4px !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 4px 8px !important;
    }

    header.header-main > .container .header-row > .header-logo-col {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        order: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    header.header-main > .container .header-row .header-logo-main,
    header.header-main > .container .header-row .header-logo-main-link,
    header.header-main > .container .header-row .header-logo-picture {
        display: block !important;
        width: fit-content !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        text-align: center !important;
        transform: none !important;
    }

    header.header-main > .container .header-row .header-logo-main-img {
        display: block !important;
        width: 140px !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: none !important;
        object-fit: contain !important;
        margin: 0 auto !important;
    }

    header.header-main > .container .header-row > .header-actions-col {
        position: static !important;
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        order: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    header.header-main > .container .header-row .header-actions-col > .row.g-0 {
        position: static !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    header.header-main > .container .header-row .header-actions-col > .row.g-0 > .col-auto {
        flex: 0 0 auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    header.header-main > .container .header-row .header-actions-col .header-actions-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        min-height: 48px !important;
        padding: 0 !important;
    }

    header.header-main > .container .header-row .crittex-customer-number {
        min-height: 48px;
        flex-shrink: 1 !important;
        min-width: 0;
        max-width: 132px;
        padding: .35rem .5rem;
    }

    header.header-main > .container .header-row .crittex-customer-number-label {
        font-size: .6rem;
        letter-spacing: .04em;
        white-space: nowrap;
    }

    header.header-main > .container .header-row .crittex-customer-number-value {
        font-size: .75rem;
    }

    header.header-main > .container .header-row .header-actions-col > .row.g-0 > nav.top-bar-nav {
        position: absolute !important;
        top: 14px !important;
        left: 8px !important;
        right: 8px !important;
        bottom: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 0 !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        transform: none !important;
        pointer-events: none;
    }

    header.header-main > .container .header-row .top-bar-nav > .top-bar-nav-item {
        margin: 0 !important;
        pointer-events: auto;
    }

    header.header-main > .container .header-row .top-bar-nav .top-bar-nav-btn {
        transform: none !important;
    }

    header.header-main > .container .header-row .top-bar-currency .dropdown-menu {
        left: 0 !important;
        right: auto !important;
    }

    header.header-main > .container .header-row .header-actions-col .header-cart-btn {
        min-width: 80px !important;
        height: 48px !important;
        min-height: 48px !important;
    }

}

@media (max-width: 479.98px) {
    header.header-main > .container .header-row .header-actions-col > .row.g-0 {
        gap: 4px !important;
    }

    header.header-main > .container .header-row .crittex-customer-number {
        width: 96px;
        max-width: 96px;
        align-items: center;
        padding: .3rem .25rem;
    }

    header.header-main > .container .header-row .crittex-customer-number-label-full {
        display: none;
    }

    header.header-main > .container .header-row .crittex-customer-number-label-short {
        display: inline;
    }

    header.header-main > .container .header-row .crittex-customer-number-label {
        font-size: .55rem;
    }

    header.header-main > .container .header-row .crittex-customer-number-value {
        font-size: .7rem;
        letter-spacing: .01em;
    }

    header.header-main > .container .header-row .header-actions-col .header-cart-btn {
        width: auto !important;
        min-width: 72px !important;
        padding: 1px 3px !important;
    }

    header.header-main > .container .header-row .header-cart-total {
        font-size: .65rem;
    }
}

@media (max-width: 409.98px) {
    header.header-main > .container .header-row .crittex-customer-number {
        width: 88px;
        max-width: 88px;
    }
}

@media (max-width: 389.98px) {
    header.header-main > .container .header-row .header-actions-col .header-actions-btn {
        width: 44px !important;
        height: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
    }

    header.header-main > .container .header-row .crittex-customer-number {
        width: 80px;
        max-width: 80px;
        min-height: 44px;
        padding: .3rem 3px;
    }

    header.header-main > .container .header-row .crittex-customer-number-value {
        font-size: .65rem;
    }

    header.header-main > .container .header-row .header-actions-col > .row.g-0 {
        gap: 3px !important;
    }

    header.header-main > .container .header-row .header-actions-col .header-cart-btn {
        width: auto !important;
        min-width: 64px !important;
        height: 44px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 359.98px) {
    header.header-main > .container .header-row .header-actions-col > .row.g-0 {
        gap: 1px !important;
    }

    header.header-main > .container .header-row .header-actions-col .header-actions-btn {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
    }

    header.header-main > .container .header-row .crittex-customer-number {
        width: 74px;
        max-width: 74px;
        min-height: 40px;
        padding: .2rem 2px;
    }

    header.header-main > .container .header-row .crittex-customer-number-label {
        font-size: .5rem;
    }

    header.header-main > .container .header-row .crittex-customer-number-value {
        font-size: .6rem;
    }

    header.header-main > .container .header-row .header-actions-col .header-cart-btn {
        width: auto !important;
        min-width: 56px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 1px 2px !important;
    }

    header.header-main > .container .header-row .header-cart-total {
        font-size: .6rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .crittex-header-account .crittex-customer-number {
        transition: none;
    }
}

/* The shipping country is a separate control from the storefront language. */
header.header-main .top-bar-nav {
    align-items: center !important;
}

header.header-main .top-bar-nav > .top-bar-nav-item {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    align-self: center;
}

header.header-main .top-bar-nav .top-bar-language .top-bar-nav-btn {
    position: relative !important;
    inset: auto !important;
    height: 32px !important;
    transform: none !important;
}

header.header-main .crittex-country-selector {
    position: relative !important;
    flex: 0 0 auto !important;
    order: 2 !important;
    width: auto !important;
    min-width: 0 !important;
    pointer-events: auto;
}

header.header-main .top-bar-nav > .top-bar-currency {
    order: 1 !important;
}

header.header-main .top-bar-nav > .top-bar-language {
    order: 3 !important;
}

header.header-main .crittex-country-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
    gap: 5px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 160px !important;
    height: 32px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 8px !important;
    border: 1px solid rgba(89, 188, 237, .4) !important;
    border-radius: 10px !important;
    background: linear-gradient(135deg, rgba(29, 12, 49, .93), rgba(62, 25, 90, .8)) !important;
    color: #e6f8ff !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 0 8px rgba(28, 173, 238, .12) !important;
    font-size: .72rem !important;
    font-weight: 600;
    line-height: 1 !important;
    white-space: nowrap !important;
    transform: none !important;
}

header.header-main .crittex-country-toggle::before,
header.header-main .crittex-country-toggle::after {
    display: none !important;
}

header.header-main .crittex-country-toggle:hover,
header.header-main .crittex-country-toggle:focus-visible {
    border-color: #5bcbf6 !important;
    box-shadow: 0 0 12px rgba(28, 173, 238, .27) !important;
}

header.header-main .crittex-country-toggle:focus-visible {
    outline: 2px solid #5bcbf6;
    outline-offset: 3px;
}

header.header-main .crittex-country-toggle > svg {
    position: static !important;
    display: block !important;
    flex: 0 0 auto;
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    inset: auto !important;
    transform: none !important;
    color: inherit !important;
    filter: none !important;
}

header.header-main .crittex-country-toggle > .crittex-country-chevron {
    width: 10px !important;
    height: 10px !important;
}

.crittex-country-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crittex-country-code {
    display: none;
}

header.header-main .crittex-country-menu {
    width: 272px !important;
    max-width: calc(100vw - 24px) !important;
    padding: 12px !important;
    border: 1px solid rgba(95, 194, 239, .55) !important;
    border-radius: 14px !important;
    background: rgba(28, 12, 47, .97) !important;
    color: #f3eaff !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .4), 0 0 18px rgba(0, 180, 255, .2) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    z-index: 10065 !important;
    white-space: normal !important;
}

.crittex-country-heading {
    margin-bottom: 8px;
    color: #f3eaff;
    font-size: .85rem;
    font-weight: 700;
}

.crittex-country-hint,
.crittex-country-status,
.crittex-country-empty {
    margin: 0 0 8px;
    color: #cebddf;
    font-size: .75rem;
    line-height: 1.4;
}

.crittex-country-status {
    margin: 8px 0 0;
    color: #e6f8ff;
}

.crittex-country-search {
    display: block;
    margin: 0 0 8px;
}

header.header-main .crittex-country-search input {
    display: block;
    width: 100%;
    height: 36px;
    min-width: 0;
    padding: 6px 9px;
    border: 1px solid rgba(95, 194, 239, .35);
    border-radius: 8px;
    background: rgba(255, 255, 255, .05);
    color: #f3eaff;
    font: inherit;
    font-size: .8rem;
}

.crittex-country-search input::placeholder {
    color: #bca5d1;
}

.crittex-country-search input:focus-visible {
    outline: 2px solid #5bcbf6;
    outline-offset: 1px;
}

.crittex-country-list {
    max-height: min(320px, 45vh);
    max-height: min(320px, 45dvh);
    margin: 0;
    padding: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    list-style: none;
}

header.header-main .crittex-country-option {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px;
    width: 100%;
    min-height: 36px;
    padding: 7px 9px !important;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #f3eaff !important;
    font-size: .8rem !important;
    line-height: 1.4;
    text-align: left;
    white-space: normal !important;
}

header.header-main .crittex-country-option:hover,
header.header-main .crittex-country-option:focus-visible,
header.header-main .crittex-country-option.active {
    background: rgba(57, 178, 238, .16) !important;
    color: #e6f8ff !important;
}

.crittex-country-option-code {
    flex: 0 0 auto;
    color: #a3d8f2;
    font-size: .7rem;
}

.crittex-country-address-link {
    display: inline-block;
    margin-top: 10px;
    color: #5bcbf6;
    font-size: .75rem;
    text-decoration: underline;
}

.crittex-country-selector [hidden] {
    display: none !important;
}

@media (max-width: 767.98px) {
    header.header-main > .container .header-row .header-actions-col > .row.g-0 > nav.top-bar-nav {
        display: grid !important;
        grid-template-columns: 1fr auto auto;
        gap: 4px !important;
    }

    header.header-main > .container .header-row .top-bar-nav > .top-bar-nav-item {
        position: relative !important;
        inset: auto !important;
        transform: none !important;
        align-self: center;
        justify-self: end;
    }

    header.header-main > .container .header-row .top-bar-nav > .top-bar-currency {
        justify-self: start;
    }

    header.header-main .crittex-country-toggle {
        width: 42px !important;
        max-width: 42px !important;
        gap: 2px !important;
        padding: 0 4px !important;
        font-size: .7rem !important;
    }

    header.header-main .crittex-country-toggle > .crittex-country-globe,
    header.header-main .crittex-country-name {
        display: none !important;
    }

    header.header-main .crittex-country-code {
        display: inline;
    }

    header.header-main > .container .header-row .top-bar-language .top-bar-nav-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 32px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        transform: none !important;
    }
}

@media (max-width: 359.98px) {
    header.header-main .crittex-country-toggle {
        width: 38px !important;
        max-width: 38px !important;
        padding: 0 2px !important;
    }

    header.header-main > .container .header-row .top-bar-language .top-bar-nav-btn {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        padding: 0 !important;
        gap: 0 !important;
    }

    header.header-main > .container .header-row .top-bar-language .language-flag {
        flex: 0 0 20px !important;
        width: 20px !important;
        min-width: 20px !important;
        max-width: 20px !important;
        height: 14px !important;
        margin: 0 !important;
    }
}
