/**
 * USDA Eligibility section widget styles.
 *
 * Lifted verbatim from /extras/milestone/milestone-usda-eligibility-section.html
 * with two scoping renames:
 *   .mms-eligibility-section → .mms-usda-elig-section
 *   .mms-rate                → .mms-usda-elig (modal scope)
 * All other markup/breakpoint behavior preserved.
 */

/* ── ISOLATION RESET ─────────────────────────────────────────────── */
.mms-usda-elig-section,
.mms-usda-elig-section *,
.mms-usda-elig-section *::before,
.mms-usda-elig-section *::after {
  box-sizing: border-box;
  font-family: 'DM Sans', sans-serif !important;
  -webkit-font-smoothing: antialiased;
  margin: 0;
  padding: 0;
}

/* ── SECTION WRAPPER ─────────────────────────────────────────────── */
.mms-usda-elig-section {
  max-width: 1120px;
  margin: 0 auto;
  padding: 5% 24px;
  color: #171E3B;
  --p: #1e3295;
  --pdk: #171e3b;
  --sec: #0ea5c9;
}

.mms-usda-elig-section .mms-eligibility-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}

/* ── COLUMN CARDS ────────────────────────────────────────────────── */
.mms-usda-elig-section .mms-col {
  background: #ffffff;
  border-style: solid;
  border-radius: 15px;
  border-width: 0 0 0 10px;
  border-color: #171E3B;
  box-shadow: 0px 0px 10px -4px rgba(0, 0, 0, 0.5);
  padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  overflow: hidden;
  transition: border-color 0.25s ease;
}
.mms-usda-elig-section .mms-col:hover {
  border-color: #FFFFFF;
}

.mms-usda-elig-section .mms-col .mms-col-title {
  font-size: clamp(1.25rem, 1rem + 1vw, 1.6rem);
  font-weight: 800;
  color: #171E3B;
  margin-bottom: 24px;
  letter-spacing: -0.01em;
  line-height: 1.2;
}

/* ── AREAS GRID (LEFT COL) ──────────────────────────────────────── */
.mms-usda-elig-section .mms-areas-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 24px;
}

.mms-usda-elig-section .mms-area-tile {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #F9FAFB;
  border: 1px solid #E5E5E5;
  border-radius: 999px;
  padding: 12px 14px;
  transition: border-color 0.2s, background 0.2s, transform 0.2s;
  cursor: default;
}
.mms-usda-elig-section .mms-area-tile:hover {
  border-color: #1E3295;
  background: #ffffff;
  transform: translateY(-1px);
}

