/* =========================================================
   TEMPLE STREET FONT STANDARD v1.1 SAFE
   Global brand typography system.
   UI/UX Pro Max mode.
   Typography only. No layout/business logic.
========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;450;500;550;600;650;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
    --font-temple: "Geist", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-temple-body: var(--font-temple);
    --font-temple-heading: var(--font-temple);
    --font-temple-price: var(--font-temple);

    --ts-font-weight-body: 450;
    --ts-font-weight-label: 550;
    --ts-font-weight-button: 600;
    --ts-font-weight-heading: 680;

    --ts-letter-tight: -0.025em;
    --ts-letter-heading: -0.035em;
    --ts-line-body: 1.55;
    --ts-line-heading: 1.08;
}

/* Global typography standard */
html,
body,
button,
input,
textarea,
select,
option {
    font-family: var(--font-temple-body) !important;
    text-rendering: geometricPrecision;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Headings and major titles */
h1, h2, h3, h4, h5, h6,
.section-title,
.flow-title,
.liquid-name,
.cart-header h2,
.sheet-header h3,
.modal-title,
.ts-loc-name,
.ts-footer-brand,
.seo-banner-title,
.checkout-title,
.ts-pro-hero h1,
.ts-otp-copy h2,
.main-status,
.timeline-title,
.order-id {
    font-family: var(--font-temple-heading) !important;
    font-weight: var(--ts-font-weight-heading) !important;
    letter-spacing: var(--ts-letter-heading);
    line-height: var(--ts-line-heading);
}

/* Body and helper text */
p,
span,
div,
label,
small,
.input-field,
.liquid-desc,
.sheet-desc,
.modal-desc,
.ts-footer-desc,
.seo-banner-desc,
.sub-status,
.timeline-desc {
    font-family: var(--font-temple-body) !important;
}

/* Labels and meta */
.input-label,
.ts-delivering,
.upsell-title,
.ts-copyright,
.secure-lock,
.pay-tag,
.dock-text,
.aura-chip,
.ts-pro-kicker,
.ts-pro-step,
.ts-pro-pay-label {
    font-family: var(--font-temple-body) !important;
    font-weight: var(--ts-font-weight-label) !important;
    letter-spacing: -0.01em;
}

/* Buttons */
button,
.btn-primary,
.action-btn,
.desktop-pay-btn,
.sheet-action-btn,
.generate-link-btn,
.upsell-add-btn,
.gps-btn,
.ts-otp-primary,
.ts-promo-apply-btn,
.ts-magic-offer-btn {
    font-family: var(--font-temple-body) !important;
    font-weight: var(--ts-font-weight-button) !important;
    letter-spacing: -0.015em;
}

/* Prices, totals, quantities */
.liquid-price,
.cart-item-price,
.summary-amount,
.var-price,
.sugg-price,
.bill-row,
.bill-row.total,
.pay-amount-value,
.qty-val,
.ts-grand-total-row,
#subtotal,
#taxAmount,
#deliveryFee,
#grandTotal {
    font-family: var(--font-temple-price) !important;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}

/* Inline style fallback guard */
[style*="Outfit"],
[style*="Plus Jakarta Sans"] {
    font-family: var(--font-temple) !important;
}

body {
    line-height: var(--ts-line-body);
}

@media (max-width: 768px) {
    :root {
        --ts-font-weight-heading: 650;
        --ts-line-body: 1.5;
    }
}