/* === FALUB — variaveis.css === */

:root {
  /* Fundo e superfícies */
  --bg:           #F1F4F8;
  --surface:      #FFFFFF;
  --surface2:     #F7F9FC;
  --surface3:     #EEF1F6;

  /* Bordas */
  --border:       rgba(15, 23, 42, 0.08);
  --border2:      rgba(15, 23, 42, 0.13);
  --border3:      rgba(15, 23, 42, 0.22);

  /* Marca */
  --accent:       #C8001F;
  --accent2:      #E0102E;
  --accent-dark:  #9B0018;
  --accent-glow:  rgba(200, 0, 31, 0.07);
  --accent-glow2: rgba(200, 0, 31, 0.14);

  /* Status */
  --green:        #16803c;
  --green-bg:     rgba(22, 128, 60, 0.09);
  --red:          #c0192b;
  --red-bg:       rgba(192, 25, 43, 0.09);
  --amber:        #b45309;
  --amber-bg:     rgba(180, 83, 9, 0.09);
  --blue:         #1d4ed8;
  --blue-bg:      rgba(29, 78, 216, 0.09);
  --success:      #16803c;
  --danger:       #c0192b;

  /* Texto */
  --text:         #0F172A;
  --text2:        #475569;
  --text3:        #94A3B8;

  /* Forma */
  --radius:       10px;
  --radius-sm:    7px;
  --radius-lg:    14px;
  --shadow:       0 4px 24px rgba(15, 23, 42, 0.10);
  --shadow-sm:    0 1px 8px  rgba(15, 23, 42, 0.07);
  --shadow-md:    0 8px 32px rgba(15, 23, 42, 0.12);

  /* Layout */
  --topbar-h:     60px;
  --sidebar-w:    220px;
  --cart-w:       380px;
}

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

html { scroll-behavior: smooth; }

body {
  font-family: 'Barlow', sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  overflow-x: hidden;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button { cursor: pointer; font-family: inherit; }
input, select, textarea { font-family: inherit; }
img { display: block; }