/* ------------------------------------------------------------------
   theme.css
   Copyright (c) 2026 [YOUR NAME]. All rights reserved.

   This file and the platform it belongs to are the property of the
   copyright holder. No part may be reproduced, distributed or used to
   create derivative works without written permission.
   ------------------------------------------------------------------ */
/* ==================================================================
   AgentIQ — global theme
   Loaded last on every page, so it re-skins the tools without
   touching their markup. Dark chrome, paper canvas.
   ================================================================== */

:root{
  --y:#E0AC46;
  --ui-yellow:#E0AC46;
  --ink:#000;
  --paper:#000;
  --ui:#000;
  --line:rgba(255,255,255,.075);
  --mute:#83837C;
  --mid:#8E8E86;
  --tx:#F4F4EE;
  --tx3:#4E4E48;
  --panel:#0A0A09;
  --field:#131312;
}

html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--tx);-webkit-font-smoothing:antialiased}
::selection{background:var(--y);color:#0A0A09}

/* ---------- scrollbars ---------- */
*{scrollbar-width:thin;scrollbar-color:#2C2C29 transparent}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:#2C2C29;border-radius:20px;border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:#454540;background-clip:content-box}


/* ------------------------------------------------------------------
   Documents are paper. They must never inherit the dark UI text
   colour — anything inside them that doesn't set its own colour
   defaults to ink, not to the light chrome colour.
   ------------------------------------------------------------------ */
.page,.dl,.t,.sheet{color:#1A1A18}
.page table,.sheet table,.page td,.sheet td,.page th,.sheet th{color:inherit}

/* the Northpoint Property block is yellow — the wordmark on it is always dark */
.logo b,.mark b,.lh .mark b,.rb-logo-mark{color:#141412!important}

/* ---------- the control panel ---------- */
.panel{
  background:var(--panel)!important;
  border-right:1px solid rgba(255,255,255,.07)!important;
  color:var(--tx);
  padding:24px 22px 22px!important;
}
.panel h1{
  font-family:'Playfair Display',Georgia,serif!important;
  font-weight:400!important; font-size:29px!important;
  letter-spacing:-.02em!important; text-transform:none!important;
  color:var(--tx)!important; margin:0 0 2px!important;
}
.panel .sub{
  font-family:'JetBrains Mono',ui-monospace,monospace!important;
  font-size:9.5px!important; letter-spacing:.2em!important; text-transform:uppercase;
  color:var(--tx3)!important; margin-bottom:22px!important;
}

.panel fieldset{
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:8px!important; padding:14px 13px 15px!important;
  margin:0 0 12px!important; background:rgba(255,255,255,.014);
  transition:border-color .2s;
}
.panel fieldset:focus-within{border-color:rgba(255,229,18,.32)!important}
.panel legend{
  font-family:'JetBrains Mono',ui-monospace,monospace!important;
  font-size:9px!important; letter-spacing:.19em!important;
  color:var(--tx3)!important; padding:0 7px!important;
}
.panel fieldset:focus-within legend{color:var(--y)!important}

.panel label{color:#A7A79E!important;font-size:10.5px!important;font-weight:500!important;letter-spacing:.02em}
.panel input,.panel select,.panel textarea{
  background:var(--field)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  color:var(--tx)!important; border-radius:6px!important;
  transition:border-color .16s,background .16s;
}
.panel input::placeholder,.panel textarea::placeholder{color:#4E4E49}
.panel input:hover,.panel select:hover,.panel textarea:hover{border-color:rgba(255,255,255,.2)!important}
.panel input:focus,.panel select:focus,.panel textarea:focus{
  border-color:var(--y)!important; background:#1C1C1A!important;
  outline:none!important; box-shadow:0 0 0 3px rgba(255,229,18,.10);
}
.panel input[type=file]{padding:5px 7px!important;font-size:11px!important;color:#8E8E86!important;cursor:pointer}
.panel input[type=file]::file-selector-button{
  background:#242422;border:1px solid rgba(255,255,255,.12);color:#C9C9C1;
  border-radius:4px;padding:3px 9px;margin-right:9px;font:inherit;font-size:11px;cursor:pointer;
}
.panel input[type=file]::file-selector-button:hover{border-color:var(--y);color:var(--y)}
.panel input[type=checkbox]{accent-color:var(--y)}
.panel .hint{color:#6E6E67!important;font-size:10.5px!important;line-height:1.6!important}
.panel .chk,.panel .toggles label{color:#B4B4AB!important}

.panel button{
  background:var(--y)!important; color:#000!important;
  border:1px solid var(--y)!important; border-radius:6px!important;
  font-weight:600!important; letter-spacing:.01em;
  transition:transform .12s,box-shadow .18s,filter .16s;
}
.panel button:hover{filter:brightness(1.07);box-shadow:0 4px 16px rgba(255,229,18,.2)}
.panel button:active{transform:translateY(1px)}
.panel button.ghost,.panel button.mini{
  background:transparent!important; color:#C4C4BC!important;
  border:1px solid rgba(255,255,255,.16)!important; box-shadow:none!important;
}
.panel button.ghost:hover,.panel button.mini:hover{border-color:var(--y)!important;color:var(--y)!important}
.panel button:disabled{opacity:.4;filter:none;box-shadow:none}
.panel .actions,.panel div[style*="sticky"]{
  background:var(--panel)!important; border-top:1px solid rgba(255,255,255,.08)!important;
}

/* sub-cards inside the panel */
.panel .compcard,.panel .item,.panel .d{
  background:rgba(255,255,255,.025)!important;
  border-color:rgba(255,255,255,.08)!important;
  color:var(--tx);
}
.panel .compcard .t{color:#B4B4AB!important}

/* status blocks keep their meaning but go dark */
#check.ok,#gate.ok{background:rgba(122,190,110,.09)!important;border-color:rgba(122,190,110,.34)!important;color:#A8D69B!important}
#check.warn{background:rgba(255,229,18,.08)!important;border-color:rgba(255,229,18,.34)!important;color:#EBD98A!important}
#check.bad,#gate.warn{background:rgba(226,92,92,.09)!important;border-color:rgba(226,92,92,.34)!important;color:#E9A0A0!important}

/* ---------- the canvas ---------- */
.stage{
  background:
    radial-gradient(circle at 50% 0%,rgba(255,229,18,.045),transparent 60%),
    linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px) 0 0/26px 26px,
    linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px) 0 0/26px 26px,
    #000!important;
  padding:34px 26px 60px!important;
}
.stage .caption{
  background:var(--panel)!important;border-color:rgba(255,255,255,.09)!important;color:#C4C4BC!important;
}
.stage .caption h3{color:var(--tx3)!important;font-family:'JetBrains Mono',monospace!important;letter-spacing:.16em!important}
.slot .cap{color:var(--tx3)!important;font-family:'JetBrains Mono',monospace!important;
  font-size:9.5px!important;letter-spacing:.16em;text-transform:uppercase}

/* the documents themselves stay paper */
.page,.dl,.t{
  box-shadow:0 1px 2px rgba(0,0,0,.5),0 18px 48px -12px rgba(0,0,0,.85)!important;
  border-radius:2px;
}

/* ---------- nav ---------- */
#rb-bar{
  background:rgba(10,10,9,.86)!important;
  backdrop-filter:saturate(150%) blur(14px);
  -webkit-backdrop-filter:saturate(150%) blur(14px);
  border-bottom:1px solid rgba(255,255,255,.07);
}
#rb-bar .rb-logo{color:var(--y)!important;text-decoration:none}
#rb-quick{color:var(--tx3)!important}
#rb-all{background:transparent!important}
#rb-bar a{transition:color .15s,background .15s}
#rb-bar a.on{background:rgba(255,229,18,.13)!important;color:var(--y)!important}
#rb-data{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.1em}
#rb-drafts{border:1px solid rgba(255,255,255,.16)!important;background:transparent!important;
  transition:border-color .15s,color .15s}
#rb-drafts:hover{border-color:var(--y)!important;color:var(--y)!important;background:transparent!important}

/* ---------- drafts drawer ---------- */
#rb-drawer{background:var(--panel)!important;border-left:1px solid rgba(255,255,255,.08)!important;color:var(--tx)}
#rb-drawer h3{color:var(--tx3)!important;font-family:'JetBrains Mono',monospace!important;letter-spacing:.16em!important}
#rb-drawer .who{background:rgba(255,255,255,.03)!important;border-color:rgba(255,255,255,.08)!important}
#rb-drawer label{color:#A7A79E!important}
#rb-drawer select,#rb-drawer input{background:var(--field)!important;border-color:rgba(255,255,255,.1)!important;color:var(--tx)!important}
#rb-drawer .d{border-color:rgba(255,255,255,.08)!important;background:rgba(255,255,255,.02)}
#rb-drawer .d .m{color:#6E6E67!important}
#rb-drawer .d button,#rb-drawer .acts button,#rb-drawer .acts label{
  background:transparent!important;color:#C4C4BC!important;border-color:rgba(255,255,255,.16)!important}
#rb-drawer .d button:hover,#rb-drawer .acts button:hover,#rb-drawer .acts label:hover{border-color:var(--y)!important;color:var(--y)!important}
#rb-drawer .note{color:#6E6E67!important;border-top-color:rgba(255,255,255,.08)!important}

/* ---------- chat ---------- */
#rb-chat{background:var(--panel)!important;border-color:rgba(255,255,255,.1)!important;
  box-shadow:0 20px 60px rgba(0,0,0,.7)!important}
#rb-chat header{background:#141413!important;border-bottom:1px solid rgba(255,255,255,.07)}
#rb-log .ray{background:#1B1B19!important;color:#DEDED7!important}
#rb-log .you{background:var(--y)!important;color:#000!important}
#rb-log .sys{color:#5C5C56!important}
#rb-eg button{background:transparent!important;border-color:rgba(255,255,255,.14)!important;color:#9A9A92!important}
#rb-eg button:hover{border-color:var(--y)!important;color:var(--y)!important}
#rb-form{border-top-color:rgba(255,255,255,.08)!important}
#rb-in{background:var(--field)!important;border-color:rgba(255,255,255,.1)!important;color:var(--tx)!important}
#rb-in::placeholder{color:#4E4E49}
#rb-in:focus{border-color:var(--y)!important;outline:none}
#rb-open{background:#141413!important;border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:0 8px 30px rgba(0,0,0,.6)!important;padding:9px 18px 9px 10px!important;gap:10px!important}
#rb-open:hover{border-color:rgba(255,229,18,.5)!important;background:#1B1B19!important}
#rb-open .dot{display:none}
#rb-open .ray-av{width:26px;height:26px;border-radius:50%;flex:none}

/* ---------- motion ---------- */
@media (prefers-reduced-motion: no-preference){
  .panel fieldset{animation:rbUp .5s cubic-bezier(.2,.7,.3,1) backwards}
  .panel fieldset:nth-of-type(1){animation-delay:.03s}
  .panel fieldset:nth-of-type(2){animation-delay:.07s}
  .panel fieldset:nth-of-type(3){animation-delay:.11s}
  .panel fieldset:nth-of-type(4){animation-delay:.15s}
  .panel fieldset:nth-of-type(5){animation-delay:.19s}
  .panel fieldset:nth-of-type(6){animation-delay:.23s}
  @keyframes rbUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

  .page,.dl,.t{animation:rbFade .55s cubic-bezier(.2,.7,.3,1) backwards}
  @keyframes rbFade{from{opacity:0;transform:translateY(14px) scale(.99)}to{opacity:1;transform:none}}

  #rb-open{animation:rbPop .5s cubic-bezier(.2,1.3,.4,1) .9s backwards}
  @keyframes rbPop{from{opacity:0;transform:translateY(14px) scale(.9)}to{opacity:1;transform:none}}
}

/* ---------- print: strip all of it ---------- */
@media print{
  /* the dark UI pages would otherwise print light text on white paper */
  body,.stage,.wrap,.grid,.day,.job,.prop,.pcard,.camp,.box,.hunt,.conn div,.sum div,
  .alltools,.alltools a,.task,.panel,#board,.newp,.tabs,.head{
    background:#fff!important;color:#1a1a18!important}
  .wrap *,#board *,.grid *,.sum *,.conn *{color:#1a1a18!important;border-color:#D8D8D2!important}
  .micro,.sm,.meta,.sub,.due,.s,.tag,.hint{color:#5A5A55!important}
  table th{border-bottom-color:#1a1a18!important}
  body,.stage{background:#fff!important}
  .page,.dl,.t{box-shadow:none!important;border-radius:0!important;animation:none!important}
  #rb-bar,#rb-drawer,#rb-chat,#rb-open,#rb-drafts,#rb-saved{display:none!important}
}
