:root {
      --green:       #1a3a2a;
      --green-mid:   #2d5a40;
      --green-light: #4a8c64;
      --cream:       #f5f0e8;
      --cream-dark:  #e8e0d0;
      --red:         #8c2020;
      --gold:        #b8963e;
      --text:        #1a1a1a;
      --text-muted:  #666;
      --border:      #d4cfc6;
      --white:       #ffffff;
      --radius:      6px;
      --shadow:      0 2px 12px rgba(0,0,0,0.08);
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { font-size: 15px; }
    body { font-family: 'DM Sans', sans-serif; background: var(--cream); color: var(--text); min-height: 100vh; }

    header { background: var(--green); color: var(--cream); padding: 0 2rem; }
    .header-inner { max-width: 800px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; height: 64px; }
    .logo { font-family: 'Cormorant Garamond', serif; font-size: 1.4rem; font-weight: 600; color: var(--cream); text-decoration: none; }
    .logo span { color: var(--gold); }
    .flag-stripe { height: 4px; background: linear-gradient(to right, #009246 33.3%, #fff 33.3% 66.6%, #ce2b37 66.6%); }

    /* ── Header nav / back link ─────────────────────────────────────────── */
    .header-nav { margin-left: auto; }
    .header-back {
      font-family: 'DM Sans', sans-serif;
      font-size: 1rem;
      font-weight: 500;
      color: var(--gold);
      text-decoration: none;
      transition: opacity 0.15s;
    }
    .header-back:hover {
      opacity: 0.75;
    }

    main { max-width: 800px; margin: 0 auto; padding: 2.5rem 2rem 4rem; }
    .page-title { font-family: 'Cormorant Garamond', serif; font-size: 2rem; font-weight: 600; color: var(--green); margin-bottom: 0.25rem; }
    .page-subtitle { font-size: 0.9rem; color: var(--text-muted); margin-bottom: 2rem; line-height: 1.6; }

    .form-card { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 2rem; }

    .toggle-group { display: flex; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; margin-bottom: 2rem; }
    .toggle-btn { flex: 1; padding: 0.7rem; border: none; background: var(--cream); font-family: 'DM Sans', sans-serif; font-size: 0.9rem; font-weight: 500; color: var(--text-muted); cursor: pointer; transition: background 0.15s, color 0.15s; }
    .toggle-btn.active { background: var(--green); color: var(--cream); }

    .field-group { margin-bottom: 1.5rem; }
    label { display: block; font-size: 0.85rem; font-weight: 500; color: var(--text); margin-bottom: 0.4rem; }
    label .required { color: var(--red); }
    label .hint { font-weight: 400; color: var(--text-muted); font-size: 0.8rem; margin-left: 0.4rem; }

    input[type="text"], input[type="email"], select, textarea {
      width: 100%; padding: 0.6rem 0.8rem; border: 1px solid var(--border); border-radius: var(--radius);
      font-family: 'DM Sans', sans-serif; font-size: 0.9rem; color: var(--text); background: var(--white); outline: none; transition: border-color 0.15s;
    }
    input:focus, select:focus, textarea:focus { border-color: var(--green-light); }
    textarea { resize: vertical; min-height: 80px; }

    .two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
    @media (max-width: 600px) { .two-col { grid-template-columns: 1fr; } }

    /* Date picker rows */
    .date-selects { display: flex; gap: 0.5rem; }
    .date-selects select { flex: 1; }
    .date-selects select.day-sel  { flex: 0 0 80px; }
    .date-selects select.year-sel { flex: 0 0 90px; }

    .checkbox-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 0.4rem; }
    .checkbox-item { display: flex; align-items: center; gap: 0.4rem; font-size: 0.85rem; }
    .checkbox-item input[type="checkbox"] { width: auto; accent-color: var(--green); }

    .radio-group { display: flex; gap: 1.5rem; }
    .radio-item { display: flex; align-items: center; gap: 0.4rem; font-size: 0.9rem; cursor: pointer; }
    .radio-item input { accent-color: var(--green); width: auto; }

    .section-divider { border: none; border-top: 1px solid var(--border); margin: 1.5rem 0; }
    .section-label { font-family: 'Cormorant Garamond', serif; font-size: 1.1rem; color: var(--green); margin-bottom: 1rem; }

    .record-lookup { background: var(--cream); border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem; margin-bottom: 1.5rem; display: none; }
    .record-lookup.visible { display: block; }
    .record-lookup label { font-size: 0.85rem; font-weight: 600; color: var(--green); margin-bottom: 0.5rem; }
    .record-lookup select { margin-top: 0.25rem; }
    .record-lookup .loading-msg { font-size: 0.82rem; color: var(--text-muted); margin-top: 0.4rem; display: none; }
    .record-lookup .no-match-msg { font-size: 0.82rem; color: var(--red); margin-top: 0.4rem; display: none; }
    .record-lookup .match-note { font-size: 0.8rem; color: var(--text-muted); margin-top: 0.5rem; line-height: 1.5; }

    .btn-row { display: flex; gap: 0.75rem; margin-top: 1rem; flex-wrap: wrap-reverse; }
    .btn-primary { flex: 1; min-width: 200px; padding: 0.85rem; background: var(--green); color: var(--cream); border: none; border-radius: var(--radius); font-family: 'DM Sans', sans-serif; font-size: 1rem; font-weight: 500; cursor: pointer; transition: background 0.2s; }
    .btn-primary:hover { background: var(--green-mid); }
    .btn-primary:disabled { opacity: 0.6; cursor: not-allowed; }
    .btn-cancel { padding: 0.85rem 1.5rem; background: transparent; color: var(--text-muted); border: 1px solid var(--border); border-radius: var(--radius); font-family: 'DM Sans', sans-serif; font-size: 1rem; font-weight: 500; cursor: pointer; transition: background 0.2s, color 0.2s; white-space: nowrap; }
    .btn-cancel:hover { background: var(--cream-dark); color: var(--text); }

    .alert { padding: 1rem 1.25rem; border-radius: var(--radius); font-size: 0.9rem; margin-top: 1rem; display: none; }
    .alert-success { background: #d4edda; color: #1a5c2e; border: 1px solid #b8ddc4; }
    .alert-error   { background: #f8d7da; color: #721c24; border: 1px solid #f1b0b7; }