/*
 * Ads Control Center — Soft UI Dashboard Tailwind adaptation.
 * Design tokens, gradients and shadows adapted from the supplied Creative Tim
 * template (MIT). Full notice: /soft-ui/LICENSE.txt.
 * Scoped component styles preserve the existing application's behavior.
 */
:root {
  --bg:#f8f9fa; --surface:#fff; --ink:#344767; --muted:#67748e;
  --line:#e9ecef; --blue:#8a239c; --nav:#344767; --radius:16px;
  --shadow:0 20px 27px 0 rgba(0,0,0,.05);
  --soft-accent:linear-gradient(310deg,#7928ca,#ff0080);
  --soft-dark:linear-gradient(310deg,#141727,#3a416f);
  --soft-icon:0 .3125rem .625rem 0 rgba(0,0,0,.12);
}
body{background:var(--bg);color:var(--ink);font-family:"Open Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button{border-color:#dfe3ea;border-radius:10px;font-weight:650;transition:box-shadow .18s,background .18s,transform .18s}
button:hover{border-color:#cbd3da;background:#fff;box-shadow:0 4px 7px -1px #00000012}
button.primary,.report-toolbar .registration-action{background:var(--soft-accent);border-color:transparent;color:white;box-shadow:0 4px 7px -1px #9e26992b}
button.primary:hover{background:var(--soft-accent);box-shadow:0 7px 14px #9e269930;transform:translateY(-1px)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:#a941ba;outline-offset:3px}
aside{inset:16px auto 16px 16px;width:224px;height:calc(100dvh - 32px);padding:22px 12px 12px;border:0;border-radius:18px;background:transparent;color:var(--muted)}
.brand{padding:0 12px 24px;margin:0 0 24px;border-bottom:1px solid #e1e4e9;color:#344767;font-size:18px;font-weight:750;gap:11px}
.brand-sub{font-size:9px;letter-spacing:3px;color:#67748e;margin-top:5px}
.brand-mark{width:37px;height:39px;border:0;border-radius:10px;background:var(--soft-dark);box-shadow:var(--soft-icon)}
.nav-label{color:#6d7890;font-size:10px;font-weight:750;letter-spacing:1.1px;margin:0 16px 12px}
.nav{gap:8px}
.nav button{padding:11px 12px;min-height:54px;gap:12px;color:#67748e;border:0;border-radius:12px;font-size:12px;font-weight:550;background:transparent;box-shadow:none}
.nav button:hover{color:#344767;background:#ffffff9e}
.nav button.active{background:#fff;color:#344767;box-shadow:var(--shadow);font-weight:750;border:0}
.nav-icon{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;border-radius:9px;background:white;color:#344767;box-shadow:var(--soft-icon)}
.nav-icon .ui-icon{width:17px;height:17px}
.nav button.active .nav-icon{background:var(--soft-accent);color:#fff}
.nav button.active .ui-icon{color:#fff}
.nav button:focus-visible{outline-color:#a941ba}
.foot{position:relative;isolation:isolate;overflow:hidden;background:var(--soft-dark);border:0;border-radius:14px;padding:18px 14px;box-shadow:var(--soft-icon);gap:11px}
.foot:before{content:"";position:absolute;inset:0;z-index:-1;background:url('/soft-ui/waves-white.svg') center/cover;opacity:.5;pointer-events:none}
.foot b{color:white;font-size:12px}.foot span{color:#d8dce9;font-size:10px}
.workspace-avatar{background:#ffffff20;color:#fff;border:1px solid #ffffff2b;border-radius:10px}
main{margin-left:256px;padding:27px 30px 38px;max-width:1800px}
.top{margin:0 0 16px;gap:20px}.eyebrow{color:#67748e;font-size:10px;letter-spacing:1.25px;font-weight:600}
h1{font-size:28px;line-height:1.25;color:#344767;font-weight:750;letter-spacing:-.85px;margin:7px 0}
h2,h3{color:#344767;font-weight:700}#sub{font-size:12px;color:#67748e;line-height:1.6}
.cloud-status{padding:0;margin:0 0 20px;border:0;font-size:11px;color:#67748e}
.owner-signin{color:#52607a;font-size:11px}.access-mode{gap:10px}.access-mode .badge{background:#fff;border-color:#e9ecef;border-radius:8px;box-shadow:0 2px 5px #00000004}
.card,.spend-table.card,.campaign-card{background:#fff;border-color:transparent;border-radius:16px;box-shadow:var(--shadow)}
.report-toolbar{box-shadow:var(--shadow);padding:16px 20px;border-radius:16px;margin-bottom:10px;gap:8px 18px}
.range-picker>summary{border-color:#dfe3e8;border-radius:11px;background:#fff;min-height:52px}
.range-picker>summary b{color:#344767}.range-picker[open]>summary{border-color:#b75dc7;box-shadow:0 0 0 3px #e9aede44}
.range-calendar{border-color:#e9ecef;box-shadow:0 16px 40px #34476724;border-radius:15px}
.range-grid .range-edge,.range-grid .range-edge:hover{background:var(--soft-accent);border-color:transparent;color:#fff}
.range-grid .range-between{background:#f6ebf8;color:#812193}.range-grid .range-day:hover{background:#f6ebf8;border-color:#ce9bd7}.range-grid .range-edge:hover{background:var(--soft-accent)}
.report-toolbar .date-presets{background:#f0f2f5;border-radius:10px;padding:4px}
.date-presets button{color:#67748e;border-radius:8px;font-size:11px;min-height:32px}
.date-presets button[aria-pressed=true]{background:#fff;color:#344767;box-shadow:0 3px 5px -1px #00000012}
.report-toolbar .filter-help summary{color:#67748e;font-size:10px}
.sync-status{color:#67748e;margin:8px 2px 16px;font-size:10px}.sync-status:before{color:#8b5998}
.dashboard-viewbar{border:0;gap:12px;margin-bottom:16px}
.dashboard-tabs{background:#eceff3;padding:4px;gap:4px;border-radius:12px}
.dashboard-tabs button{border:0;border-radius:9px;min-height:38px;padding:9px 17px;font-size:12px;color:#67748e}
.dashboard-tabs button[aria-pressed=true]{color:#344767;background:#fff;box-shadow:0 4px 7px -1px #00000010;font-weight:700;border:0}
.dashboard-tabs button:hover{background:#ffffff70;color:#344767}#dashboardViewNote{font-size:10px;padding:0}
.status-summary{padding:18px 20px;margin-bottom:18px;border:0;border-radius:16px;box-shadow:var(--shadow)}
.status-summary-head{margin-bottom:14px}.status-summary-heading h2{font-size:14px;color:#344767}
.status-summary-count{border-radius:7px;background:#f0f2f5;color:#5c6981;font-size:10px;padding:4px 8px}
.status-summary-link{color:#7d2d8b;background:#fbf5fc;border:1px solid #f0e2f2;min-height:32px;font-size:11px;border-radius:9px}
.status-summary-metrics{gap:12px;align-items:start}
.status-summary-metric{grid-template-columns:40px minmax(0,1fr);padding:14px;gap:0 12px;background:#f8f9fb;border:1px solid #edf0f4;border-radius:12px;min-height:108px;margin:0;text-align:left}
.status-summary-label{grid-column:2;grid-row:1;margin:0;align-self:end;font-size:12px;line-height:1.45;font-weight:700;color:#344767}
.status-summary-value{grid-row:1/3;color:#344767;font-size:27px;font-weight:750;letter-spacing:-1px}
.status-summary-value span{font-size:10px;color:#67748e;letter-spacing:0}
.status-summary-caption{font-size:10px;line-height:1.55;color:#67748e;grid-row:2;margin:4px 0 0}
.status-summary-disclosure{min-width:0;border:1px solid #e7eaf0;border-radius:12px;background:#f8f9fb;margin:0;overflow:hidden}
.status-summary-disclosure>summary{list-style:none;border:0;border-radius:11px;background:transparent;position:relative;padding-bottom:33px;min-height:108px;transition:background .15s}
.status-summary-disclosure>summary::-webkit-details-marker{display:none}
.status-summary-disclosure>summary:hover{background:#f1f3f8;color:#344767}
.status-summary-disclosure>summary:focus-visible{outline-offset:-3px}
.status-summary-prompt{display:flex;align-items:center;gap:7px;position:absolute;right:13px;bottom:10px;font-size:10px;line-height:1.2;font-weight:600;color:#67748e}
.status-chevron{display:block;width:6px;height:6px;border-bottom:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);margin:-3px 1px 0 3px;transition:transform .15s}
.status-summary-disclosure .when-open{display:none}
.status-summary-disclosure[open] .when-open{display:inline}.status-summary-disclosure[open] .when-closed{display:none}
.status-summary-disclosure[open] .status-chevron{transform:rotate(225deg);margin-top:3px}
.status-summary-accounts{margin:0 14px;padding:12px 0 14px;border-top:1px solid #e4e8ef}
.status-summary-accounts ul{gap:10px}.status-summary-accounts li{display:grid;grid-template-columns:minmax(40px,auto) minmax(0,1fr);gap:9px;font-size:11px;line-height:1.6}
.status-summary-accounts b{max-width:110px;color:#344767;font-weight:700}.status-summary-accounts li>span{color:#67748e}
.status-summary-accounts details{margin-top:10px}.status-summary-accounts summary{color:#79298c}
.status-summary-empty{font-size:11px;color:#67748e;padding:12px 0 14px;margin:0 14px;border-top:1px solid #e4e8ef}
.status-summary-foot{gap:10px 20px;margin-top:14px}.status-summary-explanation{font-size:10px;color:#67748e;max-width:420px}
.status-summary-time{font-size:10px;color:#67748e}.status-summary-time strong{color:#52607a;font-weight:600}
#dashboardReport .report-period,#dashboardReport .report-currency{color:#67748e;font-size:10px}
.metrics{gap:16px;margin-bottom:20px}
.metrics .metric.card{border:0;box-shadow:var(--shadow);border-radius:16px;padding:18px 20px;min-height:168px;background:#fff;position:relative}
.metric>small{font-size:12px;min-height:36px;font-weight:600;gap:8px;color:#67748e}
.metric strong{font-size:clamp(23px,1.95vw,31px);color:#344767;margin:10px 0 8px;letter-spacing:-.7px;font-weight:750}
.metric em{font-size:11px;line-height:1.55;color:#67748e}
.metric small .metric-icon{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border:0;margin:0;border-radius:10px;color:#fff;background:var(--soft-accent);box-shadow:var(--soft-icon)}
.metric-icon .ui-icon{width:19px;height:19px}
.metric small .metric-icon-leads{background:linear-gradient(310deg,#2152ff,#21d4fd)}
.metric small .metric-icon-cpr{background:var(--soft-dark)}
.metric small .metric-icon-registration{background:linear-gradient(310deg,#16866f,#48c7a6)}
.metric-registration.card{background:#fff;border:0}.metric-registration strong{color:#344767}.metric-registration small{color:#67748e}
.metric-qualifier{color:#67748e;font-weight:500;font-size:10px}
.metric .provisional{position:static;order:5;font-size:9px;margin-top:7px;padding:2px 6px;background:#f0f2f5;color:#5c6981;border:0}
.metric-cpr em{padding-right:0}.metric-explanation{margin:6px 0 0;padding:0}.metric-explanation summary{color:#8a239c;font-size:10px}
.spend-table.card{padding:22px 24px}.spend-table h2{font-size:15px}.spend-table>p{font-size:11px;color:#67748e;margin-bottom:18px}
.scroll{border:1px solid #f0f2f5;border-radius:12px;scrollbar-color:#cbd3da transparent}
th,.spend-table th{background:#fafbfc;color:#67748e;font-size:10px;font-weight:700;letter-spacing:.1px;padding:13px 16px}
td,.spend-table td{border-bottom-color:#edf0f4;color:#344767;font-size:12px;padding:14px 16px}
.spend-table td:nth-child(3){color:#344767;font-weight:700}.spend-table td small{color:#67748e;font-size:10px}
.spend-table tbody tr:hover,tbody tr:hover{background:#fcf9fd}
.table-slot,.spend-table .table-slot{background:#f2eaf7;color:#8a399c;width:28px;height:28px;border-radius:8px;font-weight:700}
.badge{border-radius:7px;background:#f0f2f5;color:#5e6b81;border-color:#e5e8ef}.badge.good{background:#e7f7ef;color:#227452;border-color:#d8ede2}.badge.bad{background:#fff0f2;color:#ad394c;border-color:#f6dce2}.badge.warn{background:#fff7e8;color:#94651a;border-color:#f4e7cc}
.campaign-card{padding:22px}.account-heading{gap:12px}.slot-mark{border:0;background:var(--soft-dark);color:#fff;box-shadow:var(--soft-icon);border-radius:11px}
.campaign-card .account-label{color:#67748e;font-size:11px}.campaign-card h2{color:#344767;font-size:15px}
.account-state,.account-meta,.account-meta summary,.delivery-note,.identifier{color:#67748e}
.campaign-summary{background:#f7f8fb;border-color:#edf0f5;border-radius:11px}.campaign-summary p{color:#67748e}
.ad-preview{border-color:#e9ecef;border-radius:12px}.ad-asset img,.ad-asset video{border-radius:9px;background:#f8f9fa}
.notice{background:#f5f3f8;color:#5e607a;border-color:#ebe5f0;border-radius:11px}
.status-unverified,.cloud-status.has-error{background:#f2f4f7;border-color:#e1e5eb;color:#59687b}
.dashboard-disclosure.card,.journey-section.card{background:#fff;border:0;border-radius:16px;box-shadow:var(--shadow)}
.disclosure-card>summary,.journey-section>summary{color:#344767;border-radius:16px;padding:18px 22px}
.disclosure-card>summary:hover,.journey-section>summary:hover{background:#fbf9fc}
.disclosure-body,.journey-body{border-top-color:#edf0f4}
.journey-toolbar{background:#fff;border-color:transparent;box-shadow:var(--shadow);border-radius:16px;padding:16px 20px}
.journey-section>summary{min-height:72px}.journey-section h2{font-size:14px}
.journey-detail>summary{color:#8a239c}.timeline{border-color:#e4d9ed}.event:before{background:#a23fae}
input,select,textarea{border-color:#dfe3e8;border-radius:9px;color:#344767}
input:hover,select:hover,textarea:hover{border-color:#bfa5c6}
input:focus,select:focus,textarea:focus{border-color:#b75dc7}
dialog{border:0;border-radius:18px;box-shadow:0 25px 80px #1417273d}dialog::backdrop{background:#14172777}
.upload-zone{background:#fbf7fc;border-color:#cda2d6;border-radius:14px}.upload-zone b{color:#8b3c9c}.upload-zone:hover{background:#f7eef9;border-color:#af62bf}
.meta-sync-help{background:#f2f4f7;border-color:#e5e8ee;color:#67748e}
.toast{background:var(--soft-dark);border-radius:12px;box-shadow:0 8px 26px -4px #14172733}
/* Keep account cards compact; each account's details open independently. */
.campaign-card .account-heading{margin-bottom:14px}
.campaign-card .campaign-summary{margin:12px 0 0;padding:12px 14px;border-radius:11px}
.campaign-card .campaign-summary>b{display:block;font-size:12px;line-height:1.6}
.campaign-connection-note{display:block;margin-top:4px;color:#67748e;font-size:11px;line-height:1.5;overflow-wrap:anywhere}
.campaign-card-details{margin:12px 0 0}
.campaign-card-details>summary{display:flex;justify-content:space-between;align-items:center;gap:12px;list-style:none;padding:10px 12px;min-height:40px;border:1px solid #ece3f0;border-radius:10px;background:#fbf6fc;color:#7d2d8b;font-size:11px;font-weight:650}
.campaign-card-details>summary::-webkit-details-marker{display:none}
.campaign-card-details>summary:hover{background:#f5ecf8;border-color:#d9c7df}
.campaign-card-details .when-open{display:none}
.campaign-card-details[open]>summary .when-open{display:inline}
.campaign-card-details[open]>summary .when-closed{display:none}
.campaign-chevron{width:7px;height:7px;flex:0 0 7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:-4px 2px 0 0;transition:transform .15s}
.campaign-card-details[open]>summary .campaign-chevron{transform:rotate(225deg);margin-top:4px}
.campaign-detail-body{max-height:min(640px,70dvh);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cbd3da transparent;margin-top:14px;padding-right:6px;overflow-wrap:anywhere}
.campaign-detail-body:focus-visible{outline:2px solid #a941ba;outline-offset:3px;border-radius:5px}
.campaign-detail-body>.account-meta{margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid #edf0f4}
.campaign-detail-body>.account-meta p{font-size:11px;line-height:1.8;margin:0;color:#67748e}
.campaign-card-details .active-creatives{max-height:none;overflow:visible}
.campaign-card-details .delivery-note{margin-bottom:0}
@media(min-width:1700px){main{padding-left:42px;padding-right:42px}.metric strong{font-size:32px}}
@media(max-width:1250px){aside{width:204px;left:12px}.brand{font-size:16px;padding-left:8px;padding-right:8px}.nav button{padding:10px;font-size:11px}.nav-icon{width:32px;height:32px;flex-basis:32px}main{margin-left:228px;padding:24px}.metrics{gap:12px}.metrics .metric.card{padding:17px 16px}.metric strong{font-size:24px}.metric>small{font-size:11px}.metric small .metric-icon{width:32px;height:32px;flex-basis:32px}.status-summary-metrics{gap:9px}.status-summary-metric{grid-template-columns:32px minmax(0,1fr);padding:12px;column-gap:9px}.status-summary-disclosure>summary{padding-bottom:32px}.status-summary-label{font-size:11px}.status-summary-value{font-size:24px}.status-summary-caption{font-size:10px}}
@media(max-width:1000px){.metrics .metric.card{min-height:156px}.metric strong{font-size:28px}.metric>small{font-size:12px}.status-summary-metrics{grid-template-columns:1fr}.status-summary-metric,.status-summary-disclosure>summary{min-height:84px;grid-template-columns:40px minmax(0,1fr);padding:15px 115px 15px 15px;column-gap:13px}.status-summary-total{padding-right:15px}.status-summary-label{font-size:12px}.status-summary-caption{font-size:11px}.status-summary-prompt{bottom:calc(50% - 6px);right:16px}.status-summary-accounts li{grid-template-columns:minmax(50px,auto) minmax(0,1fr)}.status-summary-time{max-width:48%}}
@media(max-width:760px){aside{position:sticky;inset:0;width:100%;height:auto;padding:12px 16px 8px;background:#f8f9faf5;border:0;border-bottom:1px solid #e8eaf0;border-radius:0;backdrop-filter:blur(12px)}.brand{border:0;margin:0 0 8px;padding:0;font-size:15px;gap:9px}.brand-mark{width:29px;height:30px;padding:7px;border-radius:8px}.brand-sub{font-size:8px;letter-spacing:2px;margin-top:2px}.nav-label,.foot{display:none}.nav{display:flex;gap:6px;overflow-x:auto;padding:2px 1px 6px}.nav button{flex:0 0 auto;min-height:42px;padding:6px 10px;gap:7px;font-size:11px;border-radius:10px}.nav-icon{width:25px;height:25px;flex-basis:25px;border-radius:7px}.nav-icon .ui-icon{width:14px;height:14px}.nav button.active{box-shadow:0 4px 7px -1px #0000000d}main{margin:0;padding:20px 16px 30px}.top{gap:12px;flex-wrap:wrap}h1{font-size:25px}#sub{font-size:12px}.access-mode{justify-content:flex-start}.cloud-status{font-size:10px;margin-bottom:16px}.report-toolbar{padding:14px;border-radius:14px}.report-toolbar .date-presets{padding:4px}.report-toolbar .date-presets button{min-height:34px;font-size:11px;padding:6px}.report-toolbar>.rowhead>.actions{flex-wrap:wrap}.sync-status{margin-bottom:14px;line-height:1.6}.status-summary{padding:16px;border-radius:14px}.status-summary-head{align-items:flex-start;gap:8px}.status-summary-heading{gap:6px}.status-summary-heading h2{font-size:13px}.status-summary-link{font-size:10px;padding:5px 8px}.status-summary-foot{display:block;margin-top:12px}.status-summary-time{max-width:100%;text-align:left;margin-top:8px;font-size:10px}.status-summary-explanation{font-size:10px}.dashboard-tabs{gap:3px;width:100%;padding:4px}.dashboard-tabs button{flex:1;min-height:38px;padding:8px;font-size:11px}.dashboard-viewbar{gap:7px}.dashboard-viewbar>.small{padding:0 2px;font-size:10px}.metrics{gap:12px}.metrics .metric.card{padding:15px;min-height:160px;border-radius:14px}.metric>small{font-size:11px;min-height:28px;gap:5px}.metric small .metric-icon{width:28px;height:28px;flex-basis:28px;border-radius:8px}.metric-icon .ui-icon{width:16px;height:16px}.metric strong{font-size:clamp(19px,4.7vw,28px);white-space:normal;overflow-wrap:anywhere;letter-spacing:-.6px}.metric em{font-size:10px}.spend-table.card{padding:18px 16px;border-radius:14px}.spend-table th,.spend-table td{padding:12px;font-size:11px}.campaign-card{padding:18px}.journey-toolbar{padding:14px}.journey-section>summary{padding:16px;min-height:68px}.journey-body,.disclosure-body{padding-left:16px;padding-right:16px}}
@media(max-width:420px){.status-summary-head{align-items:center}.status-summary-heading{flex-basis:55%}.status-summary-metric,.status-summary-disclosure>summary{padding-right:30px;padding-bottom:32px;min-height:104px}.status-summary-total{padding:15px 12px;min-height:78px}.status-summary-prompt{bottom:11px;right:13px}.metrics{gap:10px}.metrics .metric.card{padding:13px 11px}.metric>small{align-items:flex-start}.metric small .metric-icon{width:25px;height:25px;flex-basis:25px}.metric strong{font-size:20px}.status-summary-accounts li{display:flex;flex-wrap:wrap;gap:2px 8px}.status-summary-accounts li>span{flex-basis:100%}.status-summary-accounts b{max-width:100%}}
@media(prefers-reduced-motion:reduce){button,.status-chevron,.status-summary-disclosure>summary{transition:none}button.primary:hover{transform:none}}
