/* FORMULARIOS */
* {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
  
  *[type='range'] {
    -webkit-appearance: auto;
    -moz-appearance: auto;
    appearance: auto;
  }
  
  /* iconos de selectores */
  ::-webkit-calendar-picker-indicator {
    opacity: 0;
  }
  
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  input[type=number] { -moz-appearance:textfield; }
  .ck,
  .sN i,
  .sB i {
    -webkit-user-select: none;
    user-select: none;
  }
  
  /* Firefox */
  input[type="number"] {
    -moz-appearance: textfield;
  }
  
  /* Radio & Checkbox */
  [type="checkbox"],
  [type="radio"] {
    display: none;
  }
  
  .ck {
    display: flex;
    align-items: center;
    gap: var(--eo0);
    height: var(--eo4);
  }
  
  .ck>* {
    width: 100%;
  }

  /* SELECTORES */
  [class*="sl"]>* {
    width: 100%;
    height: 100%;
  }
  
  select {
    background: transparent;
    padding-right: var(--eo4);
    min-width: var(--eo7);
  }
  
  [class*="sl"] {
    position: relative;
    background: rgb(var(--crB));
  }
  
  [class*="sl"]::before {
    pointer-events: none;
    position: absolute;
    top: 0;
    right: var(--eo1);
    height: 100%;
    line-height: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
  }
  
  select>option {
    background: rgb(var(--crB));
    min-height: var(--eo4);
  }
  
  .sN,
  .sB {
    display: flex;
    cursor: pointer;
    position: relative;
  }
  
  .sN i,
  .sB i {
    min-width: var(--eo4);
    text-align: center;
    font-size: var(--fs3);
    position: absolute;
    top: 0;
    right: var(--eo0);
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .sN i:first-child{
    left:var(--eo0);
    right: initial;
  }

  input[type='password'] {
    font-family: 'ftI';
  }

  .sN>input {
    text-align: center;
  }
  
  /* Color */
  
  .slC {
    overflow: hidden;
    position: relative;
  }
  
  .slC>input {
    margin-left: -25%;
    margin-top: -5%;
    width: 150%;
    height: 150%;
  }
  
  .slC::before {
    background: rgb(var(--crB));
    width: var(--eo4);
    height: 150%;
    right: 0;
    top: -25%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  /* Contenedores de formularios */
  form>* {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  
  /* contenedor de elementos de cada dato */
  form>*>div {
    width: 100%;
    display: flex;
    min-height: var(--eo4);
    position: relative;
    flex-direction: column;
  }
  
  /*horizontal -  Columnas 2 y 3*/
  .cl {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    column-gap: var(--gap);
  }
  
  .cl>* {
    min-width: var(--eo8);
  }
  
  .cl>label {
    width: 100%;
  }
  
  .cl2 {
    width: calc(50% - (var(--gap)/2));
  }
  
  .cl3 {
    width: calc(33% - (var(--gap)/1.5));
  }
  
  label {
    min-height: calc(var(--fs5) * 2);
    font-size: var(--fs5);
    display: flex;
    align-items: center;
    gap: var(--eo0);
    cursor: pointer;
  }
  .ck label{
    display:block;
  }
  /* Textarea */
  textarea {
    resize: vertical;
    padding: var(--eo0);
    min-height: var(--eo4);
  }
  
  /* Mensajes y avisos */
  form .e {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: var(--eo6);
  }
  
  [class*="mj"] {
    min-height: calc(var(--fs5) * 1.5);
    font-size: var(--fs5);
    display: flex;
    align-items: center;
    padding-left: var(--brB);
  }
  
  /* Botones ancho según columna */
  form [class*="bt"] {
    width: auto;
  }