/* ConnectSuite Enterprise v2 Phase 4.1 – Clean Premium UI Hotfix */
*{box-sizing:border-box}
:root{
  --bg:#f4f7ff;--panel:#ffffff;--panel-soft:#f8faff;--text:#152033;--muted:#667085;
  --line:#e5e9f2;--primary:#7c3aed;--primary2:#d946ef;--sidebar:#07142f;
  --shadow:0 14px 42px rgba(31,41,85,.08)
}
:root[data-theme="dark"]{
  --bg:#07101f;--panel:#0d1930;--panel-soft:#101e39;--text:#f8fafc;--muted:#9aa8bf;
  --line:#22324f;--sidebar:#040b1b;--shadow:0 16px 45px rgba(0,0,0,.28)
}
html,body{margin:0;min-height:100%;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}
body{overflow-x:hidden}
a{text-decoration:none;color:inherit}
button,.btn{border:0;border-radius:11px;padding:11px 16px;background:linear-gradient(135deg,var(--primary),#9b4df2);color:#fff;font-weight:800;cursor:pointer}
input,textarea,select{font:inherit}

/* Public site */
.public-body{background:#f6f8fc;color:#172033}
.topnav{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 6%;background:#fff;border-bottom:1px solid #e8ecf4}
.topnav>div{display:flex;gap:22px;align-items:center}
.brand{font-size:24px;font-weight:900;letter-spacing:-.5px}.brand span{color:#8b3df5}
.hero{padding:80px 6%;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;background:linear-gradient(135deg,#eef2ff,#faf5ff)}
.hero h1{font-size:54px;line-height:1.05;margin:0 0 18px}.hero p{font-size:18px;color:#64748b;line-height:1.7}
.hero-card{background:#111827;color:#fff;border-radius:24px;padding:26px;box-shadow:0 28px 70px rgba(15,23,42,.25)}
.section{padding:60px 6%}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:22px;box-shadow:0 10px 35px rgba(15,23,42,.06)}
.price{font-size:34px;font-weight:900}.footer{padding:28px 6%;text-align:center;background:#111827;color:#cbd5e1}
.auth-wrap{min-height:75vh;display:grid;place-items:center;padding:30px}.auth-card{width:min(520px,100%);background:#fff;padding:28px;border-radius:20px;border:1px solid #e2e8f0}

/* Forms & tables */
.field{margin:12px 0}.field label{display:block;font-weight:700;margin-bottom:6px}
.field input,.field textarea,.field select,.conversation-actions select{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text)}
.row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow);margin-top:18px}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.alert{padding:12px 14px;border-radius:10px;margin:12px 24px}.success{background:#dcfce7;color:#166534}.error{background:#fee2e2;color:#991b1b}
.badge{display:inline-block;padding:5px 9px;border-radius:999px;background:#eee8ff;color:#6d28d9;font-size:11px;font-weight:800}
.code{background:#07101f;color:#d1fae5;padding:14px;border-radius:12px;overflow:auto}.muted{color:var(--muted)}

/* App shell – critical layout */
.app-shell.premium-shell{
  display:grid !important;
  grid-template-columns:250px minmax(0,1fr) !important;
  min-height:100vh;
  width:100%;
  align-items:start
}
.premium-sidebar{
  display:flex !important;
  flex-direction:column;
  gap:0;
  position:sticky !important;
  top:0;
  left:auto;
  width:250px;
  height:100vh;
  min-height:100vh;
  overflow-y:auto;
  padding:24px 17px;
  background:linear-gradient(180deg,#07142f 0%,#061024 60%,#030a18 100%) !important;
  color:#fff;
  z-index:100
}
.brand-wrap{padding:0 10px 22px;border-bottom:1px solid rgba(255,255,255,.12)}
.brand-wrap .brand{display:block;color:#fff;font-size:25px}.brand-wrap .brand span{color:#a855f7}
.brand-wrap small{display:block;color:#9fb0cf;font-size:10px;margin-top:4px}
.sidebar-nav{
  height:auto !important;
  padding:0 !important;
  margin:18px 0 0 !important;
  background:transparent !important;
  border:0 !important;
  display:grid !important;
  grid-template-columns:1fr;
  align-items:stretch !important;
  gap:5px !important
}
.sidebar-nav a{
  display:flex !important;align-items:center;justify-content:flex-start !important;gap:12px;
  min-height:42px;padding:11px 13px !important;border-radius:11px;color:#d8e0f3;background:transparent
}
.sidebar-nav a:hover,.sidebar-nav a.active{background:linear-gradient(90deg,#6337ed,#a33df2);color:#fff;box-shadow:0 8px 22px rgba(124,58,237,.25)}
.sidebar-promo{margin-top:auto;padding:15px;border-radius:16px;background:linear-gradient(145deg,#28175d,#0d1a40);border:1px solid #6541c8;color:#fff}
.sidebar-promo small{color:#c4b5fd;font-weight:800}.sidebar-promo b{display:block;margin:7px 0}.sidebar-promo p{font-size:11px;color:#cbd5e1;line-height:1.5}
.sidebar-promo a{display:block;text-align:center;padding:9px;border-radius:10px;background:linear-gradient(90deg,#6d3df4,#ec2aa8);font-weight:800}
.logout-link{display:block;margin-top:12px;color:#cbd5e1;padding:10px 12px;border-radius:10px}.logout-link:hover{background:#16233c;color:#fff}

.premium-main{display:block;min-width:0;width:100%;padding:0;background:radial-gradient(circle at top right,rgba(196,158,255,.18),transparent 30%),var(--bg)}
.premium-header{
  height:74px;
  margin:0 !important;
  padding:0 24px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px;
  position:sticky !important;
  top:0;z-index:60;
  background:rgba(255,255,255,.82) !important;
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line)
}
:root[data-theme="dark"] .premium-header{background:rgba(9,18,35,.88) !important}
.header-search{display:flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:0 12px;width:min(360px,42vw)}
.header-search input{border:0;background:transparent;padding:11px;width:100%;color:var(--text);outline:0}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.icon-btn{width:40px;height:40px;padding:0;border-radius:12px;background:var(--panel);color:var(--text);border:1px solid var(--line);display:grid;place-items:center}
.user-chip{display:flex;align-items:center;gap:10px}.user-chip>span{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#7c3aed,#a855f7);display:grid;place-items:center;color:#fff;font-weight:900}
.user-chip b,.user-chip small{display:block}.user-chip small{color:var(--muted);font-size:10px}
.content-wrap{width:100%;max-width:1600px;margin:0 auto;padding:26px}

/* Dashboard */
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.page-heading h1{margin:5px 0;font-size:30px}.page-heading p{margin:0;color:var(--muted)}
.eyebrow{font-size:10px;letter-spacing:.14em;font-weight:900;color:#7c3aed}.date-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 15px;box-shadow:var(--shadow)}
.date-card b,.date-card small{display:block}.date-card small{color:var(--muted)}
.premium-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.metric-card{display:flex;gap:14px;align-items:center;min-width:0;padding:18px;border-radius:17px;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}
.metric-icon{width:48px;height:48px;flex:0 0 48px;border-radius:50%;display:grid;place-items:center;font-size:22px}
.metric-card small,.metric-card span{display:block}.metric-card strong{display:block;font-size:24px;margin:4px 0;overflow-wrap:anywhere}.metric-card span{font-size:10px;color:var(--muted)}
.metric-card.purple .metric-icon{background:#f0e7ff;color:#7c3aed}.metric-card.blue .metric-icon{background:#e5f0ff;color:#2563eb}.metric-card.orange .metric-icon{background:#fff0e0;color:#f97316}.metric-card.green .metric-icon{background:#e3faee;color:#059669}.metric-card.pink .metric-icon{background:#ffe6f0;color:#db2777}
.dashboard-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:18px}.span-2{grid-column:span 2}.dashboard-grid>.panel{margin-top:0}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.panel-head h3{margin:0}.panel-head select{padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text)}
.fake-chart{height:220px;position:relative;margin-top:18px;overflow:hidden}.fake-chart svg{position:absolute;inset:20px 0 0;width:100%;height:180px}.chart-grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:100% 45px,75px 100%;opacity:.45}
.donut-wrap{display:flex;align-items:center;justify-content:center;gap:20px;padding-top:18px}.donut{position:relative;width:150px;height:150px;border-radius:50%;background:conic-gradient(#7c3aed 0 25%,#14b8a6 25% 50%,#3b82f6 50% 75%,#ef4444 75%);display:grid;place-items:center}
.donut:before{content:"";width:90px;height:90px;background:var(--panel);border-radius:50%;position:absolute}.donut span{position:relative;font-size:24px;font-weight:900;text-align:center}.donut small{display:block;font-size:10px;color:var(--muted)}
.donut-wrap ul{list-style:none;padding:0}.donut-wrap li{margin:9px 0;color:var(--muted)}.donut-wrap b{float:right;margin-left:18px;color:var(--text)}
.health-card{background:linear-gradient(145deg,#11193d,#081126);color:#fff}.health-card p{display:flex;justify-content:space-between;color:#cbd5e1}.health-card b{color:#22c55e}
.quick-card{background:linear-gradient(145deg,#7138e8,#9b5cf6);color:#fff}.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quick-grid a{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:14px;text-align:center}.quick-grid span{display:block;font-size:11px;margin-top:5px}
.empty-state{min-height:180px;display:grid;place-items:center;align-content:center;color:var(--muted);gap:8px}.empty-state>b{color:var(--text)}
.activity-list>div{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.activity-list b,.activity-list small{display:block}.activity-list small{color:var(--muted)}
.conversation-shell{background:#e5ddd5;border-radius:18px;padding:22px;min-height:420px;margin:18px 0;display:flex;flex-direction:column;gap:10px}.chat-bubble{max-width:74%;padding:11px 13px;border-radius:14px;background:#fff;color:#172033;box-shadow:0 3px 10px rgba(15,23,42,.08)}.chat-bubble.out{align-self:flex-end;background:#dcf8c6}.chat-bubble.in{align-self:flex-start}.chat-bubble small{display:block;margin-top:6px;color:#64748b;font-size:10px;text-align:right}
.inbox-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.inbox-tabs a{padding:8px 12px;background:var(--panel);border:1px solid var(--line);border-radius:999px}
.tag-chip{display:inline-block;padding:6px 10px;border-radius:999px;background:#ede9fe;color:#6d28d9;font-weight:800}

@media(max-width:1200px){
  .premium-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .app-shell.premium-shell{grid-template-columns:1fr !important}
  .premium-sidebar{position:fixed !important;left:-270px;width:250px;transition:left .25s ease}
  body.sidebar-open .premium-sidebar{left:0}
  .content-wrap{padding:16px}.header-search{display:none}.page-heading{align-items:flex-start;flex-direction:column}.user-chip>div{display:none}
}
@media(max-width:620px){
  .premium-stats,.dashboard-grid,.grid,.row{grid-template-columns:1fr}.span-2{grid-column:span 1}
  .premium-header{padding:0 12px !important}.content-wrap{padding:12px}.page-heading h1{font-size:25px}
  .donut-wrap{flex-direction:column}.topnav>div a:not(.btn){display:none}
}

.campaign-target-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:18px 0}.target-option{display:block;padding:9px 11px;margin:6px 0;border:1px solid var(--line);border-radius:10px;background:var(--panel-soft)}
.inline-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.inline-actions form{margin:0}
.btn.secondary{background:var(--panel-soft);color:var(--text);border:1px solid var(--line)}
@media(max-width:700px){.campaign-target-grid{grid-template-columns:1fr}}

.cron-status{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px;border-radius:14px}.cron-status.running{background:#dcfce7;color:#166534;border:1px solid #86efac}.cron-status.stopped{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}
.payload-preview{white-space:pre-wrap;word-break:break-word;max-width:650px;font-size:11px;background:var(--panel-soft);padding:10px;border-radius:9px}
.btn.danger{background:#dc2626;color:#fff}

.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.plan-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:var(--shadow)}.plan-card.featured{border:2px solid #7c3aed;transform:translateY(-4px)}.plan-badge{font-size:10px;font-weight:900;color:#7c3aed;letter-spacing:.1em}.plan-price{font-size:34px;font-weight:900;margin:14px 0}.plan-price small{font-size:12px;color:var(--muted)}.plan-card ul{padding-left:18px;color:var(--muted);line-height:1.9}.plan-actions{display:flex;gap:8px}.checkout-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:18px}.summary-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.summary-row.total{font-size:20px}.payment-help{background:linear-gradient(145deg,#11193d,#081126);color:#fff}.invoice-sheet{max-width:900px;margin:28px auto;background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:30px;box-shadow:var(--shadow)}.invoice-sheet header{display:flex;justify-content:space-between;gap:18px}.invoice-status{padding:8px 12px;border-radius:999px;height:max-content;font-weight:900;font-size:11px}.invoice-status.pending{background:#fff7ed;color:#c2410c}.invoice-status.paid{background:#dcfce7;color:#166534}.invoice-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:24px 0}.invoice-meta small,.invoice-meta b{display:block}.invoice-meta small{color:var(--muted)}.invoice-total{font-size:18px;font-weight:900}.payment-box{margin-top:24px;padding:22px;border-radius:18px;background:var(--panel-soft);border:1px solid var(--line)}.upi-id{font-size:24px;font-weight:900;color:#7c3aed}.paid-banner{margin-top:20px;padding:18px;border-radius:14px;background:#dcfce7;color:#166534;font-weight:900;text-align:center}
@media(max-width:900px){.plan-grid,.checkout-grid{grid-template-columns:1fr}.invoice-meta{grid-template-columns:1fr 1fr}}

.brand-preview{margin-top:18px;padding:30px;border-radius:22px;background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary));color:#fff;box-shadow:var(--shadow)}.brand-preview span{font-size:10px;letter-spacing:.15em;font-weight:900}.brand-preview h2{font-size:32px;margin:10px 0}.brand-preview button{background:#fff;color:var(--brand-primary)}
.usage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.usage-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow)}.usage-card small,.usage-card strong{display:block}.usage-card strong{font-size:24px;margin:7px 0}.usage-track{height:10px;border-radius:999px;background:var(--panel-soft);overflow:hidden;margin:12px 0}.usage-track span{display:block;height:100%;background:linear-gradient(90deg,#7c3aed,#d946ef);border-radius:999px}
.wallet-hero{max-width:420px}.money-credit{color:#059669;font-weight:900}.money-debit{color:#dc2626;font-weight:900}
@media(max-width:900px){.usage-grid{grid-template-columns:1fr}}

.embedded-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:18px}.embedded-card{background:linear-gradient(145deg,#11193d,#081126);color:#fff}.embedded-card p,.embedded-card li{color:#cbd5e1;line-height:1.65}.embedded-icon{width:62px;height:62px;border-radius:18px;background:linear-gradient(135deg,#7c3aed,#d946ef);display:grid;place-items:center;font-size:30px}.connection-status{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px;border-radius:14px;margin:14px 0}.connection-status.connected{background:#dcfce7;color:#166534}.connection-status.pending{background:#fff7ed;color:#9a3412}.connection-status b,.connection-status span{display:block}
@media(max-width:900px){.embedded-grid{grid-template-columns:1fr}}

.media-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:18px}.media-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}.media-icon{width:54px;height:54px;border-radius:16px;background:linear-gradient(135deg,#7c3aed,#d946ef);display:grid;place-items:center;color:#fff;font-weight:900;font-size:22px}.media-card h3{font-size:15px;word-break:break-word}.media-card p{color:var(--muted);font-size:12px}
@media(max-width:1100px){.media-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.media-grid{grid-template-columns:1fr}}

.auto-queue-notice{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;margin-bottom:18px;border-radius:18px;background:linear-gradient(135deg,#e9ddff,#dff7ff);border:1px solid #c4b5fd;color:#4c1d95}.auto-queue-notice b,.auto-queue-notice span{display:block}.auto-queue-notice span{margin-top:5px;color:#5b6475}:root[data-theme="dark"] .auto-queue-notice{background:linear-gradient(135deg,#251650,#102744);color:#ddd6fe;border-color:#5b3bb5}:root[data-theme="dark"] .auto-queue-notice span{color:#cbd5e1}

.flow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}.flow-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow)}.flow-status{position:absolute;right:14px;top:14px;font-size:9px;font-weight:900;padding:5px 8px;border-radius:999px}.flow-status.active{background:#dcfce7;color:#166534}.flow-status.draft{background:#eef2ff;color:#4338ca}.flow-status.paused{background:#fff7ed;color:#9a3412}.flow-meta{display:flex;gap:10px;margin:14px 0}.flow-meta span{background:var(--panel-soft);border:1px solid var(--line);border-radius:999px;padding:6px 9px;font-size:11px}
.builder-layout{display:grid;grid-template-columns:1fr 1fr;gap:18px}.flow-canvas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0}.flow-node{background:var(--panel);border:2px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}.flow-node.start-node{border-color:#7c3aed;background:linear-gradient(135deg,rgba(124,58,237,.08),var(--panel))}.node-type{font-size:9px;font-weight:900;color:#7c3aed;letter-spacing:.1em}
@media(max-width:1000px){.flow-grid,.flow-canvas{grid-template-columns:repeat(2,1fr)}.builder-layout{grid-template-columns:1fr}}@media(max-width:620px){.flow-grid,.flow-canvas{grid-template-columns:1fr}}