@import '../r/r.css';
@import './iconos/css/all.min.css';

/*
* * * * *
* Configuracion general
* * * * * 
*/
html {
    overflow: hidden;
}
nav#nav_interna {
    display: inline-block;
    width: 45px;
    height: 50px;
    vertical-align: top;
    transition: all 0.3s ease-in;
    overflow: hidden;
    position: absolute;
    z-index: 1;
}

nav#__intra_menu .accordion .accordion-body
{
    margin-bottom: 0;
}
nav#__intra_menu .accordion
{
    box-shadow: 0px 1px 0px 0px rgb(255 255 255 / 1%);
}
nav#__intra_menu .accordion-header i {
    position: absolute;
    top: 50%;
    right: 0.6rem;
    transform: translateY(-50%);
}

nav#__intra_menu .accordion-header:hover
{
    background-color:var(--color-grulla);
}
nav#__intra_menu .accordion-header {
    position: relative;
    padding: 0.5rem 0.4rem 0.5rem 10%;
    text-transform: uppercase;
    font-size: 0.7rem;
    transition: padding-left 100ms linear;
    color:rgba(255,255,255,0.8);
}

#__intra_menu .menu .menu-item {
    font-size: 0.7rem;
    background-color: var(--color-negro-claro);
    position: relative;
    padding: 0.2rem 1rem;
    color: rgba(255,255,255,.7);
    margin: 0;
}
#__intra_menu .menu .menu-item:first-letter {
    text-transform: capitalize;
}
#__intra_menu .menu .menu-item::before {
    content: "";
    width: 85%;
    position: absolute;
    bottom: 0;
    left: 7%;
    height: 1px;
    background: rgba(255,255,255,.1);
}

#nav_interna .accordion input:checked ~ .accordion-header 
{
    color: var(--color-blanco);
    position: relative;
    z-index: 1;
}

#nav_interna .accordion-header:before
{
    content: "";
    position: absolute;
    left: 5%;
    top: 0;
    width: 0%;
    height: 100%;
    transition: width 100ms linear;
    background-color: var(--color-verde);
}

#nav_interna .accordion input:checked ~ .accordion-header:before
{
    content: "";
    position: absolute;
    left: 5%;
    top: 0;
    width: 90%;
    height: 100%;
    border-radius: 0px;
    z-index: -1;
    box-shadow: 0 0 0px 1px rgba(0,0,0,.1);
    border-radius: 7px;
}

nav#__intra_menu .accordion
{
    background-color: var(--color-background-menu-oscuro);
    position: relative;
}

nav#__intra_menu .accordion input:checked ~ .accordion-body::before, nav#__intra_menu .accordion[open] .accordion-body::before
{
    content: "";
    position: absolute;
    left: 0;
    width: 2px;
    background-color: var(--color-grulla);
    height: 100%;
    z-index: 2;
    top: 0;
}

.section_body {
    display: inline-block;
    width: 100%;
    margin-left: 2px;
    vertical-align: top;
    height: CALC(100% - 48px);
    overflow: auto;
    box-sizing: border-box;
    background-color: var(--color-background);
    position: absolute;
    right: 0;
    transition: all 0.3s ease-in;
    left: 0;
    top: 48px;
}
.content
{
	display: block;
	width: 100%;
	height: 100%;
}
  ul.menu {
      height: fit-content;
      transform: none;
  }

	.height-100
	{
		height: 100%;
	}
	.fit-content
	{
		width: fit-content;
	}
  .fit-content-important
  {
    width: fit-content !important;
  }
.max-container-center-1300
{
  max-width: 1633px;
/*  margin-left: auto;
  margin-right: auto;*/
  text-align: left;
}
.max-container-center-1024
{
  max-width: 1024px;
/*  margin-left: auto;
  margin-right: auto;*/
  text-align: left;
}
.max-container-center-800
{
  max-width: 800px;
/*  margin-left: auto;
  margin-right: auto;*/
  text-align: left;
}

table.table.table-striped.table-hover.table-scroll {
    padding: 2.5rem 0 4rem 0;
}
#__intra_menu .menu li.menu-item.padre a:hover
{
    color: var(--color-texto-menu-titulo);
}

#__intra_menu .menu .menu-item > a:focus, #__intra_menu .menu .menu-item > a:hover {
    background: transparent;
}
.acb-menu
{
    margin-top:0.3rem;
}

figure#contLogo {
    height: 6rem;
    width: 100%;
    padding: 1.5rem;
}

figure#contLogo img {
    height: 100%;
    display: block;
    margin: 0 auto;
    width: auto;
}
div#userInfo {
    height: 2rem;
    padding: 0rem 1rem;
}
.menu li.menu-item.padre > a:focus, li.menu .menu-item.padre > a:hover, .menu li.menu-item.padre > a:active
{
    box-shadow:  unset;
    color: var(--color-texto-menu-titulo);
    outline: unset;
}

