:root {
  /* Característicos del tema */
  --tema-principal: hsl(200, 100%, 40%);
  /*--tema-principal-claro: hsl(197, 36%, 75%);*/
  --tema-principal-claro: hsl(200, 40%, 60%);
  --tema-secundario: hsl(210, 57%, 43%);
  --tema-secundario-claro: hsl(210, 57%, 93%);
  /* Texto */
  --texto: hsl(0, 0%, 40%);
  --texto-oscuro: hsl(0, 0%, 20%);
  --texto-claro: hsl(0, 0%, 77%);
  /* Enlaces */
  --enlaces:  hsl(200, 100%, 31%);
  --enlaces-hover:  hsl(200, 100%, 25%);
  --claro-como-enlaces: hsl(202, 54%, 91%);
  --claro-como-enlaces-oscuro: hsl(202, 46%, 81%);
  /* Botones CRUD */
  --boton-borde: 1px solid #DBDBDB;
  --boton-fondo: #DCDCDC;
  --boton-relleno: 0.5rem 1.2rem;
  --boton-borde-inferior: 1.2rem;
  --boton-borde-radio: 0.3rem;
  /* Notificaciones */
  --confirmacion: rgb(30, 158, 121);
  --neutro: rgb(31, 128, 158);
  --alerta: rgb(158, 134, 31);
  --error: rgb(158, 31, 71);
  /* Fondos */
  --fondo-oscuro: hsl(0, 0%, 27%);
  --fondo-medio: hsl(0, 0%, 65%);
  --fondo-claro: hsl(0, 0%, 96%);
  --fondo-claro-menos: hsl(0, 0%, 85%);
  --fondo-claro-menos-hsla: hsla(0, 0%, 80%, 0.5);
  --fondo-oscuro-semiopaco: hsla(0, 0%, 27%, 0.5);
  --fondo-medio-semiopaco: hsla(0, 0%, 50%, 0.5);
  --fondo-claro-semiopaco: hsla(0, 0%, 92%, 0.5);
  --fondo-elemento-flotante: hsla(0, 0%, 100%, 0.5);

  /* Espacios */
  --anchura-menu-principal: 25rem;
  --espaciado-areas-principales: 2rem;
  --contenido-1: calc(100vw - var(--anchura-menu-principal) - 2 * var(--espaciado-areas-principales));
  --contenido-1-5: calc(var(--contenido-1) / 5);
  --contenido-1-4: calc(var(--contenido-1) / 4);
  --contenido-1-3: calc(var(--contenido-1) / 3);
  --contenido-1-2: calc(var(--contenido-1) / 2);

  /* Tiempos */
  --animacion-estandar: 0.15s;
  --animacion-rapida: 0.08s;
  --animacion-lenta: 0.25s;


  /* Filtros color */
  --filtro-enlaces:
    invert(21%)
    sepia(83%)
    saturate(2309%)
    hue-rotate(181deg)
    brightness(99%)
    contrast(101%);
}

/*
Correspondencias
--neutro
filter: invert(37%) sepia(100%) saturate(383%) hue-rotate(148deg) brightness(93%) contrast(88%);

--error
filter: invert(16%) sepia(89%) saturate(1897%) hue-rotate(319deg) brightness(97%) contrast(96%);

--confirmacion
filter: invert(52%) sepia(97%) saturate(3499%) hue-rotate(135deg) brightness(92%) contrast(76%);

--alerta
filter: invert(50%) sepia(11%) saturate(4085%) hue-rotate(15deg) brightness(101%) contrast(76%);

--enlaces
filter: invert(21%) sepia(83%) saturate(2309%) hue-rotate(181deg) brightness(99%) contrast(101%);
*/



/* Basadas en FiraSans */

/*@font-face {
  font-family: estandar;
  src: url('/fuentes/firasans_regular.ttf');
}

@font-face {
  font-family: negrita;
  src: url('/fuentes/firasans_medium.ttf');
}

@font-face {
  font-family: ligera;
  src: url('/fuentes/firasans_light.ttf');
}
@font-face {
  font-family: 'unidades';
  src: url('/fuentes/rob_regular.ttf');
}*/

/* Basadas en Roboto */

@font-face {
  font-family: estandar;
  src: url('/fuentes/RobotoCondensed-Regular.ttf');
  /*src: url('/fuentes/RobotoCondensed-Light.ttf');*/
}
@font-face {
  font-family: negrita;
  src: url('/fuentes/RobotoCondensed-Bold.ttf');
  /*src: url('/fuentes/RobotoCondensed-Regular.ttf');*/
}

/*@font-face {
  font-family: gruesa;
  src: url('/fuentes/Roboto-Black.ttf');
}*/

@font-face {
  font-family: ligera;
  src: url('/fuentes/RobotoCondensed-Light.ttf');
  /*src: url('/fuentes/RobotoCondensed-Regular.ttf');*/
}
@font-face {
  font-family: unidades;
  src: url('/fuentes/RobotoMono-Regular.ttf');
}
@font-face {
  font-family: unidadesn;
  /*src: url('/fuentes/RobotoMono-SemiBold.ttf');*/
  src: url('/fuentes/RobotoMono-VariableFont_wght.ttf');
  font-weight: 700;
}

/* Fuente secundaria */
@font-face {
  font-family: estandarbis;
  src: url('/fuentes/PlayfairDisplay-Regular.ttf');
  /*src: url('/fuentes/RobotoCondensed-Light.ttf');*/
}
@font-face {
  font-family: negritabis;
  src: url('/fuentes/PlayfairDisplay-Bold.ttf');
  /*src: url('/fuentes/RobotoCondensed-Regular.ttf');*/
}


html {
  width: 100%;

  font-size: calc(0.7rem + 0.3vw);
  line-height: calc(0.7rem + 0.3vw + 0.1rem);
  /*letter-spacing: 0.01rem;*/
  margin: 0 auto;
  color: var(--texto-oscuro);
  font-family: 'estandar', 'Arial', Helvetica, sans-serif;
  scroll-behavior: smooth;
}

body {
  display: grid;
  grid-template-columns:
    var(--anchura-menu-principal)
    calc(100vw - var(--anchura-menu-principal) - calc(var(--espaciado-areas-principales)/2));
  grid-template-rows: auto auto;
  grid-template-areas: "header contenido" "footer footer";
  transition: grid-template-columns 0.05s ease-out;
}
.lateral_escondido main {
  padding-top: 8.2rem;
}

#volver_arriba{
  /*background-image: url(/img/iconos_meteo/flecha-hacia-arriba.svg);*/
  background-image: url(/img/iconos_meteo/chevron-flecha-hacia-arriba.svg);
  background-position: center;

  background-repeat: no-repeat;
  position: fixed;
  border-radius: 2rem;
  background-color: #b04590;
  color: white;
  text-decoration: none;
  filter: invert(100%);
  display: flex;
  align-items: center;
  align-self: center;
  justify-content: center;

  width: 0;
  height: 0;
  bottom: 2.5rem;
  right: 2.5rem;
  background-size: 0;
  font-size: 0;
  opacity: 0;

  transition:
    width 0.4s ease-in,
    height 0.4s ease-in,
    bottom 0.4s ease-in,
    right 0.4s ease-in,
    background-size 0.4s ease-in,
    font-size 0.4s ease-in,
    opacity 0.4s ease-in ;
}
.desplazado #volver_arriba{
  width: 3rem;
  height: 3rem;
  bottom: 1rem;
  right: 1rem;
  font-size: 1.4rem;
  background-size: 1.2rem;
  opacity: 1;
}
.esconder{
  grid-template-columns: 100%;
  grid-template-areas: 'contenido';
  transition: all 0.3s ease;
}
/* Texto seleccionado */
/*::selection {
        background-color: rgba(150, 150, 150, 0.1);
        color: #BFB404;
}*/

