/*
  VelocityDial preprod Cuba UI refresh
  Source pack selected from /home/cuba_v9.1.zip:
  - html.zip: dashboard shell, card, pricing, login, table, and landing-page component patterns
  - flask.zip: Flask/Jinja package was inspected only for server-rendered asset organization
  This file intentionally ports the Cuba design language instead of importing the full 1MB Cuba CSS,
  avoiding Bootstrap/global selector collisions with the existing FastAPI/Jinja application.
*/

:root{
  --theme-deafult:#7366ff; /* Cuba keeps this historical spelling. */
  --theme-default:#7366ff;
  --theme-secondary:#f73164;
  --cuba-info:#16c7f9;
  --cuba-success:#54ba4a;
  --cuba-warning:#ffaa05;
  --cuba-danger:#fc4438;
  --cuba-dark:#1b1b2f;
  --cuba-ink:#2f2f3b;
  --cuba-muted:rgba(82,82,108,.78);
  --cuba-line:#ecf3fa;
  --cuba-soft:#f5f6f9;
  --cuba-soft-2:#f8f9fd;
  --cuba-card:#fff;
  --cuba-sidebar:#1f1f3f;
  --cuba-shadow:0 9px 20px rgba(46,35,94,.07);
  --cuba-shadow-lg:0 22px 54px rgba(46,35,94,.14);
  --cuba-radius:18px;
  --cuba-radius-lg:26px;
  --font:'Rubik', 'Roboto', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --vd-purple:var(--theme-default);
  --vd-purple-dark:#5f52e8;
  --vd-blue:#16c7f9;
  --vd-cyan:#16c7f9;
  --vd-gradient:linear-gradient(135deg,var(--theme-default),var(--theme-secondary));
  --vd-gradient-dark:linear-gradient(145deg,#11113b 0%,#1e1d49 42%,#7366ff 100%);
  --vd-ink:var(--cuba-ink);
  --vd-muted:var(--cuba-muted);
  --vd-bg:#f8f9fd;
  --vd-line:var(--cuba-line);
  --shadow-sm:var(--cuba-shadow);
  --shadow-md:0 15px 35px rgba(46,35,94,.10);
  --shadow-lg:var(--cuba-shadow-lg);
}

body.cuba-redesign{
  font-family:var(--font);
  color:var(--cuba-ink);
  background:
    radial-gradient(circle at 12% 4%, rgba(115,102,255,.12), transparent 30rem),
    radial-gradient(circle at 86% 8%, rgba(247,49,100,.10), transparent 26rem),
    linear-gradient(180deg,#fbfcff 0%,#f5f6fb 100%);
}
body.cuba-redesign:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:linear-gradient(rgba(115,102,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(115,102,255,.035) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.65),transparent 75%);
  z-index:-1;
}

.preprod-ribbon{
  position:fixed;
  z-index:9999;
  top:14px;
  right:14px;
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.44rem .7rem;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg,var(--theme-secondary),var(--theme-default));
  box-shadow:0 12px 30px rgba(115,102,255,.28);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.065em;
  text-transform:uppercase;
}

