/**
 * Sección «formulario» de la página «referidos», 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.
 *
 * 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-1mgrf5c{margin-top: 0px; margin-bottom: 0px;}
.css-r76xl9{padding: 48px 16px; max-width: 900px; margin-left: auto; margin-right: auto;}
.css-q8lpi9{background-color: rgb(255, 255, 255); color: rgba(0, 0, 0, 0.87); transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1); border-radius: 4px; box-shadow: var(--Paper-shadow); background-image: var(--Paper-overlay); overflow: hidden;}
.css-15q2cw4{padding: 16px;}
.css-15q2cw4:last-child{padding-bottom: 24px;}
.css-5isqup{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;}
.css-h5fkc8{margin-top: 32px;}
.css-1dmnckk{box-sizing: border-box; display: flex; flex-flow: wrap; margin-top: calc(-24px); width: calc(100% + 24px); margin-left: calc(-24px);}
.css-1dmnckk > .MuiGrid-item{padding-top: 24px;}
.css-1dmnckk > .MuiGrid-item{padding-left: 24px;}
.css-iol86l{box-sizing: border-box; margin: 0px; flex-direction: row; flex-basis: 100%; -webkit-box-flex: 0; flex-grow: 0; max-width: 100%;}
@media (min-width: 600px){
.css-iol86l{flex-basis: 100%; -webkit-box-flex: 0; flex-grow: 0; max-width: 100%;}
}
@media (min-width: 900px){
.css-iol86l{flex-basis: 50%; -webkit-box-flex: 0; flex-grow: 0; max-width: 50%;}
}
@media (min-width: 1200px){
.css-iol86l{flex-basis: 50%; -webkit-box-flex: 0; flex-grow: 0; max-width: 50%;}
}
@media (min-width: 1536px){
.css-iol86l{flex-basis: 50%; -webkit-box-flex: 0; flex-grow: 0; max-width: 50%;}
}
.css-15j76c0{box-sizing: border-box; margin: 0px; flex-direction: row; flex-basis: 100%; -webkit-box-flex: 0; flex-grow: 0; max-width: 100%;}
.css-1475ar9{margin: 0px 0px 16px; font-family: Poppins, sans-serif; font-size: 1rem; line-height: 1.75; font-weight: 700;}
.css-1ov46kg{display: flex; flex-direction: column;}
.css-1ov46kg > :not(style):not(style){margin: 0px;}
.css-1ov46kg > :not(style) ~ :not(style){margin-top: 16px;}

/* --- campo de texto --- */
.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-19lagpe{color: rgba(0, 0, 0, 0.6); font-family: Poppins, sans-serif; font-weight: 400; 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); font-size: 0.875rem;}
.css-19lagpe.Mui-error{color: rgb(211, 47, 47);}
.css-rxuhmm{font-family: Poppins, sans-serif; font-weight: 400; 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; font-size: 0.875rem;}
.css-rxuhmm:hover .MuiOutlinedInput-notchedOutline{border-color: rgba(0, 0, 0, 0.87);}
@media (hover: none){
.css-rxuhmm:hover .MuiOutlinedInput-notchedOutline{border-color: rgba(0, 0, 0, 0.23);}
}
.css-rxuhmm.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;}

/* --- casilla de términos --- */
.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-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;}
}
@media print{
.css-d771x4{print-color-adjust: exact;}
}
.css-j8yymo{cursor: inherit; position: absolute; opacity: 0; width: 100%; height: 100%; top: 0px; left: 0px; margin: 0px; padding: 0px; z-index: 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-dun14h{margin: 0px; font-family: Poppins, sans-serif; font-weight: 400; font-size: 0.875rem; line-height: 1.43;}

/* --- botón «Enviar» --- */
.css-xi606m{text-align: center;}
.css-61sxt5{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; 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); background-color: rgb(205, 220, 57); color: rgb(0, 0, 0); padding: 9.6px 40px; border-radius: 12px; font-weight: 700;}
.css-61sxt5:hover{text-decoration: none; background-color: rgb(175, 180, 43); 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-61sxt5: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-61sxt5: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-61sxt5{print-color-adjust: exact;}
}

/*
 * --- añadidos ---
 *
 * Producción no tiene ninguno de estos estados porque no valida nada y el aviso
 * de éxito lo pinta un `<Alert>` de MUI que solo existe montado en React. Los
 * colores son los de la paleta de MUI, para que no desentonen con el resto.
 */
.icasa-aviso{margin-top: 24px; padding: 12px 16px; border-radius: 4px; font-family: Poppins, sans-serif; font-size: 0.875rem; line-height: 1.43; color: rgb(255, 255, 255);}