.seller_push_status {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-width: 0;
    margin-top: 16px;
    padding: 13px 14px;
    border: 1px solid var(--dark-line);
    border-radius: var(--radius-sm);
    background: var(--white);
    color: var(--gray-700);
    transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.seller_push_status_icon {
    position: relative;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border-radius: var(--radius-sm);
    background: var(--gray-100);
    transition: background-color .2s ease;
}

.seller_push_status_icon::before {
    content: '';
    position: absolute;
    inset: 9px;
    background: var(--gray-500);
    -webkit-mask: url('/images/icon/alarm.svg') no-repeat center / contain;
    mask: url('/images/icon/alarm.svg') no-repeat center / contain;
    transition: background-color .2s ease;
}

.seller_push_status_copy {
    flex: 1 1 auto;
    min-width: 0;
}

.seller_push_status_heading {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.seller_push_status_heading strong {
    min-width: 0;
    font-size: var(--ft14);
    line-height: 1.4;
    color: var(--gray-700);
}

.seller_push_status_badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 22px;
    padding: 3px 8px;
    border-radius: var(--radius-xs);
    background: var(--gray-100);
    color: var(--gray-500);
    font-size: var(--ft11);
    line-height: 1;
    white-space: nowrap;
}

.seller_push_status_copy > p {
    margin-top: 3px;
    color: var(--gray-500);
    font-size: var(--ft12);
    line-height: 1.45;
}

.seller_push_status_action {
    flex: 0 0 auto;
    min-width: 94px;
    min-height: 38px;
    padding: 9px 14px;
    border: 1px solid var(--dark-line);
    border-radius: var(--radius-sm);
    background: var(--bg);
    color: var(--gray-700);
    font-size: var(--ft12);
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    transition: border-color .2s ease, background-color .2s ease, color .2s ease;
}

.seller_push_status_action[hidden] {
    display: none;
}

.seller_push_status_action:hover,
.seller_push_status_action:focus-visible {
    border-color: var(--primary);
    color: var(--primary);
}

.seller_push_status_action:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--primary) 35%, transparent);
    outline-offset: 2px;
}

.seller_push_status[data-state='enabled'] {
    border-color: color-mix(in srgb, var(--primary) 45%, var(--dark-line));
    background: color-mix(in srgb, var(--primary-bg-light) 58%, var(--white));
}

.seller_push_status[data-state='enabled'] .seller_push_status_icon {
    background: var(--primary-bg-light);
}

.seller_push_status[data-state='enabled'] .seller_push_status_icon::before,
.seller_push_status[data-state='enabled'] .seller_push_status_badge {
    background: var(--primary);
}

.seller_push_status[data-state='enabled'] .seller_push_status_badge {
    color: var(--white);
}

.seller_push_status[data-state='checking'] .seller_push_status_icon::after,
.seller_push_status[data-state='activating'] .seller_push_status_icon::after {
    content: '';
    position: absolute;
    inset: 3px;
    border: 2px solid transparent;
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: sellerPushStatusSpin .8s linear infinite;
}

.seller_push_status[data-state='activating'] .seller_push_status_action {
    pointer-events: none;
    opacity: .65;
}

@keyframes sellerPushStatusSpin {
    to { transform: rotate(360deg); }
}

html.dark .seller_push_status,
body.dark .seller_push_status {
    border-color: var(--dark-line);
    background: var(--white);
}

html.dark .seller_push_status[data-state='enabled'],
body.dark .seller_push_status[data-state='enabled'] {
    border-color: color-mix(in srgb, var(--primary) 52%, var(--dark-line));
    background: color-mix(in srgb, var(--primary-bg-light) 72%, var(--white));
}

@media all and (max-width: 768px) {
    .seller_push_status {
        align-items: flex-start;
        gap: 10px;
        padding: 12px;
    }

    .seller_push_status_icon {
        flex-basis: 34px;
        width: 34px;
        height: 34px;
    }

    .seller_push_status_icon::before {
        inset: 8px;
    }

    .seller_push_status_action {
        align-self: center;
        min-width: 82px;
        padding-right: 11px;
        padding-left: 11px;
    }
}

@media all and (max-width: 480px) {
    .seller_push_status {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .seller_push_status_action {
        grid-column: 1 / -1;
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .seller_push_status,
    .seller_push_status_icon,
    .seller_push_status_icon::before,
    .seller_push_status_action {
        transition: none;
    }

    .seller_push_status[data-state='checking'] .seller_push_status_icon::after,
    .seller_push_status[data-state='activating'] .seller_push_status_icon::after {
        animation: none;
        border-color: color-mix(in srgb, var(--primary) 55%, transparent);
    }
}
