/* OA VIDEO CP Production Dashboard UI */
:root{
  --oa-bg:#071126;
  --oa-bg-2:#0d1b36;
  --oa-panel:rgba(255,255,255,.92);
  --oa-panel-soft:rgba(255,255,255,.78);
  --oa-text:#0f172a;
  --oa-muted:#64748b;
  --oa-border:rgba(15,23,42,.09);
  --oa-blue:#0ea5e9;
  --oa-blue-2:#2563eb;
  --oa-green:#16a34a;
  --oa-red:#dc2626;
  --oa-amber:#d97706;
  --oa-shadow:0 20px 60px rgba(2,6,23,.18);
  --oa-radius:22px;
}
html{scroll-behavior:smooth;}
body{
  background:
    radial-gradient(circle at 18% 0%, rgba(14,165,233,.28), transparent 34%),
    radial-gradient(circle at 82% 10%, rgba(37,99,235,.24), transparent 30%),
    linear-gradient(135deg,var(--oa-bg),var(--oa-bg-2) 48%,#081224) !important;
  color:var(--oa-text);
  min-height:100vh;
}
body::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:-1;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.8), transparent 80%);
}
.app,.shell,.app-shell,.dashboard-shell{min-height:100vh;}
.sidebar,aside.nav,nav.sidebar,.side-nav{
  background:linear-gradient(180deg,rgba(4,12,30,.96),rgba(8,24,52,.96)) !important;
  border-right:1px solid rgba(255,255,255,.1) !important;
  box-shadow:12px 0 38px rgba(0,0,0,.22);
}
.sidebar a,.side-nav a,aside.nav a,nav.sidebar a,.nav-link{
  border-radius:15px !important;
  transition:transform .16s ease, background .16s ease, box-shadow .16s ease, color .16s ease;
}
.sidebar a:hover,.side-nav a:hover,aside.nav a:hover,nav.sidebar a:hover,.nav-link:hover{
  transform:translateX(3px);
  background:rgba(14,165,233,.16) !important;
}
.sidebar a.active,.side-nav a.active,aside.nav a.active,nav.sidebar a.active,.nav-link.active{
  background:linear-gradient(135deg,var(--oa-blue),var(--oa-blue-2)) !important;
  color:#fff !important;
  box-shadow:0 12px 26px rgba(14,165,233,.28);
}
main,.content,.main,.page,.dashboard-main{background:transparent !important;}
.page-head,.topbar,.header,.dashboard-header{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.11);
  box-shadow:0 20px 50px rgba(0,0,0,.16);
  backdrop-filter:blur(18px);
  border-radius:24px;
  padding:20px 22px;
  margin-bottom:22px;
}
.page-head h1,.section h1{letter-spacing:-.04em;color:#fff !important;font-weight:900;}
.page-head p,.section>.page-head p{color:rgba(255,255,255,.78) !important;max-width:860px;}
.card,.panel,.box,.module,.tenant-card,.audit-row,.sim-window,.upload-panel,.runtime-box{
  background:var(--oa-panel) !important;
  border:1px solid var(--oa-border) !important;
  border-radius:var(--oa-radius) !important;
  box-shadow:var(--oa-shadow) !important;
  overflow:hidden;
}
.card,.panel,.box,.module{position:relative;}
.card::before,.panel::before,.box::before,.module::before{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg,var(--oa-blue),var(--oa-blue-2),#7dd3fc);
  opacity:.88;
}
.card h2,.card h3,.panel h2,.panel h3{letter-spacing:-.025em;color:#0f172a;font-weight:850;}
.card-head{gap:14px;align-items:center;}
.muted,small,.help-text{color:var(--oa-muted) !important;}
.btn,button.btn,a.btn,.button,[type="button"],[type="submit"]{
  border:0 !important;border-radius:14px !important;font-weight:800 !important;
  letter-spacing:-.01em;box-shadow:0 12px 24px rgba(37,99,235,.18);
  transition:transform .14s ease, box-shadow .14s ease, filter .14s ease, opacity .14s ease;
}
.btn:not(.secondary):not(.danger):not(.success),button.btn:not(.secondary):not(.danger):not(.success),a.btn:not(.secondary):not(.danger):not(.success){
  background:linear-gradient(135deg,var(--oa-blue),var(--oa-blue-2)) !important;color:#fff !important;
}
.btn:hover,button:hover,a.btn:hover{transform:translateY(-1px);filter:saturate(1.08);box-shadow:0 16px 34px rgba(37,99,235,.26);}
.btn:active,button:active,a.btn:active{transform:translateY(0);}
.btn.secondary,button.secondary,a.secondary,.btn.small.secondary{background:#eaf4ff !important;color:#0f3a65 !important;box-shadow:none;}
.btn.success,button.success{background:linear-gradient(135deg,#22c55e,#16a34a) !important;color:#fff !important;}
.btn.danger,button.danger{background:linear-gradient(135deg,#ef4444,#dc2626) !important;color:#fff !important;}
button[disabled],.btn[disabled],.oa-disabled{opacity:.55 !important;cursor:not-allowed !important;transform:none !important;filter:grayscale(.15);}
input,select,textarea{
  border:1px solid #dbe4f0 !important;border-radius:14px !important;background:#fff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8);transition:border .15s ease, box-shadow .15s ease;
}
input:focus,select:focus,textarea:focus{outline:none !important;border-color:#38bdf8 !important;box-shadow:0 0 0 4px rgba(14,165,233,.15) !important;}
.copy-row{background:#f8fbff;border:1px solid #e5eef9;border-radius:16px;padding:8px;gap:8px;}
.copy-row code,code{background:#eef6ff;color:#0f2a4a;border-radius:10px;padding:4px 7px;}
.badge,.pill,.status-pill{border-radius:999px !important;font-weight:850;padding:7px 11px;background:#e0f2fe;color:#075985;border:1px solid #bae6fd;}
.badge.live,.status-live,.online{background:#dcfce7!important;color:#166534!important;border-color:#bbf7d0!important;}
.badge.offline,.status-offline,.offline{background:#fee2e2!important;color:#991b1b!important;border-color:#fecaca!important;}
.video-wrap,.player-card,.preview-card,.live-preview{border-radius:24px!important;overflow:hidden;background:#030712!important;box-shadow:0 22px 60px rgba(0,0,0,.28)!important;}
video,iframe{max-width:100%;border-radius:18px;}
pre,.log-box{
  border-radius:18px!important;background:#071126!important;color:#dbeafe!important;border:1px solid rgba(125,211,252,.14)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);font-size:12px;line-height:1.55;
}
/* Production mode: hide development/debug notes from the dashboard without removing useful operational controls. */
[data-dev-note],.dev-note,.developer-note,.debug-note,.stage-note,.build-note,.internal-note,.lab-note{display:none!important;}
.card:has(.developer-note),.card:has(.debug-note){display:none!important;}
.oa-dev-hidden{display:none!important;}
.oa-toast{
  position:fixed;right:22px;bottom:22px;z-index:99999;max-width:min(420px,calc(100vw - 32px));
  background:rgba(8,24,52,.96);color:#fff;border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:13px 16px;
  box-shadow:0 24px 70px rgba(0,0,0,.32);transform:translateY(12px);opacity:0;transition:opacity .18s ease, transform .18s ease;
}
.oa-toast.show{opacity:1;transform:translateY(0);}
.oa-loading{position:relative;pointer-events:none;opacity:.72;}
.oa-loading::after{content:"";width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;display:inline-block;margin-left:8px;vertical-align:-2px;animation:oaSpin .75s linear infinite;}
@keyframes oaSpin{to{transform:rotate(360deg)}}
.section{animation:oaFade .18s ease-out;}
@keyframes oaFade{from{opacity:.72;transform:translateY(4px)}to{opacity:1;transform:none}}
.settings-grid,.boost-grid,.two-col{gap:18px!important;}
.media-grid{gap:16px!important;}
.list .item,.playlist-row,.media-item{border-radius:18px!important;border:1px solid #e8eef7!important;background:#fff!important;box-shadow:0 10px 26px rgba(15,23,42,.06)!important;}
@media (max-width:900px){
  .page-head{border-radius:18px;padding:16px}.card{border-radius:18px!important}.two-col,.settings-grid{grid-template-columns:1fr!important}.head-actions,.row-actions,.control-buttons{flex-wrap:wrap;}
  .btn,button.btn,a.btn{width:auto;min-height:42px;}
}