/* NEWTREE Orders — front-end form styling
   Reuses the same palette as the main NEWTREE theme: teal/gold for MARIKA,
   navy/orange for WakuWaku Travel. Scoped under .nt-form-wrap so it never
   leaks into the rest of the page. */

.nt-form-wrap {
  --nt-teal: #1B5F5E;
  --nt-teal-light: #2D8B87;
  --nt-gold: #C9A96E;
  --nt-cream: #FAF8F5;
  --nt-charcoal: #2A2A2A;
  --nt-mid: #6B6B6B;
  --nt-stone: #E5DED2;
  --nt-white: #FFFFFF;
  --nt-red: #c94040;
  --nt-accent: var(--nt-teal);
  --nt-accent-light: var(--nt-teal-light);

  max-width: 720px;
  margin: 0 auto;
  font-family: 'Noto Sans JP', sans-serif;
  color: var(--nt-charcoal);
  font-weight: 300;
}

.nt-form-wrap.nt-travel {
  --nt-accent: #0d1f3c;
  --nt-accent-light: #1a3a63;
  --nt-gold: #e8822a;
}

.nt-card {
  background: var(--nt-white);
  border-left: 4px solid var(--nt-gold);
  padding: 32px 36px;
  margin-bottom: 24px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.05);
}

.nt-card-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px;
  font-weight: 600;
  color: var(--nt-accent);
  letter-spacing: 0.06em;
  margin: 0 0 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--nt-stone);
}

.nt-row { display: grid; gap: 14px; margin-bottom: 14px; }
.nt-col-2 { grid-template-columns: 1fr 1fr; }
.nt-col-3 { grid-template-columns: 1fr 1fr 1fr; }

.nt-field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 14px; }
.nt-field label { font-size: 11px; font-weight: 500; color: var(--nt-mid); letter-spacing: 0.06em; }
.nt-req { color: var(--nt-red); margin-left: 2px; }

.nt-form-wrap input[type="text"],
.nt-form-wrap input[type="date"],
.nt-form-wrap input[type="tel"],
.nt-form-wrap input[type="email"],
.nt-form-wrap input[type="number"],
.nt-form-wrap select,
.nt-form-wrap textarea {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 14px;
  color: var(--nt-charcoal);
  background: var(--nt-white);
  border: 1px solid var(--nt-stone);
  border-radius: 2px;
  padding: 10px 12px;
  outline: none;
  width: 100%;
  box-sizing: border-box;
  transition: border-color .15s;
}
.nt-form-wrap input:focus, .nt-form-wrap select:focus, .nt-form-wrap textarea:focus {
  border-color: var(--nt-gold);
  box-shadow: 0 0 0 2px rgba(201,169,110,0.18);
}
.nt-form-wrap textarea { resize: vertical; min-height: 100px; line-height: 1.7; }

.nt-checkbox-group { display: flex; gap: 16px; flex-wrap: wrap; padding: 4px 0 16px; }
.nt-checkbox-option { display: flex; align-items: center; gap: 7px; cursor: pointer; font-size: 14px; }
.nt-checkbox-option input { width: 16px; height: 16px; accent-color: var(--nt-gold); }

.nt-radio-group { display: flex; flex-direction: column; gap: 10px; padding: 4px 0; }
.nt-radio-option { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; font-size: 13px; line-height: 1.6; }
.nt-radio-option input { width: 16px; height: 16px; accent-color: var(--nt-gold); margin-top: 2px; flex-shrink: 0; }
.nt-radio-option small { color: var(--nt-mid); }

.nt-traveler-block { border: 1px solid var(--nt-stone); padding: 20px; margin-bottom: 14px; border-radius: 2px; background: var(--nt-cream); }
.nt-traveler-title { font-size: 13px; font-weight: 500; color: var(--nt-accent); margin-bottom: 14px; letter-spacing: 0.05em; }

.nt-add-btn {
  background: none;
  border: 1px dashed var(--nt-gold);
  color: var(--nt-accent);
  padding: 10px 20px;
  font-size: 13px;
  cursor: pointer;
  border-radius: 2px;
  margin-bottom: 20px;
}
.nt-add-btn:hover { background: var(--nt-cream); }

.nt-hp-field { position: absolute; left: -9999px; top: -9999px; }

.nt-submit-area { text-align: center; padding-top: 8px; }
.nt-submit-note { font-size: 12px; color: var(--nt-mid); margin-bottom: 18px; line-height: 1.7; }
.nt-submit-btn {
  background: var(--nt-accent);
  color: #fff;
  border: none;
  padding: 15px 48px;
  font-family: 'Cormorant Garamond', serif;
  font-size: 15px;
  letter-spacing: 0.12em;
  cursor: pointer;
  border-radius: 2px;
  transition: background .2s;
}
.nt-submit-btn:hover { background: var(--nt-accent-light); }
.nt-submit-btn:disabled { background: #ccc; cursor: not-allowed; }

.nt-msg-box { display: none; text-align: center; padding: 50px 20px; }
.nt-msg-box.nt-show { display: block; }
.nt-msg-icon { font-size: 36px; margin-bottom: 14px; color: var(--nt-accent); }
.nt-msg-box h2 { font-family: 'Cormorant Garamond', serif; font-size: 22px; color: var(--nt-accent); margin: 0 0 10px; }
.nt-msg-box p { font-size: 13px; color: var(--nt-mid); line-height: 1.8; margin: 0; }
.nt-msg-box.nt-error .nt-msg-icon, .nt-msg-box.nt-error h2 { color: var(--nt-red); }

@media (max-width: 640px) {
  .nt-card { padding: 24px 20px; }
  .nt-col-2, .nt-col-3 { grid-template-columns: 1fr; }
}
