/* Theme tokens derived from bedendenbeyne.com (Kiddino theme) */
:root {
  --theme-color: #fab248;      /* orange */
  --theme-color-dark: #e89a2a;
  --theme-color2: #ffd600;     /* yellow */
  --teal: #1eaaa4;
  --teal-dark: #178f8a;
  --teal-deep: #11625f;
  --sidebar-bg: #124f4c;
  --sidebar-bg2: #0f4341;
  --red: #e92833;
  --yellow: #fec624;
  --green: #28a745;
  --blue: #3fa9f5;
  --purple: #8e6bd6;
  --pink: #f06292;
  --smoke: #f0f6fa;
  --cream: #faf6f0;
  --light: #f8f9fa;
  --border: #e0e0e0;
  --title-color: #1f2a2a;
  --body-color: #444444;
  --muted: #8a9494;
  --white: #ffffff;
  --card-shadow: 0 6px 24px rgba(17, 98, 95, 0.08);
  --card-radius: 18px;
  --title-font: "Fredoka", sans-serif;
  --body-font: "Jost", sans-serif;
  --sidebar-width: 260px;
  --sidebar-collapsed: 72px;
  --topbar-height: 66px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
  font-family: var(--body-font);
  font-size: 14px;
  color: var(--body-color);
  background: var(--cream);
  line-height: 1.5;
}
h1, h2, h3, h4, h5, h6 { font-family: var(--title-font); color: var(--title-color); margin: 0 0 .5rem; font-weight: 600; }
a { color: var(--teal-dark); text-decoration: none; }
a:hover { color: var(--theme-color-dark); }
img { max-width: 100%; }
::selection { background: var(--theme-color); color: #fff; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--smoke); }
::-webkit-scrollbar-thumb { background: #cdd9d8; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--teal); }

.text-muted { color: var(--muted); }
.text-teal { color: var(--teal-dark); }
.text-orange { color: var(--theme-color); }
.text-red { color: var(--red); }
.text-green { color: var(--green); }
.text-center { text-align: center; }
.text-right { text-align: right; }
.fw-600 { font-weight: 600; }
.small { font-size: 12px; }
.mt-1 { margin-top: .5rem; } .mt-2 { margin-top: 1rem; } .mt-3 { margin-top: 1.5rem; }
.mb-1 { margin-bottom: .5rem; } .mb-2 { margin-bottom: 1rem; } .mb-3 { margin-bottom: 1.5rem; }
.d-flex { display: flex; } .align-center { align-items: center; } .justify-between { justify-content: space-between; } .justify-end { justify-content: flex-end; }
.gap-1 { gap: .5rem; } .gap-2 { gap: 1rem; } .flex-wrap { flex-wrap: wrap; }
.w-100 { width: 100%; }
.hidden { display: none !important; }