/*
 * ImplanMed CRM — a weboldal natív űrlapjainak (Implantat-Check, Kontakt) kiegészítő stílusai.
 * Élesítéskor ide kerül: /assets/crm-forms.css (a scripts/weboldal-urlapok.sh teszi be a <head>-be).
 * Az alap megjelenést a weboldal saját osztályai adják (.form-grid, .form-field, input/select/textarea, .btn.primary);
 * itt csak az van, amire a weboldalon nincs szabály. Minden szabály a .crm-form / .crm-form-success alá szűkítve.
 */
.crm-form[hidden], .crm-form-success[hidden] { display: none; }
.crm-form .form-grid { gap: 0 .9rem; }
.crm-form .form-field > label { color: #49362c; }
.crm-form .crm-req { color: var(--rosewood, #7a4944); margin-left: .1rem; }

/* select: egységes nyíl, a helyőrző halványabb */
.crm-form select {
  width: 100%; appearance: none; -webkit-appearance: none; cursor: pointer;
  padding-right: 2.6rem !important;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23926b4f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 1rem center / 12px 8px;
}
.crm-form select:invalid { color: var(--muted, #76685d); }
.crm-form select option { color: var(--ink, #1b1411); }

/* hibás mező, de csak a kitöltés / beküldési kísérlet után */
.crm-form :is(input, select, textarea):user-invalid { border-color: #b42318; }

/* fájlfeltöltés: a valódi input láthatatlanul a doboz fölött van (kattintás, ráhúzás, billentyűzet) */
.crm-form .crm-file { position: relative; }
.crm-form .crm-file input[type=file] {
  position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0 !important;
  border: 0; opacity: 0; cursor: pointer; z-index: 1;
}
.crm-form .crm-file-drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem;
  min-height: 96px; padding: 1rem; text-align: center; color: #49362c;
  border: 1.5px dashed rgba(146, 107, 79, .4); border-radius: 16px; background: rgba(255, 255, 255, .72);
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}
.crm-form .crm-file:hover .crm-file-drop, .crm-form .crm-file.is-drag .crm-file-drop { border-color: var(--bronze, #926b4f); background: #fff; }
.crm-form .crm-file:focus-within .crm-file-drop { border-color: var(--bronze, #926b4f); box-shadow: 0 0 0 4px rgba(212, 191, 150, .22); }
.crm-form .crm-file-cta { font-weight: 600; }
.crm-form .crm-file-hint { font-size: .8rem; color: var(--muted, #76685d); }
.crm-form .crm-file-names { margin: 0; font-size: .86rem; color: #3d342d; overflow-wrap: anywhere; }
.crm-form .crm-file-names:empty { display: none; }
.crm-form .crm-file-error { margin: 0; font-size: .86rem; color: #9b1c1c; }
.crm-form .crm-file-error[hidden] { display: none; }

/* adatvédelmi jelölőnégyzet */
.crm-form .crm-consent { display: flex; align-items: flex-start; gap: .65rem; margin: .2rem 0 1.1rem; font-size: .9rem; line-height: 1.45; color: #3d342d; }
.crm-form .crm-consent input[type=checkbox] {
  flex: none; width: 1.15rem; height: 1.15rem; margin: .12rem 0 0; padding: 0 !important;
  border-radius: 4px !important; box-shadow: none; accent-color: var(--rosewood, #7a4944); cursor: pointer;
}
.crm-form .crm-consent label { cursor: pointer; }
.crm-form .crm-consent a { color: var(--rosewood, #7a4944); text-decoration: underline; text-underline-offset: 2px; }

/* csapdamező a robotoknak — látható felhasználónak soha */
.crm-form .crm-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

/* hiba (a CRM nem érhető el, vagy elutasította a kérést): csak data-crm-state="error" mellett látszik */
.crm-form .crm-alert {
  display: none; margin: 0 0 1rem; padding: .85rem 1rem; font-size: .92rem; line-height: 1.45;
  color: #7f1d1d; background: rgba(180, 35, 24, .06); border: 1px solid rgba(180, 35, 24, .28); border-radius: 16px;
}
.crm-form[data-crm-state="error"] .crm-alert { display: block; }
.crm-form .crm-alert p { margin: 0; }
.crm-form .crm-alert p + p { margin-top: .35rem; }
.crm-form .crm-alert a { font-weight: 600; text-decoration: underline; white-space: nowrap; }

/* küldés gomb + töltés állapot */
.crm-form .crm-submit { white-space: normal; text-align: center; }
.crm-form .crm-submit[disabled] { opacity: .75; cursor: progress; transform: none; }
.crm-form .crm-submit-busy { display: none; align-items: center; gap: .55rem; }
.crm-form[data-crm-state="sending"] .crm-submit-label { display: none; }
.crm-form[data-crm-state="sending"] .crm-submit-busy { display: inline-flex; }
.crm-form .crm-submit-busy::before {
  content: ""; width: 1em; height: 1em; border-radius: 50%;
  border: 2px solid currentColor; border-right-color: transparent; animation: crm-spin .8s linear infinite;
}
@keyframes crm-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .crm-form .crm-submit-busy::before { animation: none; } }
.crm-form .crm-note { margin: .85rem 0 0; text-align: center; font-size: .86rem; color: var(--muted, #76685d); }

/* sikeres küldés (az átirányításig, vagy ha az nem történik meg) */
.crm-form-success {
  padding: 1.5rem; text-align: center; color: #3d342d;
  background: rgba(255, 250, 242, .92); border: 1px solid var(--line, rgba(146, 107, 79, .22)); border-radius: 22px;
}
.crm-form-success:focus { outline: none; }
.crm-form-success strong { display: block; margin-bottom: .4rem; font-family: "Playfair Display", Georgia, serif; font-size: 1.4rem; color: var(--ink, #1b1411); }
.crm-form-success p { margin: 0; }