/* Consultant Chat — Studio Theme (premium) */
.ccmvp-widget{
  position:fixed;
  bottom: calc(var(--ccmvp-offset-bottom, 18px) + var(--ccmvp-offset-bottom-dyn, 0px));
  z-index:99999;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
  letter-spacing: -.01em;
}


/* ============================
   Modal Call Menu (center) + backdrop
   - Call menu can be shown centered as a modal.
   - Callback form stays as the classic side panel.
   ============================ */
.ccmvp-overlay{
  position: fixed;
  inset: 0;
  z-index: 0;
  background: rgba(2,6,23,.42);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
/* subtle "film" grain */
.ccmvp-widget.is-overlay-noblur .ccmvp-overlay{
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
.ccmvp-overlay::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(1200px 520px at 20% 10%, rgba(255,255,255,.10), transparent 60%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 3px);
  opacity:.55;
  pointer-events:none;
}
.ccmvp-widget.is-open.is-overlay .ccmvp-overlay{
  opacity: 1;
  pointer-events: auto;
}
/* Center the panel only in modal mode */
.ccmvp-widget.is-modal .ccmvp-panel{
  position: fixed;
  left: 50%;
  top: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%,-50%) scale(.985);
}
.ccmvp-widget.is-open.is-modal .ccmvp-panel{
  transform: translate(-50%,-50%) scale(1);
}


/* ============================
   OpenWork UX additions
   ============================ */

