/**
 * Sección «formulario» de la página «reclamaciones», clonada de producción.
 *
 * Las clases `css-…` son los hashes que genera Emotion en el sitio viejo.
 * Se conservan literales para que el render sea idéntico; por eso no son
 * legibles. La plantilla que las usa está al lado, en el mismo directorio.
 *
 * Este formulario es el único del sitio que no reduce la letra de sus campos
 * —en el React no pasa `InputProps`—, así que usa las variantes de 1rem
 * (`css-1fekm3r`, `css-1rmiksn`) y no las de 0.875rem de los demás.
 *
 * Generado desde https://www.icasa.pe — no editar a mano salvo para corregir.
 */

/*
 * Los estados de los campos —etiqueta flotante, casilla, radio, `select`, el
 * error de un campo— están en `assets/css/chrome.css`: los pinta
 * `template-parts/campo.php`, que es de los cinco formularios.
 */

.css-b5auzx{margin-left: auto; margin-right: auto; margin-top: 40px;}
.css-dyh95q{margin: 0px 0px 0.35em; font-family: Poppins, sans-serif; font-size: 1.5rem; line-height: 1.334; text-align: var(--Typography-textAlign); font-weight: 700; padding-bottom: 16px;}
.css-1tildd2{margin: 0px; font-family: Poppins, sans-serif; font-weight: 400; font-size: 0.875rem; line-height: 1.43; padding-bottom: 24px;}
.css-12xbrj3{margin: 0px; font-family: Poppins, sans-serif; font-size: 1rem; line-height: 1.75; font-weight: 700;}
.css-137srli{margin: 0px; font-family: Poppins, sans-serif; font-weight: 400; font-size: 0.875rem; line-height: 1.43; font-style: italic;}

/* La pila vertical del formulario y la fila de dos campos. */
.css-1ov46kg{display: flex; flex-direction: column;}
.css-1ov46kg > :not(style):not(style){margin: 0px;}
.css-1ov46kg > :not(style) ~ :not(style){margin-top: 16px;}
.css-yvxf5u{display: flex; flex-direction: column;}
.css-yvxf5u > :not(style):not(style){margin: 0px;}
.css-yvxf5u > :not(style) ~ :not(style){margin-top: 16px;}
@media (min-width: 600px){
.css-yvxf5u{flex-direction: row;}
.css-yvxf5u > :not(style):not(style){margin: 0px;}
.css-yvxf5u > :not(style) ~ :not(style){margin-top: 0px; margin-left: 16px;}
}

/* --- campo de texto (variante de 1rem) --- */
.css-1vbfw84{display: inline-flex; flex-direction: column; position: relative; min-width: 0px; padding: 0px; margin: 0px; border: 0px; vertical-align: top; width: 100%;}
.css-1fekm3r{color: rgba(0, 0, 0, 0.6); font-family: Poppins, sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.4375em; padding: 0px; display: block; transform-origin: left top; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; position: absolute; left: 0px; top: 0px; transition: color 200ms cubic-bezier(0, 0, 0.2, 1), transform 200ms cubic-bezier(0, 0, 0.2, 1), max-width 200ms cubic-bezier(0, 0, 0.2, 1); z-index: 1; pointer-events: none; transform: translate(14px, 16px) scale(1); max-width: calc(100% - 24px);}
.css-1fekm3r.Mui-error{color: rgb(211, 47, 47);}
.css-1rmiksn{font-family: Poppins, sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.4375em; color: rgba(0, 0, 0, 0.87); box-sizing: border-box; cursor: text; display: inline-flex; -webkit-box-align: center; align-items: center; width: 100%; position: relative; border-radius: 4px;}
.css-1rmiksn:hover .MuiOutlinedInput-notchedOutline{border-color: rgba(0, 0, 0, 0.87);}
@media (hover: none){
.css-1rmiksn:hover .MuiOutlinedInput-notchedOutline{border-color: rgba(0, 0, 0, 0.23);}
}
.css-1rmiksn.Mui-error .MuiOutlinedInput-notchedOutline{border-color: rgb(211, 47, 47);}
.css-1pk1fka{font: inherit; letter-spacing: inherit; color: currentcolor; border: 0px; box-sizing: content-box; background: none; height: 1.4375em; margin: 0px; -webkit-tap-highlight-color: transparent; display: block; min-width: 0px; width: 100%; padding: 16.5px 14px;}
.css-1pk1fka:focus{outline: 0px;}
.css-1pk1fka:invalid{box-shadow: none;}
.css-5v2ak0{text-align: left; position: absolute; inset: -5px 0px 0px; margin: 0px; padding: 0px 8px; pointer-events: none; border-radius: inherit; border-style: solid; border-width: 1px; overflow: hidden; min-width: 0%; border-color: rgba(0, 0, 0, 0.23);}
.css-81qg8w{float: unset; width: auto; overflow: hidden; display: block; padding: 0px; height: 11px; font-size: 0.75em; visibility: hidden; max-width: 0.01px; transition: max-width 50ms cubic-bezier(0, 0, 0.2, 1); white-space: nowrap;}
.css-81qg8w > span{padding-left: 5px; padding-right: 5px; display: inline-block; opacity: 0; visibility: visible;}

