/* VelocityDial sharp-corner design layer.
   Loaded after page-specific styles so every surface shares one geometry scale. */
:root{
  --radius-sm:4px;
  --radius-md:6px;
  --radius-lg:8px;
  --radius-xl:10px;
  --vd-corner-control:6px;
  --vd-corner-surface:9px;
}

body :is(
  [class*="card"],
  [class*="panel"],
  [class*="shell"],
  [class*="modal"],
  [class*="dialog"],
  [class*="dropdown"],
  [class*="menu"],
  [class*="switch"],
  [class*="header"],
  [class*="hero"],
  [class*="toolbar"],
  [class*="table-wrap"],
  [class*="directory"]
){
  border-radius:var(--vd-corner-surface)!important;
}

body :is(
  button,
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea,
  [role="button"],
  [class*="button"],
  [class*="-btn"],
  [class*="-cta"],
  [class*="-tab"],
  [class*="-row"],
  [class*="-item"],
  [class*="-box"],
  [class*="-strip"],
  [class*="-bar"],
  [class*="notice"],
  [class*="alert"],
  [class*="empty-state"],
  [class*="icon"]
){
  border-radius:var(--vd-corner-control)!important;
}

/* Dedicated public-page and pricing surfaces without generic component suffixes. */
body :is(
  .reference-nav,
  .final-cta,
  .clean-final-cta,
  .softphone-hero-board,
  .webphone-showcase,
  .pricing-v3-summary,
  .pricing-v3-total,
  .pricing-v3-facts div,
  .pricing-v3-rate-panel,
  .pricing-v3-steps article,
  .pricing-v3-bottom article
){
  border-radius:var(--vd-corner-surface)!important;
}

body article,
body section,
body details,
body .ref-number-field,
body .ref-dialer-options > div,
body .ref-login-menu > div{
  border-radius:var(--vd-corner-surface)!important;
}

/* Keep identity and compact state markers intentionally circular. */
body :is(
  [class*="avatar"],
  [class*="badge"],
  [class*="chip"],
  [class*="pill"],
  [class*="tag"],
  [class*="dot"],
  [class*="orb"],
  [class*="indicator"]
){
  border-radius:999px!important;
}

body :is(.brand-mark,.brand-mark-mini,.brand-mark-pill,.agent-logo-mark){
  border-radius:0!important;
}

body .reference-nav > nav a,
body .ref-login-menu summary,
body .ref-login-menu > div a{
  border-radius:var(--vd-corner-control)!important;
}

/* Authenticated SaaS panels use an even tighter enterprise geometry.
   Repeated body classes deliberately outrank older panel-specific !important rules. */
body.company-control-body.company-control-body,
body.agent-mode.agent-mode{
  --vd-panel-corner-control:5px;
  --vd-panel-corner-surface:7px;
}

body.company-control-body.company-control-body :is(
  article,
  section,
  details,
  [class*="card"],
  [class*="panel"],
  [class*="hero"],
  [class*="shell"],
  [class*="sidebar"],
  [class*="topbar"],
  [class*="toolbar"],
  [class*="workspace"],
  [class*="directory"],
  [class*="table-wrap"],
  [class*="modal"],
  [class*="dialog"],
  [class*="drawer"],
  [class*="dropdown"],
  [class*="menu"],
  [class*="metric"],
  [class*="stat"],
  [class*="insight"],
  [class*="summary"],
  [class*="event"],
  [class*="notice"],
  [class*="empty"]
),
body.agent-mode.agent-mode :is(
  article,
  section,
  details,
  [class*="card"],
  [class*="panel"],
  [class*="hero"],
  [class*="shell"],
  [class*="sidebar"],
  [class*="topbar"],
  [class*="toolbar"],
  [class*="workspace"],
  [class*="directory"],
  [class*="table-wrap"],
  [class*="modal"],
  [class*="dialog"],
  [class*="drawer"],
  [class*="dropdown"],
  [class*="menu"],
  [class*="metric"],
  [class*="stat"],
  [class*="insight"],
  [class*="summary"],
  [class*="event"],
  [class*="notice"],
  [class*="empty"]
){
  border-radius:var(--vd-panel-corner-surface)!important;
}

