.md-form {
  display: flex;
  flex-direction: column;
  gap: var(--md-space-5);
}

.md-field {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.md-field__control {
  position: relative;
  display: flex;
  align-items: center;
  height: var(--md-control-h);
  min-height: var(--md-control-h);
  overflow: hidden;
  background: var(--md-surface-lowest);
  border: 1px solid var(--md-outline);
  border-radius: var(--md-radius-sm);
}

.md-field.is-multiline .md-field__control {
  height: auto;
  min-height: calc(var(--md-control-h) * 2);
  align-items: flex-start;
  overflow: auto;
}

.md-field.is-multiline .md-field__input {
  min-height: calc(var(--md-control-h) * 2);
  padding: var(--md-space-3) var(--md-space-4);
  resize: vertical;
}

.md-field__input,
.md-field select,
.md-field textarea {
  flex: 1;
  width: 100%;
  min-width: 0;
  min-height: 0;
  padding: 0 var(--md-space-4);
  border: 0;
  background: transparent;
  appearance: none;
  font: var(--md-body);
  color: var(--md-on-surface);
}

.md-field select.md-field__input { padding-right: 40px; }

.md-field.has-icon .md-field__input { padding-left: 48px; }
.md-field.has-toggle .md-field__input { padding-right: 48px; }
.md-field.has-chevron .md-field__input { padding-right: 40px; }

.md-field__chevron {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  color: var(--md-on-surface-variant);
  pointer-events: none;
  transition: transform var(--md-duration) var(--md-ease), color var(--md-duration) var(--md-ease);
}

.md-field__icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--md-on-surface-variant);
  pointer-events: none;
  z-index: 2;
}

.md-field__label {
  order: -1;
  font: var(--md-title-sm);
  color: var(--md-on-surface);
  pointer-events: auto;
}

.md-field:focus-within .md-field__control {
  border-color: var(--md-primary);
  box-shadow: inset 0 0 0 1px var(--md-primary);
}

.md-field:has(.md-field__input:disabled) .md-field__control {
  background: var(--md-surface-container);
  border-color: var(--md-outline-variant);
}

.md-field:has(.md-field__input:disabled) .md-field__input {
  color: var(--md-on-surface);
  cursor: default;
}

.md-field:has(.md-field__input:disabled) .md-field__label {
  color: var(--md-on-surface-variant);
}

.md-field:has(.md-field__input:disabled):focus-within .md-field__control {
  border-color: var(--md-outline-variant);
  box-shadow: none;
}

.md-field__input { z-index: 1; }

.md-field__input:focus,
.md-field__input:focus-visible { outline: none; }

.md-field__input:-webkit-autofill,
.md-field__input:-webkit-autofill:hover,
.md-field__input:-webkit-autofill:focus,
.md-field__input:-webkit-autofill:active {
  -webkit-text-fill-color: var(--md-on-surface);
  caret-color: var(--md-on-surface);
  background-color: var(--md-surface-lowest) !important;
  box-shadow: none;
  transition: background-color 99999s ease-out;
}

.md-field__eye {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: var(--md-radius-sm);
  background: transparent;
  color: var(--md-on-surface-variant);
  cursor: pointer;
  display: grid;
  place-items: center;
  z-index: 3;
}

.md-field__eye:hover { background: var(--md-state-on-light); }
.md-field__eye .md-icon { width: 20px; height: 20px; }

.md-field__hint {
  margin: 0;
  font: var(--md-body-sm);
  color: var(--md-on-surface-variant);
}

.md-field__error {
  margin: 0;
  font: var(--md-body-sm);
  color: var(--md-error);
}

.md-field.is-invalid .md-field__control { border-color: var(--md-error); }
.md-field.is-invalid:focus-within .md-field__control {
  box-shadow: inset 0 0 0 1px var(--md-error);
}
.md-field.is-invalid .md-field__label { color: var(--md-error); }

.md-password-strong {
  display: flex;
  flex-direction: column;
  gap: var(--md-space-5);
  width: 100%;
}

.md-strength {
  display: flex;
  flex-direction: column;
  gap: var(--md-space-3);
  padding: var(--md-space-4);
  background: var(--md-surface-container);
  border-radius: var(--md-radius-sm);
}

.md-strength__bars {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--md-space-2);
}

