/* ═══════════════════════════════════════════
   APPLE TYPOGRAPHY — Global override
   Áp font Apple SF Pro chuẩn iPadOS / iOS / macOS
   Link SAU tất cả CSS khác để override --font var
   ═══════════════════════════════════════════ */

:root {
    --font-apple-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
    --font-apple-text:    -apple-system, BlinkMacSystemFont, "SF Pro Text",    "Inter", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
    --font-apple-mono:    "SF Mono", ui-monospace, "Cascadia Code", "Roboto Mono", "Consolas", "Liberation Mono", monospace;
    /* Override existing --font var (defined in landing.css + admin.css) */
    --font: var(--font-apple-text);
}

/* ── Universal antialiasing + ligatures ── */
html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
    -webkit-text-size-adjust: 100%;
}

body,
input,
textarea,
select,
button {
    font-family: var(--font-apple-text);
    letter-spacing: -0.011em;
}

/* ── Display headings: SF Pro Display, semibold (Apple chuẩn) ── */
h1, h2, h3, h4, h5, h6,
.section-title,
.hiw-title,
.pcta-title,
.card-title {
    font-family: var(--font-apple-display);
    letter-spacing: -0.022em;
    font-feature-settings: "ss01", "cv11", "kern" 1;
}

/* H1/H2 dùng weight 600 (semibold) thay 700/800 — đặc trưng Apple */
h1 { letter-spacing: -0.035em; }
h2 { letter-spacing: -0.028em; }
h3 { letter-spacing: -0.022em; }

/* ── Code / monospace ── */
code, pre, kbd, samp, .mono {
    font-family: var(--font-apple-mono);
    font-feature-settings: "kern" 0, "liga" 0;
}

/* ── Buttons: Apple SF rounded weight 500-600 ── */
button,
.btn,
.hero-btn-primary,
.hero-btn-ghost,
.hero-btn-outline,
.hiw-cta-btn,
.pcta-btn,
.home-try-btn {
    font-family: var(--font-apple-text);
    letter-spacing: -0.012em;
    font-feature-settings: "kern" 1;
}

/* ── Form controls ── */
.form-control,
.form-select,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="search"],
textarea {
    font-family: var(--font-apple-text);
    letter-spacing: -0.011em;
}

/* ── Tighten common Bootstrap ── */
.navbar,
.nav-link,
.dropdown-item,
.modal-title,
.card-header,
.list-group-item,
.alert {
    font-family: var(--font-apple-text);
    letter-spacing: -0.011em;
}

/* ── Numbers: tabular nums (giống Apple wallet/balance) ── */
.tabular-nums,
.balance-amount,
.hero-stat-num,
.price,
.cost,
[data-tabular] {
    font-feature-settings: "tnum" 1, "lnum" 1, "kern" 1;
    font-variant-numeric: tabular-nums;
}

/* ── Caps + tracking (eyebrows, labels) ── */
.section-label,
.hero-eyebrow,
.brand-strip-label,
.htl-text,
.hiw-badge,
.pf-heading,
.pcta-badge {
    font-family: var(--font-apple-text);
    font-feature-settings: "kern" 1, "ss01" 1;
}

/* ── Off-white instead of pure white (Apple's #f5f5f7) ── */
body.landing-page {
    color: #f5f5f7;
}

/* ── Selection color giống macOS ── */
::selection {
    background: rgba(10,132,255,0.35);
    color: #f5f5f7;
}
::-moz-selection {
    background: rgba(10,132,255,0.35);
    color: #f5f5f7;
}
