/* ========================================================
   GLOBAL MAIN STYLESHEET (V3 ROUTER)
   ======================================================== */
@import url('components/cards.css');
@import url('components/controls.css');
@import url('components/bottom_menu.css');
@import url('components/product_modal.css');
@import url('components/updating_overlay.css');
@import url('components/sidebar_menu.css');
@import url('layout/mobile.css');
@import url('layout/home_screen.css');
@import url('layout/vr_player.css');

:root {
    --primary-color: var(--color-primary, #d0bd95);
    --text-main: var(--color-ink, #1d1d1f);
    --glass-bg: rgba(255, 255, 255, 0.15);
    --glass-border: var(--color-hairline, #e0e0e0);
    --glass-shadow: var(--shadow-card-subtle, 0 1px 3px rgba(0, 0, 0, 0.04));
    --ios-easing: var(--ease-spring, cubic-bezier(0.25, 1, 0.5, 1));
    --main-font: var(--font-body, 'Inter', system-ui, -apple-system, sans-serif);

    /* Legacy glass variables */
    --glass-panel-bg: var(--color-canvas, #ffffff);
    --glass-panel-border: 1px solid var(--color-hairline, #e0e0e0);
    --glass-panel-shadow: var(--shadow-floating, 0 4px 24px rgba(0, 0, 0, 0.08));
    --glass-panel-blur: none;
}

body,
html,
button,
input,
textarea {
    font-family: var(--font-body, 'Inter', system-ui, sans-serif) !important;
}

/* Base Styles */
html,
body {
    margin: 0;
    padding: 0;
    width: 100vw;
    height: 100%;
    overflow: hidden; /* Added to prevent scrolling */
    position: fixed; /* Khóa giao diện VR khỏi hiện tượng xô lệch */
}

body {
    background-color: var(--color-canvas, #ffffff);
    color: var(--color-ink, #1d1d1f);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100dvh;
    /* Changed from height to min-height */
    user-select: none;
}