/* Rótulos */
h1, h2, h3, h4, h5, h6 {
  font-family: 'negrita', 'Impact', Charcoal, sans-serif;
  font-weight: normal;
}

main > h1 {
  font-size: 2.618rem;
  margin: 0 0 2rem;
  /*  border-bottom: 0.2rem solid var(--texto-claro);*/
  color: var(--texto-claro);
}

h2 {
  font-size: 1.4rem;
  margin: 2rem 0 1rem;
  color: #a1a1a1;
  /*color: white;*/

  padding: 0.5rem 0;
  /*    border-radius: 0.5rem;*/
}


/* Características generales */
strong {
  font-family: 'negrita', 'Impact', Charcoal, sans-serif;
  font-weight: normal;
}

a {
  /*color: #356f92;*/
  color: var(--enlaces);
  outline: none;
}
a:hover {
  color: var(--enlaces-hover);
  outline: none;
}

ul {
  list-style-type: none;
}

li {
  list-style-type: none;
}

/* La página y sus partes */

/*header > *,
main > *,
footer > * {
        width: 100%;
        max-width: 900px;
}*/

header {
  grid-area: header;
  background-color: white;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 1rem;
  padding-right: 1rem;
  z-index: 1;
  /*! height: 100%; */

  /*! box-shadow: 0 0 0.5rem #BFB404; */
  /*! position: fixed; */
  /*! height: calc(100vh - 11rem); */
  /*! top: 0; */
  /*padding-bottom: 10rem;*/

}

main {
  grid-area: contenido;
  min-height: calc(100vh - 3.5rem);
  /*box-shadow: 0 0 0.5rem #BFB404;*/
  /*box-shadow: 0.6rem 0 0.3rem -0.4rem var(--fondo-medio) inset;*/
  /*  box-shadow: 1.2rem 0 0.5rem -1rem var(--fondo-medio) inset; /* la buena */
  /*border-left: 0.2rem solid var(--fondo-medio);*/
  background-color: var(--fondo-claro-menos);
  /*background-color: #606060;*/
  transition: padding-top 0.05s ease-out;
}

footer {
  grid-area: footer;
}

/* Menú */

/*#menu .n1 > ul {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 14rem;
  right: 0;
  left: 1rem;
   width: calc(100%); 
  overflow-y: auto;
  height: calc(100% - 25rem);
  padding-right: 1.3rem;
  padding-left: 0.3rem;
  text-align: left;
}*/

#menu .n1 > ul {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 14rem;
  right: 0;
  left: 0;
  bottom: 0;
  overflow-y: auto;
  text-align: left;
}

#menu .elemento_menu > a,
#menu .elemento_menu > span {
  position: relative;
  display: block;
  width: 100%;
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
  padding-right: 0.4rem;
  margin-top: 0.15rem;
  text-decoration: none;
  transition:
    background-color 0.1s ease-in;
}

#menu .elemento_menu.n2 {
  display: grid;
  grid-template-rows: 2.2rem;
  width: 100%;
  cursor: default;
  color: var(--texto);
}

#menu .elemento_menu.n2 span {
  position: relative;
  display: block;
  /*  padding-top: 0.6rem;
    padding-bottom: 0.3rem;*/
}

#menu .elemento_menu.n2 > span,
#menu .elemento_menu.n2 > a {
  position: relative;
  display: inline;
  align-self: end;
  /*padding: 0.3rem 0 0.3rem 2rem;*/
  padding-left: 2.5rem;
  background-repeat: no-repeat;
  /*background-size: 40px 40px;*/
  cursor: pointer;

}
/*#menu .elemento_menu.n2 > span:hover{
  color: #3f7292;
}*/


#menu .elemento_menu.n2 > ul {
  visibility: visible;
  opacity: 1;
  display: none;
  padding-top: 0.5rem;
  padding-bottom: 0.2rem;
  background-color: rgba(0, 0, 0, 0.04);
}

#menu .elemento_menu.n2:hover > ul,
#menu .elemento_menu.n2:focus-within ul {
  visibility: visible;
  opacity: 1;
  transition:
    all .1s ease-out;
  overflow: visible;
}

#menu .elemento_menu.n2 .activo > a {
  /* color: #BFB404; */
  /*  background-color: #e8f1f5;*/
  /*background-color: var(--tema-principal-claro);*/
  background-color: var(--tema-secundario-claro);
}


#menu .elemento_menu.n3 > a,
#menu .elemento_menu.n3 > span {
  padding-left: 2rem;
}

#menu .elemento_menu.n4 > a,
#menu .elemento_menu.n4 > span {
  padding-left: 3rem;
}

#menu .elemento_menu.n5 > a,
#menu .elemento_menu.n5 > span {
  padding-left: 4rem;
}

#menu .elemento_menu.n6 > a,
#menu .elemento_menu.n6 > span {
  padding-left: 5rem;
}

#menu .elemento_menu > a:hover {
  /*text-decoration: underline;*/
  /*  background-color: #e8f1f5;*/
  /*background-color: var(--tema-principal-claro);*/
  background-color: var(--tema-secundario-claro);
  border-radius: 0.3rem;
}
#menu .elemento_menu.n1 > :focus {
  outline: auto;
}

#menu .elemento_menu.n1 > :focus:hover {
  outline: none;
  animation: none;
  border-bottom: none;

}

#menu .elemento_menu.n2 > :hover,
#menu .elemento_menu.n2 > :focus {
  color: var(--texto-oscuro);
  outline: none;
}

#menu .elemento_menu.n2 :focus::before {
  /*	content: "\25B8";
    position: absolute;*/
  /*left: -0.2rem;*/
  opacity: 0.7;
}

#menu .elemento_menu.n2 :focus:hover::before {
  content: "";
}

#menu .elemento_menu.n2 > a:hover,
#menu .elemento_menu.n2 > a:focus {
  color: var(--enlaces-hover);
}




/*

#menu #elemento__ > ul .elemento_menu ul {
        margin-top: 0.4rem;
}

*/
/*
#menu li {
    list-style: none;
    padding: 0.2rem;
}
*/
/*

#menu a,
#menu span {
    font-family: 'estandar', 'Trebuchet MS', Helvetica, sans-serif;
    text-decoration: none;
}
*/
#elemento__ {
  text-align: center;
  margin-top: 2.5rem;
}

#menu #elemento__ a#enlace__ {
  position: relative;
  top: 0rem;
  left: -1.2rem;
  color: transparent;
  background-image: url("/img/imagen-de-fondo.png");
  background-size: contain;
  background-repeat: no-repeat;
  width: calc(var(--anchura-menu-principal) - 2rem);
  height: 5rem;
  visibility: visible;
  display: inline-block;
  transition: left 0.05s ease-out;
  filter: invert(32%) sepia(64%) saturate(1999%) hue-rotate(176deg) brightness(100%) contrast(103%);
  background-size: 10rem;
  background-position-x: 11.2rem;
  background-position-y: 0;
}

/*Comportamiento mostrar/esconder menu*/
.n2 > ul{
  /*display: block;*/
}
#menu .elemento_menu.n2.mostrar > ul{
  /*background-color: red;*/
  display: block;
}
#menu .elemento_menu.n2.esconder > ul{
  display: none;
}

#menu .elemento_menu.n2.hilo_activo > ul{
  display: block;
}

#menu .elemento_menu.n2.hilo_activo > span,
#menu .elemento_menu.n2.desplegado > span {
  box-shadow: 0 0.7rem 1rem -0.6rem var(--fondo-medio);
  transition: box-shadow 0.2s ease-in;
}