/* Cuba top navigation / landing shell */
.cuba-redesign .site-nav{
  max-width:min(1420px,calc(100% - 28px));
  margin:14px auto 0;
  padding:.78rem .95rem;
  border:1px solid rgba(236,243,250,.95);
  border-radius:22px;
  background:rgba(255,255,255,.88);
  box-shadow:var(--cuba-shadow);
  backdrop-filter:blur(18px);
}
.cuba-redesign .logo strong,
.cuba-redesign .agent-logo strong{font-weight:900;letter-spacing:-.02em;color:var(--cuba-ink)}
.cuba-redesign .brand-mark,
.cuba-redesign .brand-mark-mini,
.cuba-redesign .brand-mark-pill,
.cuba-redesign .agent-logo-mark,
.cuba-redesign .login-icon{
  background:linear-gradient(135deg,var(--theme-default) 0%,#9b7bff 55%,var(--theme-secondary) 100%);
  box-shadow:0 10px 24px rgba(115,102,255,.24);
}
.cuba-redesign .site-nav nav a,
.cuba-redesign .link-button{
  border-radius:12px;
  color:#6b6b83;
  font-size:.9rem;
  font-weight:700;
  min-height:38px;
}
.cuba-redesign .site-nav nav a.active,
.cuba-redesign .site-nav nav a:hover,
.cuba-redesign .link-button:hover{
  background:rgba(115,102,255,.10);
  color:var(--theme-default);
  transform:translateY(-1px);
}

.cuba-redesign .primary,
.cuba-redesign .agent-btn-primary,
.cuba-redesign .agent-btn-call,
.cuba-redesign .softphone-call,
.cuba-redesign .mini-call-button,
.cuba-redesign button.primary{
  border:0!important;
  border-radius:12px;
  background:linear-gradient(135deg,var(--theme-default),#8f76ff 54%,var(--theme-secondary));
  color:#fff!important;
  box-shadow:0 10px 25px rgba(115,102,255,.28);
}
.cuba-redesign .agent-btn-call,
.cuba-redesign .softphone-call,
.cuba-redesign .mini-call-button{
  background:linear-gradient(135deg,var(--cuba-success),#27b8a8);
  box-shadow:0 10px 25px rgba(84,186,74,.24);
}
.cuba-redesign .primary:hover,
.cuba-redesign .agent-btn-primary:hover,
.cuba-redesign .agent-btn-call:hover,
.cuba-redesign .softphone-call:hover,
.cuba-redesign .mini-call-button:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(115,102,255,.34);
}
.cuba-redesign .secondary,
.cuba-redesign .agent-btn-secondary,
.cuba-redesign .agent-link-btn,
.cuba-redesign .agent-play-btn{
  border:1px solid var(--cuba-line)!important;
  border-radius:12px;
  background:#fff!important;
  color:var(--theme-default)!important;
  box-shadow:0 4px 12px rgba(46,35,94,.05);
}
.cuba-redesign .secondary:hover,
.cuba-redesign .agent-btn-secondary:hover,
.cuba-redesign .agent-link-btn:hover,
.cuba-redesign .agent-play-btn:hover{
  border-color:#dcd8ff!important;
  background:#f6f4ff!important;
  transform:translateY(-2px);
}

.cuba-redesign .hero,
.cuba-redesign .page-hero,
.cuba-redesign .compact-price-hero,
.cuba-redesign .blog-hero,
.cuba-redesign .help-hero,
.cuba-redesign .article-hero{
  position:relative;
  overflow:hidden;
}
.cuba-redesign .tragofone-hero,
.cuba-redesign .compact-price-hero,
.cuba-redesign .page-hero{
  max-width:min(1420px,calc(100% - 28px));
  margin:14px auto 0;
  border:1px solid rgba(236,243,250,.9);
  border-radius:32px;
  background:linear-gradient(145deg,#fff 0%,#f8f7ff 56%,#fff4f8 100%);
  box-shadow:var(--cuba-shadow-lg);
}
.cuba-redesign .tragofone-hero:after,
.cuba-redesign .compact-price-hero:after,
.cuba-redesign .page-hero:after,
.cuba-redesign .agent-page-header:after,
.cuba-redesign .agent-phone-hero:after,
.cuba-redesign .app-header:after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  border-radius:50%;
  right:-80px;
  top:-90px;
  background:radial-gradient(circle,rgba(247,49,100,.14),transparent 68%);
  pointer-events:none;
}
.cuba-redesign .hero-copy h1,
.cuba-redesign .compact-price-hero h1,
.cuba-redesign .page-hero h1,
.cuba-redesign .section-head h2,
.cuba-redesign .final-cta h2,
.cuba-redesign .app-header h1,
.cuba-redesign .agent-page-header h1,
.cuba-redesign .agent-phone-hero h1{
  color:var(--cuba-ink);
  letter-spacing:-.05em;
  font-weight:900;
}
.cuba-redesign .hero-copy h1 span,
.cuba-redesign .compact-price-hero h1 span,
.cuba-redesign .page-hero h1 span{
  background:linear-gradient(135deg,var(--theme-default),var(--theme-secondary));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.cuba-redesign .badge,
.cuba-redesign .clean-badge,
.cuba-redesign .flag-badge,
.cuba-redesign .status-chip,
.cuba-redesign .tier-pill,
.cuba-redesign .agent-card-badge,
.cuba-redesign .agent-trial-badge{
  border:1px solid #dcd8ff;
  background:#f4f2ff;
  color:var(--theme-default);
  border-radius:999px;
  font-weight:800;
}
.cuba-redesign .gold-chip,
.cuba-redesign .agent-trial-badge{
  border-color:#ffe3a0;
  background:#fff8e6;
  color:#b87700;
}

/* Cuba card system ported to existing templates */
.cuba-redesign .panel,
.cuba-redesign .feature-card,
.cuba-redesign .blog-card,
.cuba-redesign .auth-card,
.cuba-redesign .auth-side,
.cuba-redesign .clean-country-card,
.cuba-redesign .compact-pricing-bottom article,
.cuba-redesign .metric-card,
.cuba-redesign .billing-metrics article,
.cuba-redesign .agent-metric,
.cuba-redesign .agent-card,
.cuba-redesign .agent-engine-card,
.cuba-redesign .agent-info-card,
.cuba-redesign .agent-dialer-card,
.cuba-redesign .agent-profile-card,
.cuba-redesign .agent-permissions-card,
.cuba-redesign .agent-settings-card,
.cuba-redesign .agent-security-card,
.cuba-redesign .empty-state-card,
.cuba-redesign .recording-card,
.cuba-redesign .agent-detail-card,
.cuba-redesign .softphone-hero-board,
.cuba-redesign .softphone-shell,
.cuba-redesign .mini-phone-card,
.cuba-redesign .article-summary-card,
.cuba-redesign .article-cta-panel{
  border:1px solid var(--cuba-line)!important;
  border-radius:var(--cuba-radius-lg)!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:var(--cuba-shadow)!important;
}
.cuba-redesign .panel:hover,
.cuba-redesign .feature-card:hover,
.cuba-redesign .clean-country-card:hover,
.cuba-redesign .metric-card:hover,
.cuba-redesign .billing-metrics article:hover,
.cuba-redesign .agent-metric:hover,
.cuba-redesign .agent-detail-card:hover,
.cuba-redesign .recording-card:hover{
  transform:translateY(-3px);
  border-color:#ddd9ff!important;
  box-shadow:0 16px 38px rgba(46,35,94,.12)!important;
}
.cuba-redesign .panel-head,
.cuba-redesign .agent-card-header,
.cuba-redesign .country-card-head,
.cuba-redesign .login-card-top,
.cuba-redesign .agent-info-header,
.cuba-redesign .agent-profile-card-header,
.cuba-redesign .agent-card-head{
  border-bottom:1px solid rgba(236,243,250,.9);
  padding-bottom:.8rem;
  margin-bottom:.9rem;
}
.cuba-redesign .eyebrow,
.cuba-redesign .agent-eyebrow{
  color:var(--theme-default);
  font-size:.72rem;
  letter-spacing:.12em;
  font-weight:900;
}
.cuba-redesign p{color:var(--cuba-muted)}

/* Marketing boards / feature cards */
.cuba-redesign .download-strip{
  max-width:min(1240px,calc(100% - 28px));
  margin:1rem auto 0;
  background:rgba(255,255,255,.72);
  border:1px solid var(--cuba-line);
  border-radius:22px;
  padding:.75rem;
  box-shadow:var(--cuba-shadow);
}
.cuba-redesign .download-strip a{
  border-radius:16px;
  border:1px solid transparent;
  background:#fff;
  box-shadow:0 4px 14px rgba(46,35,94,.04);
}
.cuba-redesign .download-strip a:hover{
  border-color:#dcd8ff;
  background:#f8f7ff;
  transform:translateY(-2px);
}
.cuba-redesign .feature-card{
  padding:1.25rem!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.cuba-redesign .feature-card span:first-child,
.cuba-redesign .compact-pricing-bottom article span,
.cuba-redesign .metric-top .metric-icon,
.cuba-redesign .sidebar-nav-icon{
  display:inline-grid;
  place-items:center;
  min-width:34px;
  height:34px;
  border-radius:12px;
  background:linear-gradient(135deg,rgba(115,102,255,.14),rgba(247,49,100,.10));
  color:var(--theme-default);
}
.cuba-redesign .dark-band,
.cuba-redesign .clean-dark-band,
.cuba-redesign .dialer-showcase-band{
  background:linear-gradient(145deg,#171734 0%,#26265a 56%,#7366ff 100%)!important;
  border-radius:34px;
  max-width:min(1420px,calc(100% - 28px));
  margin:1.25rem auto;
  box-shadow:var(--cuba-shadow-lg);
}
.cuba-redesign .final-cta,
.cuba-redesign .clean-final-cta{
  max-width:min(1180px,calc(100% - 28px));
  margin:1.5rem auto;
  border:1px solid var(--cuba-line);
  border-radius:32px;
  background:linear-gradient(145deg,#fff 0%,#f8f7ff 100%);
  box-shadow:var(--cuba-shadow-lg);
}

/* Pricing cards: Cuba pricing-simple / pricing-block feel */
.cuba-redesign .pricing-page-dark,
.cuba-redesign .clean-pricing-page{
  background:transparent!important;
}
.cuba-redesign .south-pricing-wrap,
.cuba-redesign .compact-production-pricing{
  max-width:min(1220px,calc(100% - 28px));
  margin:1.1rem auto;
  padding:1.2rem;
  border-radius:32px;
  background:linear-gradient(145deg,#22224c 0%,#17172f 100%);
  box-shadow:var(--cuba-shadow-lg);
}
.cuba-redesign .compact-production-pricing .section-head h2,
.cuba-redesign .compact-production-pricing .section-head p{color:#fff}
.cuba-redesign .south-country-grid.two-plan-country-grid{gap:1rem}
.cuba-redesign .clean-country-card{
  position:relative;
  overflow:hidden;
  padding:1.1rem!important;
}
.cuba-redesign .clean-country-card:before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:6px;
  background:linear-gradient(90deg,var(--theme-default),var(--theme-secondary),var(--cuba-info));
}
.cuba-redesign .compact-price-box{
  border:1px solid #edeaff;
  border-radius:22px;
  background:linear-gradient(145deg,#f8f7ff 0%,#fff 100%);
  padding:1rem;
  margin:.85rem 0;
}
.cuba-redesign .tier-price strong,
.cuba-redesign .pricing-total{
  color:var(--theme-default);
  font-weight:900;
}
.cuba-redesign .compact-tier-grid>div,
.cuba-redesign .compact-includes span,
.cuba-redesign .pricing-breakdown,
.cuba-redesign .signup-plan-summary,
.cuba-redesign .agent-stat-box,
.cuba-redesign .agent-info-rows>div,
.cuba-redesign .agent-info-details>div,
.cuba-redesign .agent-insight,
.cuba-redesign .insight-grid article,
.cuba-redesign .check-list p,
.cuba-redesign .agent-check-item{
  border:1px solid var(--cuba-line)!important;
  border-radius:16px!important;
  background:var(--cuba-soft-2)!important;
}

/* Auth / signup pages based on Cuba login-card/login-dark */
.cuba-redesign.auth-body,
body.cuba-redesign.auth-body{
  background:
    radial-gradient(circle at 15% 8%,rgba(115,102,255,.22),transparent 26rem),
    radial-gradient(circle at 86% 16%,rgba(247,49,100,.16),transparent 23rem),
    linear-gradient(145deg,#f5f6fb 0%,#eff1fa 100%);
}
.cuba-redesign .auth-shell{
  align-items:start;
  padding-top:clamp(2rem,5vw,4.2rem);
}
.cuba-redesign .login-card,
.cuba-redesign .clean-signup-card{
  width:min(100%,560px);
  padding:1.4rem!important;
}
.cuba-redesign .signup-shell{
  grid-template-columns:minmax(320px,560px) minmax(280px,420px);
  gap:1rem;
  max-width:1040px;
  margin:0 auto;
}
.cuba-redesign .login-card:before,
.cuba-redesign .clean-signup-card:before,
.cuba-redesign .auth-side:before{
  content:"";
  display:block;
  height:5px;
  margin:-1.4rem -1.4rem 1rem;
  border-radius:26px 26px 0 0;
  background:linear-gradient(90deg,var(--theme-default),var(--theme-secondary),var(--cuba-info));
}
.cuba-redesign input,
.cuba-redesign select,
.cuba-redesign textarea{
  border:1px solid #e6edf7!important;
  border-radius:12px!important;
  background:#fff!important;
  color:var(--cuba-ink)!important;
  box-shadow:none!important;
}
.cuba-redesign input:focus,
.cuba-redesign select:focus,
.cuba-redesign textarea:focus{
  border-color:var(--theme-default)!important;
  box-shadow:0 0 0 4px rgba(115,102,255,.12)!important;
}
.cuba-redesign label span,
.cuba-redesign .auth-form label span,
.cuba-redesign .agent-form label span,
.cuba-redesign .credit-topup-form label span,
.cuba-redesign .auto-topup-form label span,
.cuba-redesign .custom-topup-form label span{
  color:#6f6f8b;
  font-weight:800;
  letter-spacing:.08em;
}
.cuba-redesign .step{
  border:1px solid var(--cuba-line);
  border-radius:16px;
  background:#fff;
  padding:.8rem;
  box-shadow:0 6px 16px rgba(46,35,94,.04);
}
.cuba-redesign .step span{
  background:linear-gradient(135deg,var(--theme-default),var(--theme-secondary));
  color:#fff;
}

/* Company panel: Cuba compact-wrapper/sidebar/header/card patterns */
body.cuba-redesign.company-control-body,
body.cuba-redesign.app-body:not(.agent-mode){
  background:#f7f8fc;
}
.cuba-redesign .app-sidebar.vd-shell-sidebar,
.cuba-redesign .app-sidebar{
  background:linear-gradient(180deg,#1d1d3e 0%,#15152d 100%)!important;
  border-right:0!important;
  box-shadow:10px 0 28px rgba(46,35,94,.12);
}
.cuba-redesign.company-control-body .app-sidebar.vd-shell-sidebar,
.cuba-redesign .app-sidebar.vd-shell-sidebar,
.cuba-redesign.agent-mode .agent-sidebar{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable;
  overscroll-behavior:contain;
}
.cuba-redesign.company-control-body .app-sidebar.vd-shell-sidebar::-webkit-scrollbar,
.cuba-redesign.agent-mode .agent-sidebar::-webkit-scrollbar{width:8px}
.cuba-redesign.company-control-body .app-sidebar.vd-shell-sidebar::-webkit-scrollbar-thumb,
.cuba-redesign.agent-mode .agent-sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}
.cuba-redesign .app-sidebar .logo strong,
.cuba-redesign .app-sidebar strong,
.cuba-redesign .app-sidebar nav a,
.cuba-redesign .app-sidebar .logout{color:#fff!important}
.cuba-redesign .app-sidebar nav a{
  display:flex;
  align-items:center;
  gap:.7rem;
  min-height:45px;
  border-radius:12px;
  margin:.14rem 0;
  color:rgba(255,255,255,.72)!important;
  background:transparent;
  transition:transform .14s ease,background .14s ease,color .14s ease;
}
.cuba-redesign .app-sidebar nav a.active,
.cuba-redesign .app-sidebar nav a:hover{
  background:linear-gradient(90deg,rgba(115,102,255,.34),rgba(247,49,100,.18));
  color:#fff!important;
  transform:translateX(3px);
}
.cuba-redesign .sidebar-profile-card,
.cuba-redesign .sidebar-upgrade-card{
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}
.cuba-redesign .company-control-main,
.cuba-redesign .app-main{
  padding:clamp(1.1rem,2.8vw,2rem);
}
.cuba-redesign .app-header,
.cuba-redesign .detail-hero,
.cuba-redesign .app-command-bar,
.cuba-redesign .agent-page-header,
.cuba-redesign .agent-phone-hero{
  position:relative;
  overflow:hidden;
  border:1px solid var(--cuba-line)!important;
  border-radius:24px!important;
  background:linear-gradient(145deg,#fff 0%,#f8f7ff 100%)!important;
  box-shadow:var(--cuba-shadow)!important;
}
.cuba-redesign .command-tabs a{
  border-radius:10px;
  background:#fff;
  border:1px solid var(--cuba-line);
  color:#6b6b83;
}
.cuba-redesign .command-tabs a.active,
.cuba-redesign .command-tabs a:hover{
  background:rgba(115,102,255,.11);
  border-color:#dcd8ff;
  color:var(--theme-default);
}
.cuba-redesign .metric-grid,
.cuba-redesign .compact-kpi-grid,
.cuba-redesign .billing-metrics,
.cuba-redesign .agent-metrics,
.cuba-redesign .call-analytics-grid{
  gap:.95rem;
}
.cuba-redesign .metric-card strong,
.cuba-redesign .billing-metrics article strong,
.cuba-redesign .agent-metric strong,
.cuba-redesign .agent-stat-row strong{
  color:var(--cuba-ink);
  font-weight:900;
}
.cuba-redesign .metric-card span,
.cuba-redesign .billing-metrics article span,
.cuba-redesign .agent-metric span{
  color:#767692;
  font-weight:800;
}
.cuba-redesign .metric-sparkline,
.cuba-redesign .bar{
  background:#f1f2f8!important;
}
.cuba-redesign .metric-sparkline i,
.cuba-redesign .bar i{
  background:linear-gradient(90deg,var(--theme-default),var(--theme-secondary))!important;
}
.cuba-redesign .table-wrap,
.cuba-redesign .agent-table-wrap{
  border:1px solid var(--cuba-line);
  border-radius:18px;
  background:#fff;
  overflow:auto;
}
.cuba-redesign .call-table,
.cuba-redesign .agent-table{
  border-collapse:separate;
  border-spacing:0;
}
.cuba-redesign .call-table th,
.cuba-redesign .agent-table th{
  background:#f6f7fb;
  color:#6f6f8b;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.065em;
  border-bottom:1px solid var(--cuba-line);
}
.cuba-redesign .call-table td,
.cuba-redesign .agent-table td{
  border-bottom:1px solid #f0f3f8;
}
.cuba-redesign .call-result,
.cuba-redesign .agent-result-pill,
.cuba-redesign .direction-pill,
.cuba-redesign .hangup-pill{
  border-radius:999px;
  border:1px solid var(--cuba-line);
  font-weight:800;
}
.cuba-redesign .call-result.answered,
.cuba-redesign .agent-result-pill.answered,
.cuba-redesign .pill-answered{background:#eaf8ea!important;color:#2f8f2e!important;border-color:#cfeecb!important}
.cuba-redesign .call-result.failed,
.cuba-redesign .agent-result-pill.failed,
.cuba-redesign .pill-failed{background:#fff0f2!important;color:#d73255!important;border-color:#ffd4dd!important}
.cuba-redesign .call-result.missed,
.cuba-redesign .agent-result-pill.missed,
.cuba-redesign .pill-missed{background:#fff6df!important;color:#b87700!important;border-color:#ffe3a0!important}
.cuba-redesign .rec-play-btn{
  border-radius:10px;
  background:#f4f2ff;
  color:var(--theme-default);
  border:1px solid #dcd8ff;
}
.cuba-redesign .billing-wallet-grid,
.cuba-redesign .insight-grid,
.cuba-redesign .quick-actions-grid,
.cuba-redesign .agent-detail-grid,
.cuba-redesign .recording-grid{
  gap:1rem;
}
.cuba-redesign .wallet-balance-card,
.cuba-redesign .billing-actions,
.cuba-redesign .billing-proration-note{
  border:1px solid var(--cuba-line)!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:0 7px 18px rgba(46,35,94,.05)!important;
}

/* Agent panel: Cuba dashboard shell with vivid softphone cards */
body.cuba-redesign.agent-mode{
  background:
    radial-gradient(circle at 78% 0%,rgba(247,49,100,.12),transparent 28rem),
    linear-gradient(180deg,#f7f8fc 0%,#f2f3f9 100%)!important;
}
.cuba-redesign .agent-sidebar{
  background:linear-gradient(180deg,#1f1f3f 0%,#15152d 100%)!important;
  border-right:0!important;
  box-shadow:10px 0 28px rgba(46,35,94,.12)!important;
}
.cuba-redesign .agent-logo{
  border-bottom:1px solid rgba(255,255,255,.12);
}
.cuba-redesign .agent-logo strong{color:#fff!important}
.cuba-redesign .agent-nav a,
.cuba-redesign .agent-logout{
  border-radius:12px;
  color:rgba(255,255,255,.72)!important;
}
.cuba-redesign .agent-nav a.active,
.cuba-redesign .agent-nav a:hover,
.cuba-redesign .agent-logout:hover{
  background:linear-gradient(90deg,rgba(115,102,255,.36),rgba(247,49,100,.18))!important;
  color:#fff!important;
  box-shadow:none!important;
}
.cuba-redesign .agent-sidebar-profile{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.08);
}
.cuba-redesign .agent-initial,
.cuba-redesign .avatar{
  background:linear-gradient(135deg,var(--theme-default),var(--theme-secondary));
  color:#fff;
  box-shadow:0 10px 24px rgba(115,102,255,.22);
}
.cuba-redesign .agent-dialer-card{
  background:linear-gradient(180deg,#fff 0%,#faf9ff 100%)!important;
  border-radius:30px!important;
}
.cuba-redesign .agent-dialer-card:before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 50% -22%,rgba(115,102,255,.16),transparent 42%);
  pointer-events:none;
}
.cuba-redesign .agent-key,
.cuba-redesign .dialpad-btn,
.cuba-redesign .agent-dtmf-key{
  border:1px solid var(--cuba-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  color:var(--cuba-ink)!important;
  box-shadow:0 8px 18px rgba(46,35,94,.05)!important;
}
.cuba-redesign .agent-key:hover,
.cuba-redesign .dialpad-btn:hover,
.cuba-redesign .agent-dtmf-key:hover{
  border-color:#dcd8ff!important;
  background:#f7f5ff!important;
  transform:translateY(-2px);
}
.cuba-redesign .agent-dialer-status,
.cuba-redesign .agent-dialer-country,
.cuba-redesign .agent-trial-badge,
.cuba-redesign .agent-phone-hero-status,
.cuba-redesign .agent-status-line{
  border:1px solid var(--cuba-line)!important;
  background:#fff!important;
  box-shadow:0 6px 16px rgba(46,35,94,.05)!important;
}
.cuba-redesign .agent-pulse.ready{background:var(--cuba-success)!important;box-shadow:0 0 0 5px rgba(84,186,74,.18)!important}
.cuba-redesign .agent-pulse.waiting{background:var(--cuba-warning)!important;box-shadow:0 0 0 5px rgba(255,170,5,.18)!important}
.cuba-redesign .agent-pulse.error{background:var(--cuba-danger)!important;box-shadow:0 0 0 5px rgba(252,68,56,.16)!important}
.cuba-redesign .agent-pulse.active{background:var(--theme-default)!important;box-shadow:0 0 0 5px rgba(115,102,255,.18)!important}
.cuba-redesign .agent-call-controls,
.cuba-redesign .agent-note-card,
.cuba-redesign .agent-trial-note,
.cuba-redesign .agent-security-note{
  border:1px solid var(--cuba-line)!important;
  border-radius:18px!important;
  background:#fff!important;
}
.cuba-redesign .agent-ctrl-btn{
  border:1px solid var(--cuba-line)!important;
  border-radius:14px!important;
  background:#f8f9fd!important;
}
.cuba-redesign .agent-ctrl-hangup{
  background:#fff0f2!important;
  color:var(--cuba-danger)!important;
  border-color:#ffd4dd!important;
}
.cuba-redesign .agent-phone-engine-hidden{display:none!important}

/* Utility states */
.cuba-redesign .alert,
.cuba-redesign .agent-alert{
  border-radius:16px!important;
  border:1px solid var(--cuba-line)!important;
  box-shadow:0 7px 18px rgba(46,35,94,.05)!important;
}
.cuba-redesign .alert.success,
.cuba-redesign .agent-alert-success{background:#eaf8ea!important;color:#2f8f2e!important;border-color:#cfeecb!important}
.cuba-redesign .alert.error,
.cuba-redesign .agent-alert-error{background:#fff0f2!important;color:#d73255!important;border-color:#ffd4dd!important}
.cuba-redesign .site-footer{
  max-width:min(1420px,calc(100% - 28px));
  margin:1rem auto 14px;
  border:1px solid var(--cuba-line);
  border-radius:20px;
  background:#fff;
  color:#6f6f8b;
  box-shadow:var(--cuba-shadow);
}

@media(max-width:1180px){
  .cuba-redesign .signup-shell{grid-template-columns:1fr;max-width:680px}
  .cuba-redesign .south-pricing-wrap,.cuba-redesign .compact-production-pricing{padding:.9rem}
}
@media(max-width:860px){
  .preprod-ribbon{position:static;margin:.5rem auto 0;width:max-content;max-width:calc(100% - 1rem)}
  .cuba-redesign .site-nav{margin:.5rem;max-width:none;border-radius:18px}
  .cuba-redesign .tragofone-hero,
  .cuba-redesign .compact-price-hero,
  .cuba-redesign .page-hero,
  .cuba-redesign .dark-band,
  .cuba-redesign .final-cta,
  .cuba-redesign .download-strip,
  .cuba-redesign .site-footer{max-width:none;margin:.75rem .5rem;border-radius:22px}
  .cuba-redesign .app-sidebar,
  .cuba-redesign .agent-sidebar{border-radius:0!important}
  .cuba-redesign .agent-nav a,.cuba-redesign .app-sidebar nav a{min-width:max-content}
  .cuba-redesign .app-header,.cuba-redesign .app-command-bar,.cuba-redesign .agent-page-header,.cuba-redesign .agent-phone-hero{border-radius:20px!important}
  .cuba-redesign .panel,.cuba-redesign .agent-card,.cuba-redesign .agent-dialer-card{border-radius:20px!important}
}
@media(max-width:520px){
  .cuba-redesign .primary,
  .cuba-redesign .secondary,
  .cuba-redesign .agent-btn-secondary,
  .cuba-redesign .agent-btn-primary{border-radius:12px;width:100%}
  .cuba-redesign .compact-price-box,.cuba-redesign .auth-card,.cuba-redesign .auth-side{border-radius:20px!important}
}