/* profile.css — หน้า /profile ข้อมูลการสมัคร (9 พ.ย. 69) · มือถือก่อน: คอลัมน์เดียว ทุกอย่างตัดบรรทัดได้ ไม่มีความกว้างตายตัว */

.profile { display: grid; gap: 14px; min-width: 0; }
.profile .page-head { margin-bottom: 4px; }
.profile .card + .card { margin-top: 0; }
.profile .crumb { margin: 0; }
.profile .crumb a { display: inline-flex; align-items: center; gap: 6px; color: var(--brand); font-weight: 600; text-decoration: none; }

/* ── ข้อความสถานะ ─────────────────────────────────────── */
.pnote { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 12px 14px; border-radius: var(--r-sm);
    background: var(--brand-soft); color: var(--ink); overflow-wrap: anywhere; }
.pnote .icon { flex: 0 0 auto; margin-top: 3px; }
.pnote--ok { background: var(--green-soft); color: var(--green); font-weight: 600; }
.pnote--error { background: var(--maroon-soft); color: var(--maroon); font-weight: 600; }
.pnote--saving { background: var(--surface-2); }
.pnote--quiet { background: transparent; padding: 0; color: var(--ink-2); font-size: .9rem; }

.pbanner { display: flex; gap: 10px; align-items: flex-start; padding: 16px; border-radius: var(--r);
    background: var(--maroon-soft); color: var(--ink); border: 1px solid color-mix(in srgb, var(--maroon) 30%, var(--line)); }
.pbanner > .icon { flex: 0 0 auto; color: var(--maroon); margin-top: 2px; }
.pbanner__title { font-weight: 700; color: var(--maroon); }
.pbanner__link { display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; font-weight: 600; color: var(--brand); }
.pstate__link { margin-top: 10px; }

/* ── การ์ดอ่านข้อมูล ──────────────────────────────────── */
.pcard { min-width: 0; }
.pcard__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.pcard__head .pcard__title { margin: 0; }
.pcard__title { display: flex; align-items: center; gap: 8px; font-size: 1.15rem; margin-bottom: 12px; }
.pcard__title .icon { color: var(--brand); flex: 0 0 auto; }
.pcard__edit { display: inline-flex; align-items: center; gap: 4px; min-height: 40px; padding: 0 12px; border-radius: 999px;
    border: 1px solid var(--line); color: var(--brand); font-weight: 600; text-decoration: none; white-space: nowrap; }
.pcard__edit:hover { background: var(--surface-2); }
.pcard__hint { margin-top: 14px; color: var(--ink-2); font-size: .92rem; }

.pfacts { display: grid; gap: 12px; margin: 0; }
.pfacts div { display: grid; gap: 2px; min-width: 0; }
.pfacts dt { font-size: .84rem; color: var(--ink-2); }
.pfacts dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }
.pfacts__sub { display: block; font-weight: 400; color: var(--ink-2); font-size: .92rem; }
.pfacts--tight { gap: 8px; margin-top: 8px; }
.pmono { font-variant-numeric: tabular-nums; letter-spacing: .04em; }
.pbreak { overflow-wrap: anywhere; white-space: pre-line; }

.pactions { display: grid; gap: 8px; margin-top: 10px; }
.pactions__item { justify-content: flex-start; }
.pactions__item.is-pending { color: var(--ink-2); }

/* ── คำขอ / ประวัติ ───────────────────────────────────── */
.preqs, .phistory { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.preq { padding: 14px; border: 1px solid var(--line-soft); border-radius: var(--r-sm); background: var(--paper); min-width: 0; }
.preq__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; }
.preq__kind { font-weight: 700; }
.preq .pnote { margin-top: 10px; }
.preq__cancel { margin-top: 10px; }
.pchip { display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; border-radius: 999px; font-size: .85rem; font-weight: 600; }
.pchip.is-pending { background: var(--brand-soft); color: var(--brand); }
.pchip.is-ok { background: var(--green-soft); color: var(--green); }
.pchip.is-bad { background: var(--maroon-soft); color: var(--maroon); }
.pchip.is-muted { background: var(--surface-2); color: var(--ink-2); }
.phistory li { display: grid; gap: 2px; padding-bottom: 10px; border-bottom: 1px solid var(--line-soft); }
.phistory li:last-child { border-bottom: 0; padding-bottom: 0; }
.phistory__what { font-weight: 600; }
.phistory__meta { color: var(--ink-2); font-size: .9rem; }

/* ── ฟอร์ม ─────────────────────────────────────────────── */
.pform { display: grid; gap: 16px; min-width: 0; }
.pgrid { display: grid; gap: 14px; min-width: 0; }
.pset { border: 0; margin: 0; padding: 0; display: grid; gap: 12px; min-width: 0; }
.pset__title { font-weight: 700; font-size: 1.02rem; padding: 0; margin-bottom: 4px; }
.pfield { display: grid; gap: 6px; min-width: 0; }
.pfield label { font-weight: 600; }
.pfield__opt { margin-left: 4px; font-weight: 400; color: var(--ink-2); font-size: .88rem; }
.pfield input, .pfield select, .pfield textarea {
    font: inherit; width: 100%; max-width: 100%; min-height: 48px; padding: 0 14px; border-radius: var(--r-sm);
    border: 1px solid var(--line); background: var(--paper); color: var(--ink);
}
.pfield textarea { padding: 10px 14px; min-height: 96px; resize: vertical; }
.pfield input:focus, .pfield select:focus, .pfield textarea:focus { outline: none; border-color: var(--brand); background: var(--surface); box-shadow: var(--focus); }
.pfield.is-invalid input, .pfield.is-invalid select, .pfield.is-invalid textarea { border-color: var(--maroon); }
.pfield__help { font-size: .86rem; color: var(--ink-2); margin: 0; }
.pfield__error { display: flex; gap: 6px; align-items: flex-start; margin: 0; color: var(--maroon); font-weight: 600; font-size: .92rem; }
.pfield__error .icon { flex: 0 0 auto; margin-top: 3px; }
.pcheck { font-weight: 500; }
.pcheck input { width: 22px; height: 22px; flex: 0 0 auto; accent-color: var(--brand); }
.pradios { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.pcurrent { margin: 0; color: var(--ink-2); overflow-wrap: anywhere; }
.pcurrent strong { color: var(--ink); }

.ppostcode { display: grid; gap: 8px; align-items: end; }
.ppostcode__find { width: 100%; }

.pchoices { display: grid; gap: 8px; }
.pchoice { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid var(--line); border-radius: var(--r-sm);
    background: var(--surface); cursor: pointer; min-width: 0; }
.pchoice input { width: 20px; height: 20px; margin-top: 2px; flex: 0 0 auto; accent-color: var(--brand); }
.pchoice:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); }
.pchoice.is-disabled { cursor: not-allowed; background: var(--surface-2); color: var(--ink-2); }
.pchoice__text { display: grid; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
.pchoice__title { font-weight: 600; }
.pchoice__sub { font-size: .9rem; color: var(--ink-2); }
.pchoice__why { font-size: .86rem; color: var(--maroon); font-weight: 600; }

.pform__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

@media (min-width: 640px) {
    .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ppostcode { grid-template-columns: minmax(0, 1fr) auto; }
    .ppostcode__find { width: auto; }
    .pactions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .pfacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pform__actions { display: flex; justify-content: flex-end; }
}