/* File: calcly-style.css */
.calcly-wrapper {
  background:#fff;color:#111827;padding:20px;border-radius:12px;
  box-shadow:0 2px 8px rgba(0,0,0,0.05);max-width:560px;margin:0 auto;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
.calcly-header{text-align:center;margin-bottom:16px;}
.calcly-logo{font-weight:700;font-size:1.6em;color:#1e66f5;}
.calcly-subtitle{color:#374151;font-size:.95em;}
.calcly-field{margin-bottom:14px;position:relative;}
.calcly-form label{display:block;font-weight:600;margin-bottom:4px;}
.calcly-hint{font-size:.8em;color:#6b7280;margin-top:4px;}
.calcly-form input{
  width:100%;padding:10px;border:1px solid #ddd;border-radius:8px;font-size:1em;
}
.calcly-button,.calcly-button-outline{
  background:#1e66f5;color:#fff;border:none;padding:10px 16px;border-radius:8px;
  cursor:pointer;transition:all .2s ease;font-weight:600;margin:8px 6px 0 0;
}
.calcly-button-outline{background:#fff;border:1px solid #1e66f5;color:#1e66f5;}
.calcly-button:hover{background:#1554d1;}
.calcly-actions{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px;}
.calcly-feedback{
  margin-top:8px;background:#f0f7ff;border:1px solid #cfe3ff;color:#0b4aa2;
  border-radius:8px;padding:8px 10px;font-size:.9em;
}

.calcly-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:.9em;}
.calcly-table th,.calcly-table td{border:1px solid #eee;padding:6px 8px;text-align:right;}
.calcly-table th{background:#f8fafc;text-align:center;}

/* Progress bar */
.progress-container{background:#e5e7eb;border-radius:10px;height:22px;margin:10px 0;overflow:hidden;}
.progress-bar{
  height:100%;background:linear-gradient(90deg,#1e66f5,#16a34a);
  color:#fff;font-weight:600;text-align:center;line-height:22px;width:0;transition:width .8s ease-in-out;
}

/* Chart wrapper for better responsive height */
.chart-wrap{position:relative;height:300px;margin-top:14px;}
.chart-fallback{
  text-align:center;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;
  border-radius:8px;padding:10px;margin-top:10px;
}

/* Tooltip bubbles */
.calcly-tip{
  display:inline-flex;align-items:center;justify-content:center;background:#1e66f5;color:#fff;
  border-radius:50%;width:22px;height:22px;font-size:12px;font-weight:700;margin-left:6px;
  cursor:pointer;position:relative;transition:background .2s,transform .1s;user-select:none;
  border:0;
}
.calcly-tip:hover,.calcly-tip:focus{background:#1554d1;transform:scale(1.08);outline:none;}
.calcly-tip:active{transform:scale(0.96);}
.calcly-tip.pulse{animation:pulseTip .22s ease;}
@keyframes pulseTip{0%{transform:scale(1.12);}100%{transform:scale(1);}}

/* Tooltip bubble text */
.calcly-tip::after{
  content:attr(data-tip);position:absolute;left:50%;transform:translateX(-50%);
  bottom:130%;background:#111827;color:#fff;padding:8px 10px;border-radius:8px;
  font-size:.8em;width:240px;text-align:left;opacity:0;visibility:hidden;
  transition:opacity .18s ease;pointer-events:none;z-index:9999;
}
.calcly-tip::before{
  content:'';position:absolute;bottom:120%;left:50%;transform:translateX(-50%);
  border:6px solid transparent;border-top-color:#111827;opacity:0;visibility:hidden;transition:opacity .18s ease;
}
.calcly-tip:hover::after,.calcly-tip:hover::before,
.calcly-tip.active::after,.calcly-tip.active::before{
  opacity:1;visibility:visible;
}

/* Responsive */
@media(max-width:560px){
  .calcly-wrapper{padding:16px;}
  .calcly-tip::after{width:200px;font-size:.75em;}
}