#menu .elemento_menu > span::before,
#menu .elemento_menu > a::before {
  content: '';
  position: absolute;
  top: 0.2rem;
  bottom: 0;
  left: 0.2rem;
  width: 1.5rem;
  /*background-image: url("/img/iconos/sennala-punto.svg");*/
  background-repeat: no-repeat;
  background-size: 1.5rem;
  background-position: center right;
  opacity: 0.4;
}

#menu .elemento_menu.n2 > span::before,
#menu .elemento_menu.n2 > a::before{
  content: '';
  top: 0;
  bottom: 0.2rem;
  /*padding-left: 2rem;*/
  left: 0.8rem;
  /*background-image: url("/img/iconos/emblemicons-master/label-fill.svg");*/
  /*background-image: url("/img/iconos/emblemicons-master/label.svg");*/
  background-image: url("/img/iconos/emblemicons-master/play-fill.svg");
  transition: transform 0.05s ease-in;
}
#menu .elemento_menu.n2.desplegado > span::before,
#menu .elemento_menu.n2.desplegado > a::before {
  transform: rotate(90deg);
  transition: transform 0.05s ease-in;
}

/*#menu .elemento_menu.n2 > span::before,
#menu .elemento_menu.n2 > a::before{
  background-image: url("/img/iconos/emblemicons-master/play-fill.svg");
}*/

#menu .elemento_menu.n2 > a::before{
  filter:
    invert(19%)
    sepia(98%)
    saturate(2226%)
    hue-rotate(182deg)
    brightness(101%)
    contrast(101%);
}


#menu .elemento_menu.n2 > a:hover:before,
#menu .elemento_menu.n2 > span:hover:before {
  opacity: 0.6;
}



/* Opción de salir */
#opciones_usuario_conocido {
  position: absolute;
  border-radius: 0.5rem;

  padding: 0.2rem 0.7rem;
  /*! z-index: 1; */
  /*background-color: #b8b8b8;*/
  background-color: var(--fondo-medio);
  /*! opacity: 0.3; */
  top: 10rem;
  width: calc(100% - 2rem);
  height: 2.3rem;
  display: flex;
  align-items: center;
  /*! flex-direction: row; */
  justify-content: space-evenly;
}
#opciones_usuario_conocido form {
  min-width: inherit;
}
#opciones_usuario_conocido > * {
  flex: 0 0 auto;
  /*! border-color: var(--fondo-medio-semiopaco); */
  height: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: calc(40% - 0.5rem);
  /*! padding: 0 2rem; */
  /*! background-color: var(--fondo-medio-semiopaco); */
  /*! border-width: 0.1rem 0.6rem; */
  /*! border-radius: 0.6rem; */
  /*! border-style: solid; */
}


form#salir {
  /*! display: inline; */
}

#opciones_usuario_conocido a,
form#salir [type="submit"] {
  font-family: 'negrita', 'Trebuchet MS', Helvetica, sans-serif;
  font-size: 0.9rem;
  color: white;
  padding-top: 0.1rem;
  padding-left: 1.2rem;
  background-size: 1rem;
  background-repeat: no-repeat;
  background-position-x: left;
  background-position-y: center;
}

#opciones_usuario_conocido a {
  text-decoration: none;
  margin-right: 1rem;
  background-image: url('/img/iconos/md-person-w.svg');
  /*background-position-y: bottom;*/
  /*filter: brightness(0.2) sepia(1) hue-rotate(180deg) saturate(5);*/
}

#opciones_usuario_conocido a:hover {
  text-decoration: underline;
}

form#salir [type="submit"] {
  display: inherit;
  border: none;
  /*color: rgb(53, 111, 146);*/
  /*font-family: estandar;*/
  margin: 0;
  padding-right: 0;
  padding-bottom: 0;
  background-color: transparent;
  background-image: url('/img/iconos/md-exit-w.svg');
  font-weight: normal;
}

form#salir [type="submit"]:hover {
  text-decoration: underline;
  cursor: pointer;
}

/* Atenúa y desatenúa los elementos de la cabecera (menú y opción de salir) */
#menu #elemento__ > ul .elemento_menu ul {
  /*opacity: 0;*/
  padding-left: 1rem;
  transition:
    opacity .3s ease-out !important;
  /*! width: calc(100% - 0.5rem); */
}

#menu #elemento__ > ul .elemento_menu span {
  /*padding-left: 1rem;*/
}

header #menu #elemento__ > ul .elemento_menu span:hover ~ ul,
header #menu #elemento__ > ul .elemento_menu ul:hover {
  /*	opacity: 1;
          transition:
                  opacity .3s ease-out;*/
}


/*#menu #elemento__ > ul .elemento_menu ul,
#opciones_usuario_conocido input[type="submit"],
#opciones_usuario_conocido a {
        opacity: 0;
        transition:
                opacity .3s ease-out;
}

header:hover #menu #elemento__ > ul .elemento_menu ul,
header:hover #opciones_usuario_conocido input[type="submit"],
header:hover #opciones_usuario_conocido a {
        opacity: 1;
        transition:
                opacity .08s ease-out;
}*/

/* Listas en general */
main article {
  /*margin: 0 0 0.7rem 0;*/
}

/* Formularios en general */



.campo,
fieldset {
  position: relative;
  margin-top: 1.1rem;
  margin-bottom: 1.1rem;
  width: 100%;
}

label {
  /* A retirar en futuras revisiones */
  display: block;
}

/*label,*/
.rotulo_campo.de_campo,
legend {
  font-family: negrita;
  /*color: #747f8a;*/
  color: var(--tema-principal-claro);

}
.rotulo_campo.de_campo{
  /*color: #127594;*/
  margin-top: 0.7rem;
}

legend {
  position: absolute;
  top: 1rem;
  font-size: 1.6rem;
  /*color: rgba(9, 65, 82, 0.2);*/
  color: var(--tema-principal-claro);
}

.rotulo_campo.bloque {
  display: block;
}

.rotulo_campo.linea {
  display: inline-block;
}

.item_lista_campo {
  margin: 0.4rem;
  position: relative;
}

.item_lista_campo input {
  margin-right: 0.2rem;
}

option {
  font-family: negrita;
}



input,
select,
textarea {
  margin: 0.2rem 0;
}

input[type="file"] {
  margin: 0;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="date"],