.md-strength__bar {
  height: 4px;
  border-radius: var(--md-radius-full);
  background: var(--md-outline-variant);
}

.md-strength.is-1 .md-strength__bar:nth-child(-n+1) { background: var(--md-error); }
.md-strength.is-2 .md-strength__bar:nth-child(-n+2) { background: var(--md-warning); }
.md-strength.is-3 .md-strength__bar:nth-child(-n+3) { background: var(--md-secondary); }
.md-strength.is-4 .md-strength__bar { background: var(--md-success); }

.md-strength__label {
  font: var(--md-label-sm);
  color: var(--md-on-surface-variant);
}

.md-strength__rules {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--md-space-2);
}

.md-strength__rules li {
  display: flex;
  align-items: center;
  gap: var(--md-space-2);
  min-height: 20px;
  font: var(--md-body-sm);
  color: var(--md-on-surface-variant);
}

.md-strength__rules li .md-icon {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.md-strength__rules li.is-ok { color: var(--md-success); }

.md-control-row {
  display: flex;
  align-items: flex-start;
  gap: var(--md-space-4);
  flex-wrap: wrap;
}

.md-control-row .md-field { flex: 1; min-width: 180px; }
.md-control-row .md-btn {
  flex: 0 0 auto;
  align-self: flex-start;
  margin-top: var(--md-label-offset);
}

@media (max-width: 767px) {
  .md-control-row { flex-direction: column; }
  .md-control-row .md-field,
  .md-control-row .md-select,
  .md-control-row .md-btn {
    width: 100%;
    min-width: 0;
    flex: 1 1 auto;
  }
  .md-control-row .md-btn { margin-top: 0; }

  .md-file-field__empty .md-btn { width: 100%; }

  .md-field__input,
  .md-field select,
  .md-field textarea,
  .md-select__trigger {
    font: var(--md-body-lg);
  }
}

.md-select { position: relative; }

.md-select__trigger {
  width: 100%;
  margin: 0;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
}

.md-select__trigger:focus,
.md-select__trigger:focus-visible { outline: none; }

.md-select__value {
  flex: 1;
  min-width: 0;
  padding: 0 40px 0 16px;
  font: var(--md-body);
  color: var(--md-on-surface);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.md-select.has-icon .md-select__value { padding-left: 48px; }
.md-select:not(.has-value) .md-select__value { color: var(--md-on-surface-variant); }

.md-select.is-open .md-field__chevron {
  transform: translateY(-50%) rotate(180deg);
  color: var(--md-primary);
}

.md-select__native {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
  padding: 0;
}

.md-select__menu {
  max-height: 240px;
  overflow-y: auto;
}

.md-select__menu--searchable {
  display: flex;
  flex-direction: column;
  max-height: min(360px, 70vh);
  overflow: hidden;
  padding: 0;
}

.md-dropdown__menu.md-select__menu--searchable.is-open {
  display: flex;
}

.md-select__search {
  display: flex;
  align-items: center;
  gap: var(--md-space-2);
  flex: 0 0 auto;
  padding: var(--md-space-2) var(--md-space-3);
  border-bottom: 1px solid var(--md-outline-variant);
  background: var(--md-surface-lowest);
}

.md-select__search-icon {
  flex: 0 0 auto;
  color: var(--md-on-surface-variant);
}

.md-select__search-input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 40px;
  border: 0;
  padding: 0;
  font: var(--md-body-lg);
  color: var(--md-on-surface);
  background: transparent;
}

.md-select__search-input:focus,
.md-select__search-input:focus-visible {
  outline: none;
}

.md-select__search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

.md-select__options {
  flex: 1 1 auto;
  overflow-y: auto;
  max-height: none;
}

.md-select__empty {
  margin: 0;
  padding: var(--md-space-4) var(--md-space-5);
  font: var(--md-body);
  color: var(--md-on-surface-variant);
  text-align: center;
}

.md-select__options .md-dropdown__item.is-filtered-out,
.md-select__options .md-dropdown__item[hidden] {
  display: none !important;
}

.md-check-list {
  display: flex;
  flex-direction: column;
  margin-top: var(--md-space-3);
  border: 1px solid var(--md-outline-variant);
  border-radius: var(--md-radius-sm);
  background: var(--md-surface-lowest);
  overflow: hidden;
}

.md-check {
  display: flex;
  align-items: center;
  gap: var(--md-space-3);
  min-height: var(--md-control-h);
  padding: 0 var(--md-space-4);
  cursor: pointer;
}

.md-check + .md-check {
  border-top: 1px solid var(--md-outline-variant);
}

.md-check:hover { background: var(--md-surface-high); }

.md-check__input {
  width: 20px;
  height: 20px;
  margin: 0;
  flex: 0 0 auto;
  accent-color: var(--md-primary);
}

.md-check__copy {
  display: flex;
  flex-direction: column;
  gap: var(--md-space-1);
  min-width: 0;
}

.md-check__label { font: var(--md-body); color: var(--md-on-surface); }
.md-check__key { font: var(--md-body-sm); color: var(--md-on-surface-variant); }

.md-field__hint {
  margin: 0;
  padding-left: var(--md-space-4);
  font: var(--md-body-sm);
  color: var(--md-on-surface-variant);
}

.md-field.is-invalid .md-field__hint { display: none; }

.md-file {
  display: flex;
  align-items: flex-start;
  gap: var(--md-space-4);
}

.md-file__preview {
  width: var(--md-control-h);
  height: var(--md-control-h);
  flex: 0 0 auto;
  border: 1px solid var(--md-outline-variant);
  border-radius: var(--md-radius-sm);
  background: var(--md-surface-container);
  color: var(--md-on-surface-variant);
  display: grid;
  place-items: center;
  overflow: hidden;
}

.md-file__preview.has-image {
  background: var(--md-surface-lowest);
}

.md-file__preview--on-dark,
.md-file__preview--on-dark.has-image {
  background: var(--md-primary);
  color: var(--md-on-primary);
}

.md-file__preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.md-file__body {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--md-space-2);
}