.mms-usda-elig-section .mms-area-pin {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.mms-usda-elig-section .mms-area-pin svg {
  width: 16px;
  height: 16px;
  color: #1E3295;
  transition: color 0.2s;
}
.mms-usda-elig-section .mms-area-tile:hover .mms-area-pin svg {
  color: #000000;
}

.mms-usda-elig-section .mms-area-name {
  font-size: 0.95rem;
  font-weight: 600;
  color: #171E3B;
}

/* ── INFO CTA BOX + BUTTON ──────────────────────────────────────── */
.mms-usda-elig-section .mms-info-box {
  background: #F4F5F7;
  border-left: 8px solid #1E3295;
  padding: 20px;
  margin-bottom: 16px;
  border-radius: 15px;
}
.mms-usda-elig-section .mms-info-box .mms-info-title {
  font-size: 1rem;
  font-weight: 800;
  color: #171E3B;
  margin-bottom: 6px;
}
.mms-usda-elig-section .mms-info-box p {
  font-size: 0.9rem;
  color: #3D3D3D;
  line-height: 1.6;
}

.mms-usda-elig-section .mms-info-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 20px;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  background: linear-gradient(135deg, #1E3295, #171E3B);
  color: #ffffff;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 0.9rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  transition: all 0.3s, transform 0.4s;
  box-shadow: 0 4px 14px rgba(23, 30, 59, 0.2);
  line-height: 1;
}
.mms-usda-elig-section .mms-info-btn:hover {
  transform: translateX(7px);
  filter: brightness(95%);
  box-shadow: 0 6px 20px rgba(23, 30, 59, 0.3);
}
.mms-usda-elig-section .mms-info-btn svg {
  width: 16px;
  height: 16px;
}

/* ── FORM CARD (RIGHT COL) ──────────────────────────────────────── */
.mms-usda-elig-section .mms-field {
  margin-bottom: 16px;
}
.mms-usda-elig-section .mms-field label {
  display: block;
  font-size: 0.78rem;
  font-weight: 700;
  color: #4b5563;
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.mms-usda-elig-section .mms-field input[type="text"],
.mms-usda-elig-section .mms-field select {
  width: 100%;
  padding: 14px 18px;
  border: 1.5px solid #e5e7eb;
  border-radius: 999px;
  font-size: 1rem;
  color: #171E3B;
  background: #fff;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  line-height: 1.4;
  font-family: 'DM Sans', sans-serif !important;
}
.mms-usda-elig-section .mms-field input::placeholder {
  color: #9ca3af;
}
.mms-usda-elig-section .mms-field input:focus,
.mms-usda-elig-section .mms-field select:focus {
  border-color: #1E3295;
  box-shadow: 0 0 0 3px rgba(30, 50, 149, 0.1);
}

.mms-usda-elig-section .mms-select-wrap {
  position: relative;
}
.mms-usda-elig-section .mms-select-wrap::after {
  content: '';
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #9ca3af;
  pointer-events: none;
}
.mms-usda-elig-section .mms-select-wrap select {
  padding-right: 40px;
  cursor: pointer;
}

.mms-usda-elig-section .mms-btn-submit {
  display: block;
  width: 100%;
  padding: 18px;
  margin-top: 24px;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  background: linear-gradient(135deg, #1E3295, #171E3B);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0;
  font-family: 'DM Sans', sans-serif !important;
  transition: all 0.3s, transform 0.4s;
  box-shadow: 0 4px 14px rgba(23, 30, 59, 0.2);
  line-height: 1;
}
.mms-usda-elig-section .mms-btn-submit:hover {
  transform: translateX(7px);
  filter: brightness(95%);
  box-shadow: 0 6px 20px rgba(23, 30, 59, 0.3);
}

.mms-usda-elig-section .mms-disclaimer {
  font-size: 0.75rem;
  color: #9ca3af;
  text-align: center;
  margin-top: 16px;
  line-height: 1.5;
}

/* ── BREAKPOINTS — outer section ─────────────────────────────────── */
/* Tablet Landscape (≤ 1024px): tighten gap, slight padding pullback */
@media (max-width: 1024px) {
  .mms-usda-elig-section { padding: 4% 20px; }
  .mms-usda-elig-section .mms-eligibility-grid { gap: 24px; }
}

/* Tablet Portrait (≤ 768px): collapse to single column, kill translateX hover.
   On a full-width button, translateX(7px) on hover/active causes horizontal
   overflow — replace with brightness-only tap feedback. */
@media (max-width: 768px) {
  .mms-usda-elig-section .mms-eligibility-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .mms-usda-elig-section .mms-info-btn:hover,
  .mms-usda-elig-section .mms-btn-submit:hover {
    transform: none;
  }
  .mms-usda-elig-section .mms-info-btn:active,
  .mms-usda-elig-section .mms-btn-submit:active {
    filter: brightness(88%);
  }
}

/* Mobile Portrait (≤ 480px): tighter card padding, larger tap targets */
@media (max-width: 480px) {
  .mms-usda-elig-section { padding: 0; }
  .mms-usda-elig-section .mms-col { padding: 20px; }
  /* Collapse area tiles to single column so longer town names
     (e.g. "East Longmeadow", "Belchertown") don't truncate. */
  .mms-usda-elig-section .mms-areas-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .mms-usda-elig-section .mms-area-tile { padding: 10px 12px; }
  .mms-usda-elig-section .mms-area-name { font-size: 0.9rem; }
  .mms-usda-elig-section .mms-info-btn,
  .mms-usda-elig-section .mms-btn-submit { padding: 16px; font-size: 0.95rem; }
  .mms-usda-elig-section .mms-field input[type="text"],
  .mms-usda-elig-section .mms-field select { padding: 14px 16px; }
}

/* ── MODAL ───────────────────────────────────────────────────────── */
.mms-usda-elig,.mms-usda-elig *,.mms-usda-elig *::before,.mms-usda-elig *::after{box-sizing:border-box;-webkit-font-smoothing:antialiased;}
.mms-usda-elig .step-title,.mms-usda-elig .success-title{font-family:'DM Sans',sans-serif !important;font-weight:700;line-height:1.2;margin:0;padding:0;border:none;background:none;color:#1f2937;letter-spacing:-0.01em;}
.mms-usda-elig p,.mms-usda-elig ul,.mms-usda-elig ol,.mms-usda-elig li{margin:0;padding:0;list-style:none;font-family:'DM Sans',sans-serif !important;}
.mms-usda-elig a{text-decoration:none;color:inherit;}
.mms-usda-elig input,.mms-usda-elig select,.mms-usda-elig button,.mms-usda-elig textarea{font-family:'DM Sans',sans-serif !important;-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;}
.mms-usda-elig input[type="number"]::-webkit-inner-spin-button,.mms-usda-elig input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none;}

.mms-usda-elig{
  font-family:'DM Sans',sans-serif !important;
  font-size:16px;line-height:1.5;color:#1f2937;
  background:rgba(0,0,0,0.6);
  position:fixed;top:0;left:0;width:100%;height:100%;
  z-index:999999;
  display:flex;align-items:center;justify-content:center;padding:16px;
  --p:#1e3295;--pdk:#171e3b;
  --p50:#eff6ff;--p100:#dbeafe;--sec:#0ea5c9;
  --n50:#f9fafb;--n100:#f3f4f6;--n200:#e5e7eb;
  --n300:#d1d5db;--n400:#9ca3af;--n500:#6b7280;
  --n600:#4b5563;--n700:#374151;--n800:#1f2937;
  animation:mmsFadeIn 0.2s ease;
}
@keyframes mmsFadeIn{from{opacity:0}to{opacity:1}}

.mms-usda-elig .modal{background:white;border-radius:15px;box-shadow:0 25px 60px rgba(0,0,0,0.2);width:100%;max-width:560px;animation:mmsSlideIn 0.3s ease;overflow:hidden;position:relative;}
@keyframes mmsSlideIn{from{opacity:0;transform:translateY(20px) scale(0.98)}to{opacity:1;transform:translateY(0) scale(1)}}

.mms-usda-elig .close-btn{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--n400);transition:background 0.15s;z-index:10;}
.mms-usda-elig .close-btn:hover{background:var(--n100);color:var(--n700);}

.mms-usda-elig .modal-body{padding:32px 40px 24px;}
@media(max-width:480px){.mms-usda-elig .modal-body{padding:24px 20px 16px;}}

.mms-usda-elig .progress-wrap{margin-bottom:28px;}
.mms-usda-elig .progress-labels{display:flex;justify-content:space-between;font-size:0.8rem;margin-bottom:8px;}
.mms-usda-elig .progress-labels span:first-child{color:var(--n500);}
.mms-usda-elig .progress-labels span:last-child{color:var(--n700);font-weight:600;}
.mms-usda-elig .progress-track{height:8px;background:var(--n100);border-radius:99px;overflow:hidden;}
.mms-usda-elig .progress-bar{height:100%;background:linear-gradient(to right,var(--p),var(--sec));border-radius:99px;transition:width 0.5s cubic-bezier(0.4,0,0.2,1);}

.mms-usda-elig .step-header{text-align:center;margin-bottom:28px;}
.mms-usda-elig .step-icon{width:64px;height:64px;background:linear-gradient(135deg,var(--p100),#cffafe);border-radius:15px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.mms-usda-elig .step-icon svg{width:30px;height:30px;color:var(--p);}
.mms-usda-elig .step-header .step-title{font-size:1.7rem;font-weight:700;color:var(--n800);margin-bottom:6px;}
.mms-usda-elig .step-header p{font-size:0.95rem;color:var(--n500);line-height:1.5;}

.mms-usda-elig .options{display:flex;flex-direction:column;gap:10px;margin-bottom:4px;}
.mms-usda-elig .option-label{display:block;padding:14px 16px;border:2px solid var(--n200);border-radius:15px;cursor:pointer;transition:all 0.15s;background:white;}
.mms-usda-elig .option-label:hover{border-color:var(--n300);background:var(--n50);}
.mms-usda-elig .option-label.selected{border-color:var(--p);background:var(--p50);}
.mms-usda-elig .option-inner{display:flex;align-items:center;gap:14px;}
.mms-usda-elig .option-icon{width:42px;height:42px;border-radius:15px;background:var(--n100);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 0.15s;}
.mms-usda-elig .option-label.selected .option-icon{background:var(--p100);}
.mms-usda-elig .option-icon svg{width:20px;height:20px;color:var(--n500);}
.mms-usda-elig .option-label.selected .option-icon svg{color:var(--p);}
.mms-usda-elig .option-text{flex:1;}
.mms-usda-elig .option-title{font-size:0.95rem;font-weight:600;color:var(--n800);}
.mms-usda-elig .option-desc{font-size:0.82rem;color:var(--n500);margin-top:2px;}

.mms-usda-elig .option-radio-dot{width:18px;height:18px;flex-shrink:0;border-radius:50%;border:2px solid #d1d5db;background:white;transition:all 0.15s;}
.mms-usda-elig .option-radio-dot.checked{border-color:#1e3295;background:#1e3295;box-shadow:inset 0 0 0 3px white;}

.mms-usda-elig .input-group{margin-bottom:16px;}
.mms-usda-elig .input-group label{display:block;font-size:0.75rem;font-weight:700;color:var(--n600);margin-bottom:7px;text-transform:uppercase;letter-spacing:0.04em;}
.mms-usda-elig .input-wrap{position:relative;}
.mms-usda-elig .input-prefix{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--n400);font-weight:500;font-size:0.95rem;pointer-events:none;}
.mms-usda-elig .input-wrap input,.mms-usda-elig .input-group input,.mms-usda-elig .input-group select{width:100%;padding:12px 18px;border:2px solid var(--n200);border-radius:999px;font-size:0.95rem;color:var(--n800);outline:none;transition:border-color 0.15s,box-shadow 0.15s;background:white;line-height:1.4;}
.mms-usda-elig .input-wrap input{padding-left:32px;}
.mms-usda-elig .input-group input:focus,.mms-usda-elig .input-group select:focus,.mms-usda-elig .input-wrap input:focus{border-color:var(--p);box-shadow:0 0 0 3px rgba(30,50,149,0.1);}
.mms-usda-elig .input-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media(max-width:400px){.mms-usda-elig .input-row{grid-template-columns:1fr;}}

.mms-usda-elig .score-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.mms-usda-elig .score-tile{padding:14px 12px;border:2px solid var(--n200);border-radius:15px;cursor:pointer;text-align:center;transition:all 0.15s;background:white;}
.mms-usda-elig .score-tile:hover{border-color:var(--n300);}
.mms-usda-elig .score-tile.selected{border-color:var(--p);background:var(--p50);}
.mms-usda-elig .score-tile .score-range{font-size:1rem;font-weight:700;color:var(--n800);}
.mms-usda-elig .score-tile .score-label{font-size:0.75rem;color:var(--n500);margin-top:2px;}
.mms-usda-elig .score-tile.selected .score-range{color:var(--p);}

.mms-usda-elig .success-screen{text-align:center;padding:16px 0 8px;}
.mms-usda-elig .success-icon{width:80px;height:80px;background:linear-gradient(135deg,#d1fae5,#a7f3d0);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;}
.mms-usda-elig .success-icon svg{width:36px;height:36px;color:#059669;}
.mms-usda-elig .success-screen .success-title{font-size:1.8rem;font-weight:700;color:var(--n800);margin-bottom:10px;}
.mms-usda-elig .success-screen p{font-size:0.95rem;color:var(--n500);line-height:1.6;max-width:380px;margin:0 auto 24px;}
.mms-usda-elig .success-details{background:var(--n50);border:1px solid var(--n200);border-radius:15px;padding:18px 20px;text-align:left;margin-bottom:20px;}
.mms-usda-elig .detail-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--n100);font-size:0.85rem;}
.mms-usda-elig .detail-row:last-child{border-bottom:none;}
.mms-usda-elig .detail-row span{color:var(--n500);}
.mms-usda-elig .detail-row strong{color:var(--n800);font-weight:600;}

.mms-usda-elig .modal-footer{display:flex;align-items:center;justify-content:space-between;padding:16px 40px 28px;}
@media(max-width:480px){.mms-usda-elig .modal-footer{padding:12px 20px 20px;}}

.mms-usda-elig .btn-back{display:flex;align-items:center;gap:8px;padding:12px 20px;border:none;background:transparent;font-size:0.95rem;font-weight:600;color:var(--n600);cursor:pointer;border-radius:999px;transition:all 0.15s;line-height:1;}
.mms-usda-elig .btn-back:hover:not(:disabled){background:var(--n100);color:var(--n800);}
.mms-usda-elig .btn-back:disabled{opacity:0.4;cursor:not-allowed;}

.mms-usda-elig .btn-next{display:flex;align-items:center;gap:8px;padding:12px 28px;border:none;background:linear-gradient(to right,var(--p),var(--pdk));color:white;font-size:0.95rem;font-weight:700;border-radius:999px;cursor:pointer;transition:all 0.2s;box-shadow:0 4px 14px rgba(23,30,59,0.2);line-height:1;}
.mms-usda-elig .btn-next:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px rgba(23,30,59,0.3);}
.mms-usda-elig .btn-next:disabled{opacity:0.45;cursor:not-allowed;transform:none;box-shadow:none;}

.mms-usda-elig .step-content{animation:mmsFadeSlide 0.25s ease;}
@keyframes mmsFadeSlide{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}