/* ══════════════════════════════════════════════════════════════════════
   MHS - base.css - Theme Variables & Reset
   ══════════════════════════════════════════════════════════════════════ */

/* == START Theme Variables == */

/* Light theme (default) */
:root {
  --bg:           #f0f4f5;
  --card:         #ffffff;
  --border:       #d0dde0;
  --border-light: #e2ecee;

  --primary:        #1a8a8a;
  --primary-dark:   #126767;
  --primary-light:  #e0f4f4;
  --primary-text:   #0d5555;

  --blue:           #3a6a9e;
  --blue-light:     #e6eef6;
  --blue-text:      #2a4f7a;

  --amber:          #b5692a;
  --amber-light:    #fdf0e2;
  --amber-text:     #8c4e17;

  --red:            #a32828;
  --red-light:      #fce8e8;
  --red-text:       #8b1f1f;
  --red-border:     #f0c0c0;

  --grey:           #8a9ea3;
  --grey-light:     #f0f4f5;

  --text:           #1e2d30;
  --text-mid:       #4a5e63;
  --text-soft:      #8a9ea3;

  --lock-bg:        #126767;
  --header-bg:      #126767;
  --nav-bg:         #ffffff;

  --tab-h:          56px;
  --side-margin:    5%;
}

/* Dark theme */
[data-theme="dark"] {
  --bg:           #1a2224;
  --card:         #222d2f;
  --border:       #2e3e42;
  --border-light: #263033;

  --primary:        #1eaaaa;
  --primary-dark:   #159090;
  --primary-light:  #1a3535;
  --primary-text:   #5dd4d4;

  --blue:           #5b8fc7;
  --blue-light:     #1e2e40;
  --blue-text:      #88b4e0;

  --amber:          #d4843a;
  --amber-light:    #2d1e0e;
  --amber-text:     #e8a96a;

  --red:            #c94040;
  --red-light:      #2d1414;
  --red-text:       #e87070;
  --red-border:     #5a2222;

  --grey:           #6a8a90;
  --grey-light:     #1e2c2e;

  --text:           #dde8ea;
  --text-mid:       #8fb0b8;
  --text-soft:      #5a7a82;

  --lock-bg:        #0f1f1f;
  --header-bg:      #0f1f1f;
  --nav-bg:         #1e2d2f;
}

/* == END Theme Variables == */


/* == START Base Reset == */

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

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: 'Nunito', sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  transition: background 0.2s ease, color 0.2s ease;
}

/* == END Base Reset == */