input[type="time"],
select,
textarea
{
  padding: 0.3rem 0.5rem;
  border: none;
  border: 1px solid #97b2c3;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="date"],
input[type="time"],
select
{
  height: 2.5rem;
}

select::first-letter {
  text-transform: uppercase;
}
select[multiple] {
  padding: 0;
  height: auto;
}
option {
  padding: 0.3rem 0.5rem;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
select:focus,
textarea:focus {
  box-shadow: 0 0 0.5rem #c9af79 inset;
}

input[type="password"] {
  font-size: 2rem;
}

input[type="submit"],
button {
  /*  padding: 0.3rem 0.6rem;
    border-radius: 0.4rem;
    display: block;*/
  border: 1px solid var(--boton-borde);
  /*background-color: var(--boton-fondo);*/

  position: relative;
  display: inline-block;
  padding: 0.5rem 1.2rem 0.5rem 2.2rem;
  border-bottom: 0.2rem solid var(--alerta);
  border-radius: 0.3rem;
  background-color: white;
  font-family: negrita;
  text-decoration: none;
  cursor: pointer;
  color: var(--alerta);
  box-shadow:
    0 0.1rem 0.2rem -0.1rem var(--fondo-medio),
    0 0rem 0.5rem -0.3rem var(--alerta);
  transition: background-color 0.05s ease-in, border-bottom-width 0.05s ease-in, box-shadow 0.05s ease-in;

  /*  background-image: url("/img/iconos/heroicons-master/solid/save.svg");
    background-position-y: calc(50% - 0.15rem);
    background-size: 1rem;
    background-repeat: no-repeat;
    background-position: 1rem center;
    backdrop-filter: invert(50%) sepia(11%) saturate(4085%) hue-rotate(15deg) brightness(101%) contrast(76%);*/
}

input[type="submit"]:hover,
button:hover {
  box-shadow:
    0 0.25rem 0.2rem -0.1rem var(--fondo-medio),
    0 0rem 0.5rem -0.15rem var(--alerta);
}


/* Casillas personalizadas */
input[type="checkbox"] {
  opacity: 0;
  position: absolute;
}
input[type="checkbox"] + label {
  padding-left: 1.4rem;
}
input[type="checkbox"] + label::before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 1rem;
  height: 1rem;
  border: 1px solid #1D7D4C;
  background-color: white;
}
input[type="checkbox"] + label::after {
  content: " ";
  position: absolute;
  left: 0;
  top: -0.5rem;
  width: 1.7rem;
  height: 1.7rem;
  background-image: url('/img/iconos/md-checkmark-azul.svg');
  background-repeat: no-repeat;
  background-position: bottom;
  opacity: 0;
  transition:
    opacity 0.06s ease-in 0s;

}
input[type="checkbox"]:checked + label::after {
  opacity: 1;
}
input[type="checkbox"]:disabled + label::before {
  border: 1px solid #9abac9;
  background-color: rgb(250, 250, 250);
}
input[type="checkbox"]:disabled:checked + label::after {
  background-image: url('/img/iconos/md-checkmark-desactivado-azul.svg');
}


input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
select,
textarea {
  width: 90%;
}

input[type="date"],
input[type="time"] {
  width: auto;
}

/* Círculos */
input[type="radio"] {
  opacity: 0;
  position: absolute;
}
input[type="radio"] + label {
  padding-left: 1.4rem;
}
input[type="radio"]:not(:checked) + label::before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 1.3rem;
  height: 1.3rem;
  background-image: url('/img/iconos/ios-radio-button-off-azul.svg');
  background-repeat: no-repeat;
  /*background-size: 1rem;*/
  background-position-y: -0.1rem;
  background-position-x: -0.1rem;
}
input[type="radio"]:checked + label::after {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 1.3rem;
  height: 1.3rem;
  background-image: url('/img/iconos/ios-radio-button-on-azul.svg');
  background-repeat: no-repeat;
  /*background-size: 1rem;*/
  background-position-y: -0.1rem;
  background-position-x: -0.1rem;
}
input[type="radio"]:disabled:not(:checked) + label::before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 1.3rem;
  height: 1.3rem;
  background-image:
    url('/img/iconos/ios-radio-button-off-desactivado-azul.svg');
  background-repeat: no-repeat;
  /*background-size: 1rem;*/
  background-position-y: -0.1rem;
  background-position-x: -0.1rem;
}
input[type="radio"]:disabled:checked + label::after {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 1.3rem;
  height: 1.3rem;
  background-image:
    url('/img/iconos/ios-radio-button-on-desactivado-azul.svg');
  background-repeat: no-repeat;
  /*background-size: 1rem;*/
  background-position-y: bottom;
  background-position-x: -0.1rem;
}

/* Selector de ficheros */
.selector_ficheros_boton {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  padding: 0.3rem;
  width: 10rem;
  height: 2.5rem;
  background-color: #127594;
  color: white;
  cursor: pointer;
  font-family: negrita;
  font-size: 0.9rem;
  margin-top: 0.2rem;
  margin-bottom: 0.2rem;
}

.selector_ficheros_boton:hover,
.selector_ficheros_contenedor:focus-within .selector_ficheros_boton {
  border: 0.2rem solid #9abac9;
}

.selector_ficheros_contenedor {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.selector_ficheros_contenedor input[type=file] {
  position: relative;
  height: 0;
  width: 0;
  opacity: 0;
}

/* Resalta casillas y círculos cuando hover o puntero */
input[type="checkbox"]:hover:not(:disabled) + label,
input[type="radio"]:hover:not(:disabled) + label {
  color: #127594;
}
input[type="checkbox"]:focus:not(:disabled) + label,
input[type="radio"]:focus:not(:disabled) + label {
  color: #127594;

}

/*input[type="checkbox"]:focus:not(:disabled) + label:before,
input[type="radio"]:focus:not(:disabled) + label:before {
        content: "\25B8";
        position: absolute;
        right: -2.2rem;
}*/


/* Indicadores de campo requerido */
.campo .indicador_campo_requerido,
.indicador_item_requerido {
  color: var(--error);
  padding-left: 0.1rem;
}
.indicador_item_requerido {
  font-family: negrita;
}


/* Textos de ayuda a los campos de formularios */
.campo .texto_ayuda {
  font-size: 0.9rem;
  margin-top: 0.1rem;
  opacity: 0.7;
  color: var(--texto-oscuro);
  /*font-style: italic;*/
}


/* Fieldsets */
/*fieldset {
  background-color: var(--fondo-elemento-flotante);
  padding: 1rem;
  border: none;
  border-radius: 0.3rem;
  box-shadow:
    0 -0.2rem 0.2rem -0.2rem rgba(0, 0, 0, 0.7),
    0 0.2rem 0.2rem -0.2rem rgba(0, 0, 0, 0.7),
    -0.4rem 0 0.5rem -0.5rem rgba(50, 30, 0, 0.2),
    0.4rem 0 0.5rem -0.5rem rgba(50, 30, 0, 0.2);
}*/


fieldset {
  position: relative;
  min-height: 5rem;
  border-radius: 0.3rem;
  padding: 1rem;
  background-color: white;
  border-style: none none solid none;
  border-bottom-width: 0.2rem;
  border-color: var(--tema-principal);

  box-shadow: 0px 0px 0.6rem -0.2rem var(--texto-claro);
}

fieldset.tiene_rotulo {
  padding-top: 4rem;
}

fieldset#acciones_workflow {
  border: none;
  grid-column: 1 / -1;
  box-shadow: none;
  background-color: transparent;
  padding-left: 0;
  padding-right: 0;
}


form {
  /*width: 90%;*/
  min-width: 300px;
  /*max-width: 700px;*/
}



/* Notificaciones */

#notificaciones {
  position: relative;
  /*! width: 50%; */
  /*  margin: 0 auto 2rem;
    padding: 1rem;*/
  /*	border-top: 1px solid rgba(255, 255, 255, 0.7);
          border-bottom: 1px solid rgba(255, 255, 255, 0.7);
          border-radius: 0.5rem/1px;
          box-shadow: 0 0 3px rgb(255, 255, 255);*/
  /*overflow: hidden;*/
  /*	background: linear-gradient(
                  rgba(255, 255, 255, .5),
                  rgba(255, 255, 255, .4),
                  rgba(255, 255, 255, .1),
                  rgba(255, 255, 255, .3));*/
  opacity: 0;
  padding-top: 1rem;
  padding-bottom: 1rem;
  margin-top: -1rem;

  transition:
    opacity 0.3s ease-in,
    padding-top 0.3s ease-in,
    padding-bottom 0.3s ease-in,
    margin-top .3s ease-out,
    margin-bottom 0.3s ease-in;

}

#notificaciones:not(:empty) {
  opacity: 1;
  margin: 0 auto 2rem;
  padding: 1rem;
}

#notificaciones::before {
  content: '';
  position: absolute;
  top: 2px;
  right: 1px;
  bottom: 2px;
  left: 1px;
  /*border-radius: 13px;*/
  /*! z-index: -1; */
  /*! background: linear-gradient(135deg,
    rgba(255, 255, 255, .6) 1%,
    rgba(255, 255, 255, .3) 24%,
    rgba(255, 255, 255, .2) 49%,
    rgba(255, 255, 255, .1) 51%,
    rgba(255, 255, 255, .1) 75%,
    rgba(255, 255, 255, .3) 95%); */
  border: 2px solid white;
  border-radius: 0.4rem;
  background-color: rgba(255, 255, 255, 0.7);
  box-shadow: 0 0.2rem 0.2rem rgba(0, 0, 0, .3);
}

