/**
 * AI Calculator Pro – Frontend CSS
 * Structural only. No colors, fonts, or decorative styles.
 * Theme inherits naturally. Override via .aicp-* classes.
 */

/* ── Shared ───────────────────────────────────────────────────────────────── */
.aicp-calculator-wrap { width: 100%; }

.aicp-field { display: flex; flex-direction: column; gap: .25rem; margin-bottom: .75rem; }
.aicp-field label { font-weight: 600; }
.aicp-field input,
.aicp-field select,
.aicp-field textarea { width: 100%; box-sizing: border-box; }
.aicp-field--checkbox { flex-direction: row; align-items: center; gap: .5rem; }

.aicp-range-wrap { display: flex; align-items: center; gap: .75rem; }
.aicp-range-wrap input[type="range"] { flex: 1; }
.aicp-range-val { min-width: 3ch; text-align: right; font-weight: 600; }

.aicp-help { font-size: .875em; opacity: .7; }

.aicp-contact-fields { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid currentColor; opacity: .9; }

/* ── Normal mode ──────────────────────────────────────────────────────────── */
.aicp-form { display: flex; flex-direction: column; }
.aicp-fields { display: flex; flex-direction: column; }

.aicp-submit-wrap { margin-top: .5rem; }
.aicp-submit { cursor: pointer; }

.aicp-live-result { margin: 1rem 0; }
.aicp-result-live { display: flex; align-items: baseline; gap: .5rem; flex-wrap: wrap; }
.aicp-result-live .aicp-result-label { opacity: .7; }
.aicp-result-live .aicp-result-value { font-size: 1.4em; font-weight: 700; }

/* ── Final result ─────────────────────────────────────────────────────────── */
.aicp-result-wrap { display: flex; flex-direction: column; gap: 1rem; }
.aicp-result-main { display: flex; flex-direction: column; gap: .25rem; }
.aicp-result-main .aicp-result-value { font-size: 2em; font-weight: 700; }
.aicp-result-main .aicp-result-label { opacity: .7; }
.aicp-result-fields { display: flex; flex-direction: column; gap: .4rem; }
.aicp-result-field { display: flex; justify-content: space-between; gap: 1rem; }
.aicp-result-field-label { opacity: .7; }
.aicp-result-field-value { font-weight: 600; }
.aicp-result-note { opacity: .7; font-style: italic; margin: 0; }

/* ── Errors ───────────────────────────────────────────────────────────────── */
.aicp-error-msg { color: #c00; font-size: .875em; }
.aicp-global-error { padding: .75rem; border-left: 3px solid #c00; color: #c00; margin-top: .5rem; }

/* ══════════════════════════════════════════════════════════════════════════════
   WIZARD MODE
══════════════════════════════════════════════════════════════════════════════ */
.aicp-wizard { display: flex; flex-direction: column; gap: 1.25rem; }

/* Progress bar */
.aicp-wizard-progress {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.aicp-wizard-bar-track {
  flex: 1;
  height: 6px;
  background: rgba(0,0,0,.1);
  border-radius: 3px;
  overflow: hidden;
}
.aicp-wizard-bar {
  height: 6px;
  background: currentColor;
  border-radius: 3px;
  transition: width .3s ease;
  width: 0%;
}
.aicp-wizard-step-count {
  font-size: .8em;
  opacity: .6;
  white-space: nowrap;
}

/* Step title */
.aicp-wizard-title {
  font-size: 1.15em;
  font-weight: 700;
  min-height: 1.4em;
}

/* Fields area */
.aicp-wizard-fields { display: flex; flex-direction: column; }

/* Live result in wizard */
.aicp-wizard-live {
  padding: .6rem 0;
  border-top: 1px solid rgba(0,0,0,.08);
}

/* Navigation */
.aicp-wizard-nav {
  display: flex;
  gap: .75rem;
  align-items: center;
}
.aicp-btn-prev { cursor: pointer; }
.aicp-btn-next { cursor: pointer; margin-left: auto; }

/* Error */
.aicp-wizard-error {
  color: #c00;
  font-size: .9em;
  min-height: 1.2em;
}

/* Slide transition (optional enhancement) */
.aicp-wizard-fields {
  animation: aicp-slide-in .2s ease;
}
@keyframes aicp-slide-in {
  from { opacity: 0; transform: translateX(12px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Action button field ──────────────────────────────────────────────────── */
.aicp-field--button { flex-direction: row; }
.aicp-action-btn    { cursor: pointer; }
