.cclc-fab-root { --cclc-fab-color: #184341; --cclc-fab-ink: #181b31; }

/* Button */
.cclc-fab { position: fixed; z-index: 9990; width: 60px; height: 60px; border-radius: 50%;
  border: 0; cursor: pointer; background: var(--cclc-fab-color); color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 20px -4px rgba(0,0,0,.35); transition: transform .15s ease, box-shadow .15s ease; }
.cclc-fab:hover { transform: translateY(-2px) scale(1.03); box-shadow: 0 10px 26px -6px rgba(0,0,0,.45); }
.cclc-fab:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.cclc-fab--bottom-right .cclc-fab { right: 24px; bottom: 24px; }
.cclc-fab--bottom-left  .cclc-fab { left: 24px; bottom: 24px; }

/* Overlay + modal */
.cclc-fab-overlay { position: fixed; inset: 0; z-index: 99999; background: rgba(10,20,25,.55); animation: cclc-fab-fade .2s ease both; }
.cclc-fab-modal { position: fixed; z-index: 100000; top: 50%; left: 50%;
  width: min(460px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow: auto;
  background: #fff; color: var(--cclc-fab-ink); border-radius: 18px; padding: 28px 26px 22px;
  box-shadow: 0 24px 70px -20px rgba(0,0,0,.6); transform: translate(-50%,-50%);
  animation: cclc-fab-pop .24s cubic-bezier(.2,.9,.3,1.2) both; }
.cclc-fab-close { position: absolute; top: 10px; right: 14px; background: none; border: 0; font-size: 30px; line-height: 1; color: #8a94a6; cursor: pointer; }
.cclc-fab-close:hover { color: var(--cclc-fab-ink); }
.cclc-fab-close:focus-visible { outline: 2px solid var(--cclc-fab-color); outline-offset: 2px; }
.cclc-fab-title { margin: 0 0 18px; font-size: 22px; color: var(--cclc-fab-color); }

/* Fields with floating labels */
.cclc-fab-field { position: relative; margin: 0 0 18px; }
.cclc-fab-field input, .cclc-fab-field textarea {
  width: 100%; box-sizing: border-box; padding: 16px 14px 8px; border: 1px solid #d5dbd9; border-radius: 10px;
  font: inherit; font-size: 16px; color: var(--cclc-fab-ink); background: #fff; outline: none;
  transition: border-color .15s ease, box-shadow .15s ease; }
.cclc-fab-field textarea { resize: vertical; min-height: 96px; }
.cclc-fab-field input:focus, .cclc-fab-field textarea:focus {
  border-color: var(--cclc-fab-color); box-shadow: 0 0 0 3px color-mix(in srgb, var(--cclc-fab-color) 18%, transparent); }
.cclc-fab-field label { position: absolute; left: 14px; top: 14px; color: #8a94a6; font-size: 16px;
  pointer-events: none; transition: transform .15s ease, color .15s ease, font-size .15s ease; }
.cclc-fab-field input:focus + label, .cclc-fab-field textarea:focus + label,
.cclc-fab-field input:not(:placeholder-shown) + label, .cclc-fab-field textarea:not(:placeholder-shown) + label {
  transform: translateY(-9px); font-size: 11px; letter-spacing: .02em; color: var(--cclc-fab-color); }
.cclc-fab-req { color: #c0392b; }
.cclc-fab-err { display: block; min-height: 0; color: #c0392b; font-size: 13px; margin-top: 5px; }
.cclc-fab-field.cclc-fab-field--invalid input,
.cclc-fab-field.cclc-fab-field--invalid textarea { border-color: #c0392b; }

/* Honeypot — visually hidden but not display:none (bots skip display:none) */
.cclc-fab-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* Submit button + spinner */
.cclc-fab-submit { position: relative; width: 100%; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--cclc-fab-color); color: #fff; font: inherit; font-weight: 600; font-size: 16px; padding: 14px 18px;
  transition: transform .15s ease, opacity .15s ease; }
.cclc-fab-submit:hover { transform: translateY(-1px); }
.cclc-fab-submit:focus-visible { outline: 3px solid var(--cclc-fab-color); outline-offset: 3px; }
.cclc-fab-submit[disabled] { opacity: .7; cursor: default; transform: none; }
.cclc-fab-spinner { display: none; width: 18px; height: 18px; margin-left: 10px; vertical-align: -3px;
  border: 2px solid rgba(255,255,255,.5); border-top-color: #fff; border-radius: 50%; animation: cclc-fab-spin .7s linear infinite; }
.cclc-fab-form.is-sending .cclc-fab-spinner { display: inline-block; }
.cclc-fab-formstatus { margin: 12px 0 0; color: #c0392b; font-size: 14px; min-height: 0; }
.cclc-fab-form.is-error { animation: cclc-fab-shake .35s ease both; }

/* Success state */
.cclc-fab-success { text-align: center; padding: 18px 0 8px; }
.cclc-fab-success p { font-size: 18px; color: var(--cclc-fab-ink); margin: 14px 0 0; }
.cclc-fab-check { width: 72px; height: 72px; }
.cclc-fab-check circle { stroke: var(--cclc-fab-color); stroke-width: 3; stroke-dasharray: 151; stroke-dashoffset: 151; animation: cclc-fab-draw .5s ease forwards; }
.cclc-fab-check path { stroke: var(--cclc-fab-color); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 40; stroke-dashoffset: 40; animation: cclc-fab-draw .35s .45s ease forwards; }

body.cclc-fab-open { overflow: hidden; }

@keyframes cclc-fab-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes cclc-fab-pop { from { opacity: 0; transform: translate(-50%,-46%) scale(.96); } to { opacity: 1; transform: translate(-50%,-50%) scale(1); } }
@keyframes cclc-fab-spin { to { transform: rotate(360deg); } }
@keyframes cclc-fab-shake { 0%,100%{transform:translateX(0)} 20%{transform:translateX(-6px)} 40%{transform:translateX(6px)} 60%{transform:translateX(-4px)} 80%{transform:translateX(4px)} }
@keyframes cclc-fab-draw { to { stroke-dashoffset: 0; } }

/* Defensive: keep hidden elements hidden even against a theme rule. */
.cclc-fab-overlay[hidden], .cclc-fab-modal[hidden], .cclc-fab-success[hidden] { display: none; }

@media (prefers-reduced-motion: reduce) {
  .cclc-fab, .cclc-fab-submit, .cclc-fab-field input, .cclc-fab-field textarea, .cclc-fab-field label { transition: none; }
  .cclc-fab-overlay, .cclc-fab-modal, .cclc-fab-form.is-error { animation: none; }
  .cclc-fab-check circle, .cclc-fab-check path { animation: none; stroke-dashoffset: 0; }
  .cclc-fab-spinner { animation-duration: 1.2s; }
}