#notificaciones::after {
  content: '';
  /*position: absolute;*/
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /*! border-top: 1px solid rgba(255, 255, 255, 0.7); */
  /*! border-bottom: 1px solid rgba(255, 255, 255, 0.7); */
  /*! border-radius: 0.5rem/1px; */
  /*! box-shadow: 0 0 3px white; */

}

#notificaciones .notificacion {
  position: relative;
  padding: 0.5rem 0 0.5rem 2rem;
  /*margin-top: 0.4rem;*/
  margin-bottom: 0.2rem;
  text-shadow:
    0 0 1px white,
    1px 0 1px white,
    0 1px 1px white;
  border-radius: 0.3rem;
}

#notificaciones .notificacion:hover {
  background-color: white;
}

#notificaciones .notificacion .origen {
  font-size: 0.6rem;
  line-height: 0.8rem;
}

#notificaciones .notificacion .origen > :nth-child(1) {
  opacity: 0.4;
}
#notificaciones .notificacion .origen > :nth-child(2) {
  opacity: 0.6;
}
/*#notificaciones .notificacion .origen > :nth-child(1) {
  opacity: 0.5;
}*/

#notificaciones .notificacion .tipo_mensaje {
  font-weight: bold;
}
#notificaciones .notificacion .mensaje {
  font-weight: bold;
  line-height: 0.7rem;
}

#notificaciones.modificable_js {
}

#notificaciones.modificable_js .notificacion {
  margin-top: -5rem;
}

#notificaciones.modificable_js.visible .notificacion {
  margin-top: 0;
  transition:
    margin-top .3s ease-out;
}

#notificaciones.modificable_js.visible {
  /*height: 100%;*/

  /*  transition: 
      padding-top .3s ease-out,
      padding-bottom .3s ease-out,
      margin-top .3s ease-out .3s;*/

  z-index: 1;
}

#notificaciones.modificable_js.visible:empty {
  opacity: 0;
  /*  padding-top: 1rem;
    padding-bottom: 1rem;
    margin-top: -1rem;*/

  /*display: none;*/
}

#notificaciones .confirmacion {
  color: var(--confirmacion);
}
#notificaciones .neutro {
  color: var(--neutro);
}
#notificaciones .alerta {
  color: var(--alerta);
}
#notificaciones .error {
  color: var(--error);
}

#notificaciones .confirmacion::before,
#notificaciones .neutro::before,
#notificaciones .alerta::before,
#notificaciones .error::before {
  content: '';
  background-repeat: no-repeat;
  background-position: center top;

  position: absolute;
  left: 0.3rem;
  width: 1.3rem;
  height: 1.3rem;
}

#notificaciones .confirmacion::before {
  background-image: url('/img/iconos/md-checkmark-col.svg');
}

#notificaciones .neutro::before {
  background-image: url('/img/iconos/md-information-circle-col.svg');
}

#notificaciones .alerta::before {
  background-image: url('/img/iconos/md-warning-col.svg');
}

#notificaciones .error::before {
  background-image: url('/img/iconos/md-close-col.svg');
}

#notificaciones .cierra_notificacion {
  position: absolute;
  right: 0.4rem;
  top: 0.4rem;
  color: #888;
  height: 1.4rem;
  width: 1.4rem;
  text-align: center;
  border-radius: 50%;
  font-size: 1.1rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-family: estandar;
}

#notificaciones .cierra_notificacion:hover {
  cursor: pointer;
  color: #422;
  font-family: negrita;
  box-shadow: 0 0 0.2rem #422;

}


/* Formulario de roles */
.usuario_rol_asigna_retira {
  display: grid;
  grid-template-columns: 7rem 7rem;
  grid-template-rows: 1.5rem 1.5rem;
  grid-template-areas:
    "rol accion"
    "estado accion";
  gap: 0.2rem;
  justify-content: start;
  margin-bottom: 0.5rem;
}

.usuario_rol_asigna_retira .nombre_rol,
.usuario_rol_asigna_retira .estado_usuario_rol,
.usuario_rol_asigna_retira input[type="submit"] {
  align-self: center;
}

.usuario_rol_asigna_retira .nombre_rol {
  grid-area: rol;
  align-self: end;
  font-family: negrita;
}

.usuario_rol_asigna_retira .nombre_rol::first-letter {
  text-transform: uppercase;
}

.usuario_rol_asigna_retira.retira_rol .estado_usuario_rol{
  font-family: estandar;
}

.usuario_rol_asigna_retira.asigna_rol .estado_usuario_rol{
  grid-area: estado;
  align-self: start;
  opacity: 0.4;
}

.usuario_rol_asigna_retira input[type="submit"] {
  grid-area: accion;
}

.usuario_rol_asigna_retira.asigna_rol input[type="submit"] {
  color: var(--confirmacion);
}

.usuario_rol_asigna_retira.retira_rol input[type="submit"] {
  color: var(--error);
  font-family: estandar;
}

/* Módulos */
.modulo {

}


/* Roles y permisos */
#roles_y_permisos {
  width: 100%;
  max-width: unset;
}

.grupo_rotulo {
  color: #127594;
  margin-bottom: 0;
  border-bottom: 0.5rem solid #c3d6df;
}

.permiso {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  /*margin: 0.5rem 0;*/
  padding: 0.5rem 0;
  border-bottom: 1px solid #9abac9;
}
.permiso:first-of-type {
  border-top: 0.1rem solid #9abac9;
  margin-top: 0;
}
.permiso:last-of-type {
  margin-bottom: 3rem;
}
.permiso:first-of-type:last-of-type {
}
.permiso:hover {
  background-color: rgba(255, 255, 255, 0.1);
  box-shadow:
    0 1rem 0.5rem -1rem rgba(18, 117, 148, 0.1) inset,
    0 -1rem 0.5rem -1rem rgba(18, 117, 148, 0.1) inset;
}
.permiso_descripcion {
  padding: 0.5rem 0;
  flex: 1 1 50%;
  opacity: 0.9;
}
.permiso:hover .permiso_descripcion  {
  opacity: 1;
}

.permiso_descripcion h3 {
  margin: 0 0 0.2rem 0;
  font-size: 1.05rem;
}
.asignacion_roles {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex: 1 0 50%;
  padding: 0 0.5rem;
}
.rol_asignado_a_permiso {
  position: relative;
  flex: 1 0 0;
}
.rol_asignado_a_permiso:hover {
  opacity: 1;
  color: black;
}
.rol_asignado_a_permiso input[type="checkbox"] + label {
  padding-top: 1.2rem;
  padding-left: 0;
  padding: calc(1.2rem + 0.5rem) 0.5rem 0.5rem 0.5rem;
  margin: 0 0.5rem;
}
.rol_asignado_a_permiso input[type="checkbox"] + label:before {
  top: 0.5rem;
  left: 1rem;
}
.rol_asignado_a_permiso input[type="checkbox"] + label:after {
  top: 0rem;
  left: 1rem;
}
.rol_asignado_a_permiso input[type="checkbox"] + label:hover {
  /*border: 2px solid rgba(18, 117, 148, 0.1);*/
  box-shadow: 0 0 0 2px rgba(18, 117, 148, 0.1);
  cursor: pointer;
}


.rol_asignado_a_permiso label:hover {
  /*	opacity: 1;*/
}
.rol_asignado_a_permiso label input {
  opacity: 0.8;
  position: relative;
}
.rol_asignado_a_permiso label:hover input {
  opacity: 1;
}



