/* Small additions Tailwind utilities don't cover. */

/* Fallback colours and font. Each organization's own colours are set by the
   app in a <style> tag after this file and take precedence. */
:root{--brand-50:243 250 252;--brand-100:228 244 248;--brand-200:198 235 245;--brand-300:150 219 237;--brand-400:89 198 227;--brand-500:35 173 211;--brand-600:27 132 160;--brand-700:19 93 113;--brand-800:16 76 93;--brand-900:13 61 75;--brand-950:9 45 54;--accent-50:254 249 238;--accent-100:252 240 212;--accent-200:250 224 168;--accent-300:246 201 104;--accent-400:242 178 39;--accent-500:233 164 14;--accent-600:196 138 12;--accent-700:159 112 10;--accent-800:122 86 7;--accent-900:95 67 6;--font-sans:"Inter","Roboto",system-ui,-apple-system,"Segoe UI",Arial,sans-serif}

html { -webkit-font-smoothing: antialiased; }
body { font-feature-settings: "cv11", "ss01"; } /* Inter: friendlier 1 and a */
.tabular { font-variant-numeric: tabular-nums; }

/* Leave-bank gauge: the "pending" part is hatched so it reads as not-yet-final
   even without colour. */
.gauge-pending {
  background-image: repeating-linear-gradient(135deg,
    rgb(var(--accent-300)) 0 6px, rgb(var(--accent-100)) 6px 12px);
}

/* Big selectable cards on the "Log time" form */
.choice input:checked + .choice-body {
  border-color: rgb(var(--brand-600));
  background: rgb(var(--brand-50));
  box-shadow: 0 0 0 3px rgb(var(--brand-200));
}
.choice input:focus-visible + .choice-body { outline: 3px solid rgb(var(--accent-500)); outline-offset: 2px; }

:focus-visible { outline: 3px solid rgb(var(--accent-500)); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}
.print-only { display: none; }