li.menu-item.padre a
{
  background-color: inherit !important;
  color: var(--color-texto-menu-titulo);
  padding-left: 0.5rem;
}
li.menu-item.padre {
    font-weight: bold;
    padding: 0.3rem 0.4rem;
    margin-top: 0.6rem !important;
}

li.menu-item.padre:focus {
    border: 0 !important;
    box-shadow: unset;
    outline: unset;
}
li.menu-item.hijo a, li.menu-item.nadie a {
    padding-left: 1rem;
}

#nav_interna .menu
{
    border-radius : 0;
    box-shadow    : unset;
    list-style    : none;
    margin        : 0;
    min-width     : 20px;
    padding       : 0;
    z-index       : 300;
    height        : calc(100% - 9rem);
    overflow-y    : auto;
    overflow-x    : hidden;
    width         : 100%;
    position      : relative;
    top           : 0;
    transform     : translate(0,0);
    background-color: transparent;
}

.menu .menu-item > a i {
    position: relative;
    top: 1px;
    left: 0;
    font-size: 0.9rem;
}

#mn_dpersonales
{
  display: inline-block;
  height: 5%;
  width: 100%;
}
div#mn_dpersonales button {
    width: 100%;
    height: 100%;
    background: transparent;
    border: none;
    text-align: center;
    padding: 0 0.8rem;
    background: #edeef4;
}
div#mn_dpersonales i.las.la-angle-right.float-right {
    float: right;
    top: 0.3rem;
    position: relative;
    float: right;
}
*::-webkit-scrollbar {
  width: 0.25rem;
  height: 0.25rem;
}
 
*::-webkit-scrollbar-track {
  background-color: #f1f1f1; /*var(--color-background);*/
}
 
*::-webkit-scrollbar-thumb {
    background-color: #b7b7b7;
    outline: unset;
    border-radius: 3rem;
}

#__intra_menu::-webkit-scrollbar {
  width: 0.35rem;
  height: 0.35rem;
}
div#__logo_acciones 
{
    display         : flex;
    width           : 100%;
    height          : 44px;
    overflow        : hidden;
    justify-content : space-between;
    padding         : 0.1rem 0 0.5rem 0;
    background      : var(--color-background-menu);
    margin-bottom   : -5px;
    box-sizing      : content-box;
    vertical-align  : middle;
    align-content   : flex-end;
    align-items     : center;
}

div#__logo_acciones figure {
    height: fit-content;
    margin-left: 0.5rem;
}

div#__logo_acciones figure img {
    height: 30px;
}
span#__burger {
    font-size: 1.4rem;
    display: inline-block;
    padding: 0;
    margin: 0;
    color: var(--color-texto-menu-titulo);
    margin-right: 0.5rem;
}
/*
nav#__intra_menu {
    opacity: 0.4;
    transition: all 0.5s linear;
}

nav#__intra_menu:hover {
    opacity: 1;
}*/

/* PARCHE  */
dmalert
{
    z-index: 9999;
    max-width: 400px !important;
    border-radius: 7px 0 0 0px !important;
    text-align: left !important;
    padding: 1rem 0.9rem !important;
    line-height: 1rem;
}
dmalert::before {
    content: "";
    background-color: rgba(0,0,0,.4);
    width: .5rem;
    height: 100%;
    right: 0;
    top: 0;
    position: absolute;
}
div#nav_interna {
    height: 100%;
    position: relative;
    top: 0;
}
div#sidebar {
    width: 220px;
    background-color: #434532;
}
.empty {
    background-color: #303742;
}

form#form_login {
    width: 300px;
    display: block;
    min-width: 250px;
}

form#form_login .form-group {
    text-align: left;
    width: 100%;
    margin-top: 0.7rem;
}

form#form_login .form-group input {
    width: 100%;
    padding: 1.2rem 0.5rem;
}
.w100
{
    width: 100%;
}
.empty .empty-action
{
    margin: 0 !important;
}
.off-canvas-content
{
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}
.margin-0-auto
{
    margin: 0 auto;
}

#off-canvas.container
{
    padding: 0px 1rem 0 0rem;
}
div#contenido_fino_superior {
    display: block;
    height: 1.8rem;
}
/*Barras BTN Menú Despeglable Grulla*/
.off-canvas-content {
    background-color: #f7f7f7;
}
a.off-canvas-toggle.btn.btn-primary.btn-action {
    border-radius: 0;
    left: 0;
    top: 0;
    width: fit-content;
    text-align: right;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
    align-content: center;
    padding: 0 0.4rem !important;
    z-index: 55;
}

a.off-canvas-toggle.btn.btn-primary.btn-action::after {
    content: "";
    position: relative;
    height: fit-content;
    margin-left: 0.2rem;
    transform: translateY(-0.08rem);
}

/*Flechas Accordion*/
.accordion-header .text-bold {cursor: pointer;}
.accordion-header .la-caret-down {padding-left: 0.3rem; color: var(--color-grulla);}

.code-max-height
{
    max-height: 50vh;
    overflow-x: auto;
    overflow-y: auto;
}