/* Pie de página */

footer {
  background-color: var(--fondo-oscuro);
  box-shadow:
    0 1rem 0.5rem -1rem rgba(0, 0, 0, 0) inset,
    1.2rem 0 0.5rem -1rem rgba(0, 0, 0, 0.1) inset;
  position: relative;
  /*! width: calc(100% + 17rem); */
  /*! left: -17rem; */
  /*! border: 1px solid red; */
  z-index: 6;
  /*! opacity: 0.5; */
  min-height: 10rem;
}

footer::before {
  content: "";
  position: absolute;
  /*left: calc(-1 * var(--anchura-menu-principal));*/
  left: 0;
  top: 0;
  width: var(--anchura-menu-principal);
  /* border: 1px solid red; */
  height: 100%;
  background-color: var(--fondo-medio);
  /* box-shadow: 0 1rem 0.5rem -1rem rgba(0, 0, 0, 0.5) inset; */
}

footer .powered_by {
  /*! margin-top: 5rem; */
  opacity: 0.5;
  left: calc(-1 * var(--anchura-menu-principal) + 2rem);
  position: absolute;
  bottom: 1.6rem;
}

footer .powered_by .cursor {
  animation: parpadea 2s infinite;
}
@keyframes parpadea{
  0% {
    color: #000;
  }
  49% {
    color: #000;
  }
  50% {
    color: transparent;
  }
  100% {
    color: transparent;
  }
}

/* Delightful subrayado */
.subray {
  text-shadow: 1px 0px 0 white, -1px 0px 0 white;
}

.subray::before {
  content: " ";
  position: absolute;
  top: 0100%;

  background-color: #356f92;
  text-shadow: 1px 0px 0 white, -1px 0px 0 white;
  width: 100%;
  height: 1px;

}
.subray:hover::before {
  animation: subrayado 0.8s;
}
@keyframes subrayado{
  0% {
    top: 100%;
    height: 1px;
  }
  25% {
    top: 0%;
    height: 100%;
    opacity: 0.5;
  }
  50% {
    top: 0%;
    height: 1px
  }
  75% {
    top: 0%;
    height: 100%;
    opacity: 0.5;
  }
  100% {
    top: 100%;
    height: 1px;
  }
}



#escondedor {
  position: fixed;
  bottom: 0.7rem;
  left: calc(var(--anchura-menu-principal) - 3rem);
  z-index: 1000;
  height: 2rem;
  width: 2rem;
  overflow:
    hidden;
  transition:
    left 0.05s ease-out;
}

#escondedor:hover::before{
  /*width: 2rem;*/
  color: rgba(0,0,0,0.7);
}

body.lateral_escondido #escondedor{
  left: 1rem;
}

body.lateral_escondido {
  grid-template-columns: 0 auto;
}

body.lateral_escondido header {
  /*display: none;*/ /*! z-index: -1; */
  visibility: hidden;
  position: static;
}

body #escondedor::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  border-radius: 50%;

  background-color: white;
  background-image: url('/img/iconos/ionicons-designerpack/close.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;

  opacity: 0.3;

  transition:
    border-radius 0.05s ease-in,
    opacity 0.05s ease-in;
}

body #escondedor:hover::before {
  opacity: 1;
}

body.lateral_escondido #escondedor::before {
  border-radius: 0.2rem;
  background-image: url('/img/iconos/heroicons-master/solid/menu.svg');
}

/*esconder lista*/
.lateral_escondido #menu .elemento_menu.n2 > ul{
  visibility: hidden;
}

.lateral_escondido #menu #elemento__ a#enlace__{
  left: calc(50vw - 8.1rem);

}

#contenido {
  color: var(--texto);
}

/* Lista de ítems */

#contenido > .lista_items {


  display: grid;
  /* grid-template-columns: repeat(3, 1fr); */
  grid-template-columns: repeat(auto-fit, minmax(150px, 200px));
  /* grid-auto-rows: 1fr; */
  grid-gap: 2rem;

}

.item_entidad {
  position: relative;
  min-height: 5rem;
  border-radius: 0.2rem;
  padding: 0.5rem;
  background-color: white;
  border-bottom: 0.2rem solid var(--tema-principal);
  box-shadow: 0px 0px 0.6rem -0.2rem var(--texto-claro);
}

.item_entidad .enlaces_crud {
  position: absolute;
  bottom: 0;
  right: 0;
}

.item_entidad *.crud {
  display: inline;
  position: absolute;
  /*  border-radius: 0.4rem 0 0.4rem 0;
    right: 0;
  */  bottom: 0;/*
    overflow: hidden;
    height: 1.2rem;*/

}

.item_entidad a.crud {
  /*position: relative;*/
  width: 1.5rem;
  color: transparent;
  right: 1.4rem !important;
}

.item_entidad a.crud::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  background-repeat: no-repeat;
  background-position-y: center;
  background-position-x: center;
  background-size: 1rem;
}


.item_entidad a.ver {
  width: 1.5rem;
  color: transparent;
  right: 3rem !important;
}

.item_entidad a.modificar {
  /*width: 2rem;*/
  /*background-color: green;*/
}

.item_entidad  a.borrar {
  /*background-color: red;*/
  width: 1.5rem;
  color: transparent;
  right: 0rem !important;
}


.item_entidad a.ver::before,
.item_entidad a.modificar::before ,
.item_entidad a.borrar::before {
  opacity: 0.1;
  transition:
    opacity 0.1s ease-in 0s,
    filter 0.1s ease-in 0s;
}

.item_entidad:hover a.ver::before,
.item_entidad:hover a.modificar::before ,
.item_entidad:hover a.borrar::before {
  opacity: 0.3;
}

.item_entidad .enlaces_crud:hover a::before {
  opacity: 0.8;
}

.item_entidad a.ver::before {
  /*background-image: url(/img/iconos/eye-outline.svg);*/
  /*background-image: url(/img/iconos/ionicons-designerpack/search-sharp.svg);*/
  background-image: url(/img/iconos/heroicons-master/solid/search.svg);
  left: 0.5rem;
  /*filter: invert(58%) sepia(31%) saturate(6207%) hue-rotate(159deg) brightness(91%) contrast(101%);*/
}

.item_entidad a.modificar::before {
  /*background-image: url(/img/iconos/create-outline.svg);*/
  /*background-image: url(/img/iconos/emblemicons-master/check-blank.svg);*/
  background-image: url(/img/iconos/heroicons-master/solid/pencil-alt.svg);
  background-position-x: calc(50% + 0.1rem);
  /*filter: invert(41%) sepia(11%) saturate(2259%) hue-rotate(87deg) brightness(101%) contrast(101%);*/
}

.item_entidad a.borrar::before {
  /*background-image: url(/img/iconos/close-outline.svg);*/
  /*background-image: url(/img/iconos/ionicons-designerpack/flame-sharp.svg);*/
  /*background-image: url(/img/iconos/tabler-icons/flame.svg);*/
  background-image: url(/img/iconos/heroicons-master/solid/fire.svg);
  /*filter: invert(16%) sepia(65%) saturate(3246%) hue-rotate(346deg) brightness(81%) contrast(110%);*/
}

.item_entidad:hover a.ver::before {
  filter:
    invert(37%)
    sepia(100%)
    saturate(383%)
    hue-rotate(148deg)
    brightness(93%)
    contrast(88%);
}

.item_entidad:hover a.modificar::before {
  filter:
    invert(52%)
    sepia(97%)
    saturate(3499%)
    hue-rotate(135deg)
    brightness(92%)
    contrast(76%);
}

