/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/*
 *= require_tree .
 *= require_self
 */

/* Design tokens */
:root {
  --bg:        #f4f4f6;
  --surface:   #ffffff;
  --border:    #e8e8ec;
  --border2:   #d8d8e0;
  --text:      #1a1a2e;
  --muted:     #8a8a9a;
  --muted2:    #b0b0be;
  --accent:    #5b5ef4;
  --accent-bg: #f0f0ff;
  --danger:    #e84646;
  --success:   #22b573;
  --warning:   #f0a020;
  --radius:    12px;
  --font:      'Inter', sans-serif;
  --shadow:    0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
}

*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

.app-layout {
  display: flex;
  min-height: 100vh;
  overflow: hidden;
}