/*
 * Dedicated Desktop Home
 *
 * Same server-rendered Home tree as mobile. Presentation-only: no second
 * component, so analytics, discovery, geolocation and Miara initialise once.
 * `data-ui-v2-desktop="disabled"` is the instant rollback to the 430px shell.
 */

@media (min-width: 768px) and (min-height: 521px),
       (min-width: 768px) and (pointer: fine) {
    .ui-v2-mobile-shell .ui-v2-category-grid--mobile {
        display: none;
    }

    .ui-v2-mobile-shell .ui-v2-category-grid--desktop {
        display: grid;
    }

    html:has(.ui-v2-mobile-shell[data-ui-v2-desktop="enabled"]),
    body:has(.ui-v2-mobile-shell[data-ui-v2-desktop="enabled"]) {
        scroll-behavior: auto !important;
        overscroll-behavior-y: auto;
    }

    html.ui-v2-home-sheet-open:has(.ui-v2-mobile-shell[data-ui-v2-desktop="enabled"]),
    html.ui-v2-home-sheet-open:has(.ui-v2-mobile-shell[data-ui-v2-desktop="enabled"]) body {
        overflow: hidden !important;
        overscroll-behavior: none;
    }

    .ui-v2-home-composition:has(.ui-v2-mobile-shell[data-ui-v2-desktop="enabled"]) {
        max-inline-size: none;
        min-block-size: 100dvh;
        background: #fafafa;
        box-shadow: none;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"][data-ui-theme="warm-utility"] {
        inline-size: 100%;
        max-inline-size: none;
        min-block-size: 100dvh;
        border-radius: 0;
        background:
            radial-gradient(ellipse 70% 28% at 50% -8%, rgb(246 85 5 / 7%), transparent 62%),
            #fafafa;
        box-shadow: none;
        overflow: visible;
    }

    .ui-v2-page-navigator {
        position: fixed;
        z-index: 44;
        left: 50%;
        bottom: max(20px, env(safe-area-inset-bottom));
        display: flex;
        min-block-size: 56px;
        align-items: center;
        gap: 5px;
        padding: 5px;
        border: 1px solid rgb(255 255 255 / 72%);
        border-radius: 20px;
        background: rgb(23 29 43 / 88%);
        box-shadow: 0 14px 38px rgb(19 27 46 / 24%), inset 0 1px 0 rgb(255 255 255 / 10%);
        backdrop-filter: blur(18px) saturate(130%);
        transform: translateX(-50%);
        direction: ltr;
    }

    .ui-v2-page-navigator[hidden] {
        display: none !important;
    }

    html.ui-v2-home-sheet-open .ui-v2-page-navigator,
    html.ui-v2-miara-open .ui-v2-page-navigator,
    .ui-v2-mobile-shell:is(.is-drawer-open, .is-assistant-open) > .ui-v2-page-navigator {
        display: none !important;
    }

    .ui-v2-page-navigator__button {
        display: grid;
        inline-size: 46px;
        block-size: 46px;
        padding: 0;
        border: 0;
        border-radius: 15px;
        place-items: center;
        color: #fff;
        background: transparent;
        cursor: pointer;
        transition: color .16s ease, background-color .16s ease, transform .16s ease, opacity .16s ease;
        -webkit-tap-highlight-color: transparent;
    }

    .ui-v2-page-navigator__button svg {
        inline-size: 22px;
        block-size: 22px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2.15;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .ui-v2-page-navigator__button:is(:hover, :focus-visible):not(:disabled) {
        color: #fff;
        background: #f65505;
        transform: translateY(-1px);
    }

    .ui-v2-page-navigator__button:focus-visible {
        outline: 3px solid rgb(255 154 104 / 46%);
        outline-offset: 2px;
    }

    .ui-v2-page-navigator__button:active:not(:disabled) {
        transform: translateY(1px) scale(.96);
    }

    .ui-v2-page-navigator__button:disabled {
        cursor: default;
        opacity: .3;
    }

    .ui-v2-page-navigator__progress {
        position: relative;
        display: block;
        inline-size: 34px;
        block-size: 4px;
        overflow: hidden;
        border-radius: 999px;
        background: rgb(255 255 255 / 18%);
    }

    .ui-v2-page-navigator__progress i {
        position: absolute;
        inset: 0;
        border-radius: inherit;
        background: #ff7b38;
        box-shadow: 0 0 9px rgb(255 123 56 / 55%);
        transform: scaleX(var(--ui-v2-page-progress, 0));
        transform-origin: left center;
        transition: transform .12s linear;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] > .mikham-mobile-home__content {
        padding-block-end: 0;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .mikham-mobile-home__glow {
        display: none;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home {
        display: grid;
        inline-size: min(100% - 48px, 1320px);
        min-block-size: 100dvh;
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
        margin-inline: auto;
        padding: 20px 0 96px;
        background: transparent;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__header {
        position: sticky;
        z-index: 20;
        inset-block-start: 12px;
        display: grid;
        grid-template-columns: 132px auto minmax(0, 1fr) auto;
        min-block-size: 72px;
        gap: 16px;
        padding: 10px 18px;
        border: 1px solid #ececee;
        border-radius: 20px;
        background: rgb(255 255 255 / 92%);
        box-shadow: 0 10px 32px rgb(19 27 46 / 6%);
        backdrop-filter: blur(18px);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__brand,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__brand img {
        inline-size: 120px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__brand img {
        block-size: 80px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__brand {
        min-block-size: 80px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__city {
        min-inline-size: 118px;
        justify-content: flex-start;
        padding-inline: 12px;
        border-radius: 14px;
        background: #fff5ee;
        font-size: .84rem;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__city:hover {
        background: #ffeee3;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__city > span[data-home-city-label] {
        max-inline-size: 16ch;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation[hidden] {
        display: flex;
        min-inline-size: 0;
        align-items: center;
        justify-content: center;
        gap: 4px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation a {
        display: inline-flex;
        min-block-size: 44px;
        align-items: center;
        gap: 7px;
        padding-inline: 13px;
        border-radius: 12px;
        color: #596174;
        font-size: .78rem;
        font-weight: 700;
        text-decoration: none;
        white-space: nowrap;
        transition: color .16s ease, background-color .16s ease;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation a:is(:hover, .is-current) {
        color: #b33900;
        background: #fff1e8;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation a.is-primary {
        color: #fff;
        background: #f65505;
        box-shadow: 0 8px 16px rgb(246 85 5 / 22%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation a.is-primary:hover {
        color: #fff;
        background: #df4900;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation svg {
        inline-size: 18px;
        block-size: 18px;
        flex: none;
        fill: none;
        stroke: currentColor;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__header-actions {
        gap: 6px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__action::before {
        background: #f6f6f7;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search {
        display: grid;
        justify-items: center;
        gap: 10px;
        inline-size: 100%;
        margin-inline: auto;
        padding-block: 18px 4px;
        text-align: center;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__eyebrow,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search h1,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__hint {
        position: static;
        inline-size: auto;
        max-inline-size: 38rem;
        block-size: auto;
        clip-path: none;
        overflow: visible;
        margin: 0;
        white-space: normal;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__eyebrow {
        color: #b33900;
        font-size: .82rem;
        font-weight: 800;
        letter-spacing: .01em;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search h1 {
        color: #131b2e;
        font-size: clamp(1.7rem, 2.6vw, 2.2rem);
        font-weight: 800;
        letter-spacing: -.03em;
        line-height: 1.25;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__hint {
        color: #5c5f68;
        font-size: .9rem;
        line-height: 1.7;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__form {
        inline-size: min(100%, 760px);
        block-size: 64px;
        margin-block-start: 6px;
        border-radius: 20px;
        background: #fff;
        box-shadow: 0 14px 36px rgb(19 27 46 / 8%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__form input[type="search"] {
        font-size: .96rem;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__results,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__network,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-search__message {
        inline-size: min(100%, 760px);
        text-align: start;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-section {
        gap: 14px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-section__heading h2 {
        font-size: 1.14rem;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-categories {
        padding: 22px 24px 24px;
        border: 1px solid #ececee;
        border-radius: 24px;
        background: #fff;
        box-shadow: 0 8px 24px rgb(19 27 46 / 4%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-category-grid {
        grid-template-columns: repeat(8, minmax(0, 1fr));
        gap: 12px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-category-grid > a {
        min-block-size: 118px;
        border-radius: 18px;
        font-size: .76rem;
        transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-category-grid > a:hover {
        transform: translateY(-3px);
        border-color: #f3b08d;
        box-shadow: 0 12px 24px rgb(19 27 46 / 8%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-today,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-nearby-home {
        align-content: start;
        margin-block-start: 0;
        padding: 22px 24px 24px;
        border: 1px solid #ececee;
        border-radius: 24px;
        background: #fff;
        box-shadow: 0 8px 24px rgb(19 27 46 / 4%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-today__rail {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
        margin-inline: 0;
        padding: 0;
        overflow: visible;
        scroll-snap-type: none;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-today-card {
        min-inline-size: 0;
        flex: none;
        transition: transform .16s ease, box-shadow .16s ease;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-today-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 24px rgb(19 27 46 / 9%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-today-card__media {
        block-size: 140px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-nearby-home__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-nearby-row {
        min-inline-size: 0;
        transition: border-color .16s ease, box-shadow .16s ease;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-nearby-row:hover {
        border-color: #f3b08d;
        box-shadow: 0 10px 22px rgb(19 27 46 / 7%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__location-cta {
        margin-block-start: 4px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] > .ui-v2-bottom-navigation {
        display: none;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home-sheet {
        inset: 0;
        left: 0;
        inline-size: 100vw;
        align-items: center;
        justify-content: center;
        padding: 28px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home-sheet__panel,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home-sheet__panel.is-categories,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home-sheet__panel.is-compact {
        inline-size: min(100%, 620px);
        max-block-size: min(78dvh, 720px);
        padding: 22px 26px 26px;
        border-radius: 24px;
        box-shadow: 0 24px 70px rgb(19 27 46 / 28%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home-sheet__panel.is-categories {
        inline-size: min(100%, 760px);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home-sheet__handle {
        position: absolute;
        inset-block-start: 10px;
        inset-inline-end: 12px;
        margin: 0;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home-sheet__handle span {
        inline-size: 18px;
        block-size: 18px;
        background: linear-gradient(45deg, transparent 46%, #747986 47% 53%, transparent 54%),
                    linear-gradient(-45deg, transparent 46%, #747986 47% 53%, transparent 54%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-all-categories {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0 18px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-miara-trigger {
        inset-inline-end: 28px;
        inset-block-end: 28px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-miara-backdrop {
        inset: 0;
        left: 0;
        inline-size: 100vw;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-miara-sheet {
        inset-block: 24px;
        left: auto;
        right: auto;
        inset-inline-start: auto;
        inset-inline-end: 24px;
        inline-size: min(440px, calc(100vw - 48px));
        block-size: auto;
        max-block-size: none;
        border: 1px solid #e3e4e7;
        border-radius: 24px;
        box-shadow: 0 24px 72px rgb(19 27 46 / 25%);
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-miara-sheet__handle {
        display: none;
    }
}

@media (min-width: 1024px) and (min-height: 521px),
       (min-width: 1024px) and (pointer: fine) {
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px 22px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] :is(.ui-v2-home__header, .ui-v2-search, .ui-v2-categories, .ui-v2-nearby-home, .ui-v2-today) {
        grid-column: 1 / -1;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-nearby-home__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] :is(.ui-v2-home__location-status, .ui-v2-home__location-cta, .ui-v2-no-script) {
        grid-column: 1 / -1;
    }
}

@media (min-width: 768px) and (max-width: 1040px) and (min-height: 521px) {
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation a {
        padding-inline: 9px;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation a span,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__action:first-child {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-category-grid > a,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-today-card,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-nearby-row,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation a,
    .ui-v2-page-navigator__button,
    .ui-v2-page-navigator__progress i {
        transition: none;
    }

    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-category-grid > a:hover,
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-today-card:hover {
        transform: none;
    }
}
@media (min-width: 768px) and (min-height: 521px),
       (min-width: 768px) and (pointer: fine) {
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-recruitment-card { display: none; }
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation .ui-v2-home__recruitment-link {
        color: var(--ui-color-primary-soft-text);
        background: var(--ui-color-primary-soft);
        border: 1px solid rgb(246 85 5 / 22%);
    }
    .ui-v2-mobile-shell[data-ui-v2-desktop="enabled"] .ui-v2-home__desktop-navigation .ui-v2-home__recruitment-link:hover {
        color: #fff;
        background: var(--ui-color-primary-fill);
        border-color: var(--ui-color-primary-fill);
        box-shadow: var(--ui-shadow-brand);
    }
}