/**
 * MANH TAI MODERN 2026 - GLOBAL DESIGN SYSTEM
 * Hệ Thống Thiết Kế Giao Diện Chuẩn UI/UX 2026 cho Mực In Mạnh Tài
 * Quy chuẩn thương hiệu: Đỏ #ec1d27 | Xanh Navy #253989 | Be Vietnam Pro
 */

:root {
    /* Bảng màu thương hiệu cốt lõi Mực In Mạnh Tài */
    --mt-primary: #253989;          /* Xanh Navy thương hiệu uy tín */
    --mt-primary-hover: #1d2d6d;
    --mt-primary-light: #eff6ff;
    --mt-accent: #ec1d27;           /* Đỏ rực rỡ kêu gọi hành động CTA */
    --mt-accent-hover: #c8101a;
    --mt-accent-light: #fef2f2;
    --mt-success: #10b981;          /* Xanh lá còn hàng / xác thực chính hãng */
    --mt-warning: #f59e0b;          /* Vàng hổ phách đánh giá sao / quà tặng */

    /* Bảng màu trung tính tinh khiết */
    --mt-bg-body: #f8fafc;          /* Nền xám nhạt hiện đại, không chói */
    --mt-bg-card: #ffffff;
    --mt-border-light: #e2e8f0;     /* Viền siêu mảnh mềm mại */
    --mt-border-hover: #cbd5e1;
    --mt-text-main: #0f172a;        /* Chữ đen sắc nét */
    --mt-text-muted: #64748b;       /* Chữ xám thông số phụ */

    /* Chuẩn bo góc 2026 (Soft Radius) */
    --mt-radius-xs: 4px;
    --mt-radius-sm: 8px;
    --mt-radius-md: 12px;
    --mt-radius-lg: 16px;
    --mt-radius-full: 9999px;

    /* Chuẩn đổ bóng phân tầng (Soft Elevation) */
    --mt-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --mt-shadow-card: 0 1px 3px 0 rgb(0 0 0 / 0.06), 0 1px 2px -1px rgb(0 0 0 / 0.04);
    --mt-shadow-hover: 0 10px 20px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.04);
}

/* 1. NÂNG CẤP TYPOGRAPHY TOÀN HỆ THỐNG - BE VIETNAM PRO */
html,
body,
input,
button,
select,
textarea,
optgroup {
    font-family: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    color: var(--mt-text-main);
}

body {
    background-color: var(--mt-bg-body) !important;
    line-height: 1.6;
}

/* 2. CHUẨN HÓA TIÊU ĐỀ & ĐƯỜNG DẪN */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Be Vietnam Pro', sans-serif !important;
    font-weight: 700;
    color: var(--mt-text-main);
    letter-spacing: -0.015em;
}

a {
    color: var(--mt-primary);
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}

a:hover {
    color: var(--mt-accent);
}

/* 3. KHUNG TRANG CHỦ & PHÂN TẦNG HIỆN ĐẠI */
.container {
    max-width: 1240px;
}

/* 4. CHUẨN HÓA NÚT BẤM (BUTTONS) */
.btn,
button.button,
a.button,
input[type="submit"] {
    font-family: 'Be Vietnam Pro', sans-serif !important;
    font-weight: 600;
    border-radius: var(--mt-radius-sm);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 5. GỠ BỎ ĐƯỜNG VIỀN THÔ CŨNG TRÊN CÁC BLOCK */
.box-product,
.item-product,
.single-product-wrapper {
    transition: all 0.25s ease;
}