.item_entidad:hover a.borrar::before {
  filter:
    invert(16%)
    sepia(89%)
    saturate(1897%)
    hue-rotate(319deg)
    brightness(97%)
    contrast(96%);
}


/* Enlaces ARM en campos listar y añadir */

.campo > div > .arm {
  grid-column: 1 / -1;
  text-align: right;
  opacity: 0;

  transition: opacity 0.15s ease-in;
}

.campo:hover > div > .arm {
  opacity: 1;
}

.campo > div > article > .arm {
  opacity: 0.0;
  text-align: right;
  height: 0;
  transition:
    opacity 0.15s ease-in,
    height 0.15s ease-in;
}

.campo > div > article:hover > .arm {
  opacity: 1;
  height: 1rem;
}

.arm a {
  position: relative;
  display: inline-block;
  font-size: 0.7rem;
  text-decoration: none;
  line-height: 0.9rem;
  padding: 0.05rem 0.5rem 0.05rem 1.3rem;
  border-radius: 0.2rem;
  background-color: var(--fondo-claro);
}

.arm a:hover {
  color: white;
  background-color: var(--enlaces);
  opacity: 1;
}

.arm a:hover::before {
  filter: invert(100%);
}

.arm a::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0.3rem;
  width: 1rem;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 0.7rem;
  filter: var(--filtro-enlaces);
}

.arm .annadir::before {
  background-image: url("/img/iconos/heroicons-master/solid/plus-circle.svg");

}

.arm .asociar::before {
  background-image: url("/img/iconos/tabler-icons/link.svg");
}

.arm .editar::before {
  background-image: url("/img/iconos/tabler-icons/edit.svg");
}

.arm .retirar::before {
  background-image: url("/img/iconos/tabler-icons/unlink.svg");
}

.arm .borrar::before {
  background-image: url("/img/iconos/tabler-icons/x.svg");
}




/*.crud.crear,
#contenido fieldset#acciones_workflow [type="submit"] {
  position: relative;
  display: inline-block;
  padding: 0.5rem 1.2rem 0.5rem 2.2rem;
  border-bottom: 0.2rem solid var(--alerta);
  border-radius: 0.3rem;
  background-color: white;
  font-family: negrita;
  text-decoration: none;
  cursor: pointer;
  color: var(--alerta);
  box-shadow: 0 0.1rem 0.2rem -0.1rem var(--fondo-medio);

  transition:
    background-color 0.05s ease-in,
    border-bottom-width 0.05s ease-in,
    box-shadow 0.05s ease-in;
}*/

/*.crud.crear:hover,
#contenido fieldset#acciones_workflow [type="submit"]:hover {
  background-color: var(--fondo-elemento-flotante);
  border-bottom-width: 0.25rem;
  box-shadow: 0 0.2rem 0.2rem -0.1rem var(--fondo-medio);
}*/

.crud.crear::before,
#contenido .campo.enviar::before {
  content: "";
  position: absolute;
  top: 0;
  width: 2.5rem;
  /*bottom: 0;*/
  height: 2.9rem;
  left: 0;
  background-size: 1rem;
  background-repeat: no-repeat;
  background-position: 1rem center;
  z-index: 1;

  filter:
    invert(50%)
    sepia(11%)
    saturate(4085%)
    hue-rotate(15deg)
    brightness(101%)
    contrast(76%);
}

.crud.crear::before {
  background-image: url("/img/iconos/heroicons-master/solid/plus-circle.svg");

}

#contenido .campo.enviar::before {
  background-image: url("/img/iconos/heroicons-master/solid/save.svg");
  background-position-y: calc(50% - 0.15rem);
  pointer-events: none;
}

.crud.crear {
  margin: 1rem 0;
}










/*lista eventos provisionalemnte en estandar*/

/*#contenido > .crud.crear{
  display: inline-block;
  margin: 1rem 0;
  padding: 0.5rem 1rem;
  border-radius: 0.3rem;
  background-color: #fff;
  font-family: negrita;
  text-decoration: none;
  cursor: pointer;
  color: #4176a9;
  box-shadow: 0 0.1rem 0.2rem -0.1rem #666;
  transition: color 0.05s ease-in, background-color 0.05s ease-in, box-shadow 0.05s ease-in;
  background-image: url("/img/iconos/mas.png");
  background-size: 1.3rem;
  background-repeat: no-repeat;
  padding-left: 2.3rem;
  background-position-y: center;
  background-position-x: 0.3rem;
}
#contenido > .crud.crear:hover{
  background-color: #fff;
  color: #1d81e1;
  box-shadow: 0 0.15rem 0.2rem -0.05rem #222;
}*/

/*:not(.enlaces_crud) > .crud.modificar{
  background-image: url("/img/iconos/documento.png");
  right: 6rem;
}
:not(.enlaces_crud) > .crud.borrar{
  background-image: url("/img/iconos/borrar.png");
  right: 1rem;
}
:not(.enlaces_crud) > .crud.ver{
  background-image: url("/img/iconos/ver.png");
  right: 11rem;
  padding-left: 1.7rem;
}*/
.separador_accesible {
  visibility: hidden;
  /*display: none;*/
}






/* Paginador */
.paginador {
  display: flex;
  width: 80%;
  margin-bottom: 2rem;
}
.paginador .separador_accesible {
  display: none;
}
.paginador .pagina {
  position: relative;
  flex: 1 1 0;
  height: 0;
  /* border-bottom: 0.8rem solid #a8cbd9; */
  /* padding: 0.3rem; */
  text-align: center;
  text-decoration: none;
  font-size: 0;
  display: flex;
  justify-content: center;
  width: 1px;
  background-color: var(--tema-principal-claro);
  height: 1rem;
}

.paginador .pagina.actual {
  background-color: var(--tema-principal);
}

.paginador .pagina:hover {
  cursor: pointer;
}

/*.paginador .pagina.actual {
  background-color: white;
}*/
.paginador .pagina:first-of-type {
  border-radius: 0.2rem 0 0 0.2rem;
}
.paginador .pagina:last-of-type {
  border-radius: 0 0.2rem 0.2rem 0;
}
.paginador .pagina::before {
  content: attr(data-num);
  position: absolute;
  height: 1.4rem;
  top: -0.2rem;
  /*left: -0.5rem;*/
  background-color: white;
  font-family: negrita;
  font-size: 0.7rem;
  border-radius: 0.3rem;
  /* border: 1px solid #802400; */
  padding: 0 0.3rem;
  opacity: 0;
  z-index: 1;
  box-shadow: 0 0 0.2rem #020201;
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* width: 1rem; */
}
.paginador .pagina:hover::before {
  opacity: 1;
}
.paginador .pagina.actual::before {
  /*background-color: pink;*/
  opacity: 1;
}

.paginador .pag_primera,
.paginador .pag_ultima,
.paginador .pag_anterior,
.paginador .pag_siguiente {
  text-decoration: none;
  font-family: negrita;
  background-color: #a8cbd9;
  /*color: white;*/
  height: 1rem;
  font-size: 0.8rem;
  padding: 0 0.2rem;
  background-repeat: no-repeat;
  background-position-y: center;
  background-size: 0.8rem 0.7rem;
  /*  border-radius: 0.2rem;*/
}

.paginador .pag_primera:hover,
.paginador .pag_ultima:hover,
.paginador .pag_anterior:hover,
.paginador .pag_siguiente:hover {
  opacity: 0.6;
}
.paginador .pag_primera {
  padding-left: 1.2rem;
  background-image: url('/img/iconos/play-skip-back.svg');
  background-position-x: 0.2rem;
  border-radius: 0.3rem 0 0 0.3rem;
}
.paginador .pag_ultima {
  padding-right: 1.2rem;
  background-image: url('/img/iconos/play-skip-forward.svg');
  background-position-x: calc(100% - 0.3rem);
  border-radius: 0 0.3rem 0.3rem 0;
}

