/* Wrapper: enables clean corner clipping */
.uael-table-wrapper {
    border-radius: 16px !important;
    overflow: hidden !important;
     box-shadow: 0 0 0 1px #dfcece;
}

.uael-table-wrapper td.uael-table-col  {
    border: 1px solid #dfcece;
}


/* =========================
   Woo Variations table styling
   Matches .mmg-intake-form card look
   Label sits ABOVE the field (all screens)
   ========================= */

.variations_form table.variations{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #ffffff;
  overflow: hidden;
}

/* Each attribute row becomes a clean stacked block */
.variations_form table.variations tbody tr{
  display: block;
  padding: 0px 10px 20px 5px
}

.variations_form table.variations tbody tr:first-child{
  border-top: 0;
}

/* Kill cell borders, the row handles separators now */
.variations_form table.variations tbody tr th,
.variations_form table.variations tbody tr td{
  border: 0 !important;
  padding: 0 !important;
}

/* label cell: full width above */
.variations_form table.variations th.label{
  display: block;
  width: 100% !important;
  background: transparent !important;
  color: #111827 !important;
  font-weight: 600 !important;
  font-size: 14px;
  margin: 0 0 8px 0;
  vertical-align: top;
}

.variations_form table.variations th.label label{
  display: block;
  margin: 0 !important;
}

/* value cell: full width under label */
.variations_form table.variations td.value{
  display: block;
  width: 100% !important;
  vertical-align: middle;
  background-color: #fff !important;
}

/* remove theme-added spacing inside value cell */
.variations_form table.variations td.value > *{
  margin: 0 !important;
}

/* the select + any input inside variations */
.variations_form table.variations td.value select,
.variations_form table.variations td.value input[type="text"],
.variations_form table.variations td.value input[type="number"]{
  width: 100%;
  box-sizing: border-box;
  padding: 14px;
  border: 1px solid #d1d5db;
  border-radius: 10px;
  background: #fff !important;
  color: #111827;
  font-size: 15px;
  line-height: 1.3;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.variations_form table.variations td.value select:focus,
.variations_form table.variations td.value input:focus{
  border-color: #2563eb;
  box-shadow: 0 0 0 3px color-mix(in srgb, #2563eb 20%, transparent);
}

/* reset variations link */
.variations_form .reset_variations{
  display: inline-block;
  margin-top: 10px;
  font-size: 13px;
  color: #2563eb;
  text-decoration: none;
}
.variations_form .reset_variations:hover{
  text-decoration: underline;
}

/* spacing between variations card and next blocks */
.variations_form table.variations + .reset_variations_alert,
.variations_form table.variations + div{
  margin-top: 10px;
}

/* Optional: tighten padding on small screens */
@media (max-width: 720px){
  .variations_form table.variations tbody tr{
    padding: 12px 14px;
  }

  .variations_form table.variations td.value select,
  .variations_form table.variations td.value input[type="text"],
  .variations_form table.variations td.value input[type="number"]{
    padding: 12px;
    font-size: 14px;
  }
}

/* =========================
   Remove table row / cell hover effects
   ========================= */

.variations_form table.variations tr:hover,
.variations_form table.variations tr:hover th,
.variations_form table.variations tr:hover td{
  background: transparent !important;
}

.variations_form table.variations td:hover,
.variations_form table.variations th:hover{
  background: transparent !important;
}

/* kill zebra striping some themes add */
.variations_form table.variations tr:nth-child(even),
.variations_form table.variations tr:nth-child(odd){
  background: transparent !important;
}

/* prevent pointer hover styles */
.variations_form table.variations{
  pointer-events: auto;
}


/* =========================
   MMG Intake Form Styling
   Scoped to .mmg-intake-form
   ========================= */

.mmg-intake-form{
  --mmg-bg: #ffffff;
  --mmg-text: #111827;
  --mmg-muted: #6b7280;
  --mmg-border: #e5e7eb;
  --mmg-border-strong: #d1d5db;
  --mmg-focus: #2563eb;
  --mmg-radius: 12px;
  --mmg-pad: 14px;
  --mmg-gap: 12px;

  color: var(--mmg-text);
  background: var(--mmg-bg);
  border: 1px solid var(--mmg-border);
  border-radius: var(--mmg-radius);
  padding: 18px;
  margin-top: 14px;
  margin-bottom: 14px;
}

/* Headings/labels */
.mmg-intake-form .acf-label label,
.mmg-intake-form label{
  display: inline-block;
  font-weight: 600;
  font-size: 14px;
  line-height: 1.2;
  margin: 0 0 6px 0;
  color: var(--mmg-text);
}

.mmg-intake-form .acf-label .description,
.mmg-intake-form .acf-field p.description{
  margin: 6px 0 0 0;
  font-size: 13px;
  color: var(--mmg-muted);
}

/* Layout: two-column on desktop, one-column on mobile */
.mmg-intake-form{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--mmg-gap);
}

@media (max-width: 720px){
  .mmg-intake-form{
    grid-template-columns: 1fr;
    padding: 16px;
  }
}

/* ACF fields behave nicely in the grid */
.mmg-intake-form .acf-field{
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

/* Make “message/notice” type fields span full width if you use them */
.mmg-intake-form .acf-field.acf-field-message,
.mmg-intake-form .acf-field.acf-field-true-false{
  grid-column: 1 / -1;
}

/* Inputs */
.mmg-intake-form input[type="text"],
.mmg-intake-form input[type="email"],
.mmg-intake-form input[type="tel"],
.mmg-intake-form input[type="url"],
.mmg-intake-form input[type="number"],
.mmg-intake-form select,
.mmg-intake-form textarea{
  width: 100%;
  box-sizing: border-box;
  padding: var(--mmg-pad);
  border: 1px solid var(--mmg-border-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--mmg-text);
  font-size: 15px;
  line-height: 1.3;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}

/* Placeholder */
.mmg-intake-form input::placeholder,
.mmg-intake-form textarea::placeholder{
  color: #9ca3af;
}

/* Focus */
.mmg-intake-form input:focus,
.mmg-intake-form select:focus,
.mmg-intake-form textarea:focus{
  border-color: var(--mmg-focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mmg-focus) 20%, transparent);
}

/* Validation states (ACF marks some fields with .acf-error) */
.mmg-intake-form .acf-error input,
.mmg-intake-form .acf-error select,
.mmg-intake-form .acf-error textarea{
  border-color: #dc2626;
  box-shadow: 0 0 0 3px color-mix(in srgb, #dc2626 18%, transparent);
}

.mmg-intake-form .acf-notice.-error{
  grid-column: 1 / -1;
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: #7f1d1d;
  border-radius: 10px;
  padding: 10px 12px;
}

/* ACF spacing cleanup */
.mmg-intake-form .acf-input-wrap{
  height: auto;
}
.mmg-intake-form .acf-input{
  margin: 0;
}

/* Woo variations area: keep things visually aligned */
.variations_form .single_variation_wrap .mmg-intake-form{
  margin-top: 16px;
}

/* Optional: make first field full width if it’s a “name” field */
.mmg-intake-form .acf-field[data-name="captain_name"]{
  grid-column: 1 / -1;
}

/* Optional: tighten on very small screens */
@media (max-width: 420px){
  .mmg-intake-form input[type="text"],
  .mmg-intake-form input[type="email"],
  .mmg-intake-form select,
  .mmg-intake-form textarea{
    padding: 12px;
    font-size: 14px;
  }
}