/* --- select --- */
.css-mp9f0v{appearance: none; user-select: none; cursor: pointer; border-radius: 4px; font: inherit; letter-spacing: inherit; color: currentcolor; border: 0px; box-sizing: content-box; background: none; height: 1.4375em; margin: 0px; -webkit-tap-highlight-color: transparent; display: block; min-width: 0px; width: 100%; padding: 16.5px 14px;}
.css-mp9f0v:focus{outline: 0px; border-radius: 4px;}
.css-mp9f0v.css-mp9f0v.css-mp9f0v{padding-right: 32px;}
.css-mp9f0v.MuiSelect-select{height: auto; min-height: 1.4375em; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.css-mp9f0v:not([multiple]) option, .css-mp9f0v:not([multiple]) optgroup{background-color: rgb(255, 255, 255);}
.css-1l3b12y{user-select: none; width: 1em; height: 1em; display: inline-block; flex-shrink: 0; transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1); fill: currentcolor; font-size: 1.5rem; position: absolute; top: calc(50% - 0.5em); pointer-events: none; color: rgba(0, 0, 0, 0.54); right: 7px;}

/* --- textarea --- */
.css-wj7jy6{font-family: Poppins, sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.4375em; color: rgba(0, 0, 0, 0.87); box-sizing: border-box; cursor: text; display: inline-flex; -webkit-box-align: center; align-items: center; width: 100%; position: relative; border-radius: 4px; padding: 16.5px 14px;}
.css-wj7jy6:hover .MuiOutlinedInput-notchedOutline{border-color: rgba(0, 0, 0, 0.87);}
@media (hover: none){
.css-wj7jy6:hover .MuiOutlinedInput-notchedOutline{border-color: rgba(0, 0, 0, 0.23);}
}
.css-wj7jy6.Mui-error .MuiOutlinedInput-notchedOutline{border-color: rgb(211, 47, 47);}
.css-s63k3s{font: inherit; letter-spacing: inherit; color: currentcolor; border: 0px; box-sizing: content-box; background: none; margin: 0px; -webkit-tap-highlight-color: transparent; display: block; min-width: 0px; width: 100%; height: auto; resize: none; padding: 0px;}
.css-s63k3s:focus{outline: 0px;}
.css-s63k3s:invalid{box-shadow: none;}

