/* ============================================================================ D2C CONTROL-TOWER — shared theme (2026-07-30). Linked LAST in each page's so it overrides the page's own :root tokens. Gives the whole d2c.twtsc.org portal a consistent look: dark-green header band, light workspace, mint-green accents, border-only status tags, refined cards. Contrast preserved — white text only on the dark header; dark ink everywhere on the light workspace. Applied to: index, d2c-home, d2c-opsdash, d2c-sla, d2c-masters, d2c-cl-actions, d2c-wh-reasons. (actions.html carries its own richer inline control-tower block.) ============================================================================ */ :root{ --bg:#f2f7f4; --ct:#12a877; --ct-br:#2fd39a; --ct-dk:#0e8f64; --gold:#c68a2e; } body{ background:radial-gradient(1100px 480px at 100% -6%, rgba(18,168,119,.06), transparent 60%), var(--bg) !important; } /* HEADER = dark-green command band (white text stays) */ header{ background:linear-gradient(120deg, #1f3a21, var(--brand)) !important; box-shadow:0 6px 20px rgba(15,40,25,.20); } header a.link, header a{ color:#fff !important; } /* cards get depth */ .card{ border-radius:16px; box-shadow:0 4px 18px rgba(15,40,25,.06); } /* primary / good buttons -> mint-green CTA (dark text on bright mint) */ button.primary, button.good{ background:linear-gradient(135deg, var(--ct-br), var(--ct)) !important; border-color:var(--ct) !important; color:#06231a !important; } /* workspace links -> deep mint */ a.link{ color:var(--ct-dk); } /* status tags -> BORDER-ONLY capsules (no fill), readable per code */ .tag{ background:transparent !important; border:1.6px solid currentColor !important; } .tag-deepgreen{ color:#166a4f !important; } .tag-lightgreen{ color:#2e7d0a !important; } .tag-yellow{ color:#a86a00 !important; } .tag-amber{ color:#9c6a1c !important; } .tag-red{ color:#c2143a !important; } .tag-neutral{ color:#5b6152 !important; } /* tables */ th{ background:#eef4f0 !important; } tr:hover td{ background:#f1f8f4 !important; } /* inputs focus ring -> mint */ input:focus, select:focus, textarea:focus{ border-color:var(--ct) !important; box-shadow:0 0 0 3px rgba(18,168,119,.14) !important; } /* Tom Select + flatpickr accents -> mint (self-hosted widgets on these pages) */ .ts-wrapper.multi .ts-control > .item{ background:var(--ct) !important; border-color:var(--ct) !important; } .ts-dropdown .option.active{ background:rgba(18,168,119,.14) !important; color:var(--ct-dk) !important; } .flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange{ background:var(--ct) !important; border-color:var(--ct) !important; } .flatpickr-months .flatpickr-month, .flatpickr-weekdays, span.flatpickr-weekday{ background:var(--brand) !important; }