/* DROP OS — richer surfaces and purposeful motion, shared by both panels. */
body.dropos-workspace {
  --dw-edge: #49303b;
  --dw-accent: #ff3656;
  background: #090b10;
}
body.dropos-workspace .app > main {
  background: radial-gradient(ellipse 850px 470px at 12% 0%, #e41d3510, transparent 75%), #0b0d12;
}
body.dropos-workspace .main-top {
  background: linear-gradient(110deg, #331520 0%, #17141e 32%, #11141c 75%);
  border-bottom-color: #5b2735;
  box-shadow: 0 8px 30px #0002;
}
body.dropos-workspace #pageTitle { font-weight: 720; }
body.dropos-workspace[data-panel=platform] .view > .top {
  border-bottom-color: #58303e;
  background: radial-gradient(ellipse at 10% 0%, #ed25491a, transparent 65%);
}
body.dropos-workspace :is(.sidebar, #side) {
  background: linear-gradient(175deg, #20121c 0, #11131b 230px, #101219 80%);
  border-right-color: #37303c;
}
body.dropos-workspace :is(.side-brand, #side > .brand) { border-bottom: 1px solid #ffffff06; }
body.dropos-workspace :is(.side-brand .dot, #side > .brand img) { filter: drop-shadow(0 3px 12px #ff143345) !important; }
body.dropos-workspace :is(.side-foot, #side > .me) { background: #11131a; }
body.dropos-workspace[data-panel] :is(.side-nav .tab-btn.active, .side-nav .tab-btn.me-grupo-on, #nav > button.on) {
  background: linear-gradient(105deg, #b31d38 0%, #571c2e 65%, #351924 100%) !important;
  border-color: #e436555e !important;
  box-shadow: inset 3px 0 #ff526e, 0 4px 16px #c5173214 !important;
}
body.dropos-workspace[data-panel] :is(.side-nav .tab-btn, #nav > button) svg {
  transition: color 180ms ease, translate 220ms ease;
}
body.dropos-workspace[data-panel] :is(.tab-btn.active, .tab-btn.me-grupo-on, #nav > button.on) svg { color: #ffb6c2; }
body.dropos-workspace #meSub button.on {
  background: linear-gradient(125deg, #55303e, #282330);
  border-color: #845060;
  box-shadow: inset 0 1px #ffffff10, 0 3px 10px #0003;
}
/* Light catches the top of cards; the content remains on a calm, dark surface. */
body.dropos-workspace[data-panel=merchant] [id$=View] :is(.panel, .vg-card, .rt-card, .cfg-item, .of-preview, .push-option, .su-bd, .lk-main, .lk-side, .pl-list, .pl-drawer),
body.dropos-workspace[data-panel=platform] .view .card {
  background: linear-gradient(145deg, #1e202b 0%, #161921 46%, #13161e 100%) !important;
  border-color: #353747 !important;
  box-shadow: inset 0 1px #ffffff06, 0 8px 24px #0002 !important;
}
body.dropos-workspace[data-panel=merchant] #overviewContent .vg-kpis > .vg-kpi,
body.dropos-workspace[data-panel=merchant] #ordResumo .rz-card,
body.dropos-workspace[data-panel=merchant] [id$=View] :is(.acc-stat, .rt-stat),
body.dropos-workspace[data-panel=platform] .view .kpi {
  background: radial-gradient(ellipse at 100% 0, #ff365614, transparent 65%), linear-gradient(135deg, #252330, #151821 78%) !important;
  border-color: #47303e !important;
  border-top-color: #aa3e54 !important;
  box-shadow: inset 0 1px #ff75871a, 0 8px 22px #0003 !important;
}
body.dropos-workspace[data-panel=merchant] #overviewContent .vg-kpis > .vg-kpi:first-child,
body.dropos-workspace[data-panel=merchant] #ordResumo .rz-card:first-child,
body.dropos-workspace[data-panel=platform] .view .kpi.hot {
  background: radial-gradient(ellipse at 100% 0, #f5294630, transparent 72%), linear-gradient(130deg, #441d2d, #1e1925 72%) !important;
  border-color: #994052 !important;
  box-shadow: inset 0 1px #ffafbf1c, 0 12px 32px #850e2118 !important;
}
body.dropos-workspace[data-panel=merchant] #overviewContent .vg-kpi .k-ico,
body.dropos-workspace[data-panel=merchant] #ordResumo .rz-ic {
  background: linear-gradient(145deg, #622438, #361d2c);
  color: #ff8ca2;
  border: 1px solid #ab385149;
  border-radius: 10px;
  box-shadow: inset 0 1px #ffffff09;
}
body.dropos-workspace[data-panel=merchant] #overviewContent .vg-kpi.rev .k-val { color: #ffb2c0 !important; }
body.dropos-workspace[data-panel=merchant] #overviewContent .vg-card h3 { letter-spacing: -.02em !important; }
body.dropos-workspace[data-panel=merchant] #overviewContent .vg-pill.on { background: #632638; color: #fff; border-color: #ae4a60; }
body.dropos-workspace[data-panel=merchant] [id$=View] :is(.of-hero, .pl-top, .fin-hero, .mp-hero),
body.dropos-workspace[data-panel=merchant] #pxLista .pl-top {
  background: linear-gradient(112deg, #3e1b29, #181a24 65%) !important;
  border-color: #673142 !important;
}
body.dropos-workspace[data-panel=merchant] #pxLista .pl-row.on {
  background: linear-gradient(100deg, #512132, #221d28) !important;
  border-color: #9d3c55 !important;
}
body.dropos-workspace[data-panel] :is(.btn.brand, .btn.pri, .btn-primary),
body.dropos-workspace[data-panel=merchant] [id$=View] .btn.brand,
body.dropos-workspace[data-panel=merchant] #pxLista .pl-save {
  background: linear-gradient(110deg, #ff3958 0%, #f51e38 55%, #d20d2c 100%) !important;
  border-color: #ff4964 !important;
  box-shadow: inset 0 1px #ffffff2b, 0 5px 18px #eb123128 !important;
}
body.dropos-workspace[data-panel] :is(.btn, .btn-primary, .pl-save, .btn-atualizar) {
  transition: background-color 180ms, border-color 180ms, box-shadow 220ms, translate 200ms, filter 180ms;
}
body.dropos-workspace[data-panel=merchant] [id$=View] table tbody tr:hover,
body.dropos-workspace[data-panel=platform] .view table tbody tr:hover { background: #9f304019; }
body.dropos-workspace .dw-motion-card { transition: border-color 220ms ease, box-shadow 220ms ease, translate 240ms ease; }
body.dropos-workspace .dw-motion-chart { opacity: 1; }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  body.dropos-workspace[data-panel] :is(.side-nav .tab-btn, #nav > button):hover svg { translate: 2px 0; color: #ff9db0; }
  body.dropos-workspace[data-panel] .dw-motion-card:hover { border-color: #8a4558 !important; box-shadow: inset 0 1px #ffffff0b, 0 12px 28px #0003 !important; }
  body.dropos-workspace[data-panel] :is(.vg-kpi, .rz-card, .kpi).dw-motion-card:hover { translate: 0 -3px; }
  body.dropos-workspace[data-panel] :is(.btn, .btn-primary, .pl-save, .btn-atualizar):not(:disabled):hover { translate: 0 -2px; }
  body.dropos-workspace[data-panel] :is(.btn.brand, .btn.pri, .btn-primary):not(:disabled):hover { box-shadow: inset 0 1px #ffffff30, 0 8px 26px #f51e3845 !important; }
  body.dropos-workspace[data-panel] :is(.btn, .btn-primary, .pl-save, .btn-atualizar):not(:disabled):active { translate: 0 0; }
}
@media (prefers-reduced-motion:no-preference) {
  body.dropos-workspace #vivoSelo #vivoPonto,
  body.dropos-workspace[data-panel=platform] .view .live { animation: dw-live-breathe 2.8s ease-in-out infinite !important; }
  body.dropos-workspace[data-panel] :is(.modal-bg.active .modal, #rcPixModal[open]) { animation: dw-dialog-in 280ms cubic-bezier(.2,.8,.2,1); }
  body.dropos-workspace[data-panel=merchant] #overviewContent .vg-globe .pt { animation: dw-live-breathe 3.4s ease-in-out infinite !important; }
  body.dropos-workspace[data-panel=merchant] #overviewContent .vg-globe .pt:nth-of-type(2n) { animation-delay: 1.2s !important; }
}
@keyframes dw-live-breathe { 0%,100% { opacity: .65; } 50% { opacity: 1; } }
@keyframes dw-dialog-in { from { opacity: .4; translate: 0 12px; } to { opacity: 1; translate: 0 0; } }
body.dropos-workspace.dw-motion-paused *,
body.dropos-workspace.dw-motion-paused *::before,
body.dropos-workspace.dw-motion-paused *::after { animation-play-state: paused !important; }
@media(max-width:820px) {
  body.dropos-workspace .main-top { background: linear-gradient(110deg, #301521, #12151d 85%); }
  body.dropos-workspace[data-panel] .dw-motion-card { box-shadow: inset 0 1px #ffffff08, 0 4px 12px #0002 !important; }
}
@media(prefers-reduced-motion:reduce) {
  body.dropos-workspace *, body.dropos-workspace *::before, body.dropos-workspace *::after {
    animation: none !important; transition: none !important; scroll-behavior: auto !important;
  }
}
