/* Vanfleek brand kit applied to Manage: deep green #0e2f28, cream #f8f5ea, amber gold #d08d26, and the thin concentric rings from the brand artwork.
   Tailwind v4 reads its colours from these variables, so remapping the dark slate surfaces and the pale slate backgrounds recolours the whole app
   (sidebars, headers, the sign-in page, table stripes) without touching the compiled stylesheet. */
:root{
  --vf-green-deep:#0e2f28;--vf-green:#28654a;--vf-gold:#d08d26;--vf-cream:#f8f5ea;--vf-cream-2:#f1ecd9;
  --color-slate-950:#0e2f28;--color-slate-900:#133b31;
  --color-slate-50:#faf8ef;--color-slate-100:#f3efdf;
  --vf-rings-gold:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 720 720' fill='none' stroke='%23d08d26' stroke-opacity='.5' stroke-width='1.6'%3E%3Ccircle cx='720' cy='0' r='140'/%3E%3Ccircle cx='720' cy='0' r='230'/%3E%3Ccircle cx='720' cy='0' r='320'/%3E%3Ccircle cx='720' cy='0' r='410'/%3E%3Ccircle cx='720' cy='0' r='500'/%3E%3Ccircle cx='720' cy='0' r='590'/%3E%3Ccircle cx='720' cy='0' r='680'/%3E%3C/svg%3E");
  --vf-rings-green:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 720 720' fill='none' stroke='%2328654a' stroke-opacity='.16' stroke-width='1.6'%3E%3Ccircle cx='720' cy='0' r='140'/%3E%3Ccircle cx='720' cy='0' r='230'/%3E%3Ccircle cx='720' cy='0' r='320'/%3E%3Ccircle cx='720' cy='0' r='410'/%3E%3Ccircle cx='720' cy='0' r='500'/%3E%3Ccircle cx='720' cy='0' r='590'/%3E%3Ccircle cx='720' cy='0' r='680'/%3E%3C/svg%3E");
}
/* the page: cream, with the rings faint in the top-right corner behind everything */
body{background-color:var(--vf-cream);background-image:var(--vf-rings-green);background-repeat:no-repeat;background-position:top right;background-size:min(75vw,760px);background-attachment:fixed}
@media(prefers-color-scheme:dark){body{background-color:#0a211c;background-image:var(--vf-rings-gold)}}
.dark body{background-color:#0a211c;background-image:var(--vf-rings-gold)}
/* a slim gold bar across the top of every screen, as on the brand's banners and invoices */
body::before{content:"";position:fixed;top:0;left:0;right:0;height:4px;background:var(--vf-gold);z-index:300;pointer-events:none}
/* the sign-in page: deep green with gold rings, on the wide hero and behind the card on phones */
.vf-login-hero{background-color:var(--vf-green-deep);background-image:var(--vf-rings-gold),radial-gradient(circle at 12% 8%,rgba(40,101,74,.55),transparent 46%),linear-gradient(150deg,#0e2f28,#1a5440);background-repeat:no-repeat;background-position:top right,0 0,0 0;background-size:min(100%,820px),auto,auto;opacity:1}
.min-h-screen.bg-slate-950{background-image:var(--vf-rings-gold);background-repeat:no-repeat;background-position:top right;background-size:min(90vw,640px)}
/* the dark sidebars get a gold edge, like the brand artwork's accent bar */
aside.bg-slate-950{border-right:3px solid var(--vf-gold)}
/* the logo tile reads better on the dark green with a soft gold ring */
img[src*="vanfleek-logo"]{box-shadow:0 0 0 2px rgba(208,141,38,.55)}

/* the logo itself: a bigger tile in the top bar, and a faint watermark at the foot of every dark sidebar */
header.fixed img[src*="vanfleek-logo"]{width:42px;height:42px}
aside.bg-slate-950{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20opacity%3D%220.09%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22230%20215%201470%201480%22%20role%3D%22img%22%20aria-label%3D%22Vanfleek%22%3E%20%3Ctitle%3EVanfleek%3C%2Ftitle%3E%20%3Cg%20fill%3D%22%23cf8b27%22%3E%20%3Cpath%20d%3D%22M337%20235H675L657%20405H320C280%20405%20245%20375%20252%20330L254%20312C259%20270%20296%20235%20337%20235Z%22%2F%3E%20%3Cpath%20d%3D%22M719%20235C880%20255%20918%20330%20918%20430C918%20490%20912%20530%20908%20575L848%201148C843%201182%20866%201205%20900%201205H1650C1610%201350%201520%201435%201400%201445H797C650%201412%20600%201305%20623%201150Z%22%2F%3E%20%3Cellipse%20cx%3D%22823%22%20cy%3D%221592%22%20rx%3D%22108%22%20ry%3D%2288%22%20transform%3D%22rotate(-40%20823%201592)%22%2F%3E%20%3Cellipse%20cx%3D%221357%22%20cy%3D%221592%22%20rx%3D%22108%22%20ry%3D%2288%22%20transform%3D%22rotate(-40%201357%201592)%22%2F%3E%20%3C%2Fg%3E%20%3Cg%20stroke%3D%22%23fff%22%20stroke-width%3D%2213%22%20stroke-linecap%3D%22round%22%20fill%3D%22none%22%3E%20%3Cpath%20d%3D%22M399%20236L397%20258M456%20236L454%20258M509%20236L507%20258M567%20236L565%20258%22%2F%3E%20%3Cpath%20d%3D%22M413%20404L415%20376M470%20404L472%20376M523%20404L525%20376%22%2F%3E%20%3C%2Fg%3E%20%3Cpath%20fill%3D%22%2328654a%22%20fill-rule%3D%22evenodd%22%20d%3D%22M907%201140C907%20900%201090%20728%201332%20728C1520%20728%201650%20850%201680%201035C1683%201070%201676%201105%201663%201140ZM1163%201015H1437C1437%20960%201380%20912%201312%20912C1250%20912%201185%20950%201163%201015Z%22%2F%3E%20%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:center calc(100% - 78px);background-size:150px}