/* Header warehouse picker — interactive Iran map modal */

.header-city-modal.header-city-modal--map,
.header-city-modal.header-city-modal--map.header-city-modal--detached {
    z-index: 100000;
}

.header-city-modal.header-city-modal--map {
    --iwm-ink: #1c1214;
    --iwm-muted: #6b5a5e;
    --iwm-paper: #faf7f5;
    --iwm-paper-2: #f3ece8;
    --iwm-line: rgba(28, 18, 20, 0.08);
    --iwm-brand: hsl(var(--primary));
    --iwm-brand-soft: hsl(var(--primary) / 0.12);
    --iwm-sea: #dce8ef;
    --iwm-land: #fffdfb;
    --iwm-land-hover: #ffe8ec;
    --iwm-land-selected: #f6c9d0;
    --iwm-disabled: #c5b8bc;
    --iwm-shadow: 0 28px 64px rgba(28, 18, 20, 0.18);
    align-items: center;
    justify-content: center;
    padding: 0.75rem;
    box-sizing: border-box;
}

@media (max-width: 767.98px) {
    .header-city-modal.header-city-modal--map {
        align-items: center;
        justify-content: center;
        padding: 1rem;
        width: 100%;
        max-width: 100vw;
        overflow: hidden;
        box-sizing: border-box;
    }
}