/* Back button (shown when navigating between views) */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-back{
  width:42px !important;
  height:42px !important;
  border-radius:999px !important;
  background: rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  color:#fff !important;
  font-weight:900 !important;
  display:grid !important;
  place-items:center !important;
  cursor:pointer !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-back:hover{ background: rgba(255,255,255,.12) !important; }

/* Simple modern transition between views */
.ccmvp-anim .ccmvp-view:not([hidden]){ animation: ccmvpFadeUp .18s ease-out both; }
@keyframes ccmvpFadeUp{ from{ opacity:0; transform: translateY(6px);} to{ opacity:1; transform: translateY(0);} }

/* Success view */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-view--success{ padding: 24px 24px 28px !important; }
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-success{ text-align:center !important; }
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-success-title{ font-weight:950 !important; font-size:22px !important; color:#0b1220 !important; margin: 6px 0 8px !important; }
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-success-sub{ font-weight:650 !important; color:#64748b !important; line-height:1.45 !important; margin:0 0 16px !important; }
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-success-actions{ display:flex !important; justify-content:center !important; gap:10px !important; flex-wrap:wrap !important; }
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-success-back,
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-success-close{
  min-height:44px !important;
  padding:10px 14px !important;
  border-radius:14px !important;
  border:1px solid rgba(15,23,42,.12) !important;
  background:#fff !important;
  color:#0f172a !important;
  font-weight:850 !important;
  cursor:pointer !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-success-close{
  background: linear-gradient(180deg,#1fb154,#16a34a) !important;
  border-color: rgba(22,163,74,.35) !important;
  color:#fff !important;
}

/* Box-sizing: prevent width/height stretching from padding+min-height */
.ccmvp-widget,
.ccmvp-widget *,
.ccmvp-widget *::before,
.ccmvp-widget *::after{
  box-sizing: border-box;
}

/* Reset: isolate from theme typography */
.ccmvp-widget :where(h1,h2,h3,h4,h5,h6,p){ margin:0; }
.ccmvp-widget :where(a){ color: inherit; }
.ccmvp-widget :where(button,input,textarea,select){ font: inherit; }


/* placement */
.ccmvp-widget.is-right{ right: var(--ccmvp-offset-side, 18px); }
.ccmvp-widget.is-left{ left: var(--ccmvp-offset-side, 18px); }

/* tokens */
:root{
  --ccmvp-bg: rgba(255,255,255,.88);
  --ccmvp-text:#0b1220;
  --ccmvp-muted:#5b6475;
  --ccmvp-border: rgba(15, 23, 42, .10);
  --ccmvp-shadow: 0 18px 60px rgba(2,6,23,.22);
  --ccmvp-shadow-soft: 0 12px 28px rgba(2,6,23,.14);
  --ccmvp-radius: 22px;
  --ccmvp-radius-sm: 14px;
}

/* FAB */
.ccmvp-fab{
  width:58px;height:58px;border-radius:999px;
  border:1px solid rgba(255,255,255,.45);
  cursor:pointer;
  background:
    radial-gradient(24px 24px at 28% 20%, rgba(255,255,255,.60), transparent 55%),
    linear-gradient(145deg, rgba(255,255,255,.18), rgba(2,6,23,.06)),
    var(--ccmvp-accent);
  box-shadow: 0 14px 32px rgba(2,6,23,.22);
  display:flex;align-items:center;justify-content:center;
  position:relative;
  transform: translateY(0);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
  -webkit-tap-highlight-color: transparent;
}
.ccmvp-fab:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 44px rgba(2,6,23,.26);
  /* keep premium look; avoid "black" hover if theme applies aggressive button hovers */
  filter: brightness(1.02) saturate(1.05);
}
.ccmvp-fab:active{ transform: translateY(0); }
.ccmvp-fab-ico{ font-size:22px; line-height:1; transform: translateY(1px); }
.ccmvp-fab-dot{
  position:absolute; top:10px; right:10px;
  width:10px;height:10px;border-radius:999px;
  background:#22c55e;
  box-shadow:0 0 0 4px rgba(34,197,94,.18);
}

/* Panel */
.ccmvp-panel{
  width:372px; max-width:calc(100vw - 32px);
  background: var(--ccmvp-bg);
  border-radius: var(--ccmvp-radius);
  box-shadow: var(--ccmvp-shadow);
  overflow:hidden;
  z-index: 1;
  opacity:0;
  pointer-events:none;
  position:absolute;
  bottom:74px;
  border: 1px solid var(--ccmvp-border);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  transform: translateY(14px) scale(.985);
  transition: transform .20s cubic-bezier(.2,.9,.2,1), opacity .20s ease;
}
.ccmvp-widget.is-right .ccmvp-panel{ right:0; }
.ccmvp-widget.is-left .ccmvp-panel{ left:0; }

.ccmvp-widget.is-open .ccmvp-panel{
  opacity:1;
  pointer-events:auto;
  transform: translateY(0) scale(1);
}

/* Header */
.ccmvp-head{
  display:flex; gap:12px;
  align-items:flex-start;
  padding:16px 16px 14px;
  background:
    radial-gradient(900px 320px at 80% 0%, rgba(var(--ccmvp-accent-rgb, 242,194,0), .28), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.82) 0%, rgba(247,250,248,.82) 100%);
  border-bottom:1px solid rgba(15,23,42,.08);
  position:relative;
}
.ccmvp-head:before{
  content:"";
  width:38px;height:38px;border-radius:14px;
  background-color: var(--ccmvp-accent);
  background-image:
    var(--ccmvp-avatar-url, none),
    radial-gradient(20px 20px at 30% 25%, rgba(255,255,255,.55), transparent 55%),
    linear-gradient(145deg, rgba(255,255,255,.14), rgba(0,0,0,.10));
  background-size: cover, auto, auto;
  background-position: center, 30% 25%, 0 0;
  background-repeat: no-repeat;
  box-shadow: 0 10px 22px rgba(2,6,23,.14);
  flex:0 0 auto;
  margin-top:2px;
}
.ccmvp-head:after{
  /* "online" dot near avatar */
  content:"";
  position:absolute;
  left: 44px;
  top: 18px;
  width:10px;height:10px;border-radius:999px;
  background:#22c55e;
  box-shadow:0 0 0 4px rgba(34,197,94,.18), 0 8px 18px rgba(2,6,23,.16);
}
.ccmvp-title{
  font-weight:800;
  font-size:15.5px;
  color:var(--ccmvp-text);
  line-height:1.15;
}
.ccmvp-sub{
  font-size:12.5px;
  color:var(--ccmvp-muted);
  margin-top:4px;
  line-height:1.35;
}
.ccmvp-close{
  margin-left:auto;
  width:34px;height:34px;border-radius:12px;
  border:1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.74);
  cursor:pointer;
  transition: transform .16s ease, background .16s ease;
}
.ccmvp-close:hover{ transform: scale(1.04); background:#fff; }
.ccmvp-close:active{ transform: scale(.98); }

/* Body */
.ccmvp-body{ padding:14px 16px 16px; }

/* Action buttons */
.ccmvp-actions{ display:grid; gap:10px; }

.ccmvp-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:11px 12px;
  border-radius: 16px;
  text-decoration:none;
  color:var(--ccmvp-accent-ink, #fff);
  font-weight:750;
  border: 1px solid rgba(255,255,255,.18);
  background:
    radial-gradient(24px 24px at 20% 18%, rgba(255,255,255,.45), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,0,0,.08)),
    var(--ccmvp-accent);
  box-shadow: var(--ccmvp-shadow-soft);
  transform: translateY(0);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.ccmvp-btn:hover{
  transform: translateY(-1px);
  filter: saturate(1.04);
  box-shadow: 0 16px 34px rgba(2,6,23,.18);
}
.ccmvp-btn:active{ transform: translateY(0); }

.ccmvp-btn--ghost{
  color: var(--ccmvp-text);
  background:
    radial-gradient(26px 26px at 20% 18%, rgba(255,255,255,.65), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(247,250,248,.82));
  border: 1px solid rgba(15,23,42,.10);
  box-shadow: 0 10px 22px rgba(2,6,23,.10);
}


/* Action icons (clean, studio) */
.ccmvp-btn[data-ccmvp-action]::before{
  content:"";
  width:22px;height:22px;
  border-radius:999px;
  background: rgba(255,255,255,.18);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.22);
  flex:0 0 auto;
  -webkit-mask: var(--ccmvp-ico) center / 14px 14px no-repeat;
  mask: var(--ccmvp-ico) center / 14px 14px no-repeat;
  background-color: var(--ccmvp-accent-ink, #fff);
}

.ccmvp-btn[data-ccmvp-action="telegram"]{ --ccmvp-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21.7 3.9L2.9 11.2c-1.3.5-1.2 1.2-.2 1.5l4.8 1.5 1.8 5.5c.2.6.1.8.7.8.5 0 .7-.2 1-.5l2.3-2.2 4.8 3.5c.9.5 1.5.2 1.7-.8l3.1-14.6c.3-1.2-.5-1.7-1.2-1.4zM9 14.1l10-6.3c.5-.3.9-.1.5.2l-8.1 7.4-.3 3.4-1.9-6.1z'/%3E%3C/svg%3E"); }
.ccmvp-btn[data-ccmvp-action="viber"]{ --ccmvp-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.4 17.1c-.2.9-1.2 2.1-2 2.3-1.2.3-2.8.4-6.4-1.6-3.5-2-5.8-4.6-7-7.8-.4-1.1.1-2.3.8-3.1.4-.4 1-.6 1.5-.5l1.8.4c.4.1.7.4.8.8l.5 2c.1.5 0 1-.4 1.3l-.8.7c.7 1.4 2 2.9 3.4 3.8l.8-.8c.4-.4.9-.5 1.4-.4l2 .5c.4.1.7.4.8.8l.4 1.7c.1.4 0 .9-.4 1.2zM14.7 5.1c2.3.6 4 2.4 4.5 4.7.1.4-.2.8-.6.9-.4.1-.8-.2-.9-.6-.4-1.8-1.7-3.2-3.5-3.6-.4-.1-.7-.5-.6-.9.1-.4.5-.7.9-.5zM14.4 2.4c3.5.8 6.2 3.6 7 7.2.1.4-.2.8-.6.9-.4.1-.8-.2-.9-.6-.7-3-3-5.4-6-6.1-.4-.1-.7-.5-.6-.9.1-.4.5-.7 1.1-.5z'/%3E%3C/svg%3E"); }
.ccmvp-btn[data-ccmvp-action="call"]{ --ccmvp-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8c1.6 3 3.6 5 6.6 6.6l2.2-2.2c.4-.4 1-.5 1.5-.3 1 .4 2.2.7 3.4.7.6 0 1 .4 1 1V21c0 .6-.4 1-1 1C11.4 22 2 12.6 2 1c0-.6.4-1 1-1h3.8c.6 0 1 .4 1 1 0 1.2.2 2.4.7 3.4.2.5.1 1.1-.3 1.5L6.6 10.8z'/%3E%3C/svg%3E"); }

.ccmvp-btn--ghost[data-ccmvp-action]::before{
  background-color: var(--ccmvp-accent);
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.06);
}

/* Divider */
.ccmvp-divider{
  margin:14px 0 12px;
  display:flex; align-items:center; gap:10px;
  color:#95a0b3; font-size:12px;
}
.ccmvp-divider:before,.ccmvp-divider:after{
  content:""; height:1px; background:rgba(15,23,42,.10); flex:1;
}
.ccmvp-divider span{
  padding:2px 10px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  background: rgba(255,255,255,.72);
}


/* ============================
   Icon system (mask icons)
   ============================ */
.ccmvp-widget .ccmvp-ico{
  width: 18px; height: 18px;
  display:inline-block;
  background-color: currentColor;
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}
.ccmvp-widget .ccmvp-ico--phone{ -webkit-mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTYuNiAxMC4yYzEuNyAzLjQgMy44IDUuNSA3LjIgNy4ybDIuNC0yLjRjLjMtLjMuOC0uNCAxLjItLjIgMS4zLjQgMi43LjcgNC4yLjcuNyAwIDEuMi41IDEuMiAxLjJWMjFjMCAuNy0uNSAxLjItMS4yIDEuMkMxMC41IDIyLjIgMS44IDEzLjUgMS44IDIuNCAxLjggMS43IDIuMyAxLjIgMyAxLjJoMy42Yy43IDAgMS4yLjUgMS4yIDEuMiAwIDEuNC4yIDIuOC43IDQuMi4xLjQgMCAuOS0uMyAxLjJMNi42IDEwLjJaIiBmaWxsPSJjdXJyZW50Q29sb3IiLz48L3N2Zz4='); mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTYuNiAxMC4yYzEuNyAzLjQgMy44IDUuNSA3LjIgNy4ybDIuNC0yLjRjLjMtLjMuOC0uNCAxLjItLjIgMS4zLjQgMi43LjcgNC4yLjcuNyAwIDEuMi41IDEuMiAxLjJWMjFjMCAuNy0uNSAxLjItMS4yIDEuMkMxMC41IDIyLjIgMS44IDEzLjUgMS44IDIuNCAxLjggMS43IDIuMyAxLjIgMyAxLjJoMy42Yy43IDAgMS4yLjUgMS4yIDEuMiAwIDEuNC4yIDIuOC43IDQuMi4xLjQgMCAuOS0uMyAxLjJMNi42IDEwLjJaIiBmaWxsPSJjdXJyZW50Q29sb3IiLz48L3N2Zz4='); }
.ccmvp-widget .ccmvp-ico--ambulance{ -webkit-mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTMgNy41QTIuNSAyLjUgMCAwIDEgNS41IDVoOEEyLjUgMi41IDAgMCAxIDE2IDcuNVYxOGgtMmEyLjUgMi41IDAgMSAxLTUgMEg4YTIuNSAyLjUgMCAxIDEtNSAwSDJWOS41QTIgMiAwIDAgMSAzIDcuNVoiIGZpbGw9ImN1cnJlbnRDb2xvciIvPjxwYXRoIGQ9Ik0xNiA5aDMuMmEyIDIgMCAwIDEgMS43LjlsMS43IDIuNmMuMy41LjQgMSAuNCAxLjVWMThoLTJhMi41IDIuNSAwIDEgMS01IDBWOVoiIGZpbGw9ImN1cnJlbnRDb2xvciIvPjxwYXRoIGQ9Ik05IDloMnYyaDJ2MmgtMnYySDl2LTJIN3YtMmgyVjlaIiBmaWxsPSIjZmZmIi8+PC9zdmc+'); mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTMgNy41QTIuNSAyLjUgMCAwIDEgNS41IDVoOEEyLjUgMi41IDAgMCAxIDE2IDcuNVYxOGgtMmEyLjUgMi41IDAgMSAxLTUgMEg4YTIuNSAyLjUgMCAxIDEtNSAwSDJWOS41QTIgMiAwIDAgMSAzIDcuNVoiIGZpbGw9ImN1cnJlbnRDb2xvciIvPjxwYXRoIGQ9Ik0xNiA5aDMuMmEyIDIgMCAwIDEgMS43LjlsMS43IDIuNmMuMy41LjQgMSAuNCAxLjVWMThoLTJhMi41IDIuNSAwIDEgMS01IDBWOVoiIGZpbGw9ImN1cnJlbnRDb2xvciIvPjxwYXRoIGQ9Ik05IDloMnYyaDJ2MmgtMnYySDl2LTJIN3YtMmgyVjlaIiBmaWxsPSIjZmZmIi8+PC9zdmc+'); }
.ccmvp-widget .ccmvp-ico--bed{ -webkit-mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTQgMTAuNUEyLjUgMi41IDAgMCAxIDYuNSA4aDExQTIuNSAyLjUgMCAwIDEgMjAgMTAuNVYxOGgtMXYtMkg1djJINHYtNy41WiIgZmlsbD0iY3VycmVudENvbG9yIi8+PHBhdGggZD0iTTcgNi41QTIuNSAyLjUgMCAwIDEgOS41IDRoMkEyLjUgMi41IDAgMCAxIDE0IDYuNVY4SDdWNi41WiIgZmlsbD0iY3VycmVudENvbG9yIi8+PC9zdmc+'); mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTQgMTAuNUEyLjUgMi41IDAgMCAxIDYuNSA4aDExQTIuNSAyLjUgMCAwIDEgMjAgMTAuNVYxOGgtMXYtMkg1djJINHYtNy41WiIgZmlsbD0iY3VycmVudENvbG9yIi8+PHBhdGggZD0iTTcgNi41QTIuNSAyLjUgMCAwIDEgOS41IDRoMkEyLjUgMi41IDAgMCAxIDE0IDYuNVY4SDdWNi41WiIgZmlsbD0iY3VycmVudENvbG9yIi8+PC9zdmc+'); }
.ccmvp-widget .ccmvp-ico--telegram{ -webkit-mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTIxLjYgNC42IDIuOSAxMS44Yy0xIC40LTEgMS44IDAgMi4ybDQuNyAxLjggMS44IDUuNmMuMyAxIDEuNiAxLjEgMi4xLjNsMi42LTQuMSA0LjkgMy42Yy44LjYgMiAuMSAyLjMtLjlsMy40LTE1LjVjLjItMS0uOC0xLjktMS45LTEuNVptLTMuNiA0LjYtOC4yIDcuNGMtLjMuMy0uOC4xLS45LS4zbC0uNy0yLjQgMTAuNy01LjZjLjUtLjMgMSAuNC40LjlaIiBmaWxsPSJjdXJyZW50Q29sb3IiLz48L3N2Zz4='); mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTIxLjYgNC42IDIuOSAxMS44Yy0xIC40LTEgMS44IDAgMi4ybDQuNyAxLjggMS44IDUuNmMuMyAxIDEuNiAxLjEgMi4xLjNsMi42LTQuMSA0LjkgMy42Yy44LjYgMiAuMSAyLjMtLjlsMy40LTE1LjVjLjItMS0uOC0xLjktMS45LTEuNVptLTMuNiA0LjYtOC4yIDcuNGMtLjMuMy0uOC4xLS45LS4zbC0uNy0yLjQgMTAuNy01LjZjLjUtLjMgMSAuNC40LjlaIiBmaWxsPSJjdXJyZW50Q29sb3IiLz48L3N2Zz4='); }
.ccmvp-widget .ccmvp-ico--viber{ -webkit-mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTE4LjUgMy44Yy0zLjctMS4yLTkuMy0xLjItMTMgMEM0IDQuMyAzIDUuNyAzIDcuNHY4LjNjMCAxLjcgMSAzLjEgMi41IDMuNmwxLjQuNXYyLjFjMCAuNy44IDEuMSAxLjQuNmwyLjctMi4yYy4zLjEuNi4xIDEgLjEgMS45IDAgNC40LS4zIDYuNS0xIDEuNS0uNSAyLjUtMS45IDIuNS0zLjZWNy40YzAtMS43LTEtMy4xLTIuNS0zLjZabS0yLjkgMTEuOGMtLjMuMy0uOC4zLTEuMSAwbC0xLTFjLS4zLS4zLS4zLS44IDAtMS4xLjMtLjMuOC0uMyAxLjEgMGwxIDFjLjMuMy4zLjggMCAxLjFaIiBmaWxsPSJjdXJyZW50Q29sb3IiLz48L3N2Zz4='); mask-image:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSI+PHBhdGggZD0iTTE4LjUgMy44Yy0zLjctMS4yLTkuMy0xLjItMTMgMEM0IDQuMyAzIDUuNyAzIDcuNHY4LjNjMCAxLjcgMSAzLjEgMi41IDMuNmwxLjQuNXYyLjFjMCAuNy44IDEuMSAxLjQuNmwyLjctMi4yYy4zLjEuNi4xIDEgLjEgMS45IDAgNC40LS4zIDYuNS0xIDEuNS0uNSAyLjUtMS45IDIuNS0zLjZWNy40YzAtMS43LTEtMy4xLTIuNS0zLjZabS0yLjkgMTEuOGMtLjMuMy0uOC4zLTEuMSAwbC0xLTFjLS4zLS4zLS4zLS44IDAtMS4xLjMtLjMuOC0uMyAxLjEgMGwxIDFjLjMuMy4zLjggMCAxLjFaIiBmaWxsPSJjdXJyZW50Q29sb3IiLz48L3N2Zz4='); }

