/* טופס ההרשמה של AUM: מגירה שיורדת מלמעלה. אותו מבנה כמו הפופאפ של יוצאים להרפתקה, בשפה של AUM. */
.modal { position: fixed; inset: 0; z-index: 60; display: flex; align-items: flex-start; justify-content: center; padding: 0; background: rgba(74, 31, 16, .8); opacity: 0; transition: opacity .3s ease; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.modal[hidden] { display: none; }
.modal.open { opacity: 1; }
.modal-box { position: relative; width: 100%; max-width: 30rem; margin: 0 auto auto; background: var(--paper); border-radius: 0; padding: calc(1.4rem + env(safe-area-inset-top)) 1.1rem 2.4rem; text-align: center; transform: translateY(-110%); transition: transform .34s cubic-bezier(.22, .8, .2, 1); will-change: transform; }
.modal.open .modal-box { transform: none; }
.modal-box:focus { outline: none; }
/* החלקה למעלה בפס שבתחתית, לחיצה בחוץ או Esc סוגרות */
.modal-grab { position: absolute; left: 0; right: 0; bottom: 0; height: 2.2rem; display: grid; place-items: center; cursor: grab; touch-action: none; }
.modal-grab i { width: 2.7rem; height: .3rem; border-radius: .2rem; background: rgba(74, 37, 20, .28); }

.su-hand { font-family: "Amatic SC", cursive; font-weight: 700; font-size: 2.2rem; line-height: 1; color: var(--red); margin: 0; }
.su-title { font-family: "Rubik", sans-serif; font-weight: 700; font-size: 1.5rem; line-height: 1.2; color: var(--ink); margin: .1rem 0 .7rem; }
.mt-badge { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .35rem; margin: 0 auto 1.1rem; font-size: 1rem; color: var(--ink); }
.mt-badge svg { width: 1.1rem; height: 1.1rem; color: var(--red); }
.mt-badge b { font-weight: 700; }
.mt-badge span:not(:empty)::before { content: "· "; }
.mt-badge[hidden] { display: none; }

.su-grid { display: grid; grid-template-columns: minmax(0, 1fr) 7.5rem; gap: .6rem .5rem; align-items: start; }
.su-grid > *, .su-cell { min-width: 0; }
.su-input { width: 100%; background: #fff; border: 2px solid var(--line); border-radius: 16px; padding: .7rem 1rem; font: 1.05rem "Assistant", system-ui, sans-serif; color: var(--ink); }
.su-input::placeholder { color: #B39A82; }
.su-input:focus { outline: none; border-color: var(--red); }
.su-input.bad { border-color: #B3261E; }
.su-input:-webkit-autofill, .su-input:-webkit-autofill:hover, .su-input:-webkit-autofill:focus { -webkit-box-shadow: 0 0 0 1000px #fff inset !important; -webkit-text-fill-color: var(--ink) !important; caret-color: var(--ink); }
.su-select { appearance: none; -webkit-appearance: none; padding-inline-end: 2.2rem; cursor: pointer; text-align: start; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C1191F' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: left .75rem center; background-size: 1.15rem; }
.su-select:invalid { color: #B39A82; }
.su-select option { color: var(--ink); }
.su-err { color: #A8141A; font-size: .85rem; font-weight: 700; margin-top: .25rem; line-height: 1.25; text-align: center; }
.su-err:empty { display: none; }
.su-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.su-send { width: 100%; margin-top: 1rem; white-space: nowrap; transition: opacity .25s ease, background-color .4s ease; }
.su-send:disabled { opacity: .7; cursor: default; }
.su-send.swap { opacity: 0; }
.su-send.saved, .su-send:disabled.saved { opacity: 1; background: #E9D9A8; border-color: #E9D9A8; color: #8A6A55; cursor: not-allowed; pointer-events: none; }

/* אחרי ההרשמה: הטופס נסגר מלמעלה (קיפול), ואז נחשפים הטקסט ופתיחת שיחה עם טל */
.su-fold { display: grid; grid-template-rows: 1fr; opacity: 1; transition: grid-template-rows .55s cubic-bezier(.22, .8, .2, 1), opacity .4s ease; }
.su-fold > div { min-height: 0; overflow: hidden; }
.su-fold.shut { grid-template-rows: 0fr; opacity: 0; }
.su-after.shut { pointer-events: none; }
.su-after > div { padding-top: 1rem; }
.su-thanks { font-family: "Rubik", sans-serif; font-weight: 600; font-size: 1.25rem; line-height: 1.45; color: var(--ink); margin: 0 0 .4rem; }
.su-thanks-sub { color: var(--muted); font-size: 1.05rem; margin: 0 0 1rem; }
.su-fail a { color: var(--red); font-weight: 800; }

html.modal-lock { overflow: hidden; overscroll-behavior: none; }
html.modal-lock body { overflow: hidden; overscroll-behavior: none; touch-action: none; }
html.modal-lock .modal { touch-action: pan-y; }
@media (prefers-reduced-motion: reduce) { .modal, .modal-box, .su-fold, .su-send { transition: none; } }

/* שדות הפרטים האישיים: אותו מראה כמו השדות בדף הניהול (קו תחתון ותווית צפה), מועתק מ-person-form.css של הרפתקה */
.pf-field{ position:relative; display:block; margin:0; }
.pf-field > span{ position:absolute; z-index:1; top:3px; inset-inline:0 -33%; margin:0; font-size:16px; line-height:22px; font-weight:400; color:var(--muted, #8A6A55); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; pointer-events:none; transform:scale(.75); transform-origin:100% 0; transition:transform .16s ease-out, color .16s ease-out; }
.pf-field:has(> input:placeholder-shown:not(:focus):not(:-webkit-autofill)) > span{ transform:translateY(16px); inset-inline-end:0; }
.pf-field:has(> select:not(:focus) option[value=""]:checked) > span{ transform:translateY(16px); inset-inline-end:0; }
.pf-field:focus-within > span{ color:var(--ink, #4A2514); }
.pf-field:has(> .bad) > span{ color:var(--red); }

.pf-input{ display:block; width:100%; height:46px; margin:0; padding:19px 0 3px; border:0; border-bottom:1px solid rgba(74,37,20,.5); border-radius:0; background:transparent; box-shadow:none; color:var(--ink, #4A2514); font:inherit; font-size:16px; line-height:22px; transition:border-color .16s ease-out; }
.pf-input:focus{ outline:none; border-bottom-color:var(--ink, #4A2514); box-shadow:inset 0 -1px 0 var(--ink, #4A2514); }
.pf-input.bad{ border-bottom-color:var(--red); box-shadow:inset 0 -1px 0 var(--red); }
.pf-input[type="tel"]{ text-align:right; }   /* המספר נכתב משמאל לימין אבל מתחיל בקו של שם השדה */
.pf-input[type="number"]{ -moz-appearance:textfield; appearance:textfield; }
.pf-input[type="number"]::-webkit-outer-spin-button, .pf-input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
select.pf-input{ -webkit-appearance:none; appearance:none; cursor:pointer; text-align:start; padding-inline:0 20px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.4l5 5.2 5-5.2z' fill='%238A6A55'/%3E%3C/svg%3E") no-repeat left 2px bottom 10px / 12px 8px; }   /* החץ בקו של הטקסט */
select.pf-input option{ color:var(--ink, #4A2514); }
.pf-input:disabled{ opacity:1; -webkit-text-fill-color:var(--muted, #8A6A55); color:var(--muted, #8A6A55); cursor:default; }

@media (prefers-reduced-motion:reduce){ .pf-field > span, .pf-input{ transition:none; } }

/* מילוי אוטומטי של הדפדפן: בלי רקע צבעוני */
.pf-input:-webkit-autofill, .pf-input:-webkit-autofill:hover, .pf-input:-webkit-autofill:focus, .pf-input:-webkit-autofill:active{ -webkit-text-fill-color:var(--ink, #4A2514) !important; caret-color:var(--ink, #4A2514); transition:background-color 99999s ease-in-out 0s; }