/* ============================================================
   GFB Form Builder – Frontend Styles
   ============================================================ */

.gfb-frontend-form {
  --gfb-label:    #1a1a1a;
  --gfb-ibg:      #ffffff;
  --gfb-iborder:  #d1d5db;
  --gfb-icolor:   #1a1a1a;
  --gfb-btn-bg:   #2563eb;
  --gfb-btn-fg:   #ffffff;
  --gfb-error:    #dc2626;
  --gfb-radius:   6px;
  --gfb-spacing:  16px;
  font-family: system-ui, -apple-system, sans-serif;
}

/* Progress bar */
.gfb-progress-wrap { margin-bottom: 20px; }
.gfb-progress-track {
  height:        6px;
  background:    #e5e7eb;
  border-radius: 999px;
  overflow:      hidden;
}
.gfb-progress-indicator {
  height:     100%;
  background: var(--gfb-btn-bg);
  border-radius: 999px;
  transition: width .4s cubic-bezier(.4,0,.2,1);
}

/* Fields */
.gfb-field-wrap {
  margin-bottom: var(--gfb-spacing);
}

.gfb-field-wrap label {
  display:       block;
  font-size:     14px;
  font-weight:   600;
  color:         var(--gfb-label);
  margin-bottom: 6px;
}

.gfb-required { color: #b45309; margin-left: 2px; }

.gfb-field-wrap input[type="text"],
.gfb-field-wrap input[type="email"],
.gfb-field-wrap input[type="number"],
.gfb-field-wrap input[type="tel"],
.gfb-field-wrap input[type="date"],
.gfb-field-wrap input[type="file"],
.gfb-field-wrap select,
.gfb-field-wrap textarea {
  width:         100%;
  padding:       10px 14px;
  border:        1.5px solid var(--gfb-iborder);
  border-radius: var(--gfb-radius);
  background:    var(--gfb-ibg);
  color:         var(--gfb-icolor);
  font-size:     15px;
  font-family:   inherit;
  box-sizing:    border-box;
  transition:    border-color .15s, box-shadow .15s;
  -webkit-appearance: none;
}

.gfb-field-wrap input:focus,
.gfb-field-wrap select:focus,
.gfb-field-wrap textarea:focus {
  outline:      none;
  border-color: var(--gfb-btn-bg);
  box-shadow:   0 0 0 3px rgba(37,99,235,.15);
}

.gfb-field-wrap textarea { resize: vertical; min-height: 100px; }

/* Radio / Checkbox groups */
.gfb-radio-group,
.gfb-checkbox-group {
  display:        flex;
  flex-direction: column;
  gap:            8px;
}

.gfb-radio-group label,
.gfb-checkbox-group label {
  display:      flex;
  align-items:  center;
  gap:          10px;
  font-weight:  400;
  cursor:       pointer;
  font-size:    15px;
}

/* Errors */
.gfb-field-error {
  display:    block;
  font-size:  12px;
  color:      var(--gfb-error);
  margin-top: 4px;
}

.gfb-has-error input,
.gfb-has-error select,
.gfb-has-error textarea {
  border-color: var(--gfb-error) !important;
}

/* Navigation */
.gfb-step-nav {
  display:         flex;
  gap:             10px;
  margin-top:      20px;
  justify-content: flex-end;
}

.gfb-btn-prev,
.gfb-btn-next,
.gfb-btn-submit {
  display:       inline-flex;
  align-items:   center;
  padding:       11px 24px;
  border:        none;
  border-radius: var(--gfb-radius);
  font-size:     15px;
  font-weight:   600;
  font-family:   inherit;
  cursor:        pointer;
  transition:    background .15s, transform .1s;
}

.gfb-btn-prev {
  background: #f3f4f6;
  color:      #374151;
}
.gfb-btn-prev:hover { background: #e5e7eb; }

.gfb-btn-next,
.gfb-btn-submit {
  background: var(--gfb-btn-bg);
  color:      var(--gfb-btn-fg);
}
.gfb-btn-next:hover,
.gfb-btn-submit:hover { filter: brightness(1.1); }
.gfb-btn-next:active,
.gfb-btn-submit:active { transform: scale(.98); }

/* Loading state */
.gfb-btn-submit.gfb-loading {
  pointer-events: none;
  opacity: .75;
}
.gfb-btn-submit.gfb-loading::after {
  content:      '';
  display:      inline-block;
  width:        14px;
  height:       14px;
  margin-left:  8px;
  border:       2px solid rgba(255,255,255,.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation:    gfb-spin .7s linear infinite;
  vertical-align: middle;
}

@keyframes gfb-spin {
  to { transform: rotate(360deg); }
}

/* Messages */
.gfb-form-messages { margin-top: 16px; }

.gfb-message {
  padding:       14px 18px;
  border-radius: var(--gfb-radius);
  font-size:     15px;
  font-weight:   500;
}

.gfb-message-success {
  background: #ecfdf5;
  color:      #065f46;
  border:     1px solid #a7f3d0;
}

.gfb-message-error {
  background: #fef2f2;
  color:      #991b1b;
  border:     1px solid #fecaca;
}

/* Responsive */
@media (max-width: 600px) {
  .gfb-step-nav { flex-direction: column-reverse; }
  .gfb-btn-prev,
  .gfb-btn-next,
  .gfb-btn-submit { width: 100%; justify-content: center; }
}