/* Form */
.ccmvp-form-title{
  font-weight:850;
  color:var(--ccmvp-text);
  margin-bottom:10px;
  letter-spacing:-.02em;
}
.ccmvp-field{ display:block; margin-bottom:10px; }
.ccmvp-field span{
  display:block;
  font-size:12px;
  color:var(--ccmvp-muted);
  margin-bottom:6px;
}
.ccmvp-field input,
.ccmvp-field textarea{
  width:100%;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.12);
  padding:11px 12px;
  outline:none;
  font-size:14px;
  background: rgba(255,255,255,.72);
  transition: box-shadow .16s ease, border-color .16s ease, transform .16s ease;
}
.ccmvp-field textarea{ resize:vertical; min-height:84px; }
.ccmvp-field input:focus,
.ccmvp-field textarea:focus{
  border-color: rgba(var(--ccmvp-accent-rgb, 242,194,0), .55);
  box-shadow: 0 0 0 4px rgba(var(--ccmvp-accent-rgb, 242,194,0), .20);
}
.ccmvp-field input::placeholder,
.ccmvp-field textarea::placeholder{ color: rgba(91,100,117,.70); }

/* Consent */
.ccmvp-consent{
  display:flex; gap:10px; align-items:flex-start;
  margin:10px 0 8px;
  font-size:12.5px; color:#4b5568;
  line-height:1.35;
}
.ccmvp-consent input{
  margin-top:2px;
  width:18px;height:18px;
  border-radius:6px;
  border:1px solid rgba(15,23,42,.18);
  appearance:none;
  -webkit-appearance:none;
  background: rgba(255,255,255,.78);
  display:grid;
  place-items:center;
  flex:0 0 auto;
  cursor:pointer;
}
.ccmvp-consent input:checked{
  background: var(--ccmvp-accent);
  border-color: rgba(255,255,255,.25);
  box-shadow: 0 0 0 4px rgba(var(--ccmvp-accent-rgb, 242,194,0), .18);
}
.ccmvp-consent input:checked:before{
  content:"";
  width:10px;height:10px;
  clip-path: polygon(14% 54%, 0 68%, 38% 100%, 100% 26%, 86% 12%, 36% 74%);
  background:#fff;
}