/* --- radios y casillas --- */
.css-1qk38wv{display: inline-flex; flex-direction: column; position: relative; min-width: 0px; padding: 0px; margin: 0px; border: 0px; vertical-align: top;}
.css-bhi5xm{display: flex; flex-flow: wrap;}
.css-wz5myd{display: inline-flex; -webkit-box-align: center; align-items: center; cursor: pointer; vertical-align: middle; -webkit-tap-highlight-color: transparent; margin-left: -11px; margin-right: 16px;}
.css-6m95b7{display: inline-flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; position: relative; box-sizing: border-box; -webkit-tap-highlight-color: transparent; background-color: transparent; outline: 0px; border: 0px; margin: 0px; cursor: pointer; user-select: none; vertical-align: middle; appearance: none; text-decoration: none; padding: 9px; border-radius: 50%; color: rgba(0, 0, 0, 0.6);}
.css-6m95b7:hover{background-color: rgba(25, 118, 210, 0.04);}
@media (hover: none){
.css-6m95b7:hover{background-color: transparent;}
}
.css-d771x4{display: inline-flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; position: relative; box-sizing: border-box; -webkit-tap-highlight-color: transparent; background-color: transparent; outline: 0px; border: 0px; margin: 0px; cursor: pointer; user-select: none; vertical-align: middle; appearance: none; text-decoration: none; padding: 9px; border-radius: 50%; color: rgba(0, 0, 0, 0.6);}
.css-d771x4:hover{background-color: rgba(25, 118, 210, 0.04);}
@media (hover: none){
.css-d771x4:hover{background-color: transparent;}
}
.css-j8yymo{cursor: inherit; position: absolute; opacity: 0; width: 100%; height: 100%; top: 0px; left: 0px; margin: 0px; padding: 0px; z-index: 1;}
.css-1qiat4j{position: relative; display: flex;}
.css-u1xzs7{user-select: none; width: 1em; height: 1em; display: inline-block; flex-shrink: 0; transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1); fill: currentcolor; font-size: 1.5rem; transform: scale(1);}
.css-ga1h76{user-select: none; width: 1em; height: 1em; display: inline-block; flex-shrink: 0; fill: currentcolor; font-size: 1.5rem; left: 0px; position: absolute; transform: scale(1); transition: transform 150ms cubic-bezier(0, 0, 0.2, 1);}
.css-q7mezt{user-select: none; width: 1em; height: 1em; display: inline-block; flex-shrink: 0; transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1); fill: currentcolor; font-size: 1.5rem;}
.css-5f4oky{margin: 0px; font-family: Poppins, sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.5;}
.css-10azs03{color: rgba(0, 0, 0, 0.6); font-family: Poppins, sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.4375em; padding: 0px; position: relative;}

/* --- botón --- */
.css-1pvcxzi{display: inline-flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; position: relative; box-sizing: border-box; -webkit-tap-highlight-color: transparent; outline: 0px; margin: 0px; cursor: pointer; user-select: none; vertical-align: middle; appearance: none; text-decoration: none; font-family: Poppins, sans-serif; font-size: 0.875rem; line-height: 1.75; text-transform: uppercase; min-width: 64px; border: 0px; color: rgb(255, 255, 255); background-color: rgb(25, 118, 210); box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px; transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1), box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1), border-color 250ms cubic-bezier(0.4, 0, 0.2, 1); padding: 9.6px 40px; border-radius: 12px; font-weight: 700;}
.css-1pvcxzi:hover{text-decoration: none; background-color: rgb(21, 101, 192); box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 4px -1px, rgba(0, 0, 0, 0.14) 0px 4px 5px 0px, rgba(0, 0, 0, 0.12) 0px 1px 10px 0px;}
@media (hover: none){
.css-1pvcxzi:hover{box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px;}
}
.css-1pvcxzi:active{box-shadow: rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px;}
@media print{
.css-1pvcxzi{print-color-adjust: exact;}
}

/*
 * --- añadidos ---
 *
 * Producción no tiene ninguno de estos estados: el formulario no valida nada y
 * los avisos los pinta un `<Alert>` de MUI que solo existe montado en React.
 * Lo demás son los estados que MUI resolvía en JS y aquí hace el CSS.
 */

.icasa-aviso{padding: 12px 16px; border-radius: 4px; font-family: Poppins, sans-serif; font-size: 0.875rem; line-height: 1.43; color: rgb(255, 255, 255); margin-bottom: 16px;}
