
/* ── 1. a blank canvas is actually blank ── */
body.bg-empty #certSheet #textLayer,
body.bg-empty #certSheet .text-sticker{ display:none !important; }
#okBlank{ z-index:12 !important; }

/* ── 3. advanced mode: the old sidebar chrome, in the light theme ── */
.sb-head{
  background:linear-gradient(180deg,#fbfaff,#f4f2fc) !important;
  border-bottom:1px solid var(--ok-line) !important;
}
.sb-brand-icon{
  background:url("../../brand/owlmark-emblem-128.png") center/contain no-repeat !important;
  font-size:0 !important; box-shadow:none !important; border-radius:0 !important;
  width:34px !important; height:34px !important;
}
.sb-brand-text h1{
  color:var(--ok-ink) !important; font-family:var(--cs-font) !important;
  font-weight:900 !important; font-size:15px !important; letter-spacing:.1px !important;
}
.sb-brand-text p{
  color:var(--ok-ink-faint) !important; font-family:var(--cs-font) !important;
  font-style:normal !important; font-weight:700 !important;
}
.sb-tabs{
  background:var(--ok-soft) !important;
  border-bottom:1px solid var(--ok-line) !important;
}
.sb-tab{
  color:var(--ok-ink-soft) !important;
  font-family:var(--cs-font) !important; font-weight:800 !important;
  font-size:11px !important; letter-spacing:.4px !important; text-transform:none !important;
  border:0 !important; border-bottom:3px solid transparent !important;
  background:transparent !important;
}
.sb-tab svg{ opacity:.75 !important; }
.sb-tab:hover{ color:var(--ok-ink) !important; background:#fff !important; }
.sb-tab.active{
  color:var(--gel-gold-ink) !important;
  background:#fff !important;
  border-bottom-color:var(--gel-gold-rim) !important;
}
.sb-tab.active svg{ opacity:1 !important; }
.sb-body{ background:transparent !important; }
.sec{
  color:var(--ok-ink) !important;
  font-family:var(--cs-font) !important; font-weight:900 !important;
  font-size:13px !important; letter-spacing:0 !important; text-transform:none !important;
}
.sec svg{ color:var(--gel-gold-rim) !important; }
.f label, .sb-panel label{
  color:var(--ok-ink-soft) !important; font-family:var(--cs-font) !important; font-weight:700 !important;
}
.sb-panel input[type=text], .sb-panel textarea, .sb-panel select{
  background:#fff !important; color:var(--ok-ink) !important;
  border:1.5px solid var(--ok-line) !important; border-radius:10px !important;
  font-family:var(--cs-font) !important;
}
.tog + label, .sb-panel .row{ color:var(--ok-ink-soft) !important; }
.back-to-menu-btn{
  background:#fff !important; border:1px solid var(--ok-line) !important;
  color:var(--ok-ink-soft) !important;
}

/* ── the assistant recall button ── */
#okAsk{
  width:38px; height:38px; border-radius:11px; cursor:pointer;
  border:1px solid rgba(43,39,64,.09);
  background:linear-gradient(180deg,#fff3d2 0%,#ffd98a 52%,#f6c86a 53%,#eeb948 100%);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.95), 0 3px 0 var(--gel-gold-rim);
  display:grid; place-items:center; padding:0;
  transition:transform .12s, filter .12s;
}
#okAsk img{ width:26px; height:26px; }
#okAsk:hover{ filter:brightness(1.05); transform:translateY(-1px); }
#okAsk:active{ transform:translateY(2px); box-shadow:inset 0 2px 0 rgba(255,255,255,.9), 0 1px 0 var(--gel-gold-rim); }