.header-city-modal--map .header-city-modal__panel {
    width: min(100%, 70rem);
    max-width: 100%;
    max-height: min(92vh, 54rem);
    display: flex;
    flex-direction: column;
    border-radius: 22px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
    border: 1px solid rgba(255, 255, 255, 0.55);
    background: var(--iwm-paper);
    box-shadow: var(--iwm-shadow);
    animation: iwm-panel-in 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes iwm-panel-in {
    0% {
        opacity: 0;
        transform: translateY(28px) scale(0.94) rotateX(6deg);
        filter: blur(8px);
    }
    55% {
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: none;
        filter: none;
    }
}

.header-city-modal--map .header-city-modal__backdrop {
    background:
        radial-gradient(ellipse 80% 60% at 50% 40%, rgba(28, 18, 20, 0.35), rgba(28, 18, 20, 0.55));
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    animation: iwm-backdrop-in 0.55s ease both;
}

@keyframes iwm-backdrop-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.header-city-modal--map .header-city-modal__eyebrow {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--iwm-brand);
    animation: iwm-fade-up 0.55s 0.12s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.header-city-modal--map .header-city-modal__title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 800;
    color: var(--iwm-ink);
    letter-spacing: -0.01em;
    animation: iwm-fade-up 0.6s 0.18s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.header-city-modal--map .header-city-modal__subtitle {
    margin: 0.15rem 0 0;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--iwm-muted);
    line-height: 1.45;
    animation: iwm-fade-up 0.65s 0.26s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes iwm-fade-up {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

.header-city-modal--map .header-city-modal__header--map {
    position: sticky;
    top: 0;
    z-index: 3;
    flex-shrink: 0;
    align-items: flex-start;
    padding: 1.125rem 1.25rem 1rem;
    background: linear-gradient(180deg, #fff 0%, rgba(255, 253, 251, 0.96) 100%);
    border-bottom: 1px solid var(--iwm-line);
}

.header-city-modal--map .header-city-modal__heading {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.header-city-modal--map .header-city-modal__close {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    background: var(--iwm-paper-2);
    color: var(--iwm-muted);
}

.header-city-modal--map .header-city-modal__close:hover {
    background: var(--iwm-brand-soft);
    color: var(--iwm-brand);
}

.header-city-modal--map .header-city-modal__body {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(15.5rem, 0.82fr);
    gap: 0;
    min-height: 0;
    min-width: 0;
    flex: 0 0 auto;
    overflow: visible;
    transition: grid-template-columns 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

.header-city-modal--map .header-city-modal__body.is-city-stage {
    grid-template-columns: minmax(0, 1fr) minmax(22rem, 1.45fr);
}

.header-city-modal--map .header-city-modal__body > * {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 767.98px) {
    .header-city-modal--map .header-city-modal__panel {
        width: 100%;
        max-width: 100%;
        max-height: min(92vh, calc(100dvh - 1.5rem));
        height: auto;
        min-height: 0;
        border-radius: 18px;
        align-self: center;
        touch-action: pan-y;
    }

    .header-city-modal--map .header-city-modal__body {
        display: flex;
        flex-direction: column;
        grid-template-columns: unset;
        grid-template-rows: unset;
        flex: 0 0 auto;
        min-height: 0;
        width: 100%;
        overflow: visible;
    }

    .header-city-modal--map.header-city-modal--detached .header-city-selector-form {
        display: flex;
        flex-direction: column;
        flex: 0 0 auto;
        min-height: 0;
        overflow: visible;
    }

    .header-city-modal--map.header-city-modal--detached .header-city-modal__body {
        flex: 0 0 auto;
        min-height: 0;
        overflow: visible;
    }

    .iran-warehouse-map__toolbar {
        flex-wrap: wrap;
        gap: 0.5rem;
        padding: 0.55rem 0.75rem;
    }

    .iran-warehouse-map__legend {
        gap: 0.35rem 0.55rem;
    }

    .iran-warehouse-map__legend-item {
        font-size: 0.625rem;
    }

    .iran-warehouse-map {
        flex: 0 0 auto;
    }

    .iran-warehouse-map__viewport {
        min-height: 15rem;
        height: 16.5rem;
        max-height: 16.5rem;
        flex: 0 0 auto;
        touch-action: none;
        cursor: grab;
    }

    .iran-warehouse-map-cities {
        flex: 0 0 auto;
        min-height: 0;
        transition: min-height 0.7s cubic-bezier(0.22, 1, 0.36, 1), max-height 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .header-city-modal--map .header-city-modal__body.is-city-stage .iran-warehouse-map {
        max-height: 13.5rem;
    }

    .header-city-modal--map .header-city-modal__body.is-city-stage .iran-warehouse-map__viewport {
        min-height: 9.5rem;
        height: 10.5rem;
        max-height: 10.5rem;
        transition: height 0.7s cubic-bezier(0.22, 1, 0.36, 1), max-height 0.7s cubic-bezier(0.22, 1, 0.36, 1), min-height 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .iran-warehouse-map-cities.is-city-stage {
        min-height: 14rem;
    }

    .iran-warehouse-map-cities__list {
        max-height: none;
        overflow-y: visible;
    }

    .iran-warehouse-map__hint {
        gap: 0.35rem;
        padding: 0.45rem 0.65rem 0.55rem;
    }

    .iran-warehouse-map__hint-pill {
        font-size: 0.5625rem;
        padding: 0.2rem 0.45rem;
    }
}

.iran-warehouse-map {
    --iwm-map-depth: rgba(28, 18, 20, 0.14);
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    background:
        radial-gradient(120% 90% at 18% 12%, rgba(255, 255, 255, 0.55), transparent 48%),
        radial-gradient(90% 70% at 88% 78%, hsl(var(--primary) / 0.18), transparent 42%),
        linear-gradient(165deg, #5a6f7e 0%, #3d4f5c 42%, #2a3842 100%);
    overflow: hidden;
}

.iran-warehouse-map__atmosphere {
    pointer-events: none;
    position: absolute;
    inset: 0;
    z-index: 0;
    background:
        radial-gradient(ellipse 70% 55% at 50% 45%, transparent 40%, rgba(18, 24, 28, 0.28) 100%),
        repeating-linear-gradient(
            -18deg,
            transparent,
            transparent 11px,
            rgba(255, 255, 255, 0.015) 11px,
            rgba(255, 255, 255, 0.015) 12px
        );
    opacity: 0.9;
}

.iran-warehouse-map__aurora {
    pointer-events: none;
    position: absolute;
    inset: -20%;
    z-index: 0;
    background:
        radial-gradient(circle at 20% 30%, hsl(var(--primary) / 0.35), transparent 42%),
        radial-gradient(circle at 78% 20%, rgba(255, 210, 180, 0.22), transparent 38%),
        radial-gradient(circle at 60% 80%, rgba(140, 190, 220, 0.2), transparent 40%);
    filter: blur(28px);
    animation: iwm-aurora-drift 14s ease-in-out infinite alternate;
    mix-blend-mode: soft-light;
    opacity: 0.85;
}

@keyframes iwm-aurora-drift {
    0% {
        transform: translate(-4%, -2%) rotate(0deg) scale(1);
    }
    50% {
        transform: translate(3%, 4%) rotate(8deg) scale(1.08);
    }
    100% {
        transform: translate(6%, -3%) rotate(-4deg) scale(1.04);
    }
}

.iran-warehouse-map__dust {
    pointer-events: none;
    position: absolute;
    inset: 0;
    z-index: 1;
    overflow: hidden;
}

.iran-warehouse-map__dust span {
    position: absolute;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.55);
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.35);
    animation: iwm-dust-float var(--iwm-dust-dur, 9s) linear infinite;
    opacity: 0;
}

.iran-warehouse-map__dust span:nth-child(1) { left: 12%; top: 70%; --iwm-dust-dur: 11s; animation-delay: 0s; }
.iran-warehouse-map__dust span:nth-child(2) { left: 28%; top: 85%; --iwm-dust-dur: 8s; animation-delay: 1.2s; width: 2px; height: 2px; }
.iran-warehouse-map__dust span:nth-child(3) { left: 46%; top: 78%; --iwm-dust-dur: 13s; animation-delay: 0.4s; }
.iran-warehouse-map__dust span:nth-child(4) { left: 62%; top: 90%; --iwm-dust-dur: 10s; animation-delay: 2.1s; width: 4px; height: 4px; }
.iran-warehouse-map__dust span:nth-child(5) { left: 78%; top: 82%; --iwm-dust-dur: 12s; animation-delay: 0.8s; }
.iran-warehouse-map__dust span:nth-child(6) { left: 88%; top: 74%; --iwm-dust-dur: 9s; animation-delay: 1.7s; width: 2px; height: 2px; }

@keyframes iwm-dust-float {
    0% {
        transform: translateY(0) translateX(0) scale(0.6);
        opacity: 0;
    }
    12% {
        opacity: 0.7;
    }
    100% {
        transform: translateY(-120%) translateX(18px) scale(1);
        opacity: 0;
    }
}

.iran-warehouse-map__toolbar {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 0.7rem 0.9rem;
    background: rgba(18, 24, 28, 0.28);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.iran-warehouse-map__steps {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.2rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
}

.iran-warehouse-map__step {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.62);
    transition: background-color 0.2s, color 0.2s, transform 0.2s;
}

.iran-warehouse-map__step--active {
    background: #fff;
    color: var(--iwm-ink);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.iran-warehouse-map__step--done {
    color: rgba(255, 255, 255, 0.92);
}

.iran-warehouse-map__step-divider {
    width: 0.75rem;
    height: 1px;
    background: rgba(255, 255, 255, 0.28);
}

.iran-warehouse-map__step-rail {
    position: relative;
    width: 1.75rem;
    height: 3px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.2);
    overflow: hidden;
}

.iran-warehouse-map__step-rail-fill {
    position: absolute;
    inset: 0;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, #fff, hsl(var(--primary) / 0.85));
    transition: width 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.iran-warehouse-map__step-rail.is-filled .iran-warehouse-map__step-rail-fill {
    width: 100%;
}

.iran-warehouse-map__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.7rem;
}

.iran-warehouse-map__legend-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.9);
    white-space: nowrap;
}

.iran-warehouse-map__legend-item::before {
    content: "";
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 3px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    flex-shrink: 0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

.iran-warehouse-map__legend-item--available::before {
    background: #fffdfb;
}

.iran-warehouse-map__legend-item--disabled::before {
    background: #94a3b8;
    opacity: 0.75;
}

.iran-warehouse-map__legend-item--selected::before {
    background: var(--iwm-brand);
    border-color: rgba(255, 255, 255, 0.45);
}

.iran-warehouse-map__zoom {
    position: absolute;
    z-index: 3;
    top: 0.75rem;
    inset-inline-end: 0.75rem;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 0.28rem;
    padding: 0.28rem;
    border-radius: 14px;
    background: rgba(255, 253, 251, 0.92);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 8px 24px rgba(18, 24, 28, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.7);
}

.iran-warehouse-map__zoom-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    border: none;
    border-radius: 10px;
    background: transparent;
    color: var(--iwm-ink);
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background-color 0.15s, transform 0.15s, color 0.15s;
}

.iran-warehouse-map__zoom-btn:hover {
    background: var(--iwm-brand-soft);
    color: var(--iwm-brand);
}

.iran-warehouse-map__zoom-btn:active {
    transform: scale(0.94);
}

.iran-warehouse-map__zoom-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
    transform: none;
}

.iran-warehouse-map__zoom-btn--reset {
    font-size: 0;
    border-top: 1px solid var(--iwm-line);
    border-radius: 0 0 10px 10px;
    margin-top: 0.1rem;
    padding-top: 0.15rem;
}

.iran-warehouse-map__viewport {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    min-height: 26rem;
    overflow: hidden;
    cursor: grab;
    touch-action: none;
    outline: none;
}

.iran-warehouse-map__viewport:focus-visible {
    box-shadow: inset 0 0 0 2px hsl(var(--primary) / 0.45);
}

.iran-warehouse-map__viewport.is-dragging {
    cursor: grabbing;
}

.iran-warehouse-map__viewport.is-dragging .iran-warehouse-map__tooltip {
    opacity: 0;
    pointer-events: none;
}

.iran-warehouse-map__viewport.is-dragging .iran-warehouse-map__pin {
    opacity: 1;
}

.iran-warehouse-map__viewport.has-selection .iran-warehouse-map__svg-wrap path.iran-map-province--available:not(.iran-map-province--selected) {
    opacity: 0.72;
    filter: saturate(0.85);
}

.iran-warehouse-map__stage {
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    will-change: transform;
    filter: drop-shadow(0 18px 28px var(--iwm-map-depth));
}

.iran-warehouse-map__stage--animate {
    transition: transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

.iran-warehouse-map__svg-wrap {
    position: relative;
    display: block;
    line-height: 0;
    transform: perspective(1200px) rotateX(var(--iwm-tilt-x, 0deg)) rotateY(var(--iwm-tilt-y, 0deg));
    transform-origin: center center;
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.iran-warehouse-map__svg-wrap svg {
    display: block;
    width: 1200px;
    height: auto;
    max-width: none;
    user-select: none;
    -webkit-user-drag: none;
}

.iran-warehouse-map__svg-wrap #seas,
.iran-warehouse-map__svg-wrap #islands {
    display: none;
}

.iran-warehouse-map__svg-wrap #provinces path[id] {
    cursor: default;
    fill: var(--iwm-land);
    stroke: #8a7a7e;
    stroke-width: 1.1;
    transition:
        fill 0.22s ease,
        stroke 0.22s ease,
        filter 0.22s ease,
        opacity 0.22s ease,
        transform 0.22s ease;
    vector-effect: non-scaling-stroke;
    transform-box: fill-box;
    transform-origin: center;
}

.iran-warehouse-map__svg-wrap path.iran-map-province--available {
    cursor: pointer;
    fill: #fffdfb;
    stroke: #5c4a4e;
    filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.35));
}

.iran-warehouse-map__svg-wrap path.iran-map-province--available:hover,
.iran-warehouse-map__svg-wrap path.iran-map-province--available:focus {
    fill: var(--iwm-land-hover);
    stroke: var(--iwm-brand);
    outline: none;
    filter: drop-shadow(0 4px 10px hsl(var(--primary) / 0.28));
}

.iran-warehouse-map__svg-wrap path.iran-map-province--selected {
    fill: var(--iwm-land-selected) !important;
    stroke: var(--iwm-brand) !important;
    stroke-width: 1.8 !important;
    filter: drop-shadow(0 6px 14px hsl(var(--primary) / 0.35));
    animation: iwm-select-pop 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes iwm-select-pop {
    0% {
        filter: drop-shadow(0 0 0 transparent);
    }
    45% {
        filter: drop-shadow(0 8px 18px hsl(var(--primary) / 0.45));
    }
    100% {
        filter: drop-shadow(0 6px 14px hsl(var(--primary) / 0.35));
    }
}

.iran-warehouse-map__svg-wrap path.iran-map-province--disabled {
    fill: var(--iwm-disabled);
    stroke: #8b7f83;
    opacity: 0.42;
    pointer-events: none;
}

.iran-warehouse-map__label {
    font-family: inherit;
    font-size: 11px;
    font-weight: 800;
    fill: #2a1c20;
    pointer-events: none;
    user-select: none;
    paint-order: stroke fill;
    stroke: rgba(255, 253, 251, 0.92);
    stroke-width: 2.4px;
    stroke-linejoin: round;
    opacity: 0.92;
}

.iran-warehouse-map__label--disabled {
    fill: #5c5356;
    stroke: rgba(255, 255, 255, 0.4);
    opacity: 0.55;
}

.iran-warehouse-map__tooltip {
    position: absolute;
    z-index: 4;
    top: 0;
    left: 0;
    max-width: 12rem;
    padding: 0.4rem 0.7rem;
    border-radius: 999px;
    background: rgba(28, 18, 20, 0.92);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    pointer-events: none;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.22);
    transform: translate(-50%, calc(-100% - 12px));
    transition: opacity 0.15s ease, transform 0.15s ease;
}

.iran-warehouse-map__tooltip.hidden {
    opacity: 0;
    transform: translate(-50%, calc(-100% - 4px));
}

.iran-warehouse-map__tooltip:not(.hidden) {
    opacity: 1;
}

.iran-warehouse-map__hint {
    position: relative;
    z-index: 2;
    flex-shrink: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.4rem;
    margin: 0;
    padding: 0.55rem 0.85rem 0.7rem;
    text-align: center;
    background: rgba(18, 24, 28, 0.22);
}

.iran-warehouse-map__hint-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    font-size: 0.625rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.88);
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.iran-warehouse-map-cities {
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    background:
        linear-gradient(180deg, #fff 0%, var(--iwm-paper) 100%);
    border-inline-start: 1px solid var(--iwm-line);
    position: relative;
    transition:
        box-shadow 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.7s ease,
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.iran-warehouse-map-cities.is-city-stage {
    z-index: 2;
    background:
        radial-gradient(120% 80% at 50% 0%, hsl(var(--primary) / 0.08), transparent 55%),
        linear-gradient(180deg, #fff 0%, var(--iwm-paper) 100%);
    box-shadow:
        -18px 0 40px rgba(28, 18, 20, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    animation: iwm-city-stage-rise 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes iwm-city-stage-rise {
    0% {
        transform: translateX(12px) scale(0.97);
        filter: blur(2px);
        opacity: 0.85;
    }
    100% {
        transform: none;
        filter: none;
        opacity: 1;
    }
}

[dir="rtl"] .iran-warehouse-map-cities.is-city-stage,
.header-city-modal--map .iran-warehouse-map-cities.is-city-stage {
    animation-name: iwm-city-stage-rise-rtl;
}

@keyframes iwm-city-stage-rise-rtl {
    0% {
        transform: translateX(-14px) scale(0.96);
        filter: blur(2px);
        opacity: 0.85;
    }
    60% {
        transform: translateX(2px) scale(1.01);
        filter: blur(0);
    }
    100% {
        transform: none;
        filter: none;
        opacity: 1;
    }
}

.iran-warehouse-map-cities__cue {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0 0 0.15rem;
    padding: 0.55rem 0.75rem;
    border-radius: 14px;
    background: linear-gradient(105deg, hsl(var(--primary)) 0%, hsl(351 74% 42%) 100%);
    color: #fff;
    font-size: 0.8125rem;
    font-weight: 800;
    line-height: 1.35;
    box-shadow: 0 10px 24px hsl(var(--primary) / 0.28);
    animation: iwm-cue-in 0.55s cubic-bezier(0.34, 1.4, 0.64, 1) both;
}

.iran-warehouse-map-cities__cue.hidden {
    display: none !important;
}

.iran-warehouse-map-cities__cue-pulse {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.55);
    animation: iwm-cue-pulse 1.6s ease-out infinite;
    flex-shrink: 0;
}

@keyframes iwm-cue-in {
    0% {
        opacity: 0;
        transform: translateY(-10px) scale(0.92);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes iwm-cue-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.55);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

@media (max-width: 767.98px) {
    .iran-warehouse-map-cities {
        border-inline-start: none;
        border-top: 1px solid var(--iwm-line);
    }

    .iran-warehouse-map-cities.is-city-stage {
        animation-name: iwm-city-stage-rise-mobile;
        box-shadow:
            0 -12px 32px rgba(28, 18, 20, 0.08),
            inset 0 1px 0 rgba(255, 255, 255, 0.9);
    }

    @keyframes iwm-city-stage-rise-mobile {
        0% {
            transform: translateY(18px) scale(0.98);
            opacity: 0.85;
        }
        100% {
            transform: none;
            opacity: 1;
        }
    }
}

.iran-warehouse-map-cities__toolbar {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    padding: 1rem 1.05rem 0.85rem;
    background: rgba(255, 253, 251, 0.94);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--iwm-line);
}

.iran-warehouse-map-cities__meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 0;
}

.iran-warehouse-map-cities__label {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 800;
    color: var(--iwm-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.iran-warehouse-map-cities__hint {
    margin: 0;
    flex-shrink: 0;
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--iwm-muted);
    white-space: nowrap;
    padding: 0.2rem 0.5rem;
    border-radius: 999px;
    background: var(--iwm-paper-2);
}

.iran-warehouse-map-cities__search {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.8rem;
    border-radius: 14px;
    background: #fff;
    border: 1px solid var(--iwm-line);
    box-shadow: 0 1px 2px rgba(28, 18, 20, 0.03);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.iran-warehouse-map-cities__search:focus-within {
    border-color: hsl(var(--primary) / 0.35);
    box-shadow: 0 0 0 3px hsl(var(--primary) / 0.12);
}

.iran-warehouse-map-cities__search.hidden {
    display: none;
}

.iran-warehouse-map-cities__search-icon {
    flex-shrink: 0;
    width: 0.9375rem;
    height: 0.9375rem;
    color: #a8979b;
}

.iran-warehouse-map-cities__search-input {
    width: 100%;
    min-width: 0;
    border: none;
    padding: 0;
    font-size: 0.8125rem;
    color: var(--iwm-ink);
    background: transparent;
    outline: none;
}

.iran-warehouse-map-cities__search-input::placeholder {
    color: #b7a8ac;
}

.iran-warehouse-map-cities__content {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.iran-warehouse-map-cities__cue.is-cue-replay {
    animation: iwm-cue-in 0.55s cubic-bezier(0.34, 1.4, 0.64, 1) both;
}

.iran-warehouse-map-cities__list {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 0.5rem;
    flex: 0 0 auto;
    overflow: visible;
    padding: 0.85rem 1.05rem 1.15rem;
    margin: 0;
    list-style: none;
    transition: padding 0.5s ease, gap 0.5s ease;
}

.iran-warehouse-map-cities.is-city-stage .iran-warehouse-map-cities__list {
    padding: 1rem 1.15rem 1.35rem;
    gap: 0.55rem;
}

.iran-warehouse-map-cities.is-city-stage .iran-warehouse-map-cities__chip {
    padding: 0.55rem 1rem;
    font-size: 0.84375rem;
}

.iran-warehouse-map-cities__list:empty {
    display: none;
}

.iran-warehouse-map-cities__list > li {
    display: contents;
}

.iran-warehouse-map-cities__placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 2.25rem 1.35rem;
    margin: 0.85rem 1.05rem 1.15rem;
    text-align: center;
    color: var(--iwm-muted);
    line-height: 1.55;
    border-radius: 18px;
    background:
        radial-gradient(circle at 50% 0%, hsl(var(--primary) / 0.08), transparent 55%),
        linear-gradient(180deg, #fff, var(--iwm-paper-2));
    border: 1px dashed rgba(28, 18, 20, 0.1);
    animation: iwm-placeholder-in 0.45s ease both;
}

@keyframes iwm-placeholder-in {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

.iran-warehouse-map-cities__placeholder.hidden,
.iran-warehouse-map-cities__search.hidden {
    display: none !important;
}

.iran-warehouse-map-cities__placeholder-icon {
    color: var(--iwm-brand);
    opacity: 0.85;
    margin-bottom: 0.15rem;
    animation: iwm-pin-float 2.8s ease-in-out infinite;
}

@keyframes iwm-pin-float {
    0%,
    100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-4px);
    }
}

.iran-warehouse-map-cities__placeholder-title {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 800;
    color: var(--iwm-ink);
}

.iran-warehouse-map-cities__placeholder-text {
    margin: 0;
    max-width: 16rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--iwm-muted);
}

.iran-warehouse-map-cities__chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.45rem 0.85rem 0.45rem 0.45rem;
    border: 1px solid rgba(28, 18, 20, 0.08);
    border-radius: 999px;
    background: #fff;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #4a3d41;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
    transition:
        border-color 0.18s,
        background-color 0.18s,
        color 0.18s,
        box-shadow 0.18s,
        transform 0.15s;
    animation: iwm-chip-in 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: calc(var(--iwm-chip-i, 0) * 18ms);
}

.iran-warehouse-map-cities__mono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.55rem;
    height: 1.55rem;
    border-radius: 50%;
    background: linear-gradient(145deg, hsl(var(--primary) / 0.14), hsl(var(--primary) / 0.05));
    color: var(--iwm-brand);
    font-size: 0.6875rem;
    font-weight: 800;
    flex-shrink: 0;
}

.iran-warehouse-map-cities__chip-label mark,
.iran-warehouse-map-cities__mark {
    background: hsl(var(--primary) / 0.18);
    color: inherit;
    border-radius: 3px;
    padding: 0 0.1em;
}

.iran-warehouse-map-cities__chip.is-stamping {
    animation: iwm-chip-stamp 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes iwm-chip-stamp {
    0% {
        transform: scale(1);
    }
    35% {
        transform: scale(0.9);
    }
    70% {
        transform: scale(1.08);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes iwm-chip-in {
    from {
        opacity: 0;
        transform: translateY(6px) scale(0.96);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

.iran-warehouse-map-cities__chip:hover {
    border-color: hsl(var(--primary) / 0.28);
    color: var(--iwm-brand);
    background: #fff;
    box-shadow: 0 6px 16px hsl(var(--primary) / 0.1);
    transform: translateY(-1px);
}

.iran-warehouse-map-cities__chip--selected {
    border-color: var(--iwm-brand);
    background: var(--iwm-brand);
    color: #fff;
    box-shadow: 0 8px 18px hsl(var(--primary) / 0.28);
}

.iran-warehouse-map-cities__chip--selected:hover {
    border-color: var(--iwm-brand);
    background: var(--iwm-brand);
    color: #fff;
    transform: none;
}

.header-city-modal--map .header-city-selector-form {
    display: contents;
}

.header-city-modal--map.header-city-modal--detached .header-city-selector-form {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    overflow: visible;
}

.header-city-modal--map.header-city-modal--detached .header-city-modal__body {
    flex: 0 0 auto;
    min-height: 0;
    overflow: visible;
}

.iran-warehouse-map__loading {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    color: rgba(255, 255, 255, 0.96);
    font-size: 0.8125rem;
    font-weight: 600;
    background: rgba(28, 36, 42, 0.42);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.iran-warehouse-map__loading.hidden {
    /* exit handled by cinematic keyframes; reduced-motion resets to display:none */
    pointer-events: none;
}

.iran-warehouse-map__spinner {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.25);
    border-top-color: #fff;
    animation: iwm-spin 0.7s linear infinite;
}

@keyframes iwm-spin {
    to {
        transform: rotate(360deg);
    }
}

/* —— Cinematic interaction FX —— */

.iran-warehouse-map__spotlight {
    pointer-events: none;
    position: absolute;
    z-index: 2;
    width: 280px;
    height: 280px;
    margin: -140px 0 0 -140px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.22) 0%, transparent 68%);
    opacity: 0;
    transition: opacity 0.35s ease;
    mix-blend-mode: soft-light;
    will-change: left, top;
}

.iran-warehouse-map__viewport:hover .iran-warehouse-map__spotlight.is-on {
    opacity: 1;
}

.iran-warehouse-map__fx {
    pointer-events: none;
    position: absolute;
    inset: 0;
    z-index: 4;
    overflow: hidden;
}

.iran-warehouse-map__ripple {
    position: absolute;
    width: 18px;
    height: 18px;
    margin: -9px 0 0 -9px;
    border-radius: 50%;
    border: 2px solid hsl(var(--primary));
    box-shadow: 0 0 0 0 hsl(var(--primary) / 0.35);
    animation: iwm-ripple 0.85s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes iwm-ripple {
    0% {
        transform: scale(0.4);
        opacity: 1;
    }
    100% {
        transform: scale(14);
        opacity: 0;
        box-shadow: 0 0 40px 8px hsl(var(--primary) / 0);
    }
}

.iran-warehouse-map__spark {
    position: absolute;
    width: 7px;
    height: 7px;
    margin: -3.5px 0 0 -3.5px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, #fff, hsl(var(--primary)));
    box-shadow: 0 0 12px hsl(var(--primary) / 0.8);
    animation: iwm-spark 0.9s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    --iwm-spark-x: 0px;
    --iwm-spark-y: 0px;
}

@keyframes iwm-spark {
    0% {
        transform: translate(0, 0) scale(0.4);
        opacity: 1;
    }
    100% {
        transform: translate(var(--iwm-spark-x), var(--iwm-spark-y)) scale(0);
        opacity: 0;
    }
}

.iran-warehouse-map__flash {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at var(--iwm-flash-x, 50%) var(--iwm-flash-y, 50%), hsl(var(--primary) / 0.35), transparent 55%);
    animation: iwm-flash 0.65s ease forwards;
}

@keyframes iwm-flash {
    0% {
        opacity: 0.9;
    }
    100% {
        opacity: 0;
    }
}

.iran-warehouse-map__svg-wrap.is-revealing path[id] {
    animation: iwm-province-rise 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: calc(var(--iwm-intro-i, 0) * 18ms);
}

.iran-warehouse-map__svg-wrap.is-revealing path.iran-map-province--available {
    animation-name: iwm-province-rise-available;
}

@keyframes iwm-province-rise {
    0% {
        opacity: 0;
        transform: translateY(14px) scale(0.92);
        filter: blur(3px);
    }
    100% {
        opacity: 1;
        transform: none;
        filter: none;
    }
}

@keyframes iwm-province-rise-available {
    0% {
        opacity: 0;
        transform: translateY(18px) scale(0.88);
        fill: hsl(var(--primary) / 0.35);
        filter: blur(4px);
    }
    60% {
        fill: #fff5f6;
    }
    100% {
        opacity: 1;
        transform: none;
        fill: #fffdfb;
        filter: none;
    }
}

.iran-warehouse-map__svg-wrap path.iran-map-province--available {
    transition:
        fill 0.28s ease,
        stroke 0.28s ease,
        filter 0.28s ease,
        opacity 0.28s ease;
}

.iran-warehouse-map__svg-wrap path.iran-map-province--available:hover,
.iran-warehouse-map__svg-wrap path.iran-map-province--available:focus {
    animation: iwm-province-breathe 1.6s ease-in-out infinite;
}

@keyframes iwm-province-breathe {
    0%,
    100% {
        filter: drop-shadow(0 4px 10px hsl(var(--primary) / 0.28));
    }
    50% {
        filter: drop-shadow(0 8px 18px hsl(var(--primary) / 0.45));
    }
}

.iran-warehouse-map__svg-wrap path.iran-map-province--selected {
    animation: iwm-select-bloom 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes iwm-select-bloom {
    0% {
        filter: drop-shadow(0 0 0 transparent);
        stroke-width: 1.1;
    }
    40% {
        filter: drop-shadow(0 0 22px hsl(var(--primary) / 0.65));
        stroke-width: 2.4;
    }
    100% {
        filter: drop-shadow(0 6px 14px hsl(var(--primary) / 0.35));
        stroke-width: 1.8;
    }
}

.iran-warehouse-map__svg-wrap path.iran-map-province--available.iran-map-province--pulse {
    animation: iwm-available-pulse 2.8s ease-in-out infinite;
}

.iran-warehouse-map__viewport.has-selection .iran-warehouse-map__svg-wrap path.iran-map-province--available.iran-map-province--pulse {
    animation: none;
}

.iran-warehouse-map__viewport.has-selection .iran-warehouse-map__svg-wrap path.iran-map-province--available:hover,
.iran-warehouse-map__viewport.has-selection .iran-warehouse-map__svg-wrap path.iran-map-province--available:focus {
    animation: none;
}

@keyframes iwm-available-pulse {
    0%,
    100% {
        filter: drop-shadow(0 1px 0 rgba(255, 255, 255, 0.35));
    }
    50% {
        filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.55));
    }
}

.iran-warehouse-map__viewport.has-selection .iran-warehouse-map__svg-wrap path.iran-map-province--available:not(.iran-map-province--selected) {
    transition: opacity 0.45s ease, filter 0.45s ease;
}

.iran-warehouse-map__zoom {
    animation: iwm-zoom-dock-in 0.7s 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes iwm-zoom-dock-in {
    from {
        opacity: 0;
        transform: translateX(-12px) scale(0.9);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

.iran-warehouse-map__zoom-btn {
    transition: background-color 0.15s, transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), color 0.15s;
}

.iran-warehouse-map__zoom-btn:hover {
    transform: scale(1.08);
}

.iran-warehouse-map__tooltip:not(.hidden) {
    animation: iwm-tooltip-pop 0.28s cubic-bezier(0.34, 1.4, 0.64, 1) both;
}

@keyframes iwm-tooltip-pop {
    from {
        opacity: 0;
        transform: translate(-50%, calc(-100% - 2px)) scale(0.86);
    }
    to {
        opacity: 1;
        transform: translate(-50%, calc(-100% - 12px)) scale(1);
    }
}

.iran-warehouse-map__hint-pill {
    animation: iwm-hint-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: calc(0.4s + var(--iwm-hint-i, 0) * 80ms);
}

.iran-warehouse-map__hint-pill:nth-child(1) { --iwm-hint-i: 0; }
.iran-warehouse-map__hint-pill:nth-child(2) { --iwm-hint-i: 1; }
.iran-warehouse-map__hint-pill:nth-child(3) { --iwm-hint-i: 2; }

@keyframes iwm-hint-in {
    from {
        opacity: 0;
        transform: translateY(8px) scale(0.92);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

.iran-warehouse-map__step {
    transition: background-color 0.35s, color 0.35s, transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.35s;
}

.iran-warehouse-map__step--active {
    animation: iwm-step-pop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes iwm-step-pop {
    0% {
        transform: scale(0.86);
    }
    100% {
        transform: scale(1);
    }
}

.iran-warehouse-map-cities {
    position: relative;
    overflow: hidden;
}

.iran-warehouse-map-cities__shine {
    pointer-events: none;
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
        115deg,
        transparent 30%,
        rgba(255, 255, 255, 0.55) 48%,
        transparent 62%
    );
    transform: translateX(-120%);
    opacity: 0;
}

.iran-warehouse-map-cities.is-celebrating .iran-warehouse-map-cities__shine {
    animation: iwm-cities-shine 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes iwm-cities-shine {
    0% {
        transform: translateX(-120%);
        opacity: 0;
    }
    30% {
        opacity: 1;
    }
    100% {
        transform: translateX(120%);
        opacity: 0;
    }
}

.iran-warehouse-map-cities.is-celebrating {
    animation: iwm-cities-glow 0.9s ease;
}

@keyframes iwm-cities-glow {
    0%,
    100% {
        box-shadow: none;
    }
    40% {
        box-shadow: inset 0 0 0 1px hsl(var(--primary) / 0.22), inset 0 0 40px hsl(var(--primary) / 0.08);
    }
}

.iran-warehouse-map-cities__label.is-swap {
    animation: iwm-label-swap 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes iwm-label-swap {
    0% {
        opacity: 0;
        transform: translateY(8px) blur(4px);
        filter: blur(4px);
    }
    100% {
        opacity: 1;
        transform: none;
        filter: none;
    }
}

.iran-warehouse-map-cities__chip {
    animation: iwm-chip-spring 0.55s cubic-bezier(0.34, 1.4, 0.64, 1) both;
    animation-delay: calc(var(--iwm-chip-i, 0) * 28ms + 40ms);
}

@keyframes iwm-chip-spring {
    0% {
        opacity: 0;
        transform: translateY(16px) scale(0.7) rotate(-4deg);
        filter: blur(4px);
    }
    70% {
        filter: blur(0);
    }
    100% {
        opacity: 1;
        transform: none;
        filter: none;
    }
}

.iran-warehouse-map-cities__chip:hover {
    transform: translateY(-3px) scale(1.04);
}

.iran-warehouse-map-cities__chip--selected {
    animation: iwm-chip-chosen 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes iwm-chip-chosen {
    0% {
        transform: scale(0.92);
    }
    55% {
        transform: scale(1.08);
    }
    100% {
        transform: scale(1);
    }
}

.iran-warehouse-map-cities__placeholder-rings {
    position: absolute;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    border: 1px solid hsl(var(--primary) / 0.25);
    animation: iwm-ring-expand 2.4s ease-out infinite;
}

.iran-warehouse-map-cities__placeholder-rings::before,
.iran-warehouse-map-cities__placeholder-rings::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid hsl(var(--primary) / 0.2);
    animation: iwm-ring-expand 2.4s ease-out infinite;
}

.iran-warehouse-map-cities__placeholder-rings::before {
    animation-delay: 0.4s;
}

.iran-warehouse-map-cities__placeholder-rings::after {
    animation-delay: 0.8s;
}

@keyframes iwm-ring-expand {
    0% {
        transform: scale(0.55);
        opacity: 0.7;
    }
    100% {
        transform: scale(1.55);
        opacity: 0;
    }
}

.iran-warehouse-map-cities__placeholder {
    position: relative;
}

.iran-warehouse-map__loading:not(.hidden) {
    animation: iwm-loading-veil 0.35s ease both;
}

.iran-warehouse-map__loading.hidden {
    display: flex !important;
    pointer-events: none;
    animation: iwm-loading-out 0.45s ease forwards;
}

@keyframes iwm-loading-veil {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes iwm-loading-out {
    to {
        opacity: 0;
        visibility: hidden;
    }
}

.iran-warehouse-map__loading-text {
    animation: iwm-loading-pulse 1.4s ease-in-out infinite;
}

@keyframes iwm-loading-pulse {
    0%,
    100% {
        opacity: 0.7;
        letter-spacing: 0;
    }
    50% {
        opacity: 1;
        letter-spacing: 0.02em;
    }
}

.iran-warehouse-map.is-map-ready .iran-warehouse-map__stage {
    animation: iwm-stage-settle 0.85s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes iwm-stage-settle {
    0% {
        filter: drop-shadow(0 18px 28px var(--iwm-map-depth)) blur(6px);
        opacity: 0.4;
    }
    100% {
        filter: drop-shadow(0 18px 28px var(--iwm-map-depth));
        opacity: 1;
    }
}

/* —— Artistic extras: guide, pin, compass, province bar —— */

.header-city-modal--map .header-city-modal__subtitle.is-swap {
    animation: iwm-fade-up 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.iran-warehouse-map__guide {
    position: absolute;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.35rem;
    pointer-events: none;
    transform: translate(-50%, -110%);
}

.iran-warehouse-map__guide.hidden {
    display: none !important;
}

.iran-warehouse-map__guide.is-visible {
    animation: iwm-guide-bob 1.8s ease-in-out infinite;
}

.iran-warehouse-map__guide-orb {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: hsl(var(--primary));
    box-shadow: 0 0 0 0 hsl(var(--primary) / 0.45);
    animation: iwm-guide-ping 1.8s ease-out infinite;
}

.iran-warehouse-map__guide-text {
    padding: 0.3rem 0.55rem;
    border-radius: 999px;
    background: rgba(28, 18, 20, 0.9);
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

@keyframes iwm-guide-bob {
    0%,
    100% {
        transform: translate(-50%, -110%);
    }
    50% {
        transform: translate(-50%, -130%);
    }
}

@keyframes iwm-guide-ping {
    0% {
        box-shadow: 0 0 0 0 hsl(var(--primary) / 0.5);
    }
    70% {
        box-shadow: 0 0 0 16px hsl(var(--primary) / 0);
    }
    100% {
        box-shadow: 0 0 0 0 hsl(var(--primary) / 0);
    }
}

.iran-warehouse-map__compass {
    position: absolute;
    z-index: 3;
    bottom: 0.75rem;
    inset-inline-start: 0.75rem;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: rgba(255, 253, 251, 0.16);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    animation: iwm-compass-spin 18s linear infinite;
}

.iran-warehouse-map__compass-n {
    font-size: 0.6875rem;
    font-weight: 800;
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

@keyframes iwm-compass-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.iran-warehouse-map__compass-n {
    animation: iwm-compass-spin 18s linear infinite reverse;
}

.iran-warehouse-map__pin {
    position: absolute;
    z-index: 6;
    width: 22px;
    height: 28px;
    /* Tip of the pin sits on the province centroid (SVG user space). */
    transform: translate(-50%, -100%);
    pointer-events: none;
    animation: iwm-pin-drop 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) both;
}

.iran-warehouse-map__pin--static {
    animation: none;
}

.iran-warehouse-map__pin-body {
    position: absolute;
    left: 50%;
    top: 0;
    width: 16px;
    height: 16px;
    margin-left: -8px;
    border-radius: 50% 50% 50% 0;
    background: linear-gradient(145deg, hsl(var(--primary)), hsl(351 74% 28%));
    transform: rotate(-45deg);
    box-shadow: 0 6px 14px hsl(var(--primary) / 0.45);
}

.iran-warehouse-map__pin-body::after {
    content: "";
    position: absolute;
    inset: 4px;
    border-radius: 50%;
    background: #fff;
}

.iran-warehouse-map__pin-shadow {
    position: absolute;
    left: 50%;
    bottom: 1px;
    width: 14px;
    height: 5px;
    margin-left: -7px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.28);
    filter: blur(1px);
    animation: iwm-pin-shadow 0.7s cubic-bezier(0.34, 1.4, 0.64, 1) both;
}

.iran-warehouse-map__pin--static .iran-warehouse-map__pin-shadow {
    animation: none;
    opacity: 0.45;
}

@keyframes iwm-pin-drop {
    0% {
        transform: translate(-50%, calc(-100% - 42px)) scale(0.6);
        opacity: 0;
    }
    60% {
        opacity: 1;
    }
    80% {
        transform: translate(-50%, calc(-100% + 3px)) scale(1.05);
    }
    100% {
        transform: translate(-50%, -100%) scale(1);
        opacity: 1;
    }
}

@keyframes iwm-pin-shadow {
    0% {
        transform: scale(0.4);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 0.45;
    }
}

.iran-warehouse-map-cities__province-bar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0 0.35rem;
    padding: 0.45rem 0.55rem 0.45rem 0.65rem;
    border-radius: 14px;
    background: rgba(28, 18, 20, 0.04);
    border: 1px solid var(--iwm-line);
    animation: iwm-cue-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.iran-warehouse-map-cities__province-bar.hidden {
    display: none !important;
}

.iran-warehouse-map-cities__province-pin {
    display: inline-flex;
    color: var(--iwm-brand);
    flex-shrink: 0;
}

.iran-warehouse-map-cities__province-name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.8125rem;
    font-weight: 800;
    color: var(--iwm-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.iran-warehouse-map-cities__back {
    flex-shrink: 0;
    border: none;
    background: #fff;
    color: var(--iwm-brand);
    font-size: 0.6875rem;
    font-weight: 800;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(28, 18, 20, 0.08);
    transition: transform 0.2s, background-color 0.2s, box-shadow 0.2s;
}

.iran-warehouse-map-cities__back:hover {
    background: var(--iwm-brand-soft);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px hsl(var(--primary) / 0.15);
}

.iran-warehouse-map-cities__chip--selected .iran-warehouse-map-cities__mono {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}

@media (prefers-reduced-motion: reduce) {
    .header-city-modal--map .header-city-modal__panel,
    .header-city-modal--map .header-city-modal__backdrop,
    .header-city-modal--map .header-city-modal__eyebrow,
    .header-city-modal--map .header-city-modal__title,
    .header-city-modal--map .header-city-modal__subtitle,
    .iran-warehouse-map__svg-wrap path,
    .iran-warehouse-map__stage,
    .iran-warehouse-map__svg-wrap,
    .iran-warehouse-map-cities.is-city-stage,
    .iran-warehouse-map-cities__cue,
    .header-city-modal--map .header-city-modal__body,
    .iran-warehouse-map-cities__chip,
    .iran-warehouse-map-cities__placeholder,
    .iran-warehouse-map-cities__placeholder-icon,
    .iran-warehouse-map-cities__placeholder-rings,
    .iran-warehouse-map-cities__placeholder-rings::before,
    .iran-warehouse-map-cities__placeholder-rings::after,
    .iran-warehouse-map__spinner,
    .iran-warehouse-map__aurora,
    .iran-warehouse-map__dust span,
    .iran-warehouse-map__ripple,
    .iran-warehouse-map__spark,
    .iran-warehouse-map__flash,
    .iran-warehouse-map__zoom,
    .iran-warehouse-map__hint-pill,
    .iran-warehouse-map-cities__shine,
    .iran-warehouse-map__spotlight,
    .iran-warehouse-map__loading-text,
    .iran-warehouse-map__guide,
    .iran-warehouse-map__guide-orb,
    .iran-warehouse-map__compass,
    .iran-warehouse-map__compass-n,
    .iran-warehouse-map__pin,
    .iran-warehouse-map__pin-shadow,
    .iran-warehouse-map__step-rail-fill {
        transition: none !important;
        animation: none !important;
    }

    .iran-warehouse-map__loading.hidden {
        display: none !important;
    }
}
