/* Form tư vấn — skin Luminous Vision. */

.gpkm-form-tu-van {
  max-width: 560px;
  margin-block: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.gpkm-form-tu-van h2 {
  margin: 0 0 var(--sp-2);
  font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
  font-weight: 700;
}

.gpkm-form-tu-van__dan {
  margin: 0 0 var(--sp-5);
  color: var(--ink-soft);
}

.gpkm-o { margin-bottom: var(--sp-4); }

.gpkm-o label {
  display: block;
  margin-bottom: 8px;
  color: var(--ink-soft);
  font-size: 0.875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.gpkm-o label span[aria-hidden] { color: var(--rose-red); }

.gpkm-o input,
.gpkm-o select,
.gpkm-o textarea {
  width: 100%;
  min-height: 48px;
  padding: 12px var(--sp-3);
  background: var(--surface-2);
  border: 0;
  border-radius: var(--bo-goc-lon);
  color: var(--ink-2);
}

.gpkm-o textarea { min-height: 96px; resize: vertical; }

.gpkm-o input:focus,
.gpkm-o select:focus,
.gpkm-o textarea:focus {
  outline: 2px solid color-mix(in srgb, var(--rose-red) 50%, transparent);
  outline-offset: 1px;
}

.gpkm-o input:user-invalid,
.gpkm-o input:user-invalid:focus { outline-color: var(--loi); }

.gpkm-o small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: 0.8125rem; }

.gpkm-bay { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.gpkm-thong-bao {
  margin-bottom: var(--sp-3);
  padding: var(--sp-3);
  border-radius: var(--bo-goc);
}

.gpkm-thong-bao--ok { background: var(--accent-soft); border: 1px solid var(--rose-red); color: var(--ink); }
.gpkm-thong-bao--loi { background: var(--loi-nhat); border: 1px solid var(--loi); color: var(--loi); }

.gpkm-form-tu-van .gpkm-nut {
  width: 100%;
  margin-top: var(--sp-2);
  border-radius: var(--bo-goc-lon);
}
