/**
 * Bootstrap Fallback Styles for Unthemed Forms
 *
 * These styles apply when no form theme is assigned (gf-no-theme class).
 * Provides Bootstrap-based styling as a sensible default for forms without custom themes.
 *
 * Architecture:
 * - Scoped entirely within .gf-no-theme class
 * - Uses data attributes for element targeting (data-gf-field-type, data-gf-button-type, data-gf-element)
 * - Only loads when form has no theme assigned
 * - Bootstrap 5 color palette used for consistency
 *
 * Note: Most form styles are provided by Bootstrap classes:
 * - Text inputs use .form-control
 * - Textareas use .form-control
 * - Select dropdowns use .form-select
 * - Buttons use .btn, .btn-primary, .btn-secondary
 * - Alerts use .alert, .alert-success
 *
 * This file only provides custom styling not covered by Bootstrap defaults.
 */

/* =========================================================
   Font size hierarchy — no-theme forms only
   Prevents the form from inheriting oversized fonts from
   the site theme. All sizes are capped; themes handle their
   own typography independently.
   ========================================================= */

/* Form title */
.gf-no-theme [data-gf-element="form-title"] {
  font-size: clamp(1.25rem, 2.5vw, 1.75rem) !important;
  line-height: 1.3 !important;
}

/* Form description */
.gf-no-theme [data-gf-element="form-description"] {
  font-size: 0.9375rem !important;
  line-height: 1.6 !important;
}

/* Page heading */
.gf-no-theme [data-gf-element="page-heading"] {
  font-size: clamp(1rem, 2vw, 1.25rem) !important;
  line-height: 1.35 !important;
}

/* Page description */
.gf-no-theme [data-gf-element="page-description"] {
  font-size: 0.875rem !important;
  line-height: 1.6 !important;
}

/* Row heading */
.gf-no-theme [data-gf-element="row-heading"] {
  font-size: 0.9375rem !important;
  line-height: 1.4 !important;
}

/* Row description */
.gf-no-theme [data-gf-element="row-description"] {
  font-size: 0.8125rem !important;
  line-height: 1.5 !important;
}

/* Field labels */
.gf-no-theme [data-gf-element="label"] {
  font-size: 0.875rem !important;
  line-height: 1.4 !important;
}

/* Field descriptions */
.gf-no-theme [data-gf-element="description"] {
  font-size: 0.8125rem !important;
  line-height: 1.5 !important;
}

/* All text-like inputs, textarea, select */
.gf-no-theme .form-control,
.gf-no-theme .form-select {
  font-size: 0.9375rem !important;
  line-height: 1.5 !important;
}

/* Checkbox and radio labels */
.gf-no-theme .form-check-label,
.gf-no-theme [data-gf-element="checkbox-label"] {
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
}

/* Button labels (previous, next, submit) */
.gf-no-theme [data-gf-button-type] .action-btn-label,
.gf-no-theme [data-gf-button-type] {
  font-size: 0.9375rem !important;
}

/* Field-level validation errors */
.gf-no-theme [data-gf-element="error"] {
  font-size: 0.8125rem !important;
  line-height: 1.5 !important;
}

/* Page-level alert (validation summary) */
.gf-no-theme .griffinforms-formpage-alert,
.gf-no-theme .griffinforms-form-alert {
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
}

/* Hydration / warning notices */
.gf-no-theme [data-gf-element="hydration-notice"] {
  font-size: 0.8125rem !important;
  line-height: 1.5 !important;
}

/* Floating labels (address sub-fields) */
.gf-no-theme .form-floating > label,
.gf-no-theme [data-gf-element="floating-label"] {
  font-size: 0.875rem !important;
}

/* Iteration add / delete buttons */
.gf-no-theme [data-gf-element="iteration-add"],
.gf-no-theme [data-gf-element="iteration-delete"] {
  font-size: 0.875rem !important;
}

/* Payment product price */
.gf-no-theme .griffinforms-payment-price {
  font-size: 0.9375rem !important;
}

/* Payment fixed quantity note */
.gf-no-theme .griffinforms-payment-qty-fixed {
  font-size: 0.8125rem !important;
  line-height: 1.5 !important;
}

/* Payment cart empty state */
.gf-no-theme .griffinforms-payment-cart-empty {
  font-size: 0.8125rem !important;
  line-height: 1.5 !important;
}

/* Success message */
.gf-no-theme [data-gf-element="success-message"] {
  font-size: 0.9375rem !important;
  line-height: 1.6 !important;
}

/* =========================================================
   End font size hierarchy
   ========================================================= */

/* Checkbox and Radio Inputs */
.gf-no-theme [data-gf-field-type="checkbox_radio"] input[type="checkbox"],
.gf-no-theme [data-gf-field-type="checkbox_radio"] input[type="radio"] {
  accent-color: #0d6efd;
  cursor: pointer;
}

/* Phone input group sizing for no-theme forms */
.gf-no-theme .griffinforms-phone-input-group .griffinforms-phone-country-select {
  flex: 0 0 28% !important;
  max-width: 28% !important;
  width: 28% !important;
  max-width: 180px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background-color: rgba(0, 0, 0, 0.05) !important;
  padding-right: 2.25rem !important;
}

.gf-no-theme .griffinforms-phone-input-group .griffinforms-phone-country-select[data-gf-phone-display-mode="flag_code_name"] {
  flex: 0 0 35% !important;
  max-width: 35% !important;
  width: 35% !important;
  min-width: 140px !important;
  max-width: 220px !important;
}

.gf-no-theme .griffinforms-phone-input-group .griffinforms-phone-country-select[data-gf-phone-display-mode="flag_code"] {
  flex: 0 0 28% !important;
  max-width: 28% !important;
  width: 28% !important;
  min-width: 120px !important;
  max-width: 180px !important;
}

.gf-no-theme .griffinforms-phone-input-group .griffinforms-phone-country-select[data-gf-phone-display-mode="code_only"] {
  flex: 0 0 16% !important;
  max-width: 16% !important;
  width: 16% !important;
  min-width: 76px !important;
  max-width: 110px !important;
}

/* Narrow-container responsive helpers for no-theme forms */
.gf-no-theme.gf-xs [data-gf-row="container"],
.gf-no-theme.gf-sm [data-gf-row="container"] {
  flex-direction: column !important;
}

.gf-no-theme.gf-xs .griffinforms-formpage-child,
.gf-no-theme.gf-sm .griffinforms-formpage-child {
  width: 100% !important;
  max-width: 100% !important;
}

.gf-no-theme.gf-xs .griffinforms-button-row,
.gf-no-theme.gf-sm .griffinforms-button-row {
  flex-direction: column !important;
  gap: 12px !important;
}

.gf-no-theme.gf-xs .griffinforms-button-row > *,
.gf-no-theme.gf-sm .griffinforms-button-row > * {
  width: 100% !important;
}

.gf-no-theme.gf-xs .griffinforms-payment-review-actions,
.gf-no-theme.gf-sm .griffinforms-payment-review-actions {
  flex-direction: column !important;
  gap: 12px !important;
}

.gf-no-theme.gf-xs .griffinforms-payment-review-actions > *,
.gf-no-theme.gf-sm .griffinforms-payment-review-actions > * {
  width: 100% !important;
}

.gf-no-theme.gf-xs .gf-address-wrapper .row > [class*="col-"],
.gf-no-theme.gf-sm .gf-address-wrapper .row > [class*="col-"] {
  flex: 0 0 100% !important;
  max-width: 100% !important;
}