/* OTTPROVIDERS Control V3.0.2 — approved dashboard + login refinement */
:root{
  --v302-navy:#0b1f3a;
  --v302-navy-deep:#07172d;
  --v302-ink:#0f2040;
  --v302-text:#3f5372;
  --v302-muted:#7a8ba6;
  --v302-line:#e2eaf4;
  --v302-canvas:#f6f8fc;
  --v302-blue:#1677ff;
  --v302-green:#20bf6b;
  --v302-orange:#ff8a1f;
  --v302-purple:#8b5cf6;
  --v302-red:#ef476f;
  --v302-shadow:0 8px 28px rgba(17,43,80,.065);
  --v302-shadow-hover:0 16px 36px rgba(17,43,80,.11);
}

/* Header: search lives on the RIGHT, beside user controls. */
body.v30-ui .app-header{height:70px!important;padding:0 24px!important;gap:12px!important;background:rgba(255,255,255,.97)!important;box-shadow:none!important}
body.v30-ui .app-header .header-title{flex:0 1 auto!important;min-width:160px!important;margin-right:auto!important}
body.v30-ui .v29-global-search{order:20!important;width:min(360px,31vw)!important;margin:0 10px 0 auto!important;flex:0 1 360px!important}
body.v30-ui .header-actions{order:30!important;margin-left:0!important;flex:0 0 auto!important}
body.v30-ui .v29-global-search form{height:42px!important;border:1px solid #dfe7f2!important;border-radius:12px!important;background:#f8fafe!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important}
body.v30-ui .v29-global-search input{font-size:12px!important;padding-right:44px!important}
body.v30-ui .v29-global-search:focus-within form{background:#fff!important;border-color:#b9d6fb!important;box-shadow:0 0 0 3px rgba(22,119,255,.08)!important}

/* Sidebar closer to approved mockup. */
body.v30-ui .app-sidebar{width:255px!important;background:linear-gradient(180deg,#0c223f 0%,#07182e 100%)!important;border-right:0!important;box-shadow:10px 0 34px rgba(8,27,52,.08)!important}
body.v30-ui .app-shell{margin-left:255px!important}
body.v30-ui .app-brand{min-height:82px!important;padding:0 22px!important;border-bottom:1px solid rgba(255,255,255,.07)!important}
body.v30-ui .app-nav{padding:14px 11px 110px!important}
body.v30-ui .app-nav a{min-height:43px!important;margin:2px 0!important;padding:0 14px!important;border:1px solid transparent!important;border-radius:11px!important;font-size:12px!important;font-weight:650!important}
body.v30-ui .app-nav a.active{background:linear-gradient(90deg,rgba(22,119,255,.26),rgba(22,119,255,.12))!important;border-color:rgba(76,157,255,.35)!important;box-shadow:inset 2px 0 #2f8cff,0 7px 18px rgba(0,0,0,.08)!important}
body.v30-ui .sidebar-license{left:14px!important;right:14px!important;bottom:14px!important;border-radius:14px!important;background:rgba(255,255,255,.045)!important}

body.v30-ui .app-main{width:100%!important;max-width:none!important;padding:34px 30px 46px!important;background:var(--v302-canvas)!important}
body.v30-ui .app-footer{margin-top:26px!important;background:transparent!important;border:0!important;padding:12px!important}

/* Dashboard header. */
.v302-dashboard-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin:0 0 20px}
.v302-kicker{display:block;margin-bottom:7px;color:#5c7090;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.v302-dashboard-head h1{margin:0;color:var(--v302-ink);font-size:30px;line-height:1.05;font-weight:820;letter-spacing:-.045em}
.v302-dashboard-head p{margin:7px 0 0;color:#6f82a0;font-size:13px}
.v302-date-card{min-width:230px;display:flex;align-items:center;gap:11px;padding:11px 14px;border:1px solid var(--v302-line);border-radius:12px;background:#fff;color:#405574;box-shadow:0 3px 12px rgba(25,55,90,.03)}
.v302-date-card>i{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:#f0f5fc;color:#315981}
.v302-date-card span{display:flex;flex-direction:column}.v302-date-card strong{font-size:11px;color:#233a59}.v302-date-card small{margin-top:2px;font-size:9.5px;color:#8a99ad}

/* KPI cards — exact approved feel, fully clickable + draggable. */
.v302-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.v302-kpi{position:relative;min-height:124px;display:grid;grid-template-columns:54px minmax(0,1fr);grid-template-rows:auto auto;gap:0 14px;padding:17px 18px;overflow:hidden;border:1px solid var(--v302-line);border-radius:16px;color:inherit;background:#fff;box-shadow:var(--v302-shadow);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.v302-kpi::after{content:"";position:absolute;right:-28px;bottom:-50px;width:175px;height:105px;border-radius:50% 50% 0 0;background:currentColor;opacity:.065;transform:rotate(-10deg)}
.v302-kpi:hover{color:inherit;transform:translateY(-2px);box-shadow:var(--v302-shadow-hover)}
.v302-kpi-icon{grid-row:1/span 2;width:54px;height:54px;display:grid;place-items:center;border-radius:16px;font-size:21px;color:#fff;box-shadow:0 9px 20px currentColor}
.v302-kpi>div{min-width:0;display:flex;flex-direction:column}.v302-kpi>div>span{font-size:12px;font-weight:720;color:#29415f}.v302-kpi>div>strong{margin:2px 0 4px;font-size:26px;line-height:1;color:#10213e;letter-spacing:-.04em}.v302-kpi>div>small{font-size:9.5px;color:#7d8ea7}.v302-kpi>div>small b{color:#1aa859}
.v302-kpi-link{grid-column:2;align-self:end;margin-top:8px;font-size:9.8px;font-weight:700;color:#426487}.v302-kpi-link i{margin-left:5px;font-size:8px}
.v302-kpi-blue{color:#267cf0;background:linear-gradient(135deg,#fff 10%,#f2f8ff 100%)}.v302-kpi-blue .v302-kpi-icon{background:linear-gradient(145deg,#4997ff,#176df0)}
.v302-kpi-green{color:#20b56d;background:linear-gradient(135deg,#fff 10%,#f0fff7 100%)}.v302-kpi-green .v302-kpi-icon{background:linear-gradient(145deg,#55d992,#13a85f)}
.v302-kpi-orange{color:#ff8a1f;background:linear-gradient(135deg,#fff 10%,#fff7ee 100%)}.v302-kpi-orange .v302-kpi-icon{background:linear-gradient(145deg,#ffab54,#f27a0d)}
.v302-kpi-purple{color:#925df1;background:linear-gradient(135deg,#fff 10%,#f8f2ff 100%)}.v302-kpi-purple .v302-kpi-icon{background:linear-gradient(145deg,#b98bf9,#8450e8)}

/* Drag handles */
.v302-drag-handle{position:absolute;z-index:5;top:9px;right:9px;width:26px;height:26px;padding:0;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;color:#a4b1c2;font-size:10px;cursor:grab;opacity:0;transition:.15s ease}
.v302-kpi:hover .v302-drag-handle,.v302-widget:hover .v302-drag-handle{opacity:1}.v302-drag-handle:hover{background:#eef4fc;color:#537191}.v302-drag-handle:active{cursor:grabbing}.v302-dragging{opacity:.45!important;transform:scale(.985)!important}.v302-drag-over{outline:2px dashed rgba(22,119,255,.3);outline-offset:3px}

/* 12-column dashboard: varied widget sizes, like approved mockup. */
.v302-widget-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px;align-items:start}
.v302-widget{position:relative;min-width:0;overflow:hidden;border:1px solid var(--v302-line);border-radius:16px;background:#fff;box-shadow:var(--v302-shadow)}
.v302-span-3{grid-column:span 3}.v302-span-6{grid-column:span 6}
.v302-widget-head{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border-bottom:1px solid #edf2f8}
.v302-widget-head>div{min-width:0;display:flex;align-items:center;gap:10px}.v302-widget-head h2{margin:0;color:#10213e;font-size:14px;font-weight:800;letter-spacing:-.025em}.v302-widget-head p{margin:2px 0 0;color:#8292a8;font-size:9.5px}.v302-widget-head a{white-space:nowrap;color:#0873ed;font-size:9.5px;font-weight:700}.v302-widget-head>a i{margin-left:4px;font-size:8px}
.v302-title-icon,.v302-row-icon,.v302-timeline-icon{display:grid;place-items:center;flex:0 0 auto}.v302-title-icon{width:34px;height:34px;border-radius:10px;font-size:13px}.v302-title-icon.blue,.v302-row-icon.blue,.v302-timeline-icon.blue{background:#eaf3ff;color:#1677ff}.v302-title-icon.green,.v302-row-icon.green,.v302-timeline-icon.green{background:#eafaf2;color:#18ae66}.v302-title-icon.orange,.v302-row-icon.orange,.v302-timeline-icon.orange{background:#fff3e5;color:#f58a1f}.v302-title-icon.purple,.v302-row-icon.purple,.v302-timeline-icon.purple{background:#f2ebff;color:#8a56e8}.v302-title-icon.red,.v302-row-icon.red,.v302-timeline-icon.red{background:#fff0f3;color:#e94b70}.v302-row-icon.slate,.v302-timeline-icon.slate{background:#eef2f7;color:#60738f}

/* Overview chart */
.v302-overview{min-height:322px}.v302-chart-metrics{display:flex;align-items:center;gap:22px;padding:11px 17px 0;color:#677c98;font-size:9.8px}.v302-chart-metrics span{display:flex;align-items:center;gap:6px}.v302-chart-metrics i{width:7px;height:7px;border-radius:50%}.v302-chart-metrics i.blue{background:#1677ff}.v302-chart-metrics i.green{background:#18ae66}.v302-chart-metrics i.orange{background:#f58a1f}.v302-chart-metrics b{margin-left:2px;color:#16304f;font-size:11px}.v302-chart-wrap{height:230px;padding:5px 12px 10px}.v302-chart-wrap canvas{width:100%!important;height:100%!important;display:block}

/* Billing */
.v302-billing-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:13px}.v302-billing-grid>div{min-height:72px;padding:12px;border:1px solid #edf2f8;border-radius:11px;background:#fafcff}.v302-billing-grid span{display:block;margin-bottom:5px;color:#8191a8;font-size:9px}.v302-billing-grid strong{color:#10213e;font-size:17px}.v302-billing-grid .green{background:#f3fff8}.v302-billing-grid .purple{background:#f8f4ff}.v302-billing-grid .slate{background:#f7f9fc}.v302-billing-footer{margin:0 13px 13px;min-height:43px;display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;padding:7px 10px;border-radius:10px;background:#edf6ff;color:#2d5f96;font-size:9.5px}.v302-billing-footer>i:first-child{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#fff;color:#1677ff}.v302-billing-footer b{display:block;color:#2163a7}

/* Timeline/activity */
.v302-timeline{position:relative;padding:10px 14px 13px}.v302-timeline::before{content:"";position:absolute;left:30px;top:21px;bottom:20px;width:1px;background:#e5ecf5}.v302-timeline-item{position:relative;z-index:1;min-height:48px;display:flex;align-items:center;gap:10px}.v302-timeline-icon{width:33px;height:33px;border-radius:50%;box-shadow:0 0 0 4px #fff}.v302-timeline-item>div{min-width:0;display:flex;flex-direction:column}.v302-timeline-item strong{overflow:hidden;color:#243a57;font-size:10.5px;text-overflow:ellipsis;white-space:nowrap}.v302-timeline-item small{margin-top:2px;color:#8a99ad;font-size:8.8px}

/* Standard widget lists */
.v302-list{padding:7px 14px 10px}.v302-list-row{min-height:50px;display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;border-bottom:1px solid #eff3f8;color:inherit}.v302-list-row:last-child{border:0}.v302-list a.v302-list-row:hover{margin-inline:-6px;padding-inline:6px;border-radius:9px;background:#f8fbff;color:inherit}.v302-row-icon{width:32px;height:32px;border-radius:50%;font-size:11px}.v302-list-row>div{min-width:0;display:flex;flex-direction:column}.v302-list-row strong{overflow:hidden;color:#233955;font-size:10.5px;text-overflow:ellipsis;white-space:nowrap}.v302-list-row small{margin-top:2px;color:#8797ac;font-size:8.7px}.v302-row-value{display:flex;align-items:flex-end;flex-direction:column;text-align:right}.v302-row-value b{font-size:10px;color:#1d3654}.v302-row-value.warning b{color:#ef7d12}

/* Support */
.v302-support-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:12px}.v302-support-stats>div{display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;align-items:center;padding:8px;border-radius:11px;background:#f9fbfe}.v302-support-stats>div>span{grid-row:1/span 2;width:31px;height:31px;display:grid;place-items:center;border-radius:50%;font-size:11px}.v302-support-stats>div>span.red{background:#fff0f2;color:#ee4a6e}.v302-support-stats>div>span.blue{background:#edf5ff;color:#1677ff}.v302-support-stats>div>span.green{background:#eafaf2;color:#17ae66}.v302-support-stats strong{font-size:15px;color:#112847}.v302-support-stats small{font-size:8px;color:#8494aa}.v302-ticket-mini{padding:0 12px 10px}.v302-ticket-mini a{min-height:42px;display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:7px;border-top:1px solid #eef3f8;color:inherit}.v302-ticket-mini>a>span{font-size:10px;font-weight:800;color:#1677ff}.v302-ticket-mini div{display:flex;min-width:0;flex-direction:column}.v302-ticket-mini strong{overflow:hidden;font-size:9.8px;color:#263d5b;text-overflow:ellipsis;white-space:nowrap}.v302-ticket-mini small{font-size:8.3px;color:#8a99ad}.v302-ticket-mini em{padding:3px 6px;border-radius:999px;background:#edf5ff;color:#1c66bd;font-size:7.5px;font-style:normal;font-weight:800}

/* Automation */
.v302-auto-list{padding:8px 14px}.v302-auto-list>div{min-height:37px;display:grid;grid-template-columns:25px 1fr auto;align-items:center;border-bottom:1px solid #eef3f8}.v302-auto-list i{color:#55708f;font-size:10px}.v302-auto-list span{font-size:9.7px;color:#4a5f7b}.v302-auto-list b{font-size:10px;color:#1d3654}.v302-cron-state{margin:0 13px 12px;display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:5px;padding:8px 10px;border-radius:10px;font-size:8.7px}.v302-cron-state.ok{background:#edf9f3;color:#2f6f50}.v302-cron-state.warn{background:#fff5e9;color:#8d6229}.v302-cron-state b{font-size:8px;white-space:nowrap}

/* Team */
.v302-admin-list{padding:7px 14px 11px}.v302-admin-list>div{min-height:48px;display:grid;grid-template-columns:35px 1fr auto;align-items:center;gap:8px;border-bottom:1px solid #eef3f8}.v302-admin-list>div:last-child{border:0}.v302-admin-avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#2e9cff,#1677ff);color:#fff;font-size:11px;font-weight:800}.v302-admin-list>div>div{display:flex;flex-direction:column}.v302-admin-list strong{font-size:10.5px;color:#203a59}.v302-admin-list small{font-size:8.5px;color:#8797ac}.v302-admin-list em{display:inline-flex;align-items:center;gap:4px;padding:4px 7px;border-radius:999px;background:#eafaf2;color:#15965b;font-size:7.8px;font-style:normal;font-weight:800}.v302-admin-list em i{width:5px;height:5px;border-radius:50%;background:#20bf6b}

/* Journal */
.v302-journal{padding:7px 14px 11px}.v302-journal>div{min-height:49px;display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:9px;border-bottom:1px solid #eef3f8}.v302-journal>div:last-child{border:0}.v302-journal>div>div{min-width:0;display:flex;flex-direction:column}.v302-journal strong{overflow:hidden;font-size:10.5px;color:#233b59;text-overflow:ellipsis;white-space:nowrap}.v302-journal small{font-size:8.7px;color:#8494a9}.v302-journal time{font-size:8.3px;color:#8494aa;white-space:nowrap}

/* Alerts */
.v302-ok-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;background:#eafaf2;color:#16985b;font-size:8px;font-weight:800}.v302-system-ok,.v302-alert-list>div{min-height:66px;display:grid;grid-template-columns:36px 1fr;align-items:center;gap:10px;padding:10px 14px}.v302-system-ok strong,.v302-alert-list strong{font-size:10.5px;color:#236044}.v302-system-ok small,.v302-alert-list small{display:block;margin-top:3px;font-size:8.8px;color:#8090a5}.v302-alert-list>div{border-bottom:1px solid #eef3f8}.v302-empty{padding:22px;color:#8a99ad;font-size:10px;text-align:center}.v302-layout-note{display:flex;align-items:center;justify-content:center;gap:7px;margin:14px 0 0;color:#91a0b2;font-size:8.8px}

/* Login — clean premium two-panel layout, no stretching. */
body.login-page{min-height:100vh!important;padding:28px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:radial-gradient(circle at 86% 9%,rgba(22,119,255,.08),transparent 25%),#f5f8fd!important}
body.login-page .login-shell{width:min(1060px,100%)!important;min-height:620px!important;height:auto!important;display:grid!important;grid-template-columns:minmax(440px,.96fr) minmax(460px,1.04fr)!important;overflow:hidden!important;border:1px solid #dce6f2!important;border-radius:24px!important;background:#fff!important;box-shadow:0 32px 90px rgba(15,42,75,.15)!important}
body.login-page .login-visual{position:relative;min-height:620px!important;padding:50px!important;overflow:hidden!important;background:radial-gradient(circle at 10% 8%,rgba(38,132,255,.38),transparent 28%),linear-gradient(150deg,#0d2749 0%,#07182e 75%)!important}
body.login-page .login-visual::after{content:"";position:absolute;right:-120px;bottom:-170px;width:430px;height:430px;border:55px solid rgba(255,255,255,.05);border-radius:50%}
body.login-page .login-visual h1{position:relative;z-index:1;max-width:430px!important;margin:16px 0 14px!important;color:#fff!important;font-size:38px!important;line-height:1.1!important;letter-spacing:-.05em!important}
body.login-page .login-visual p{position:relative;z-index:1;max-width:430px!important;color:#91a9c6!important;font-size:12px!important;line-height:1.75!important}
body.login-page .visual-trust{position:relative;z-index:1;display:flex!important;gap:20px!important;color:#bdcee2!important}.visual-trust i{color:#49d49e!important}
body.login-page .login-panel{min-height:620px!important;padding:50px 58px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:#fff!important}
body.login-page .login-card{width:min(420px,100%)!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
body.login-page .login-card h2{margin:7px 0 7px!important;color:#10213e!important;font-size:29px!important;line-height:1.1!important;letter-spacing:-.04em!important}.login-card>p{margin:0 0 25px!important;color:#7c8da5!important;font-size:11.5px!important}.login-card label{display:block!important;margin:15px 0 7px!important;color:#415775!important;font-size:10.5px!important;font-weight:750!important}.login-card .input-icon{height:49px!important;border:1px solid #d8e3ef!important;border-radius:11px!important;background:#f7faff!important}.login-card .input-icon input{height:47px!important;color:#203956!important;font-size:12px!important;background:transparent!important}.login-card .input-icon i{color:#8296af!important}.login-card .btn-wide{margin-top:20px!important;min-height:49px!important;border-radius:11px!important;background:linear-gradient(135deg,#2f8cff,#1677ff)!important;box-shadow:0 12px 25px rgba(22,119,255,.23)!important}.login-help{margin-top:16px!important;color:#94a1b3!important;font-size:9.5px!important}

/* Small global polish to remove tiny inconsistencies. */
body.v30-ui .card,body.v30-ui .modal-card{border-color:#e1e9f3!important;box-shadow:0 6px 24px rgba(17,43,80,.055)!important}
body.v30-ui input,body.v30-ui select,body.v30-ui textarea{border-color:#d9e4ef!important}
body.v30-ui table th{font-size:9.5px!important}body.v30-ui table td{font-size:11.5px!important}

@media(max-width:1280px){
  .v302-widget-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.v302-span-6{grid-column:span 6}.v302-span-3{grid-column:span 3}
  .v302-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.v30-ui .v29-global-search{width:min(300px,28vw)!important;flex-basis:300px!important}
}
@media(max-width:980px){
  body.v30-ui .app-sidebar{width:245px!important;transform:translateX(-105%)}body.v30-ui .app-sidebar.open{transform:translateX(0)!important}body.v30-ui .app-shell{margin-left:0!important}
  .v302-widget-grid{grid-template-columns:1fr}.v302-span-3,.v302-span-6{grid-column:auto}.v302-overview{min-height:300px}.v302-chart-wrap{height:215px}
  .v302-dashboard-head{align-items:flex-start}.v302-date-card{display:none}
  body.v30-ui .v29-global-search{width:min(300px,38vw)!important}
  body.login-page{padding:20px!important}body.login-page .login-shell{grid-template-columns:1fr!important;max-width:620px!important}body.login-page .login-visual{display:none!important}body.login-page .login-panel{min-height:600px!important;padding:45px 34px!important}
}
@media(max-width:720px){
  body.v30-ui .v29-global-search{display:none!important}.v302-kpi-grid{grid-template-columns:1fr}.v302-dashboard-head h1{font-size:26px}.v302-dashboard-head p{font-size:11.5px}.v302-widget-head{align-items:flex-start}.v302-widget-head>a{margin-top:2px}.v302-support-stats{grid-template-columns:1fr}.v302-billing-grid{grid-template-columns:1fr 1fr}
  body.v30-ui .app-main{padding:23px 14px 34px!important}
  body.login-page{padding:0!important}body.login-page .login-shell{min-height:100vh!important;border:0!important;border-radius:0!important}body.login-page .login-panel{min-height:100vh!important;padding:36px 22px!important}
}
