/* colors.css — Text, background, border, shadow
 * Classnames stay Tailwind-compatible; values use the editorial palette. */

/* ===== Text ===== */
.text-white           { color: #fafafa; }
.text-transparent     { color: transparent; }
.text-current         { color: currentColor; }
.text-primary         { color: var(--color-primary); }
.text-primary-light   { color: var(--color-primary-light); }
.text-accent          { color: var(--color-accent); }
.text-success         { color: var(--color-success); }
.text-warning         { color: var(--color-warning); }
.text-danger          { color: var(--color-danger); }

/* Warmer, more editorial neutral scale — slightly cooler than Tailwind zinc */
.text-zinc-50   { color: #fafafa; }
.text-zinc-100  { color: #ededf0; }
.text-zinc-200  { color: #d9d9df; }
.text-zinc-300  { color: #bdbdc7; }
.text-zinc-400  { color: #8a8a95; }
.text-zinc-500  { color: #6b6b75; }
.text-zinc-600  { color: #4e4e57; }
.text-zinc-800  { color: #2a2a31; }

/* Categorical accents (data blocks, badges) */
.text-sky-400     { color: #56c7f5; }
.text-violet-400  { color: #b79cff; }
.text-cyan-400    { color: #22d3ee; }
.text-amber-400   { color: var(--color-amber-light); }
.text-emerald-400 { color: #34d399; }
.text-rose-400    { color: #fb7185; }
.text-red-300     { color: #fca5a5; }
.text-red-400     { color: #f87171; }
.text-green-300   { color: #86efac; }
.text-yellow-300  { color: #fde047; }

.text-danger\/60  { color: rgba(244, 63, 94, 0.6); }
.text-danger\/80  { color: rgba(244, 63, 94, 0.8); }
.text-success\/80 { color: rgba(16, 185, 129, 0.8); }
.text-warning\/80 { color: rgba(234, 179, 8, 0.8); }

/* ===== Backgrounds ===== */
.bg-surface         { background-color: var(--color-surface); }
.bg-surface-light   { background-color: var(--color-surface-light); }
.bg-surface-lighter { background-color: var(--color-surface-lighter); }
.bg-primary         { background-color: var(--color-primary); }
.bg-primary-light   { background-color: var(--color-primary-light); }
.bg-accent          { background-color: var(--color-accent); }
.bg-success         { background-color: var(--color-success); }
.bg-danger          { background-color: var(--color-danger); }
.bg-warning         { background-color: var(--color-warning); }
.bg-violet-500      { background-color: #8b5cf6; }
.bg-zinc-800        { background-color: #2a2a31; }

/* Transparent surface variants */
.bg-surface\/80         { background-color: rgba(5, 5, 7, 0.8); }
.bg-surface\/95         { background-color: rgba(5, 5, 7, 0.95); }
.bg-surface-light\/30   { background-color: rgba(12, 12, 16, 0.3); }
.bg-surface-light\/50   { background-color: rgba(12, 12, 16, 0.5); }
.bg-surface-light\/60   { background-color: rgba(12, 12, 16, 0.6); }

.bg-primary\/5   { background-color: rgba(20, 184, 166, 0.05); }
.bg-primary\/8   { background-color: rgba(20, 184, 166, 0.08); }
.bg-primary\/10  { background-color: rgba(20, 184, 166, 0.10); }
.bg-primary\/15  { background-color: rgba(20, 184, 166, 0.15); }
.bg-primary\/20  { background-color: rgba(20, 184, 166, 0.20); }
.bg-accent\/8    { background-color: rgba(34, 211, 238, 0.08); }
.bg-accent\/10   { background-color: rgba(34, 211, 238, 0.10); }
.bg-accent\/15   { background-color: rgba(34, 211, 238, 0.15); }
.bg-success\/5   { background-color: rgba(16, 185, 129, 0.05); }
.bg-success\/10  { background-color: rgba(16, 185, 129, 0.10); }
.bg-success\/15  { background-color: rgba(16, 185, 129, 0.15); }
.bg-danger\/5    { background-color: rgba(244, 63, 94, 0.05); }
.bg-danger\/10   { background-color: rgba(244, 63, 94, 0.10); }
.bg-danger\/15   { background-color: rgba(244, 63, 94, 0.15); }
.bg-warning\/5   { background-color: rgba(234, 179, 8, 0.05); }
.bg-warning\/15  { background-color: rgba(234, 179, 8, 0.15); }

.bg-sky-500\/10      { background-color: rgba(14, 165, 233, 0.10); }
.bg-violet-500\/5    { background-color: rgba(139, 92, 246, 0.05); }
.bg-violet-500\/8    { background-color: rgba(139, 92, 246, 0.08); }
.bg-amber-500\/5     { background-color: rgba(245, 158, 11, 0.05); }
.bg-cyan-500\/5      { background-color: rgba(34, 211, 238, 0.05); }
.bg-emerald-500\/5   { background-color: rgba(16, 185, 129, 0.05); }
.bg-rose-500\/5      { background-color: rgba(244, 63, 94, 0.05); }
.bg-zinc-800\/50     { background-color: rgba(42, 42, 49, 0.5); }
.bg-\[\#141416\]\/95 { background-color: rgba(14, 14, 18, 0.95); }
.bg-\[\#232326\]     { background-color: #1f1f25; }
.bg-\[\#0b0b0c\]     { background-color: #0a0a0d; }

.bg-clip-text { -webkit-background-clip: text; background-clip: text; }

/* ===== Borders — hairline everywhere ===== */
.border-surface-lighter        { border-color: var(--color-hairline-strong); }
.border-surface-lighter\/30    { border-color: rgba(255, 255, 255, 0.04); }
.border-surface-lighter\/40    { border-color: rgba(255, 255, 255, 0.055); }
.border-surface-lighter\/50    { border-color: rgba(255, 255, 255, 0.07); }
.border-primary\/20            { border-color: rgba(20, 184, 166, 0.22); }
.border-primary\/25            { border-color: rgba(20, 184, 166, 0.28); }
.border-primary\/40            { border-color: rgba(20, 184, 166, 0.42); }
.border-danger\/20             { border-color: rgba(244, 63, 94, 0.22); }
.border-danger\/25             { border-color: rgba(244, 63, 94, 0.28); }
.border-danger\/30             { border-color: rgba(244, 63, 94, 0.32); }
.border-success\/20            { border-color: rgba(16, 185, 129, 0.22); }
.border-success\/25            { border-color: rgba(16, 185, 129, 0.28); }
.border-warning\/20            { border-color: rgba(234, 179, 8, 0.22); }
.border-warning\/25            { border-color: rgba(234, 179, 8, 0.28); }
.border-warning\/30            { border-color: rgba(234, 179, 8, 0.32); }
.border-violet-500\/15         { border-color: rgba(139, 92, 246, 0.17); }
.border-amber-500\/15          { border-color: rgba(245, 158, 11, 0.17); }
.border-cyan-500\/15           { border-color: rgba(34, 211, 238, 0.17); }
.border-emerald-500\/15        { border-color: rgba(16, 185, 129, 0.17); }
.border-rose-500\/15           { border-color: rgba(244, 63, 94, 0.17); }
.border-\[\#232326\]           { border-color: #1f1f25; }
.border-\[\#1c1c1f\]           { border-color: #17171c; }
.border-dashed                 { border-style: dashed; }

/* ===== Shadows — deeper, more layered ===== */
.shadow-sm  {
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.4),
        0 0 0 0.5px rgba(255, 255, 255, 0.03) inset;
}
.shadow-lg  {
    box-shadow:
        0 12px 32px -12px rgba(0, 0, 0, 0.7),
        0 4px 12px -4px rgba(0, 0, 0, 0.5),
        0 0 0 0.5px rgba(255, 255, 255, 0.04) inset;
}
.shadow-xl  {
    box-shadow:
        0 24px 48px -12px rgba(0, 0, 0, 0.7),
        0 12px 24px -8px rgba(0, 0, 0, 0.5),
        0 0 0 0.5px rgba(255, 255, 255, 0.04) inset;
}
.shadow-2xl {
    box-shadow:
        0 32px 64px -16px rgba(0, 0, 0, 0.8),
        0 16px 32px -12px rgba(0, 0, 0, 0.6),
        0 0 0 0.5px rgba(255, 255, 255, 0.04) inset;
}
.shadow-primary\/5  { box-shadow: 0 8px 24px -8px rgba(20, 184, 166, 0.18), 0 0 0 0.5px rgba(20, 184, 166, 0.1) inset; }
.shadow-primary\/15 { box-shadow: 0 10px 30px -6px rgba(20, 184, 166, 0.35), 0 0 0 0.5px rgba(20, 184, 166, 0.15) inset; }
.shadow-primary\/20 { box-shadow: 0 12px 36px -6px rgba(20, 184, 166, 0.42), 0 0 0 0.5px rgba(20, 184, 166, 0.2) inset; }
.shadow-primary\/30 { box-shadow: 0 14px 40px -4px rgba(20, 184, 166, 0.5), 0 0 0 0.5px rgba(20, 184, 166, 0.25) inset; }

/* ===== Rings ===== */
.ring-1            { box-shadow: 0 0 0 1px var(--tw-ring-color, rgba(255, 255, 255, 0.08)); }
.ring-primary\/10  { --tw-ring-color: rgba(20, 184, 166, 0.12); }

.decoration-current\/50 { text-decoration-color: rgba(255, 255, 255, 0.55); }
.placeholder-zinc-600::placeholder { color: #55555e; }