@charset "UTF-8";
/*
Theme Name: Alta Guardia Dashboard
Theme URI: https://www.altaguardia.com/
Author: César de la Torre, CTO Alta Guardia
Author URI: https://newdomotec.com/
Description: Dashboard para el control interno de las operaciones de Alta Guardia SL
Requires at least: 5.3
Tested up to: 5.8
Requires PHP: 5.6
Version: 1.0
Alta Guardia Dashboard, (C) 2021 Alta Guardia
*/
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");
body,
html {
margin: 0 !important;
background-color: #f7f7f7;
height:100%;
}
/*LOGIN*/
.login-body {
background: url(http://altaguardia.newdomotec.com/wp-content/uploads/2021/10/job-moses-2uHWaVj7VV4-unsplash-1-2.png)
no-repeat;
background-size: contain;
position: relative;
height: 100vh;
margin: 0;
}
.center {
width: 845px;
height: 448px;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: #ffffff;
box-shadow: 0px 10px 21px rgba(0, 0, 0, 0.15);
backdrop-filter: blur(15px);
/* Note: backdrop-filter has minimal browser support */
border-radius: 10px;
}
.center div {
display: inline-block;
height: 100%;
vertical-align: top;
}
.login-branding {
background: url("http://dashboard.altaguardia.com/wp-content/themes/altaguardiadashboard/images/bambai.png")
no-repeat center center #1d1f21;
padding: 0;
width: 49%;
}
#loginform {
font-family: Inter;
font-style: normal;
font-weight: normal;
font-size: 17px;
line-height: 21px;
color: #878787;
}
.login-form {
width: 270px;
padding: 50px 75px;
}
input[type="text"],
input[type="password"] {
border-radius: 20px;
width: 305px;
height: 40px;
border: 1px solid #c4c4c4;
box-sizing: border-box;
border-radius: 10px;
display: block;
}
input[type="submit"] {
width: 305px;
height: 49px;
background: linear-gradient(
269.27deg,
#007df7 0.33%,
rgba(236, 225, 159, 0) 100%
),
#007df7;
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 20px;
line-height: 24px;
text-align: center;
color: #ffffff;
border: none;
border-radius: 10px;
}
hr {
width: 35%;
margin: 4%;
display: inline-block;
border: 1px solid #c4c4c4;
vertical-align: middle;
}
.o {
width: 305px;
text-align: center;
height: auto !important;
font-family: Inter;
font-style: normal;
font-weight: normal;
font-size: 17px;
line-height: 21px;
color: #c4c4c4;
}
.lostpassword {
text-align: center;
width: 305px;
}
a {
text-decoration: none;
font-family: Inter;
font-style: normal;
font-weight: normal;
font-size: 17px;
line-height: 21px;
color: #878787;
}
.login-msg {
margin: -15px 0 6px;
color: red;
}
h2 {
font-family: Inter;
font-style: normal;
font-weight: 600;
font-size: 20px;
line-height: 24px;
text-align: center;
color: #000000;
margin-top: 0;
width: 305px;
margin-bottom: 60px;
}
#lostpasswordform p {
font-family: Inter;
font-style: normal;
font-weight: normal;
font-size: 17px;
line-height: 21px;
color: #878787;
}
/*BARRA LATERAL*/
.barra_lateral {
width: 15%;
height:100%;
position:fixed;
background: #007df7;
}
#page {
vertical-align: top;
display: inline-block;
width: 84%;
margin-left:15%;
height: 100vh;
}
.logo_menu {
width: 70%;
margin: 15%;
}
.logo_menu img {
width: 100%;
}
.menu li a {
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 17px;
color: #ffffff;
text-transform: uppercase;
padding-left: 5%;
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
}
.menu {
list-style-type: none;
margin: 0;
padding-left: 12px;
}
.menu li {
padding: 25px 0;
background-repeat: no-repeat;
background-position: 4% center;
padding-left: 15%;
}
.current_page_item,.current-page-ancestor {
background: #f7f7f7;
border-radius: 10px 0px 0px 10px;
}
.menu_menusec_inicio {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_inicio.current_page_item,.menu_menusec_inicio.current-page-ancestor {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_gesreservas {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_gesreservas.current_page_item,.menu_menusec_gesreservas.current-page-ancestor {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_monitoreo {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_monitoreo.current_page_item,.menu_menusec_monitoreo.current-page-ancestor {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_logistica {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_logistica.current_page_item,.menu_menusec_logistica.current-page-ancestor {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_clientes {
background-image: url('data:image/svg+xml;utf8,');
}
.menu_menusec_clientes.current_page_item,.menu_menusec_clientes.current-page-ancestor {
background-image: url('data:image/svg+xml;utf8,');
}
.current_page_item .sub-menu,.current-page-ancestor .sub-menu {
display: block;
margin-left: -15%;
margin-top: 8%;
border-top: 1px solid #c4c4c4;
}
.sub-menu {
display: none;
list-style: none;
padding: 0px;
}
.current_page_item a,.current-page-ancestor a {
color: #878787 !important;
}
.sub-menu li {
padding: 20px 0 0;
}
.sub-menu li a {
text-transform: none;
}
.menu-item-has-children.current_page_item,.menu-item-has-children.current-page-ancestor {
background-position: 5% 14%;
}
.menu-item-has-children::after {
content: "";
display: block;
background: url('data:image/svg+xml;utf8,')
no-repeat;
width: 20px;
height: 20px;
float: right;
margin: 0 5px 0 0;
}
.menu-item-has-children.current_page_item::after,.menu-item-has-children.current-page-ancestor::after {
content: "";
display: block;
background: url('data:image/svg+xml;utf8,')
no-repeat;
width: 20px;
height: 20px;
float: right;
margin: 0 20px 0 0;
}
.menu_menusec_monitoreo.current_page_item::after,.menu_menusec_monitoreo.current-page-ancestor::after {
margin: -150px 20px 0 0;
}
.menu_menusec_logistica.current_page_item::after,.menu_menusec_logistica.current-page-ancestor::after {
margin: -112px 20px 0 0;
}
.header_user_info {
float: right;
}
.header_user_info div {
display: inline-block;
vertical-align: middle;
margin: 0 10px;
}
.header_user_info div p {
font-family: Inter;
font-style: normal;
font-weight: normal;
font-size: 15px;
line-height: 18px;
margin: 0;
text-align: right;
}
.header_user_name {
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 25px;
line-height: 30px;
color: #ffffff;
background: #007df7;
border-radius: 10px;
padding: 7px;
}
.header h2 {
display: inline-block;
text-transform: uppercase;
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 25px;
line-height: 30px;
color: #000000;
margin: 0;
width: auto;
}
.header {
padding: 3%;
}
.header_desplegable_user {
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-position: center center;
width: 45px;
height: 45px;
position: relative;
}
#desplegable_user {
display: none;
}
#desplegable_user:checked + .header_desplaegable_user {
background: url('data:image/svg+xml;utf8,')
no-repeat;
}
.caja_cerrar_sesion {
width: 274px;
height: 113.03px;
background: #ffffff;
box-sizing: border-box;
border-radius: 10px;
position: absolute;
right: -20px;
top: 55px;
display: none !important;
padding: 35px;
box-shadow: 0px -2px 15px rgba(0, 0, 0, 0.2);
}
.caja_cerrar_sesion:before {
border: 15px solid white;
content: "";
border-left-color: transparent;
border-top-color: transparent;
border-right-color: transparent;
position: absolute;
right: 17px;
bottom: 111px;
}
#desplegable_user:checked + .caja_cerrar_sesion {
display: inline-block !important;
}
.boton_cerrar_sesion {
width: 218px;
height: 40px;
background: #007df7;
border-radius: 10px;
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 15px;
line-height: 18px;
color: #ffffff;
text-align: center;
margin: 0 !important;
display: flex !important;
justify-content: center;
align-items: center;
}
#alertas_confirmadas {
height: 150px;
background: #ffffff;
border-radius: 10px;
padding: 30px;
margin: 2% 3%;
overflow-y: scroll;
display: inline-block;
vertical-align: top;
}
#alertas_confirmadas table {
width: 100%;
display: none;
}
#alertas_confirmadas caption {
text-align: left;
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 17px;
color: #000000;
margin-bottom: 21px;
}
#alertas_confirmadas thead {
position: sticky;
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 15px;
line-height: 18px;
color: #e50f0f;
text-align: left;
height: 40px;
vertical-align: top;
}
#alertas_confirmadas thead th,
#alertas_confirmadas thead tr {
border-bottom: 1px solid #ededed;
}
#inventario_sets {
display: inline-block;
height: 150px;
background: #ffffff;
border-radius: 10px;
padding: 30px;
margin: 2% 3%;
}
#inventario_sets h5 {
margin: 0;
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 17px;
color: #000000;
}
.cajas_inventario_set div {
display: inline-block;
width: 32%;
text-align: center;
vertical-align: middle;
height: 100%;
}
.cajas_inventario_set {
width: 100%;
height: 90%;
margin: 5% 0;
}
.cajas_inventario_set p {
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 15px;
line-height: 18px;
text-align: center;
color: #000000;
}
.inventario_set_disponibles {
border-right: 1px solid #ededed;
}
.inventario_set_deposito {
border-left: 1px solid #ededed;
}
#inventario_set_disponibles_number {
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 40px;
line-height: 48px;
text-align: center;
color: #48c03d;
}
#inventario_set_activos_number {
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 40px;
line-height: 48px;
text-align: center;
color: #000000;
}
#inventario_set_deposito_number {
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 40px;
line-height: 48px;
text-align: center;
color: #d1b82a;
}
.cajetines_inicio_3 {
height: 400px;
background: #ffffff;
border-radius: 10px;
padding: 30px;
margin: 2% 3%;
overflow-y: scroll;
display: inline-block;
vertical-align: top;
}
.cajetines_inicio_3 table {
width: 100%;
}
.cajetines_inicio_3 caption {
text-align: left;
font-family: Inter;
font-style: normal;
font-weight: bold;
font-size: 14px;
line-height: 17px;
color: #000000;
margin-bottom: 21px;
}
.cajetines_inicio_3 thead {
position: sticky;
font-family: Inter;
font-style: normal;
font-weight: normal;
font-size: 15px;
line-height: 18px;
color: #000000;
text-align: left;
height: 40px;
vertical-align: top;
}
.tables {
margin: 2% 2%;
overflow: scroll;
padding-left: 0;
height: 70vh;
}
.search_input {
width: 91% !important;
margin: 0% 3%;
padding: 0 17px;
background-image: url('data:image/svg+xml;utf8,');
background-repeat: no-repeat;
background-position: 1340px 6px;
}
.tables table {
width: 100%;
border-collapse: collapse;
}
#alertas_table table {
width: 100%;
}
.tables tr {
height: 68px;
text-align: center;
}
.tables td {
font-family: Inter;
font-style: normal;
font-weight: normal;
line-height: 21px;
color: #000000;
text-align: -webkit-center;
vertical-align: middle;
}
.tables tbody tr:nth-child(odd) {
background-color: #fff;
border: #fff;
}
.cajetines_logistica {
width: 10%;
height: 95%;
padding: 30px 30px 0;
margin: 0 1%;
display: inline-block;
vertical-align: top;
overflow:scroll;
}
.cajetinrellenar {
display: flex;
flex-direction: column;
overflow-y: scroll;
}
#apartados_logistica {
width: 95%;
margin: 2% 3%;
overflow-x: scroll;
}
.logistica_space {
width: 166vw;
height: 70vh;
}
.cuadroestado {
background-color: white;
border-radius: 25px;
padding: 7px 22px 7px 10px;
margin: 10px 0;
order: 2;
font-weight: bold;
position: relative;
cursor:pointer;
}
.estadoincidencia {
order: 1;
background-color: #ED7A7A;
}
.cuadroestado::after {
content: "";
background: url('data:image/svg+xml;utf8,') no-repeat;
width: 20px;
height: 20px;
position: absolute;
right: 10px;
top: calc(50% - 10px);
transform: rotate(-90deg);
}
/* Works on Firefox */
* {
scrollbar-width: auto;
scrollbar-color: orange transparent;
}
.cuadroestado p {
margin: 10px;
}
/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
width: 14px;
}
*::-webkit-scrollbar-track {
background: white;
}
*::-webkit-scrollbar-thumb {
background-color: orange;
border-radius: 20px;
border: 3px solid white;
}
.activar {
width: 80%;
height: 15px;
background: #48c03d;
border-radius: 10px;
padding: 20px 10px;
color: white;
font-weight: bolder;
cursor: pointer;
}
.desactivar {
width: 80%;
height: 15px;
background: #e80d0d;
border-radius: 10px;
padding: 20px 10px;
color: white;
font-weight: bolder;
cursor: pointer;
}
.ping {
width: 80%;
height: 15px;
background: #D1B82A;
border-radius: 10px;
padding: 20px;
color: white;
font-weight: bolder;
cursor: pointer;
}
.llamar {
width: 75px;
height: 15px;
background-color: #78c9f6;
border-radius: 10px;
padding: 20px 10px;
background-image: url("svg/monitoreo/call_icon.svg");
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
}
.registro a {
color: white;
}
.registro {
width: 197px;
height: 15px;
background: #007df7;
border-radius: 10px;
padding: 20px 10px;
color: white;
font-weight: bolder;
cursor: pointer;
text-align: center;
margin: 3% 4%;
}
.email {
width: 75px;
height: 15px;
background-color: #569dc5;
border-radius: 10px;
padding: 20px 10px;
background-image: url("svg/monitoreo/email_icon.svg");
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
}
td {
padding: 10px;
}
.modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #111111bd;
display: flex;
opacity: 0;
pointer-events: none;
transition: opacity 0.6s 0.9s;
--transform: translateY(-100vh);
--transition: transform 0.8s;
}
.modal--show {
opacity: 1;
pointer-events: unset;
transition: opacity 0.6s;
--transform: translateY(0);
--transition: transform 0.8s 0.8s;
}
.modal__container {
margin: auto;
width: 90%;
max-width: 600px;
max-height: 90%;
background-color: #fff;
border-radius: 6px;
padding: 3em 2.5em;
display: grid;
gap: 1em;
place-items: center;
grid-auto-columns: 100%;
transform: var(--transform);
transition: var(--transition);
overflow-y: scroll;
}
.modal__title {
font-size: 2.5rem;
}
.modal__btn__call {
width: 75px;
height: 15px;
background-color: #78c9f6;
border-radius: 10px;
background-image: url("svg/monitoreo/call_icon.svg");
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
padding: 20px 10px;
margin: auto;
}
.modal__close {
text-decoration: none;
color: #fff;
background-color: #f26250;
padding: 1em 3em;
border: 1px solid;
border-radius: 6px;
display: inline-block;
font-weight: 300;
transition: background-color 0.3s;
}
.modal__close:hover {
color: #f26250;
background-color: #fff;
}
#containerSuperior{
display:grid;
grid-template-columns: 1fr 1fr;
}
#containerInferior{
display:grid;
grid-template-columns: 1fr 1fr 1fr;
}
#swal2-title{
width:90%;
}
#campo *{
font-family: 'Helvetica Neue', Helvetica, sans-serif;
font-size: 16px;
font-variant: normal;
}
.campo{
display: flex;
width: 75%;
flex-wrap: wrap;
margin-bottom: 20px;
}
.labelcampo {
height: 35px;
flex-basis: 40%;
position: relative;
display: block;
margin: 20px 2px 0 0;
}
.labelcampo > span {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
font-weight: 900;
line-height: 32px;
color: black;
border: 2px solid #C4C4C4;
transition: border-bottom-color 200ms ease-in-out;
border-radius: 12px;
cursor: text;
pointer-events: none;
}
.labelcampo > span span {
position: absolute;
top: 0;
left: 10px;
transform-origin: 0% 50%;
transition: transform 200ms ease-in-out;
cursor: text;
}
.labelcampo .field:focus + span span,
.labelcampo .field:not([value=""]):valid + span span,
.labelcampo .field:not([value=""]):disabled + span span{
transform: scale(0.68) translateX(-10px) translateY(-36px);
cursor: default;
}
.labelcampo .field:focus + span {
border-color: #007df7;
}
.field {
background: white;
font-weight: 300;
border: 0 !important;
color: black;
outline: none;
cursor: text;
display: block;
width: 100% !important;
line-height: 32px;
padding: 3px 10px;
transition: opacity 200ms ease-in-out;
}
.field:disabled{
color:#C4C4C4;
}
.field::-webkit-input-placeholder { color: #8898AA; }
.field::-moz-placeholder { color: #8898AA; }
/* IE doesn't show placeholders when empty+focused */
.field:-ms-input-placeholder { color: #424770; }
.field:not(:focus):placeholder-shown {
opacity: 0;
}
.camposreserva{
padding: 0 3%;
width: 59%;
display: inline-block;
}
.botones{
display: inline-block;
vertical-align: top;
padding: 0 2%;
width: 30%;
}
.botonregistro{
background-color: #007df7;
padding: 9px 22px;
text-align: center;
border-radius: 20px;
margin: 30px;
color: white;
font-weight: bold;
font-size: 19px;
}
h2.titreserva{
margin:0;
}
h3.titreserva{
margin: 30px 0 0;
}
h4.titreserva{
margin: 10px 0 0;
}
.detallereserva {
display: inline-block;
width: 100%;
padding: 3% 0;
}
@media screen and (max-width:920px){
.center {
width: 450px;
height: 490px;}
.center div {
display: block;
height: 23%;
width: 100%;}
.login-form {
width: 270px !important;}
}
@media screen and (max-width:600px){
#alertas_table tr > td:nth-child(1),td:nth-child(5),td:nth-child(6),td:nth-child(7),td:nth-child(8),td:nth-child(9){
display:none;
}
#alertas_table tr > th:nth-child(1),th:nth-child(5),th:nth-child(6),th:nth-child(7),th:nth-child(8),th:nth-child(9){
display:none;
}
}
@media screen and (max-width:900px){
.menu li a {
color:transparent !important;
}
.barra_lateral{
width:99px;
}
.logo_menu img {
width: 200px;}
.logo_menu {
width: 38px;
margin: 20px 30px;
overflow: hidden;}
#page{
width: calc(100% - 105px);
margin-left: 99px;}
td{
padding: 5px;}
.tables td{
line-height: 15px;
font-size: 11px;}
th{
font-size: 13px;}
#alertas_table tr > td:nth-child(10),td:nth-child(11){
display:none;
}
#alertas_table tr > th:nth-child(10),th:nth-child(11){
display:none;
}
.menu li {
height: 17px;
background-position: 50% center !important;}
.header h2 {
font-size: 21px;}
.header_user_info div:nth-child(1) {
display:none;}
.header_desplegable_user {
display:inline-block !important;
margin:0 -10px 8px !important;}
.header_user_name {
margin:0 !important;}
.tables{
height: 80vh;}
#containerSuperior {
grid-template-columns: 1fr;
width: 100%;
}
#containerInferior {
grid-template-columns: 1fr;
width: 100%;
margin-top: 20px;
}
#inventario_sets {
padding: 15px;
height: 80%;
margin: 10px 5px;}
.cajas_inventario_set div {
width: 31%;}
.cajas_inventario_set p {
font-size: 10px;}
#alertas_confirmadas {
padding: 15px;
margin: 10px 5px;}
#alertas_confirmadas thead th, #alertas_confirmadas thead tr {
font-size:11px;}
.menu-item-has-children::after {
margin: -13px 3px 0 0;}
}
@media screen and (max-width:550px){
.center {
width: 89%;}
.login-form {
width: 74% !important;
padding: 10% 13%;}
.login-form * {
max-width: 100%;}
}
@keyframes slide-ltr{
0% {
animation-timing-function: cubic-bezier(0.4652,0.1051,0.774,0.6426);
transform: translate(0px,0px) rotate(0deg) scale(1,1) skewX(0deg) skewY(0deg);
opacity: 1;
}
22.5% {
animation-timing-function: cubic-bezier(0.4142,0.3131,0.7623,0.6513);
transform: translate(47.8px,0px) rotate(0deg) scale(1,1) skewX(0deg) skewY(0deg);
opacity: 1;
}
45% {
animation-timing-function: cubic-bezier(0.3615,0.331,0.9646,1.3461);
transform: translate(147.8px,0px) rotate(0deg) scale(1,1) skewX(0deg) skewY(0deg);
opacity: 1;
}
47.5% {
animation-timing-function: cubic-bezier(0.7006,0.3332,0.6667,0.6667);
transform: translate(165.6px,0px) rotate(0deg) scale(1,1) skewX(0deg) skewY(0deg);
opacity: 0;
}
50% {
animation-timing-function: cubic-bezier(0.1604,0.3176,-0.0218,0.6965);
transform: translate(-200px,0px) rotate(0deg) scale(1,1) skewX(0deg) skewY(0deg);
opacity: 0;
}
51% {
animation-timing-function: cubic-bezier(0.1983,0.3529,0.5263,0.6945);
transform: translate(-179.8px,0px) rotate(0deg) scale(1,1) skewX(0deg) skewY(0deg);
opacity: 0;
}
80.4% {
animation-timing-function: cubic-bezier(0.2342,0.3708,0.5422,0.9065);
transform: translate(-38.4px,0px) rotate(0deg) scale(1,1) skewX(0deg) skewY(0deg);
opacity: 1;
}
100% {
transform: translate(0px,0px) rotate(0deg) scale(1,1) skewX(0deg) skewY(0deg);
opacity: 1;
}
}