/**
 * GeoFazendas Modal Base - Body, Footer & Size Variants
 * Part of the modal-base component system.
 *
 * Scrollable body content area, footer with button layout
 * (mobile: stacked, desktop: horizontal), and size variant classes.
 */

/* ==========================================================================
   Body (Scrollable Content Area)
   ========================================================================== */

.gf-modal__body {
  flex: 1;
  padding: 0 1.25rem 1.25rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* Body with more padding for centered content */
.gf-modal__body--centered {
  text-align: center;
  padding: 0 1.5rem 1.5rem;
}

/* Message text inside body */
.gf-modal__message {
  font-size: 0.9375rem;
  color: var(--gf-color-neutral-600, #64748b);
  margin: 0;
  line-height: 1.6;
}

/* ==========================================================================
   Footer
   ========================================================================== */

.gf-modal__footer {
  display: flex;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background-color: var(--gf-color-neutral-50, #f8fafc);
  border-top: 1px solid var(--gf-modal-border-color);
  flex-shrink: 0;
  
  /* Mobile: stack buttons vertically (cancel below confirm for thumb reach) */
  flex-direction: column-reverse;
}

.gf-modal__footer .btn {
  width: 100%;
  justify-content: center;
}

/* Footer centered (for confirmation dialogs) */
.gf-modal__footer--centered {
  justify-content: center;
  background-color: transparent;
  border-top: none;
  padding: 0 1.5rem 1.5rem;
}

/* ==========================================================================
   Size Variants
   ========================================================================== */

.gf-modal--sm .gf-modal__dialog {
  --gf-modal-desktop-width: var(--gf-modal-width-sm);
}

.gf-modal--md .gf-modal__dialog {
  --gf-modal-desktop-width: var(--gf-modal-width-md);
}

.gf-modal--lg .gf-modal__dialog {
  --gf-modal-desktop-width: var(--gf-modal-width-lg);
}

.gf-modal--xl .gf-modal__dialog {
  --gf-modal-desktop-width: var(--gf-modal-width-xl);
}
