/* ============================================================
 * Alcedo — Reusable brand utility classes & primitives
 * Layered on top of the tokens. These encode the signature
 * motifs: the grid background, corner brackets, status dots.
 * ============================================================ */

/* --- Font helpers --- */
.alc-mono { font-family: var(--font-mono); }
.alc-sans { font-family: var(--font-sans); }

/* --- Grid backgrounds (the signature dark stage) --- */
.alc-grid {
  background-color: var(--bg-deep);
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: var(--grid-size) var(--grid-size);
}
.alc-grid-fine {
  background-color: var(--bg-deep);
  background-image:
    linear-gradient(var(--grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size: var(--grid-size-fine) var(--grid-size-fine);
}
.alc-grid-card {
  background-color: var(--bg-card);
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px);
  background-size: 20px 20px;
}

/* --- Corner brackets — frame brand surfaces. Always amber, 1.5px. --- */
.alc-brackets { position: relative; }
.alc-brackets::before,
.alc-brackets::after,
.alc-brackets > .alc-br-bl,
.alc-brackets > .alc-br-br {
  content: "";
  position: absolute;
  width: var(--bracket-size);
  height: var(--bracket-size);
  border-color: var(--amber);
  border-style: solid;
  pointer-events: none;
}
.alc-brackets::before { top: 10px; left: 10px; border-width: var(--bracket-w) 0 0 var(--bracket-w); }
.alc-brackets::after { top: 10px; right: 10px; border-width: var(--bracket-w) var(--bracket-w) 0 0; }
.alc-brackets > .alc-br-bl { bottom: 10px; left: 10px; border-width: 0 0 var(--bracket-w) var(--bracket-w); }
.alc-brackets > .alc-br-br { bottom: 10px; right: 10px; border-width: 0 var(--bracket-w) var(--bracket-w) 0; }

/* --- Status dots — green = ok, amber = waiting, hollow = idle --- */
.alc-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: var(--radius-pill);
  background: var(--green);
  box-shadow: var(--glow-green);
  vertical-align: middle;
}
.alc-dot.amber { background: var(--amber); box-shadow: var(--glow-amber); }

/* --- Dashed divider (modal headers/footers use these) --- */
.alc-rule-dashed { border: 0; border-top: 1px dashed var(--border); }
.alc-rule { border: 0; border-top: 1px solid var(--border); }