/**
 * 後台響應式 - 編版確認彈窗
 *
 * 由 admin-responsive.css 依原行序拆出；載入順序見 src/lib/assets.ts 的
 * ADMIN_STYLES，順序即 cascade 順序，不可調換。
 */

/* ==================== 編版確認彈窗響應式 ==================== */

/* 平板尺寸 (max-width: 48rem / 768px) */
@media (max-width: 48rem) {
    .build-confirm-modal {
        max-width: 95%;
        margin: 1rem;
    }

    .build-confirm-summary {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }

    .confirm-card {
        padding: 1rem 0.75rem;
    }

    .confirm-card-icon {
        width: 36px;
        height: 36px;
        font-size: 0.875rem;
    }

    .confirm-card-label {
        font-size: 0.65rem;
    }

    .confirm-card-value {
        font-size: 0.9rem;
    }
}

/* 手機尺寸 (max-width: 30rem / 480px) */
@media (max-width: 30rem) {
    .build-confirm-modal {
        max-width: 100%;
        margin: 0.5rem;
    }

    .build-confirm-summary {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }

    .confirm-card {
        flex-direction: row;
        padding: 0.875rem 1rem;
        gap: 1rem;
    }

    .confirm-card-icon {
        width: 40px;
        height: 40px;
    }

    .confirm-card-content {
        align-items: flex-start;
    }

    .build-name-input {
        padding: 0.75rem;
        font-size: 0.875rem;
    }

    .btn-generate-name {
        width: 40px;
        height: 40px;
    }

    .btn-start-build {
        padding: 0.625rem 1rem;
        font-size: 0.875rem;
    }
}