.md-file__input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
  padding: 0;
}

.md-file .md-check-list { width: 100%; }

.md-file-field {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--md-space-1);
}

.md-file-field__input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
  padding: 0;
}

.md-file-field__surface {
  background: var(--md-surface-lowest);
  border: 1px dashed var(--md-outline);
  border-radius: var(--md-radius-sm);
}

.md-file-field:hover .md-file-field__surface {
  background: var(--md-state-on-light);
}

.md-file-field:focus-within .md-file-field__surface,
.md-file-field.is-drag .md-file-field__surface {
  border-style: solid;
  border-color: var(--md-primary);
  box-shadow: inset 0 0 0 1px var(--md-primary);
}

.md-file-field.is-drag .md-file-field__surface {
  background: var(--md-primary-container);
}

.md-file-field.is-filled .md-file-field__surface {
  border-style: solid;
  border-color: var(--md-outline-variant);
}

.md-file-field.is-filled:hover .md-file-field__surface {
  background: var(--md-surface-lowest);
}

.md-file-field.is-invalid .md-file-field__surface {
  border-color: var(--md-error);
}

.md-file-field.is-invalid:focus-within .md-file-field__surface {
  box-shadow: inset 0 0 0 1px var(--md-error);
}

.md-file-field__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--md-space-3);
  padding: var(--md-space-5);
  text-align: center;
  cursor: pointer;
}

.md-file-field.is-filled .md-file-field__empty { display: none; }

.md-file-field__icon {
  color: var(--md-primary);
}

.md-file-field__title {
  font: var(--md-title-md);
  color: var(--md-on-surface);
}

.md-file-field__hint {
  font: var(--md-body-sm);
  color: var(--md-on-surface-variant);
}

.md-file-field__empty .md-btn {
  pointer-events: none;
}

.md-file-field__filled {
  display: none;
  align-items: center;
  gap: var(--md-space-3);
  min-height: var(--md-control-h);
  padding: var(--md-space-3) var(--md-space-3) var(--md-space-3) var(--md-space-4);
}

.md-file-field.is-filled .md-file-field__filled { display: flex; }

.md-file-field__copy {
  display: flex;
  flex-direction: column;
  gap: var(--md-space-1);
  min-width: 0;
  flex: 1;
}