/* Syntax de colores para JSONS */
.json-string { color: green; }
.json-key { color: red; }
.json-value { color: darkorange; }

.max-width-1440
{
    max-width:3600px;
}
.sm-tile-icon
{
    width: 45px;
}
.tile .tile-title, .tile .tile-subtitle 
{
    line-height: 0.8rem;
}

.divider.divider-dark[data-content]::after, .divider-vert.divider-dark[data-content]::after {
    background-color: #3b3b3b;
}
.divider.divider-dark {
    border-top-color: #3b3b3b;
}

form#_entidad {
    width: fit-content;
}

div#contenido_fino_superior {
    width: calc(100% + 1rem);
    background-color: var(--color-blanco);
    border-bottom: 1px solid rgba(0,0,0,.2);
    padding: 0.2rem;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: center;
}

/* flexs  */
.flex-left {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    align-items: stretch;
    gap: 0.3rem;
}
.flex-right {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-end;
    align-items: stretch;
    gap: 0.3rem;
}


.flex-spacing {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-between;
    align-items: stretch;
    gap: 0.3rem;
}
    .none-spacing
    {
        flex-direction: row;
        flex-wrap: wrap;
        align-content: center;
        justify-content: space-between;
        align-items: stretch;
        gap: 0.3rem;
    }

.flex-1-0-100 {
    flex: 1 0 100px;
}
.flex-1-0-150 {
    flex: 1 0 150px;
}
.flex-1-0-200 {
    flex: 1 0 200px;
}
.flex-1-0-250 {
    flex: 1 0 250px;
}
.flex-1-0-300 {
    flex: 1 0 300px;
}

.d-flex-right {
    display: flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
}
.d-none-important
{
    display: none !important;
}

.menu-item button.btn.btn-link
{
    border-radius: .5rem;
}
.menu-item button.btn.btn-link:hover {
    background-color: var(--color-verde-claro);
    color: #000000;
}
.agro-dropdown .menu .menu-item {
    position: relative;
}

.agro-dropdown .menu .menu-item::after {
    content: " ";
    width: 90%;
    height: 1px;
    background-color: rgba(0,0,0,.06);
    position: absolute;
    left: 50%;
    bottom: -2.3px;
    transform: translateX(-50%);
}

.agro-dropdown .menu .menu-item:last-child::after {
    content: unset;
}
.d-flex-login {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    height: 100vh;
}

figure.cnt-intro {
    flex: 2 0 300px;
    height: 100%;
    background: url(../template/portada.jpg) no-repeat scroll center 20% / cover transparent;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.espacio-login {
    flex: 1 0 400px;
}

.espacio-login {
    background-color: rgba(255, 255, 255, 1);
    height: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 5;
}
figure.cnt-intro::before {
    content: "";
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.2);
}

figure.cnt-intro img {
    max-width: 240px;
    position: relative;
    z-index: 3;
    width: 100%;
}

figure.cnt-intro div {
    position: relative;
    z-index: 3;
    margin-top: 1rem;
    font-size: 1rem;
}
.btn-sigpac {
    position: absolute;
    z-index: 9999;
    right: 0.3rem;
    top: 0.3rem;
    box-shadow: 0 0 0 1px var(--color-verde-claro);
}
div#info {
    display: flex;
    max-width: 300px;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 0.4rem;
}

div#info span {
    flex: 1 0 132px;
    width: 50%;
    font-size: 0.7rem;
}

div#info span label {
    display: block;
    text-transform: uppercase;
    font-weight: 400;
    margin-bottom: 0.2rem;
    font-size: 0.6rem;
}

#_entidadSel option
{
    text-transform: uppercase;
}



/* LEAFLET */
.leaflet-pane svg path:hover
{
    fill: #FFC107;
    stroke: #FFEB3B;
    fill-opacity: 0.7;
}
.card-body .accordion label.accordion-header {
    padding: 0;
}
.leaflet-marker-icon.leaflet-div-icon.leaflet-zoom-animated.leaflet-interactive 
{
    white-space: nowrap;top: 0;left: 0;width: 10px;background: transparent;border: none;pointer-events: none;
}

.leaflet-marker-icon.leaflet-div-icon.leaflet-zoom-animated.leaflet-interactive span {
    position: absolute;
    left: 0;
    transform: translateX(-50%);
    max-width: 100px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 11px;
    color: #ffffff;
    text-transform: uppercase;
    background-color: rgba(0,0,0,.3);
    padding: 0 5px;
}
.btn-popupbind {
    position: relative;
    top: 0;
    padding: 0;
    height: fit-content;
    border: none;
    cursor: pointer;
    color: #ffffff;
    background-color: transparent;
}


@media (min-width: 0px) and (max-width: 800px) 
{
    .d-flex-login {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: flex-start;
        align-items: stretch;
        height: 100vh;
    }
    figure.cnt-intro {
        max-height: 30vh;
    }

    figure.cnt-intro img {
        height: 50%;
    }
}