body.company-control-body.company-control-body :is(
  button,
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea,
  [role="button"],
  a[class],
  [class*="button"],
  [class*="-btn"],
  [class*="-tab"],
  [class*="trigger"],
  [class*="action"],
  [class*="control"],
  [class*="field"],
  [class*="input"],
  [class*="key"],
  [class*="icon"],
  [class*="initial"],
  [class*="-row"],
  [class*="-item"],
  [class*="-box"],
  [class*="-strip"],
  [class*="-bar"]
),
body.agent-mode.agent-mode :is(
  button,
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea,
  [role="button"],
  a[class],
  [class*="button"],
  [class*="-btn"],
  [class*="-tab"],
  [class*="trigger"],
  [class*="action"],
  [class*="control"],
  [class*="field"],
  [class*="input"],
  [class*="key"],
  [class*="icon"],
  [class*="initial"],
  [class*="-row"],
  [class*="-item"],
  [class*="-box"],
  [class*="-strip"],
  [class*="-bar"]
){
  border-radius:var(--vd-panel-corner-control)!important;
}

body.company-control-body.company-control-body :is(
  [class*="avatar"],
  [class*="badge"],
  [class*="chip"],
  [class*="pill"],
  [class*="tag"],
  [class*="dot"],
  [class*="indicator"]
),
body.agent-mode.agent-mode :is(
  [class*="avatar"],
  [class*="badge"],
  [class*="chip"],
  [class*="pill"],
  [class*="tag"],
  [class*="dot"],
  [class*="indicator"],
  .agent-dialer-status,
  .agent-dialer-country,
  .agent-active-country,
  .agent-contact-scope,
  .agent-call-timezone,
  .agent-call-count
){
  border-radius:999px!important;
}

body.company-control-body.company-control-body :is(.brand-mark,.brand-mark-mini,.brand-mark-pill),
body.agent-mode.agent-mode :is(.agent-logo-mark,.brand-mark,.brand-mark-mini,.brand-mark-pill){
  border-radius:0!important;
}

/* Agent shell alignment: one shared gutter and one shared identity/icon column. */
@media(min-width:1081px){
  body.agent-mode.agent-mode .agent-sidebar{
    width:264px!important;
    padding:18px 14px!important;
  }

  body.agent-mode.agent-mode .agent-logo{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr)!important;
    align-items:center!important;
    column-gap:10px!important;
    width:100%!important;
    min-height:50px!important;
    margin:0!important;
    padding:0 10px 14px!important;
  }

  body.agent-mode.agent-mode .agent-logo-mark{
    width:38px!important;
    height:28px!important;
    justify-self:center!important;
  }

  body.agent-mode.agent-mode .agent-brand-copy{
    align-self:center!important;
    justify-self:stretch!important;
    line-height:1.15!important;
  }

  body.agent-mode.agent-mode .agent-workspace-card{
    grid-template-columns:38px minmax(0,1fr) 8px!important;
    align-items:center!important;
    column-gap:10px!important;
    min-height:68px!important;
    margin:14px 0 16px!important;
    padding:10px!important;
  }

  body.agent-mode.agent-mode .agent-workspace-card .agent-initial{
    display:grid!important;
    width:38px!important;
    height:38px!important;
    place-items:center!important;
    justify-self:center!important;
    line-height:1!important;
  }

  body.agent-mode.agent-mode .agent-workspace-card > div{
    align-self:center!important;
    line-height:1.2!important;
  }

  body.agent-mode.agent-mode .agent-workspace-card > i{
    justify-self:center!important;
  }

  body.agent-mode.agent-mode .agent-nav-label{
    width:auto!important;
    margin:0 10px 6px!important;
    line-height:1.2!important;
  }

  body.agent-mode.agent-mode .agent-nav{
    gap:4px!important;
    width:100%!important;
  }

  body.agent-mode.agent-mode .agent-nav > a,
  body.agent-mode.agent-mode .agent-nav > .vd-more-menu > summary{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) auto!important;
    align-items:center!important;
    column-gap:10px!important;
    width:100%!important;
    min-height:44px!important;
    margin:0!important;
    padding:7px 10px!important;
  }

  body.agent-mode.agent-mode .agent-nav-icon{
    width:27px!important;
    height:27px!important;
    justify-self:center!important;
  }

  body.agent-mode.agent-mode .agent-nav > a strong,
  body.agent-mode.agent-mode .agent-nav > .vd-more-menu > summary strong{
    min-width:0!important;
    margin:0!important;
    line-height:1.2!important;
    text-align:left!important;
  }

  body.agent-mode.agent-mode .agent-nav > .vd-more-menu > div{
    margin-left:48px!important;
  }

  body.agent-mode.agent-mode .agent-sidebar-bottom{
    width:100%!important;
    padding-top:12px!important;
  }
}