.md-file-field__name {
  margin: 0;
  font: var(--md-title-md);
  color: var(--md-on-surface);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.md-file-field__meta {
  margin: 0;
  font: var(--md-body-sm);
  color: var(--md-on-surface-variant);
}

.md-choice-grid {
  display: grid;
  gap: var(--md-space-3);
}

.md-choice-grid + .md-choice-grid,
.md-choice-grid + .md-field,
.md-field + .md-choice-grid {
  margin-top: var(--md-space-4);
}

@media (min-width: 768px) {
  .md-choice-grid--two { grid-template-columns: 1fr 1fr; }
}

.md-time-grid {
  grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 768px) {
  .md-time-grid { grid-template-columns: repeat(3, 1fr); }
}

.md-time-grid .md-choice {
  align-items: center;
  justify-content: center;
  min-height: calc(var(--md-control-h) + var(--md-space-4));
  padding: var(--md-space-3);
  text-align: center;
}

.md-time-grid .md-choice__body { align-items: center; }
.md-time-grid .md-choice__title { font: var(--md-title-lg); }
.md-time-grid .md-choice__hint { font: var(--md-label-sm); }

.md-choice {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: var(--md-space-3);
  margin: 0;
  padding: var(--md-space-4);
  border: 1px solid var(--md-outline-variant);
  border-radius: var(--md-radius-md);
  background: var(--md-surface-lowest);
  cursor: pointer;
}

.md-choice:hover { background: var(--md-state-on-light); }

.md-choice.is-disabled {
  background: var(--md-surface-container);
  color: var(--md-on-surface-variant);
  cursor: default;
  pointer-events: none;
}

a.md-choice {
  text-decoration: none;
  color: inherit;
}

.md-choice:has(.md-choice__input:checked),
.md-choice.is-selected {
  border-color: var(--md-primary);
  background: var(--md-surface-lowest);
  box-shadow: inset 0 0 0 1px var(--md-primary);
}

.md-choice:has(.md-choice__input:checked):hover,
.md-choice.is-selected:hover {
  background: var(--md-surface-lowest);
}

.md-choice:has(.md-choice__input:focus-visible),
.md-choice:focus-visible {
  outline: 2px solid var(--md-primary);
  outline-offset: 2px;
}

.md-choice-grid.is-invalid .md-choice {
  border-color: var(--md-error);
}

.md-choice__input {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.md-choice__body {
  position: relative;
  z-index: 0;
  display: flex;
  flex-direction: column;
  gap: var(--md-space-1);
  min-width: 0;
  flex: 1;
  pointer-events: none;
}

.md-choice__title {
  font: var(--md-title-md);
  color: var(--md-on-surface);
}

.md-choice:has(.md-choice__input:checked) .md-choice__title,
.md-choice.is-selected .md-choice__title {
  color: var(--md-on-surface);
}

.md-choice__hint {
  font: var(--md-body);
  color: var(--md-on-surface-variant);
}

.md-choice:has(.md-choice__input:checked) .md-choice__hint,
.md-choice.is-selected .md-choice__hint {
  color: var(--md-on-surface-variant);
}

.md-choice__tick {
  position: relative;
  z-index: 0;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: var(--md-space-6);
  height: var(--md-space-6);
  border: 1px solid var(--md-outline);
  border-radius: var(--md-radius-xs);
  background: var(--md-surface-lowest);
  color: transparent;
  pointer-events: none;
}

.md-choice:has(.md-choice__input:checked) .md-choice__tick {
  border-color: var(--md-primary);
  background: var(--md-primary);
  color: var(--md-on-primary);
}

.md-choice__tick .md-icon { width: 20px; height: 20px; }

.md-choice:has(.md-choice__chip) { align-items: center; }

.md-choice__chip {
  position: relative;
  z-index: 0;
  flex: 0 0 auto;
  pointer-events: none;
}

.md-contact-fields {
  display: flex;
  flex-direction: column;
  gap: var(--md-space-4);
}
.md-contact-fields [data-when] { display: none; }
.md-contact-fields:has([name="channel"][value="whatsapp"]:checked) [data-when="whatsapp"] { display: block; }
.md-contact-fields:has([name="channel"][value="email"]:checked) [data-when="email"] { display: block; }

.md-license-commune {
  display: flex;
  flex-direction: column;
  gap: var(--md-space-4);
}
.md-license-commune [data-when] { display: none; }
.md-license-commune:has([name="license_commune"][value="otra"]:checked) [data-when="otra"] { display: block; }
