/* 
 * Application Mode CSS
 * Simple CSS to handle POS vs Webstore mode switching
 */

/* Base body styles for different modes */
body.pos-mode {
  /* POS is the default - no special overrides needed */
}

body.webstore-mode {
  /* Ensure webstore takes full viewport */
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

/* Simple webstore container styling */
body.webstore-mode .webstore-container {
  width: 100%;
  min-height: 100vh;
  position: relative;
}

/* Hide any POS-specific elements when in webstore mode */
body.webstore-mode .pos-only {
  display: none !important;
}

/* Hide any webstore-specific elements when in POS mode */
body.pos-mode .webstore-only {
  display: none !important;
}

/* Ensure proper font loading for different modes */
body.webstore-mode {
  font-family:
    'HK Grotesk',
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    Roboto,
    sans-serif;
}