@media(min-width:761px) and (max-width:1080px){
  body.agent-mode.agent-mode .agent-sidebar{
    row-gap:8px!important;
  }

  body.agent-mode.agent-mode .agent-logo{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr)!important;
    align-items:center!important;
    column-gap:9px!important;
  }

  body.agent-mode.agent-mode .agent-logo-mark{
    width:38px!important;
    height:28px!important;
  }

  body.agent-mode.agent-mode .agent-nav{
    align-items:center!important;
  }

  body.agent-mode.agent-mode .agent-nav > a,
  body.agent-mode.agent-mode .agent-nav > .vd-more-menu > summary{
    display:grid!important;
    grid-template-columns:27px minmax(0,max-content)!important;
    align-items:center!important;
    column-gap:7px!important;
    min-height:40px!important;
  }
}

@media(min-width:901px) and (max-width:1080px){
  body.agent-mode.agent-mode .agent-phone-side{
    grid-template-columns:1fr!important;
  }

  body.agent-mode.agent-mode .agent-phone-side > *{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
  }
}

@media(max-width:760px){
  :root{
    --vd-corner-control:5px;
    --vd-corner-surface:8px;
  }

  body.company-control-body.company-control-body,
  body.agent-mode.agent-mode{
    --vd-panel-corner-control:4px;
    --vd-panel-corner-surface:6px;
  }

  body.agent-mode.agent-mode .agent-logo-mark{
    width:38px!important;
    height:28px!important;
  }

  body.agent-mode.agent-mode .agent-nav{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    align-items:stretch!important;
    gap:4px!important;
    overflow:visible!important;
    padding:0!important;
  }

  body.agent-mode.agent-mode .agent-nav > a,
  body.agent-mode.agent-mode .agent-nav > .vd-more-menu > summary{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
    padding:7px 6px!important;
    line-height:1.15!important;
    text-align:center!important;
  }
}

/* Agent autodialer alignment */
.agent-mode.agent-tab-autodialer .agent-autodialer-grid{
  align-items:stretch!important;
}

.agent-mode.agent-tab-autodialer .agent-autodialer-grid>.agent-card{
  height:100%;
}

.agent-mode.agent-tab-autodialer .agent-readiness-list{
  gap:8px!important;
}

.agent-mode.agent-tab-autodialer .agent-readiness-step{
  grid-template-columns:32px minmax(0,1fr) 68px!important;
  min-height:74px!important;
  column-gap:12px!important;
}

.agent-mode.agent-tab-autodialer .agent-readiness-number{
  width:32px!important;
  height:32px!important;
}

.agent-mode.agent-tab-autodialer .agent-readiness-chip{
  min-width:68px!important;
  text-align:center!important;
  justify-self:end!important;
}

@media(min-width:1161px){
  .agent-mode.agent-tab-autodialer .agent-queue-actions{
    align-self:start!important;
    margin-top:19px!important;
  }
}

@media(max-width:1160px){
  .agent-mode.agent-tab-autodialer .agent-queue-actions{
    margin-top:0!important;
  }
}

@media(max-width:900px){
  .agent-mode.agent-tab-autodialer .agent-autodialer-grid>.agent-card{
    height:auto;
  }
}

@media(max-width:620px){
  .agent-mode.agent-tab-autodialer .agent-readiness-step{
    grid-template-columns:32px minmax(0,1fr)!important;
    min-height:0!important;
  }

  .agent-mode.agent-tab-autodialer .agent-readiness-chip{
    grid-column:2!important;
    min-width:0!important;
    justify-self:start!important;
  }
}