/* =========================
   UT Austin brand variables
   ========================= */
:root {
  /* Primary & neutrals (official) */
  --ut-burnt-orange: #BF5700; /* Pantone 159, official UT burnt orange */
  --ut-white: #FFFFFF;
  --ut-charcoal: #333F48;     /* Pantone 432, UT neutral */
  --ut-limestone: #D6D2C4;    /* neutral */

  /* Supportive / accent colors (used sparingly) */
  --ut-bluebonnet: #005F86;
  --ut-mineral-green: #43695B;
  --ut-web-orange: #F2A900;

  /* App theme tokens */
  --surface: var(--ut-white);
  --text: var(--ut-charcoal);
  --muted: #6c757d;
  --code-bg: var(--ut-limestone);
  --code-border: rgba(0,0,0,.08);

  /* Buttons */
  --btn-burnt-fg: #fff;
  --btn-burnt-bg: var(--ut-burnt-orange);
  --btn-burnt-hover-bg: var(--ut-burnt-orange); /* keep solid; no tints */
  --btn-outline-charcoal-fg: var(--ut-charcoal);
  --btn-outline-charcoal-border: var(--ut-charcoal);
  --btn-outline-charcoal-hover-bg: rgba(51,63,72,.08);
}

/* Dark theme */
:root[data-bs-theme="dark"] {
  --surface: #1c1f22;
  --text: #e9ecef;
  --muted: #adb5bd;
  --code-bg: #212529;
  --code-border: rgba(255,255,255,.1);

  --btn-outline-charcoal-fg: #e9ecef;
  --btn-outline-charcoal-border: #adb5bd;
  --btn-outline-charcoal-hover-bg: rgba(255,255,255,.06);
}

/* Base layout */
body {
  background: var(--surface);
  color: var(--text);
}

/* Code blocks */
pre.code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--code-bg);
  border-radius: .5rem;
  padding: 1rem;
  border: 1px solid var(--code-border);
  max-height: 320px;
  overflow: auto;
}

/* Sticky actions bar */
.sticky-actions {
  position: sticky;
  bottom: 0;
  background: color-mix(in srgb, var(--surface), transparent 8%);
  padding: .75rem;
  border-top: 1px solid var(--code-border);
}

/* Muted helper text */
.text-muted { color: var(--muted) !important; }

/* Brand buttons */
.btn-burnt {
  color: var(--btn-burnt-fg);
  background-color: var(--btn-burnt-bg);
  border-color: var(--btn-burnt-bg);
}
.btn-burnt:hover,
.btn-burnt:focus {
  color: var(--btn-burnt-fg);
  background-color: var(--btn-burnt-hover-bg);
  border-color: var(--btn-burnt-hover-bg);
  box-shadow: 0 0 0 .2rem rgba(191, 87, 0, .25);
}

.btn-outline-charcoal {
  color: var(--btn-outline-charcoal-fg);
  border-color: var(--btn-outline-charcoal-border);
}
.btn-outline-charcoal:hover,
.btn-outline-charcoal:focus {
  color: var(--btn-outline-charcoal-fg);
  background-color: var(--btn-outline-charcoal-hover-bg);
  border-color: var(--btn-outline-charcoal-border);
}

/* Optional accents (use sparingly) */
.accent-bluebonnet { color: var(--ut-bluebonnet); }
.accent-mineral   { color: var(--ut-mineral-green); }
.accent-weborange { color: var(--ut-web-orange); }