.paginador .pag_anterior {
  padding-left: 1.3rem;
  background-image: url('/img/iconos/play-back.svg');
  background-position-x: 0.2rem;
}
.paginador .pag_siguiente {
  padding-right: 1.3rem;
  background-image: url('/img/iconos/play-forward.svg');
  background-position-x: calc(100% - 0.3rem);
}

.paginador .pag_anterior,
.paginador .pag_siguiente {
  margin-left: 0.15rem;
  margin-right: 0.15rem;
}

.paginador .multiplicador {
  margin-left: 1rem;
  display: flex;
  position: relative;
}
.paginador .multiplicador:hover::before {
  content: 'concentración de ítems';
  position: absolute;
  top: 1.3rem;
  left: 0;
  width: 100%;
  text-align: center;
  line-height: 0.9rem;
  font-size: 0.8rem;
  color: rgb(149, 15, 193);
}
.paginador .multiplicador .multi {
  text-decoration: none;
  border-radius: 50%;
  margin: 0 0.15rem;
  width: 1rem;
  height: 1rem;
  font-size: 0;
  text-align: center;
  position: relative;
}
.paginador .multiplicador .multi:hover::before {
  content: attr(data-multiplicador);
  position: absolute;
  display: block;
  bottom: 1.1rem;
  font-size: 0.7rem;
  line-height: 0.9rem;
  font-family: negrita;
  left: -0.2rem;
  background-color: rgba(0, 0, 0, 0.75);
  color: white;
  padding: 0.2rem 0.4rem;
  border-radius: 0.3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}


.paginador .multiplicador .multi:nth-child(1) {
  background-color: rgba(201, 17, 217, 0.4);
}

.paginador .multiplicador .multi:nth-child(3) {
  background-color: rgba(201, 17, 217, 0.5);
}

.paginador .multiplicador .multi:nth-child(5) {
  background-color: rgba(201, 17, 217, 0.6);
}

.paginador .multiplicador .multi:nth-child(7) {
  background-color: rgba(201, 17, 217, 0.7);
}

.paginador .multiplicador .multi:nth-child(9) {
  background-color: rgba(201, 17, 217, 0.8);
}

.paginador .multiplicador .multi:nth-child(11) {
  background-color: rgba(201, 17, 217, 0.9);
}

.paginador .multiplicador .multi:nth-child(13) {
  background-color: rgba(201, 17, 217, 1);
}

.paginador .multiplicador .multi.aqui {
  background-color: #a8cbd9;
}


/*pruebaloader*/
@media (max-width: 450px){
  .loader{
    padding: 0;
  }
}

/* Datepicker */
div.ui-datepicker {
  background-color: white;
  padding: 0.5rem;
  border: 1px solid #d0d0d0;
}
div.ui-datepicker th {
  font-family: estandar;
  font-weight: normal;
  font-size: 0.75rem;
  opacity: 0.5;
}
div.ui-datepicker td {
  text-align: center;
  position: relative;
  height: 2rem;
  width: 2rem;
}
div.ui-datepicker th:nth-child(6),
div.ui-datepicker th:nth-child(7),
div.ui-datepicker td:nth-child(6) a,
div.ui-datepicker td:nth-child(7) a {
  color: red;
}
div.ui-datepicker td a {
  font-size: 0.8rem;
  color: #666;
  text-decoration: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding-top: 0.5rem;
  border-radius: 0.2rem;
}

div.ui-datepicker td a:hover {
  background-color: #EEE;
}

.ui-datepicker-title {
  font-family: negrita;
  text-align: center;
  margin-bottom: 0.5rem;
}
.ui-datepicker-prev {
  position: absolute;
  left: 1rem;
}
.ui-datepicker-next {
  position: absolute;
  right: 1rem;
}

/*
 * Extras para campos
 */

/*
Opciones (clases):
  inserta_summa
  summa_en_linea
  contenedor_buscable
  contenedor_limitado
  contenedor_encogible 
*/

/* Elementos summa de campos checkbox y select */
.summa_seleccionados {
  display: none;
}
.inserta_summa .summa_seleccionados {
  display: block;
}

.summa_item {
  position: relative;
  display: flex;
  border: 0.1rem solid transparent;
  padding: 0.1rem 0.3rem;
  border-radius: 0.3rem;
  margin-right: 0.1rem;
  width: max-content;
  transition:
    background-color var(--animacion-estandar) ease-in 0s,
    border var(--animacion-estandar) ease-in 0s;
}
.summa_en_linea .summa_item {
  display: inline-flex;
}
.summa_item_retira {
  padding-left: 0.3rem;
  font-family: negrita;
  opacity: 0.1;
  transition:
    opacity var(--animacion-estandar) ease-in 0s,
    color var(--animacion-estandar) ease-in 0s;
}
.summa_item:hover {
  border-color: var(--fondo-medio-semiopaco);
  background-color: var(--fondo-claro);
  cursor: default;
}
.summa_item:hover .summa_item_retira {
  opacity: 1;
}
.summa_item_retira:hover {
  cursor: pointer;
  color: var(--error);
}

.campo.contenedor_limitado div.contenedor_opciones,
.campo.contenedor_limitado select[multiple].contenedor_opciones {
  height: 8rem;
  max-height: 8rem;
  overflow-y: auto;
  width: 90%;
  background-color: white;
  border: 1px solid #97b2c3;
  transition:
    height var(--animacion-estandar) ease-in var(--animacion-estandar);
}

.campo.contenedor_limitado.contenedor_encogible div.contenedor_opciones,
.campo.contenedor_limitado.contenedor_encogible select[multiple].contenedor_opciones {
  height: 0;
  padding: 0;
}

/* Buscadores por campo checkbox/select */
/*.caja_busqueda {
  display: none;
}

.contenedor_buscable .caja_busqueda {
  position: relative;
  background-color: transparent;
  padding-left: 2rem;
}*/

input[type="text"].caja_busqueda {
  display: none;
  position: relative;
  background-color: transparent;
  background-image: url('/img/iconos/keyboard.svg');
  background-position: 0.3rem 0.2rem;
  background-size: 1.3rem;
  background-repeat: no-repeat;
  height: auto;
  padding-left: 2rem;
  padding-bottom: 0;
  border: none;
  filter:
    invert(80%)
    sepia(21%)
    saturate(300%)
    hue-rotate(160deg)
    brightness(83%)
    contrast(92%);
}

.contenedor_buscable input[type="text"].caja_busqueda {
  display: block;
}

input[type="text"].caja_busqueda::placeholder {
  opacity: 1;
}

input[type="text"].caja_busqueda:focus,
input[type="text"].caja_busqueda:focus-visible {
  box-shadow: none;
  outline: none;
  filter: invert(44%) sepia(21%) saturate(695%) hue-rotate(159deg) brightness(94%) contrast(87%);
}

.contenedor_encogible input[type="text"].caja_busqueda:focus + div.contenedor_opciones,
.contenedor_encogible input[type="text"].caja_busqueda:focus + select[multiple].contenedor_opciones,
.contenedor_encogible div.contenedor_opciones:focus-within,
.contenedor_encogible select[multiple].contenedor_opciones:focus-within {
  height: 8rem;
}

/*
 * Momento
 */

.momento_propuesta_interactiva {
  font-family: unidadesn;
  padding: 0.1rem;
}

.momento_fecha_confirmada {
  color: var(--confirmacion);
}

.momento_fecha_tentativa {
  color: var(--neutro);
}

.momento_fecha_no_valida {
  color: var(--error);
}

#finicio_elemento_interactivo,
#ffin_elemento_interactivo {
  margin-top: 0.3rem;
}