/* Privacy */
.ccmvp-privacy{
  font-size:12.5px;
  color:#6b7280;
  margin:0 0 10px;
}
.ccmvp-privacy a{
  color: var(--ccmvp-accent);
  text-decoration:none;
  border-bottom:1px solid rgba(var(--ccmvp-accent-rgb, 242,194,0), .35);
}
.ccmvp-privacy a:hover{ border-bottom-color: rgba(var(--ccmvp-accent-rgb, 242,194,0), .65); }

/* Submit */

.ccmvp-submit:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 44px rgba(2,6,23,.24);
}
.ccmvp-submit:active{ transform: translateY(0); }

.ccmvp-note{
  margin-top:9px;
  font-size:12.5px;
  min-height:16px;
  color:#6b7280;
}
.ccmvp-note.is-ok{ color:#16a34a; }
.ccmvp-note.is-err{ color:#dc2626; }

.ccmvp-hours{
  margin-top:10px;
  font-size:12.5px;
  color:#9aa3b2;
}

/* Mobile tweaks */
@media (max-width: 420px){
  .ccmvp-widget.is-right{ right: var(--ccmvp-offset-side, 14px); }
  .ccmvp-widget.is-left{ left: var(--ccmvp-offset-side, 14px); }
  .ccmvp-panel{ width: 344px; bottom: 70px; }
}


/* Submit button uses site accent */
.ccmvp-submit{
  width:100%;
  padding:12px 12px;
  border-radius: 16px;
  border:1px solid rgba(255,255,255,.18);
  cursor:pointer;
  background:
    radial-gradient(28px 28px at 18% 18%, rgba(255,255,255,.22), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(0,0,0,.08)),
    var(--ccmvp-accent);
  color: var(--ccmvp-accent-ink, #0b1220);
  font-weight:850;
  letter-spacing:-.01em;
  box-shadow: 0 16px 34px rgba(2,6,23,.20);
  transition: transform .16s ease, box-shadow .16s ease;
}
.ccmvp-submit:hover{ transform: translateY(-1px); box-shadow: 0 18px 44px rgba(2,6,23,.24); }
.ccmvp-submit:active{ transform: translateY(0); }

/* Online/offline dot (optional) */
.ccmvp-widget.is-offline .ccmvp-fab-dot{ background:#94a3b8; box-shadow:0 0 0 4px rgba(148,163,184,.18); }

/* Views */
.ccmvp-view{ display:block; }
.ccmvp-view[hidden]{ display:none !important; }

.ccmvp-offline-head{ padding: 4px 0 10px; }
.ccmvp-offline-title{ font-weight:850; color:var(--ccmvp-text,#0b1220); font-size:15px; }
.ccmvp-offline-sub{ margin-top:4px; color:#5b6475; font-size:12.5px; line-height:1.35; }
.ccmvp-offline-hours{ margin-top:8px; color:#9aa3b2; font-size:12.5px; }

.ccmvp-offline-phones{ display:grid; gap:10px; margin:12px 0 12px; }
.ccmvp-offline-phone{
  display:flex; align-items:center; gap:10px;
  text-decoration:none;
  padding:12px 12px;
  border-radius:16px;
  background: rgba(255,255,255,.78);
  border:1px solid rgba(15,23,42,.10);
  color:#0b1220;
}
.ccmvp-offline-phone-ico{ opacity:.75; }
.ccmvp-offline-phone-txt{ font-weight:800; letter-spacing:-.01em; }

.ccmvp-offline-cta{
  width:100%;
  padding:12px 12px;
  border-radius:16px;
  border:none;
  cursor:pointer;
  background: var(--ccmvp-accent);
  color: var(--ccmvp-accent-ink, #0b1220);
  font-weight:900;
  box-shadow: 0 16px 34px rgba(2,6,23,.18);
}
.ccmvp-offline-alt{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.ccmvp-offline-alt-link{
  display:inline-flex;
  padding:10px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.78);
  border:1px solid rgba(15,23,42,.10);
  color:#0b1220;
  text-decoration:none;
  font-weight:800;
}
.ccmvp-offline-back{
  margin-left:auto;
  padding:10px 12px;
  border-radius:999px;
  background: transparent;
  border:1px solid rgba(15,23,42,.10);
  color:#0b1220;
  cursor:pointer;
  font-weight:800;
}




/* Call menu view (premium) */
.ccmvp-view--callmenu{ padding-top: 4px; }

.ccmvp-callmenu-head{
  padding: 10px 0 12px;
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.ccmvp-callmenu-title{
  font-weight: 900;
  color: var(--ccmvp-text,#0b1220);
  font-size: 15.5px;
  letter-spacing: -.01em;
}
.ccmvp-callmenu-sub{
  margin-top: 6px;
  color: #5b6475;
  font-size: 12.8px;
  line-height: 1.35;
}
.ccmvp-callmenu-hours{
  display:inline-flex;
  margin-top:10px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.74);
  border:1px solid rgba(15,23,42,.10);
  color:#64748b;
  font-size:12px;
}

.ccmvp-callmenu-phones{
  display:grid;
  gap:10px;
  margin:14px 0 14px;
}
.ccmvp-callmenu-phone{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  padding:12px 12px;
  border-radius:18px;
  background: rgba(255,255,255,.82);
  border:1px solid rgba(15,23,42,.10);
  color:#0b1220;
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
  transition: transform .16s ease, box-shadow .16s ease;
}
.ccmvp-callmenu-phone:hover{
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(2,6,23,.10);
}
.ccmvp-callmenu-phone:active{ transform: translateY(0); }

.ccmvp-callmenu-phone-ico{
  width:36px;height:36px;border-radius:12px;
  display:grid;place-items:center;
  background:
    radial-gradient(16px 16px at 30% 25%, rgba(255,255,255,.70), transparent 60%),
    linear-gradient(145deg, rgba(255,255,255,.18), rgba(0,0,0,.10)),
    rgba(var(--ccmvp-accent-rgb, 242,194,0), .45);
  border:1px solid rgba(var(--ccmvp-accent-rgb, 242,194,0), .35);
  font-size:16px;
}

.ccmvp-callmenu-phone-main{
  display:flex;
  flex-direction:column;
  min-width:0;
  flex:1;
}
.ccmvp-callmenu-phone-txt{
  font-weight: 900;
  letter-spacing: -.01em;
  white-space:nowrap;
  overflow:hidden;
  z-index: 1;
  text-overflow:ellipsis;
}
.ccmvp-callmenu-phone-label{
  margin-top:2px;
  font-size: 12px;
  color:#6b7280;
  white-space:nowrap;
  overflow:hidden;
  z-index: 1;
  text-overflow:ellipsis;
}
.ccmvp-callmenu-phone-label:empty{ display:none; }

.ccmvp-callmenu-phone-chevron{
  opacity:.55;
  font-size: 20px;
  transform: translateY(-1px);
}

.ccmvp-callmenu-cta{
  width:100%;
  padding:13px 12px;
  border-radius:18px;
  border:none;
  cursor:pointer;
  background: var(--ccmvp-accent);
  color: var(--ccmvp-accent-ink, #0b1220);
  font-weight: 950;
  letter-spacing:-.01em;
  box-shadow: 0 16px 34px rgba(2,6,23,.18);
  transition: transform .16s ease, box-shadow .16s ease;
}
.ccmvp-callmenu-cta:hover{ transform: translateY(-1px); box-shadow: 0 18px 44px rgba(2,6,23,.22); }
.ccmvp-callmenu-cta:active{ transform: translateY(0); }

.ccmvp-callmenu-alt{
  margin-top:12px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
}
/* Hot jobs — OpenWork card (matches design mock) */
.ccmvp-hotjobs{
  margin: 14px 0 0;
}
.ccmvp-hotjobs-card{
  border:1px solid rgba(15,23,42,.10);
  border-radius:18px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(246,247,251,.92));
  box-shadow: 0 16px 46px rgba(2,6,23,.10);
  overflow:hidden; /* keep corners crisp */
  padding: 0;
}
.ccmvp-hotjobs-hd{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin: 0;
  padding: 14px 14px;
  min-height: 56px;
  border: 0;
  background: rgba(255,255,255,.56);
  cursor: pointer;
  text-align:left;
}

/* HotJobs header hover/focus — prevent theme/Elementor from turning it black */
.ccmvp-widget.ccmvp-theme--openwork .ccmvp-hotjobs-hd:hover,
.ccmvp-widget.ccmvp-theme--openwork .ccmvp-hotjobs-hd:focus-visible{
  background: rgba(255,255,255,.74) !important;
  color:#0b1220 !important;
  box-shadow: 0 10px 24px rgba(2,6,23,.10) !important;
}
.ccmvp-widget.ccmvp-theme--openwork .ccmvp-hotjobs-hd:active{
  background: rgba(255,255,255,.66) !important;
  box-shadow: none !important;
}
.ccmvp-widget.ccmvp-theme--openwork .ccmvp-hotjobs-hd .ccmvp-hotjobs-hd-txt{ color:#0b1220 !important; }

.ccmvp-hotjobs-card.is-open .ccmvp-hotjobs-hd{
  background: rgba(255,255,255,.62);
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.ccmvp-hotjobs-flame{
  font-size:16px;
  line-height:1;
}
.ccmvp-hotjobs-hd-txt{
  flex: 1 1 auto;
  font-weight:950;
  font-size:14px;
  letter-spacing:-.01em;
  color:#0b1220;
  min-width:0;
}
.ccmvp-hotjobs-chev{
  width: 10px;
  height: 10px;
  border-right: 2px solid rgba(15,23,42,.45);
  border-bottom: 2px solid rgba(15,23,42,.45);
  transform: rotate(45deg);
  margin-left: 6px;
  flex: 0 0 auto;
  opacity: .85;
  transition: transform .15s ease, opacity .15s ease;
}
.ccmvp-hotjobs-card.is-open .ccmvp-hotjobs-chev{
  transform: rotate(225deg);
  opacity: 1;
}

.ccmvp-hotjobs-body{
  margin:0;
  padding: 0 14px;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height .26s ease, opacity .18s ease, padding .18s ease;
}
.ccmvp-hotjobs-card.is-open .ccmvp-hotjobs-body{
  padding: 12px 14px 14px;
  /* Keep the accordion usable on mobile: never let it push the whole modal beyond the viewport */
  max-height: min(380px, 55dvh);
  opacity: 1;
}

.ccmvp-hotjobs-list{
  display:grid;
  gap:8px;
  max-height: min(220px, 32dvh);
  overflow: auto;
  padding-right: 4px;
}

/* subtle scrollbars */
.ccmvp-hotjobs-list::-webkit-scrollbar{ width: 8px; }
.ccmvp-hotjobs-list::-webkit-scrollbar-track{ background: transparent; }
.ccmvp-hotjobs-list::-webkit-scrollbar-thumb{ background: rgba(15,23,42,.18); border-radius: 999px; }
.ccmvp-hotjobs-list::-webkit-scrollbar-thumb:hover{ background: rgba(15,23,42,.26); }

.ccmvp-hotjobs-row{
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  gap:12px;
  text-decoration:none;
  color:#0b1220;
  font-weight:850;
  font-size:13.5px;
  position:relative;
  padding: 10px 36px 10px 10px;
  border-radius:14px;
}

.ccmvp-hotjobs-row:hover{ background: rgba(15,23,42,.03); }
.ccmvp-hotjobs-row:active{ background: rgba(15,23,42,.05); }

a.ccmvp-hotjobs-row::after{
  content:"";
  position:absolute;
  right: 10px;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  background: rgba(15,23,42,.42);
  -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZmlsbD0iYmxhY2siIGQ9Ik0xNCAzaDd2N2gtMlY2LjQxbC05LjI5IDkuMy0xLjQyLTEuNDIgOS4zLTkuMjlIMTRWM3oiLz48cGF0aCBmaWxsPSJibGFjayIgZD0iTTUgNWg2djJIN3YxMGgxMHYtNGgydjZINVY1eiIvPjwvc3ZnPg==") center/contain no-repeat;
  mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZmlsbD0iYmxhY2siIGQ9Ik0xNCAzaDd2N2gtMlY2LjQxbC05LjI5IDkuMy0xLjQyLTEuNDIgOS4zLTkuMjlIMTRWM3oiLz48cGF0aCBmaWxsPSJibGFjayIgZD0iTTUgNWg2djJIN3YxMGgxMHYtNGgydjZINVY1eiIvPjwvc3ZnPg==") center/contain no-repeat;
  opacity: .82;
  transition: transform .12s ease, opacity .12s ease, background-color .12s ease;
}
a.ccmvp-hotjobs-row:hover::after,
a.ccmvp-hotjobs-row:focus-visible::after{
  opacity: 1;
  background: rgba(15,23,42,.66);
  transform: translateY(-50%) translate(1px,-1px);
}
.ccmvp-hotjobs-left{
  display:flex;
  align-items:flex-start;
  gap:8px;
  min-width:0;
}
.ccmvp-hotjobs-bullet{
  width:18px;
  height:18px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  background: rgba(22,163,74,.14);
  color: #16a34a;
  font-size:16px;
  line-height:1;
  margin-top: 1px;
}
.ccmvp-hotjobs-name{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.ccmvp-hotjobs-more{
  margin-top: 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(15,23,42,.12);
  background: transparent;
  color:#0b1220;
  text-decoration:none;
  font-weight:950;
  box-shadow: none;
  transition: transform .12s ease, background .12s ease;
}
.ccmvp-hotjobs-more:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.70);
}
.ccmvp-hotjobs-more-ico{
  font-size:18px;
  line-height:1;
  opacity:.75;
}

.ccmvp-callmenu-alt-link{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:11px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.82);
  border:1px solid rgba(15,23,42,.10);
  color:#0b1220;
  text-decoration:none;
  font-weight:900;
  box-shadow: 0 10px 22px rgba(2,6,23,.06);
}
.ccmvp-callmenu-back{
  grid-column: 1 / -1;
  padding:11px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.72);
  border:1px solid rgba(15,23,42,.10);
  color:#0b1220;
  cursor:pointer;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
}


/* FABs wrapper: two separate buttons (chat + call) */
.ccmvp-fabs{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
}

/* Call menu launcher button (new): round / pill / auto */
.ccmvp-fab--callmenu{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}
.ccmvp-fab--callmenu::after{
  content:'';
  position:absolute; inset:2px;
  border-radius:999px;
  border:1px solid rgba(var(--ccmvp-accent-rgb, 242,194,0), .45);
  pointer-events:none;
}
.ccmvp-fab--callmenu .ccmvp-fab-label{
  display:none;
  font-weight:900;
  letter-spacing:-.02em;
  color: var(--ccmvp-accent-ink);
  white-space:nowrap;
}

/* Always round */
.ccmvp-fab--callmenu.is-round{
  width:58px;height:58px;
  border:1px solid rgba(255,255,255,.35);
  background:
    radial-gradient(26px 26px at 28% 18%, rgba(255,255,255,.80), transparent 60%),
    linear-gradient(145deg, rgba(255,255,255,.55), rgba(0,0,0,.08)),
    rgba(255,255,255,.92);
  box-shadow: 0 14px 32px rgba(2,6,23,.18);
}
.ccmvp-fab--callmenu.is-round .ccmvp-fab-ico{ font-size:18px; }

/* Pill style (desktop). Uses accent fill like the main bubble for a premium CTA feel */
.ccmvp-fab--callmenu.is-pill,
.ccmvp-fab--callmenu.is-auto{
  width:auto;
  height:46px;
  padding:0 18px 0 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.45);
  background:
    radial-gradient(24px 24px at 28% 20%, rgba(255,255,255,.60), transparent 55%),
    linear-gradient(145deg, rgba(255,255,255,.18), rgba(2,6,23,.06)),
    var(--ccmvp-accent);
  box-shadow: 0 14px 32px rgba(2,6,23,.22);
}

/* Explicit hover override for the callmenu pill/auto button.
   Some themes (incl. Elementor kits) apply global button:hover backgrounds; this keeps it yellow/premium. */
.ccmvp-widget .ccmvp-fab--callmenu.is-pill:hover,
.ccmvp-widget .ccmvp-fab--callmenu.is-auto:hover{
  background:
    radial-gradient(24px 24px at 28% 20%, rgba(255,255,255,.62), transparent 55%),
    linear-gradient(145deg, rgba(255,255,255,.16), rgba(2,6,23,.05)),
    var(--ccmvp-accent) !important;
  filter: brightness(1.02) saturate(1.06) !important;
  box-shadow: 0 18px 44px rgba(2,6,23,.24) !important;
}
.ccmvp-fab--callmenu.is-pill .ccmvp-fab-label,
.ccmvp-fab--callmenu.is-auto .ccmvp-fab-label{
  display:inline;
  font-size:16px;
}
.ccmvp-fab--callmenu.is-pill .ccmvp-fab-ico,
.ccmvp-fab--callmenu.is-auto .ccmvp-fab-ico{
  font-size:18px;
}

/* Auto: on mobile collapse to a compact round icon so it doesn't take space */
@media (max-width: 560px){
  .ccmvp-fab--callmenu.is-auto{
    width:58px;height:58px;
    padding:0;
    border:1px solid rgba(255,255,255,.35);
    background:
      radial-gradient(26px 26px at 28% 18%, rgba(255,255,255,.80), transparent 60%),
      linear-gradient(145deg, rgba(255,255,255,.55), rgba(0,0,0,.08)),
      rgba(255,255,255,.92);
    box-shadow: 0 14px 32px rgba(2,6,23,.18);
  }
  .ccmvp-fab--callmenu.is-auto .ccmvp-fab-label{ display:none; }
  .ccmvp-fab--callmenu.is-auto .ccmvp-fab-ico{ font-size:18px; }
}


/* ============================
   Call Menu — tidy cosmetics (v1.2.5)
   Small spacing/alignment fixes without changing the overall style.
   ============================ */

.ccmvp-view--callmenu{ padding-top: 0 !important; }
.ccmvp-callmenu-head{ padding: 4px 0 10px !important; }

.ccmvp-callmenu-title{
  font-size: 16px !important;
  letter-spacing: -.02em !important;
}

.ccmvp-callmenu-sub{
  margin-top: 6px !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}

.ccmvp-callmenu-hours{
  margin-top: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 10px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.70) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  color: #64748b !important;
  font-size: 12px !important;
  width: fit-content !important;
}

.ccmvp-callmenu-phones{
  margin: 12px 0 12px !important;
  gap: 10px !important;
}

.ccmvp-callmenu-phone{
  padding: 12px 12px !important;
  border-radius: 18px !important;
  align-items: center !important;
}

.ccmvp-callmenu-phone-ico{
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
}

.ccmvp-callmenu-phone-txt{
  font-size: 14.5px !important;
  line-height: 1.15 !important;
}

.ccmvp-callmenu-phone-label{
  display: block !important;
  margin-left: 0 !important;
  margin-top: 2px !important;
  font-size: 12px !important;
  color: #6b7280 !important;
}

.ccmvp-callmenu-phone::after{
  right: 12px !important;
  font-size: 18px !important;
  opacity: .75 !important;
}

.ccmvp-callmenu-cta{
  margin-top: 2px !important;
}

.ccmvp-callmenu-back{
  width: 100% !important;
  margin-left: 0 !important;
  margin-top: 10px !important;
  justify-content: center !important;
}

.ccmvp-callmenu-alt{
  margin-top: 10px !important;
}


/* ============================
   Call Menu — centered head + integrated blocks (v1.2.6)
   ============================ */

/* 1-3) Center title/subtitle/hours */
.ccmvp-callmenu-head{
  text-align:center !important;
}
.ccmvp-callmenu-title,
.ccmvp-callmenu-sub{
  margin-left:auto !important;
  margin-right:auto !important;
  max-width: 320px;
}
.ccmvp-callmenu-hours{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* 4) Make blocks feel part of the panel (less "floating") */
.ccmvp-callmenu-phone{
  box-shadow: none !important;
  background: rgba(255,255,255,.82) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
}
.ccmvp-callmenu-phone:hover{
  box-shadow: 0 10px 22px rgba(2,6,23,.08) !important;
  border-color: rgba(15,23,42,.14) !important;
}

.ccmvp-callmenu-cta{
  box-shadow: 0 14px 30px rgba(2,6,23,.14) !important;
  border: 1px solid rgba(0,0,0,.06) !important;
}

.ccmvp-callmenu-back{
  box-shadow: none !important;
  background: rgba(255,255,255,.76) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
}

/* Tighten vertical rhythm */
.ccmvp-callmenu-phones{ margin: 12px 0 12px !important; }
.ccmvp-callmenu-alt{ margin-top: 10px !important; }


/* ============================
   Call Menu — align blocks + branded messengers (v1.2.7)
   ============================ */

/* Make phone card + CTA same "system" as submit button */
.ccmvp-callmenu-phone,
.ccmvp-callmenu-cta{
  border-radius: 18px !important;
}

.ccmvp-callmenu-phone{
  min-height: 56px !important;
  padding: 14px 14px !important;
  box-shadow: none !important;
  background: rgba(255,255,255,.84) !important;
  border: 1px solid rgba(15,23,42,.10) !important;
}

.ccmvp-callmenu-phone:hover{
  border-color: rgba(15,23,42,.14) !important;
  box-shadow: 0 10px 24px rgba(2,6,23,.08) !important;
}

.ccmvp-callmenu-cta{
  min-height: 54px !important;
  padding: 14px 16px !important;
  font-size: 15px !important;
  box-shadow: 0 16px 34px rgba(2,6,23,.18) !important;
}

/* Remove "Back" button (kept for older markup safety) */
.ccmvp-callmenu-back{ display:none !important; }

/* Branded messenger buttons (no more sticking out) */
.ccmvp-callmenu-alt{
  margin-top: 12px !important;
  display: flex !important;
  gap: 12px !important;
}

.ccmvp-callmenu-app{
  flex: 1 1 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 48px !important;
  border-radius: 18px !important;
  padding: 12px 14px !important;
  font-weight: 900 !important;
  letter-spacing: -.01em !important;
  text-decoration: none !important;
  border: 1px solid rgba(15,23,42,.10) !important;
  box-shadow: 0 10px 24px rgba(2,6,23,.06) !important;
}

.ccmvp-callmenu-app .ccmvp-app-ico{
  width: 28px !important;
  height: 28px !important;
  border-radius: 10px !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(255,255,255,.22) !important;
}

.ccmvp-callmenu-app.is-telegram{
  background: linear-gradient(180deg, rgba(42,171,238,.95), rgba(28,140,207,.95)) !important;
  color: #fff !important;
  border-color: rgba(42,171,238,.25) !important;
}

.ccmvp-callmenu-app.is-viber{
  background: linear-gradient(180deg, rgba(115,96,242,.95), rgba(98,77,220,.95)) !important;
  color: #fff !important;
  border-color: rgba(115,96,242,.25) !important;
}


/* ============================
   OpenWork theme override (v1.2.21)
   Goal: match approved compact style (dark header + green CTA + tidy cards)
   IMPORTANT: scoped to .ccmvp-theme--openwork to avoid conflicts.
   ============================ */

:root{
  --ccmvp-ow-navy:#0b1220;
  --ccmvp-ow-navy-2:#121a2a;
  --ccmvp-ow-green:#16a34a;
  --ccmvp-ow-green-2:#1fb154;
  --ccmvp-ow-green-rgb:22,163,74;
}

/* Panel/card: crisp white like OpenWork cards (no glass blur) */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-panel{
  background:#ffffff !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
  border:1px solid rgba(15,23,42,.10) !important;
  border-radius: 28px !important;
  box-shadow: 0 22px 70px rgba(2,6,23,.22) !important;
}

/* Center the modal on screen (Call menu and Callback form use the same panel) */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-panel{
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  /* Use dynamic viewport units on mobile so the panel never exceeds the visible area */
  max-height: calc(100dvh - 24px) !important;
  /* Make the inside scroll instead of growing beyond the viewport */
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  transform: translate(-50%, calc(-50% + 14px)) scale(.985) !important;
}
.ccmvp-theme--openwork.ccmvp-widget.is-open .ccmvp-panel{
  transform: translate(-50%, -50%) scale(1) !important;
}

/* More breathing room so items never touch the border */
/*
  IMPORTANT:
  Some themes/Elementor templates apply aggressive padding resets on generic wrappers.
  To make gutters 100% deterministic, we keep .ccmvp-body padding at 0 and
  apply the real inner spacing on each view container.
*/
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-body{
  padding: 0 !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-panel > .ccmvp-body{
  padding: 0 !important;
}

/* Deterministic inner gutters (matches the approved compact reference) */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-view{
  padding: 24px 24px 28px !important;
  min-height: 0 !important;
}

@media (max-width: 420px){
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-view{
    padding: 18px 18px 22px !important;
  }
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-view--callmenu{
    padding: 18px 18px 22px !important;
  }
  /* Ensure the modal fits on small screens */
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-panel{
    width: calc(100vw - 18px) !important;
    max-height: calc(100dvh - 18px) !important;
  }
}


/* Header: dark/navy gradient like mock */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-head{
  background:
    radial-gradient(900px 340px at 30% 0%, rgba(255,255,255,.10), transparent 60%),
    linear-gradient(180deg, var(--ccmvp-ow-navy) 0%, var(--ccmvp-ow-navy-2) 100%) !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-head{
  padding: 18px 18px 16px !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-head:before{
  width: 56px !important;
  height: 56px !important;
  border-radius: 22px !important;
  box-shadow: 0 14px 30px rgba(2,6,23,.22) !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-head:after{
  left: 66px !important;
  top: 22px !important;
  width: 12px !important;
  height: 12px !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-title{ color:#fff !important; font-size: 18px !important; }
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-sub{ color:rgba(255,255,255,.72) !important; font-size: 13px !important; }

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-close{
  width: 42px !important;
  height: 42px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  color:#fff !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-close:hover{ background: rgba(255,255,255,.12) !important; }

/* Safety: prevent theme CSS from hiding our header text */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-head-txt{ display:block !important; }

/* Call menu: keep same deterministic gutters as the view system */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-view--callmenu{
  padding: 24px 24px 28px !important;
}

/* Callmenu title block */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-head{
  text-align:center !important;
  border-bottom:0 !important;
  padding: 6px 0 16px !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-title{
  /* Modern, less "bulky" scale on desktop */
  font-size: 24px !important;
  font-weight: 950 !important;
  letter-spacing:-.03em !important;
  color: #0b1220 !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-sub{
  font-size: 14px !important;
  color:#64748b !important;
  margin-top: 8px !important;
  line-height: 1.45 !important;
}
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-hours{
  margin-top: 12px !important;
  display: none !important; /* у мокапі не показуємо */
}

/* Phone card like mock: icon left, number centered */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phones{
  display:grid !important;
  gap: 10px !important;
  margin: 10px 0 12px !important;
}

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone{
  position: relative !important;
  width:100% !important;
  background:#fff !important;
  border:1px solid rgba(148,163,184,.55) !important;
  border-radius: 18px !important;
  min-height: 52px !important;
  padding: 11px 44px !important;
  box-shadow: none !important;
  text-decoration:none !important;
  color:#0b1220 !important;
}

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone:hover{
  transform: translateY(-1px) !important;
  box-shadow: 0 12px 28px rgba(2,6,23,.08) !important;
  border-color: rgba(148,163,184,.85) !important;
}

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone-ico{
  position:absolute !important;
  left: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 0 !important;
  background: #0b1220 !important;
  border: 0 !important;
}

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone-main{
  width: 100% !important;
  text-align: center !important;
}

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone-txt{
  font-size: 18.5px !important;
  font-weight: 950 !important;
  line-height: 1.08 !important;
  letter-spacing: -.02em !important;
}

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone-label{
  display:block !important;
  margin-top: 3px !important;
  font-size: 12px !important;
  color:#64748b !important;
}

/* Primary CTA: modern compact */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-cta{
  width:100% !important;
  min-height: 44px !important;
  padding: 11px 16px !important;
  border-radius: 18px !important;

  font-weight: 900 !important;
  font-size: 15px !important;
  letter-spacing:-.015em !important;

  border: 1px solid rgba(var(--ccmvp-ow-green-rgb), .26) !important;
  background:
    radial-gradient(120px 56px at 30% 18%, rgba(255,255,255,.18), transparent 60%),
    linear-gradient(180deg, var(--ccmvp-ow-green-2), var(--ccmvp-ow-green)) !important;

  color:#fff !important;
  box-shadow: 0 12px 28px rgba(2,6,23,.14) !important;
  display:block !important;
}

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-cta--danger{
  /* keep class, but enforce green theme */
  background:
    radial-gradient(140px 60px at 30% 18%, rgba(255,255,255,.22), transparent 60%),
    linear-gradient(180deg, var(--ccmvp-ow-green-2), var(--ccmvp-ow-green)) !important;
  color:#fff !important;
}

/* Viber/Telegram: modern cards stacked */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-alt{
  margin-top: 12px !important;
  display:grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

.ccmvp-theme--openwork.ccmvp-widget a.ccmvp-callmenu-chat{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;

  padding: 11px 14px !important;
  min-height: 52px !important;

  border-radius: 18px !important;
  background:#fff !important;
  border:1px solid rgba(148,163,184,.55) !important;
  box-shadow: 0 10px 22px rgba(2,6,23,.06) !important;

  text-decoration:none !important;
  color:#0b1220 !important;
  font-weight: 850 !important;
  font-size: 15px !important;
  line-height: 1.15 !important;
}

.ccmvp-theme--openwork.ccmvp-widget a.ccmvp-callmenu-chat:hover{
  border-color: rgba(148,163,184,.85) !important;
  box-shadow: 0 14px 30px rgba(2,6,23,.08) !important;
  background: rgba(15,23,42,.01) !important;
}

.ccmvp-theme--openwork.ccmvp-widget a.ccmvp-callmenu-chat::after{
  content:"›" !important;
  margin-left:auto !important;
  font-size: 20px !important;
  opacity:.35 !important;
  transform: translateY(-1px) !important;
}

/* Messenger icons — match reference (soft circle for Viber, blue circle for Telegram) */
.ccmvp-theme--openwork.ccmvp-widget .ccmvp-chat-ico{
  width: 34px !important;
  height: 34px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex: 0 0 auto !important;
  border-radius: 999px !important;
}

.ccmvp-theme--openwork.ccmvp-widget .ccmvp-chat-ico svg{
  display:block !important;
  width: 18px !important;
  height: 18px !important;
}

.ccmvp-theme--openwork.ccmvp-widget a.ccmvp-callmenu-chat.is-viber .ccmvp-chat-ico{
  background: rgba(115,96,242,.14) !important;
  color:#7360F2 !important;
}

.ccmvp-theme--openwork.ccmvp-widget a.ccmvp-callmenu-chat.is-telegram .ccmvp-chat-ico{
  background:#2AABEE !important;
  color:#fff !important;
}


/* Responsive: keep OpenWork callmenu compact on small screens */
@media (max-width: 420px){
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-head{ padding: 16px 16px 14px !important; }
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-head:before{ width: 48px !important; height: 48px !important; border-radius: 18px !important; }
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-head:after{ left: 58px !important; top: 20px !important; }

  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-title{ font-size: 24px !important; }
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-sub{ font-size: 13px !important; margin-top: 8px !important; }

  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone{
    min-height: 60px !important;
    padding: 12px 48px !important;
    border-radius: 18px !important;
  }
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone-ico{
    left: 14px !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 12px !important;
  }
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone-txt{ font-size: 24px !important; }
  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-phone-label{ font-size: 12px !important; margin-top: 3px !important; }

  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-cta{
    min-height: 56px !important;
    font-size: 18px !important;
    border-radius: 18px !important;
  }

  .ccmvp-theme--openwork.ccmvp-widget .ccmvp-callmenu-alt{ margin-top: 12px !important; gap: 10px !important; }
  .ccmvp-theme--openwork.ccmvp-widget a.ccmvp-callmenu-chat{
    min-height: 56px !important;
    padding: 12px 12px !important;
    border-radius: 18px !important;
    font-size: 16px !important;
  }
  .ccmvp-theme--openwork.ccmvp-widget a.ccmvp-callmenu-chat::after{ font-size: 22px !important; }
}


/* OpenWork: keep messenger CTA buttons readable in callback form (theme/Elementor hover overrides safety) */
.ccmvp-widget.ccmvp-theme--openwork :is(a,button).ccmvp-btn[data-ccmvp-action="telegram"],
.ccmvp-widget.ccmvp-theme--openwork :is(a,button).ccmvp-btn[data-ccmvp-action="viber"]{
  --ccmvp-accent:#F2C200;
  --ccmvp-accent-rgb:242,194,0;
  --ccmvp-accent-ink:#0b1220;
  color: var(--ccmvp-accent-ink) !important;
  text-decoration:none !important;
  background:
    radial-gradient(24px 24px at 20% 18%, rgba(255,255,255,.45), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(0,0,0,.08)),
    var(--ccmvp-accent) !important;
  border: 1px solid rgba(var(--ccmvp-accent-rgb), .35) !important;
}

.ccmvp-widget.ccmvp-theme--openwork :is(a,button).ccmvp-btn[data-ccmvp-action="telegram"]:hover,
.ccmvp-widget.ccmvp-theme--openwork :is(a,button).ccmvp-btn[data-ccmvp-action="viber"]:hover,
.ccmvp-widget.ccmvp-theme--openwork :is(a,button).ccmvp-btn[data-ccmvp-action="telegram"]:focus-visible,
.ccmvp-widget.ccmvp-theme--openwork :is(a,button).ccmvp-btn[data-ccmvp-action="viber"]:focus-visible{
  color: var(--ccmvp-accent-ink) !important;
  background:
    radial-gradient(24px 24px at 20% 18%, rgba(255,255,255,.55), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(0,0,0,.06)),
    var(--ccmvp-accent) !important;
  filter: none !important;
  box-shadow: 0 16px 34px rgba(2,6,23,.18) !important;
}
