.commerce-hub { min-width:0; display:grid; gap:18px; width:min(100%,1280px); margin:0 auto; }
.commerce-hub__hero { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; padding:24px; border:1px solid var(--app-border,rgba(255,255,255,.1)); border-radius:20px; background:color-mix(in srgb,var(--app-surface,#121c2d) 94%,transparent); backdrop-filter:blur(14px); }
.commerce-hub__hero h1 { margin:4px 0 8px; }
.commerce-hub__hero p { margin:0; max-width:760px; color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__hero-badges { display:grid; gap:8px; min-width:260px; text-align:right; }
.commerce-hub__hero-badges span { font-weight:800; }
.commerce-hub__hero-badges small { color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__tabs { display:flex; gap:8px; flex-wrap:wrap; }
.commerce-hub__tabs button { border:1px solid var(--app-border,rgba(255,255,255,.1)); background:color-mix(in srgb,var(--app-surface,#121c2d) 94%,transparent); color:inherit; border-radius:12px; padding:10px 14px; cursor:pointer; }
.commerce-hub__tabs button[aria-pressed="true"] { border-color:var(--accent,#ff8a34); box-shadow:0 0 0 1px var(--accent,#ff8a34) inset; }
.commerce-hub__panel { min-width:0; padding:20px; border:1px solid var(--app-border,rgba(255,255,255,.1)); border-radius:18px; background:color-mix(in srgb,var(--app-surface,#121c2d) 96%,transparent); backdrop-filter:blur(14px); }
.commerce-hub__metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.commerce-hub__metrics article { display:grid; gap:6px; padding:16px; border:1px solid var(--app-border,rgba(255,255,255,.08)); border-radius:14px; background:var(--app-surface-raised,rgba(255,255,255,.035)); }
.commerce-hub__metrics span,.commerce-hub__metrics small { color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__metrics strong { font-size:1.55rem; }
.commerce-hub__roadmap { margin-top:16px; padding:16px; border-radius:14px; background:var(--app-surface-raised,rgba(255,255,255,.035)); }
.commerce-hub__roadmap p { margin:6px 0 0; color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__insight-section { min-width:0; display:grid; gap:14px; margin-top:22px; padding-top:20px; border-top:1px solid var(--app-border,rgba(255,255,255,.08)); }
.commerce-hub__insight-section > header { display:flex; justify-content:space-between; gap:24px; align-items:end; }
.commerce-hub__insight-section > header h2 { margin:3px 0 0; }
.commerce-hub__insight-section > header > p { max-width:600px; margin:0; color:var(--app-text-muted,#9fb0c8); text-align:right; }
.commerce-hub__opportunities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.commerce-hub__opportunity { min-width:0; display:grid; grid-template-columns:minmax(160px,.8fr) minmax(180px,1fr) minmax(220px,1.2fr); gap:14px; padding:16px; border:1px solid var(--app-border,rgba(255,255,255,.08)); border-radius:14px; background:var(--app-surface-raised,rgba(255,255,255,.035)); }
.commerce-hub__opportunity h3 { margin:6px 0 3px; overflow-wrap:anywhere; }
.commerce-hub__opportunity p { margin:0; color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__priority { display:inline-flex; width:max-content; padding:3px 8px; border-radius:999px; color:#f9b36f; background:rgba(249,115,22,.12); font-size:.7rem; font-weight:800; text-transform:uppercase; }
.commerce-hub__priority--high { color:#ffac77; background:rgba(249,115,22,.16); }
.commerce-hub__evidence { min-width:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.commerce-hub__evidence span { min-width:0; display:grid; gap:2px; padding:8px; border-radius:9px; background:var(--app-input,rgba(0,0,0,.16)); }
.commerce-hub__evidence small,.commerce-hub__recommendation small,.commerce-hub__recommendation span { color:var(--app-text-muted,#9fb0c8); font-size:.72rem; }
.commerce-hub__evidence strong { overflow-wrap:anywhere; }
.commerce-hub__recommendation { display:grid; gap:6px; align-content:start; }
.commerce-hub__recommendation strong { line-height:1.35; }
.commerce-hub__table-wrap { min-width:0; overflow:auto; border:1px solid var(--app-border,rgba(255,255,255,.08)); border-radius:14px; }
.commerce-hub__attribution-table { width:100%; min-width:900px; border-collapse:collapse; background:var(--app-surface-raised,rgba(255,255,255,.025)); }
.commerce-hub__attribution-table th,.commerce-hub__attribution-table td { padding:12px; border-bottom:1px solid var(--app-border,rgba(255,255,255,.07)); text-align:right; white-space:nowrap; }
.commerce-hub__attribution-table thead th { color:var(--app-text-muted,#9fb0c8); font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; }
.commerce-hub__attribution-table th:first-child,.commerce-hub__attribution-table td:first-child { text-align:left; }
.commerce-hub__attribution-table tbody th { display:grid; gap:3px; min-width:220px; white-space:normal; }
.commerce-hub__attribution-table tbody th small { color:var(--app-text-muted,#9fb0c8); font-weight:400; overflow-wrap:anywhere; }
.commerce-hub__unattributed { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:12px; align-items:center; padding:14px 16px; border-radius:12px; background:var(--app-surface-raised,rgba(255,255,255,.035)); }
.commerce-hub__unattributed span,.commerce-hub__unattributed small { color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__form { display:grid; gap:12px; align-content:start; }
.commerce-hub__form label,.commerce-hub__connector-form label { display:grid; gap:6px; min-width:0; }
.commerce-hub__form input,.commerce-hub__form select,.commerce-hub__connector-form input { width:100%; min-width:0; min-height:42px; box-sizing:border-box; border-radius:10px; border:1px solid var(--app-border,rgba(255,255,255,.12)); background:var(--app-input,#111a2b); color:inherit; padding:0 10px; }
.commerce-hub__cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.commerce-hub__product-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:12px; }
.commerce-hub__store-card,.commerce-hub__product-grid article { min-width:0; display:grid; gap:14px; padding:18px; border:1px solid var(--app-border,rgba(255,255,255,.08)); border-radius:16px; background:var(--app-surface-raised,rgba(255,255,255,.04)); overflow:visible; }
.commerce-hub__provider { text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; color:var(--accent,#ff8a34); font-weight:800; }
.commerce-hub__store-head { min-width:0; display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.commerce-hub__store-head > div { min-width:0; }
.commerce-hub__store-card h3,.commerce-hub__product-grid h3 { min-width:0; margin:4px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.commerce-hub__store-card p,.commerce-hub__product-grid p { min-width:0; margin:0; color:var(--app-text-muted,#9fb0c8); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.commerce-hub__connection-state { flex:0 0 auto; font-size:.78rem; font-weight:800; white-space:nowrap; }
.commerce-hub__connection-state.is-connected { color:#66d69b; }
.commerce-hub__store-kpis { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.commerce-hub__store-kpis div { min-width:0; display:grid; gap:3px; padding:10px; border-radius:10px; background:var(--app-input,rgba(0,0,0,.16)); }
.commerce-hub__store-kpis span,.commerce-hub__sync-time span { color:var(--app-text-muted,#9fb0c8); font-size:.75rem; }
.commerce-hub__store-kpis strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.commerce-hub__sync-time { display:grid; gap:3px; white-space:normal !important; overflow:visible !important; }
.commerce-hub__sync-time strong { font-size:.86rem; }
.commerce-hub__store-actions { min-width:0; display:flex; align-items:stretch; gap:8px; }
.commerce-hub__store-actions > .primary-button { flex:1 1 auto; min-width:0; white-space:normal; }
.commerce-hub__action-menu { position:relative; flex:0 0 auto; }
.commerce-hub__action-menu summary { list-style:none; width:44px; height:100%; min-height:42px; display:grid; place-items:center; border:1px solid var(--app-border,rgba(255,255,255,.12)); border-radius:10px; cursor:pointer; font-size:1.3rem; }
.commerce-hub__action-menu summary::-webkit-details-marker { display:none; }
.commerce-hub__action-menu > div { position:absolute; right:0; bottom:calc(100% + 8px); z-index:30; width:min(260px,78vw); display:grid; gap:10px; padding:12px; border:1px solid var(--app-border,rgba(255,255,255,.12)); border-radius:12px; background:var(--app-surface,#121c2d); box-shadow:0 18px 48px rgba(0,0,0,.28); }
.commerce-hub__action-menu small { color:var(--app-text-muted,#9fb0c8); overflow-wrap:anywhere; }
.commerce-hub__stores-panel { display:grid; gap:22px; }
.commerce-hub__stores-toolbar { display:flex; justify-content:space-between; gap:18px; align-items:center; }
.commerce-hub__stores-toolbar h2,.commerce-hub__connect-section h2 { margin:3px 0 4px; }
.commerce-hub__stores-toolbar p,.commerce-hub__connect-section p { margin:0; color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__connect-section { display:grid; gap:12px; padding-top:4px; }
.commerce-hub__provider-tiles { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.commerce-hub__provider-tile { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center; text-align:left; padding:14px; border:1px solid var(--app-border,rgba(255,255,255,.1)); border-radius:14px; background:var(--app-surface-raised,rgba(255,255,255,.035)); color:inherit; }
.commerce-hub__provider-tile:hover { border-color:var(--accent,#ff8a34); }
.commerce-hub__provider-tile span:nth-child(2) { min-width:0; display:grid; gap:3px; }
.commerce-hub__provider-tile strong,.commerce-hub__provider-tile small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.commerce-hub__provider-tile small { color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__provider-tile em { font-style:normal; font-size:.78rem; font-weight:800; color:#66d69b; }
.commerce-hub__provider-mark { width:42px; height:38px; display:grid; place-items:center; padding:7px; box-sizing:border-box; border-radius:10px; background:var(--app-input,#111a2b); }
.commerce-hub__provider-mark img { display:block; width:100%; height:100%; object-fit:contain; }
.commerce-hub__manual-store { padding-top:2px; }
.commerce-hub__manual-store > summary { cursor:pointer; color:var(--app-text-muted,#9fb0c8); font-weight:700; }
.commerce-hub__manual-store[open] > summary { margin-bottom:14px; }
.commerce-hub__secondary-form { max-width:620px; }
.commerce-hub__connector-dialog[hidden] { display:none !important; }
.commerce-hub__connector-dialog { position:fixed; inset:0; z-index:10040; display:grid; place-items:center; padding:24px; }
.commerce-hub__connector-backdrop { position:absolute; inset:0; background:rgba(2,8,18,.72); backdrop-filter:blur(8px); }
.commerce-hub__connector-sheet { position:relative; z-index:1; width:min(720px,calc(100vw - 32px)); max-height:min(82vh,760px); overflow:auto; display:grid; gap:16px; padding:24px; border:1px solid var(--app-border,rgba(255,255,255,.12)); border-radius:18px; background:var(--app-surface,#101a2b); box-shadow:0 28px 80px rgba(0,0,0,.38); }
.commerce-hub__connector-sheet h2 { margin:4px 0 8px; }
.commerce-hub__connector-sheet p,.commerce-hub__connection-note { margin:0; color:var(--app-text-muted,#9fb0c8); overflow-wrap:anywhere; }
.commerce-hub__connector-close { position:absolute; top:12px; right:12px; width:38px; height:38px; border-radius:50%; border:1px solid var(--app-border,rgba(255,255,255,.12)); background:var(--app-input,#111a2b); color:inherit; font-size:1.3rem; }
.commerce-hub__connector-form { min-width:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr)); gap:10px; align-items:end; margin-top:16px; }
.commerce-hub__connector-form--woo { grid-template-columns:1fr 1fr; }
.commerce-hub__connector-form--woo label:first-child { grid-column:1 / -1; }
.commerce-hub__connector-form--dialog button { min-height:42px; }
.commerce-hub__product-grid article { overflow:hidden; }
.commerce-hub__product-grid h3,.commerce-hub__product-grid p { white-space:normal; overflow-wrap:anywhere; }
.commerce-hub__product-grid dl { min-width:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,110px),1fr)); gap:8px; margin:0; }
.commerce-hub__product-grid dl div { min-width:0; display:grid; gap:3px; }
.commerce-hub__product-grid dt { font-size:.75rem; color:var(--app-text-muted,#9fb0c8); }
.commerce-hub__product-grid dd { min-width:0; margin:0; font-weight:700; overflow-wrap:anywhere; }
.commerce-hub__orders { display:grid; gap:8px; }
.commerce-hub__orders article { display:grid; grid-template-columns:minmax(0,1.7fr) .7fr .8fr .8fr; gap:12px; align-items:center; padding:12px 14px; border-bottom:1px solid var(--app-border,rgba(255,255,255,.08)); }
.commerce-hub__orders article div { display:grid; gap:3px; }
.commerce-hub__orders small,.commerce-hub__empty { color:var(--app-text-muted,#9fb0c8); }
.commerce-hub button { cursor:pointer; }
.commerce-hub button:disabled { opacity:.55; cursor:wait; }
.commerce-hub__external-products { margin-top:24px; display:grid; gap:12px; }
.commerce-hub__external-products h2 { margin:0; }
.commerce-hub__external-product img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:10px; background:var(--app-input,#111a2b); }
.commerce-hub__product-placeholder { width:100%; aspect-ratio:16/10; display:grid; place-items:center; border-radius:10px; background:var(--app-input,#111a2b); color:var(--app-text-muted,#9fb0c8); font-size:.75rem; font-weight:800; letter-spacing:.12em; }
.commerce-hub__product-copy { min-width:0; display:grid; gap:3px; }
.commerce-hub__product-actions { min-width:0; display:grid; gap:8px; margin-top:auto; }
.commerce-hub__product-actions > button { width:100%; min-height:42px; }
.commerce-hub__brand-link { min-width:0; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.commerce-hub__brand-link select { width:100%; min-width:0; min-height:42px; box-sizing:border-box; border:1px solid var(--app-border,rgba(255,255,255,.12)); border-radius:10px; background:var(--app-input,#111a2b); color:inherit; padding:0 10px; }
.commerce-hub__brand-link button { min-height:42px; white-space:nowrap; }
@media (max-width:1050px) {
  .commerce-hub__cards,.commerce-hub__provider-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .commerce-hub__opportunities { grid-template-columns:1fr; }
}
@media (max-width:900px) {
  .commerce-hub__hero { display:grid; }
  .commerce-hub__hero-badges { min-width:0; text-align:left; }
  .commerce-hub__metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .commerce-hub__stores-toolbar { align-items:flex-start; }
  .commerce-hub__product-grid { grid-template-columns:1fr; }
  .commerce-hub__opportunity { grid-template-columns:1fr 1fr; }
  .commerce-hub__recommendation { grid-column:1 / -1; }
}
@media (max-width:620px) {
  .commerce-hub { gap:14px; }
  .commerce-hub__metrics { grid-template-columns:1fr 1fr; }
  .commerce-hub__orders article { grid-template-columns:1fr 1fr; }
  .commerce-hub__panel,.commerce-hub__hero { padding:16px; border-radius:14px; }
  .commerce-hub__cards,.commerce-hub__provider-tiles { grid-template-columns:1fr; }
  .commerce-hub__stores-toolbar { display:grid; }
  .commerce-hub__stores-toolbar > button { width:100%; }
  .commerce-hub__store-head { display:grid; }
  .commerce-hub__connection-state { justify-self:start; }
  .commerce-hub__store-kpis { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .commerce-hub__connector-dialog { place-items:stretch; padding:0; }
  .commerce-hub__connector-sheet { width:100%; height:100dvh; max-height:none; border:0; border-radius:0; padding:22px 16px calc(28px + env(safe-area-inset-bottom)); }
  .commerce-hub__connector-form,.commerce-hub__connector-form--woo { grid-template-columns:1fr; }
  .commerce-hub__connector-form--woo label:first-child { grid-column:auto; }
  .commerce-hub__connector-form button { width:100%; }
  .commerce-hub__brand-link { grid-template-columns:1fr; }
  .commerce-hub__brand-link button { width:100%; }
  .commerce-hub__insight-section > header { display:grid; gap:8px; }
  .commerce-hub__insight-section > header > p { text-align:left; }
  .commerce-hub__opportunity { grid-template-columns:1fr; }
  .commerce-hub__recommendation { grid-column:auto; }
  .commerce-hub__unattributed { grid-template-columns:1fr auto; }
  .commerce-hub__unattributed small { grid-column:1 / -1; }
}

/* Commerce Hub owns the full workspace width on desktop/tablet. */
body[data-active-view="commerceHub"] .workspace-board {
  grid-template-columns: minmax(0, 1fr);
}
body[data-active-view="commerceHub"] .commerce-hub-module {
  grid-column: 1 / -1;
  grid-row: 1;
  width: 100%;
  min-width: 0;
}
body[data-active-view="commerceHub"] #commerceHubRoot {
  width: 100%;
  min-width: 0;
}

html[data-theme-resolved="light"] .commerce-hub {
  --app-border: var(--line);
  --app-surface: var(--surface);
  --app-surface-raised: var(--cards);
  --app-input: #ffffff;
  --app-text-muted: var(--muted);
  color: var(--text);
}
html[data-theme-resolved="light"] .commerce-hub__connection-state.is-connected,
html[data-theme-resolved="light"] .commerce-hub__provider-tile em { color: #166534; }
html[data-theme-resolved="light"] .commerce-hub__priority,
html[data-theme-resolved="light"] .commerce-hub__priority--high { color: #9a3412; }
.commerce-hub__cost-panel { min-width: 0; overflow-wrap: anywhere; }
.commerce-hub__cost-panel .commerce-hub__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.commerce-hub__cost-panel button { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
