/* ==========================================================
   Burndown Buddy – Static Stylesheet
   Extracted from v1.2.2 presentation layer updated to v1.4 BETA
   Purpose: structure, layout, and non–theme-reactive visuals
   ========================================================== */

/* --- Buttons (structural) --- */
.btn-primary,
.btn-primary:disabled,
.btn-primary.disabled {
  background-color: var(--brand-blue);
  border-color: var(--brand-blue);
}
.btn-primary:hover {
  background-color: var(--brand-blue-600);
  border-color: var(--brand-blue-600);
}
.btn-outline-light {
  border-color: var(--border-1);
  color: var(--text-0);
}
.btn-outline-light:hover {
  background: var(--border-1);
  color: var(--text-0);
}

/* --- Chart sizing --- */
canvas {
  max-height: 52vh;
}

/* --- Legend swatch layout --- */
.legend-swatch {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 0.4rem;
  border-radius: 2px;
  vertical-align: middle;
  border: 1px solid #3a4052;
}

/* --- Code and preformatted text --- */
code {
  color: #d7e3ff;
}
details summary {
  cursor: pointer;
  color: var(--text-0);
}
pre {
  color: var(--text-0);
}

/* --- Brand accents and logos --- */
.brand-accent {
  color: var(--brand-blue);
}
.ap-logo {
  height: 28px;
  width: auto;
}
@media (min-width: 576px) {
  .ap-logo {
    height: 34px;
  }
}

/* --- Divider --- */
.divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--border-1), transparent);
  margin: 0.5rem 0 0;
}

/* --- Light-theme visibility fix for outline buttons --- */
[data-theme="light"] .btn-outline-light {
  border-color: var(--text-2, #444);
  color: var(--text-2, #444);
  background: transparent;
}

/* hover only while pointer is over */
[data-theme="light"] .btn-outline-light:hover {
  background-color: var(--text-2, #444);
  color: var(--surface-0, #fff);
  border-color: var(--text-2, #444);
}

/* when focused (keyboard tab), add subtle ring */
[data-theme="light"] .btn-outline-light:focus-visible {
  box-shadow: 0 0 0 0.2rem rgba(0,0,0,0.25);
}

/* ==========================================================
   End of static stylesheet
   ========================================================== */
