* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

#mira-back {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #1a1423;
    min-height: 100vh;
    flex-direction: column;
}

#mira-back-tickets {
    background-color: #1a1423;
    min-height: 100vh;
    display: none;
}

.form-bg {
    width: 35%;
}

.width90 {
    width: 90%;
    margin-bottom: 50px;
}

.panel-form {
    background-color: white;
    border-radius: 10px;
    margin: 100px 0;
    margin-top: 150px;
}

.panel-dash {
    width: 95%;
    /* min-height: 70%; */
}

#header-loggedin {
    height: 10vh;
    display: flex;
    align-items: center;
    background: #f8fafb;
    position: absolute;
    width: 100%;
    justify-content: space-between;
    padding: 0 20px;
}

.ticket-panel {
    padding: 25px;
    margin-left: 25px;
}

.space-messages {
    padding: 15px;
    border-radius: 5px;
    border: 1px solid #f2f2f2;
    min-height: 500px;
    /*  overflow-y: scroll; */
}

.msg-block {
    -webkit-box-shadow: 0px 0px 25px -12px #000000;
    box-shadow: 0px 0px 25px -12px #000000;
    padding: 15px;
    border-radius: 5px;
    display: grid;
    grid-template-columns: 15% 80% 5%;
    grid-template-rows: 1fr;
}

.shadow {
    -webkit-box-shadow: 0px 0px 25px -12px #000000;
    box-shadow: 0px 0px 25px -12px #000000;
    border-radius: 5px;
}

.msg-content img {
    width: 100%;
}

.menu-icon-msg {
    cursor: pointer;
    color: #0d6efd;
}

.manager-msg {
    margin-left: 10px;
}

/* Modal Header */
.modal-header-x {
    background-color: #5c636a;
    color: white;
    padding: 2px 16px;
}

/* Modal Body */
.modal-body-x {
    padding: 16px;
}

/* Modal Footer */
.modal-footer-x {
    background-color: #5c636a;
    color: white;
    padding: 2px 16px;
}

/* Modal Content */
.modal-content-x {
    position: relative;
    background-color: #fefefe;
    padding: 0 !important;
    margin: 0;
    border: 1px solid #888;
    width: 90%;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    animation-name: animatetop;
    animation-duration: 0.4s;
    top: -1050px;
    display: none;
}

.close {
    cursor: pointer;
}

.ql-editor {
    min-height: 150px !important;
}

.rating-content i {
    transition: all 0.2s;
}

.rating-content i:hover {
    cursor: pointer;
    background-color: #fab005;
    color: black !important;
    border-radius: 100%;
}

.active-rating {
    background-color: #fab005;
    color: black !important;
    border-radius: 100%;
}

.red {
    color: rgb(192, 0, 0);
}

.yellow {
    color: rgb(226, 211, 0);
}

.ice {
    color: rgb(0, 177, 184);
}

.blue {
    color: rgb(0, 86, 184);
}

.green {
    color: rgb(0, 184, 71);
}

#rating-area,
#comment {
    animation: showanimation 0.5s;
}
@keyframes showanimation {
    0% {
        opacity: 0;
        transform: scale(0.001);
    }
}


/* horas */
.button-select-ticket{
	padding: 5px 10px;
}
#ticketList .modal-dialog{
	margin-top: 0 !important;
	padding: 10px;
	height: 100%;
}
#ticketList .modal-dialog .modal-content{
	max-height: 100%;
}
#tickets-table{
	width: 100% !important;
}
#ticketList .modal-dialog .modal-content .modal-body{
	overflow-y: auto;
}

.select-modal-buttons{
	display: flex;
	align-items: center;
}
.select-item-modal{
	display: flex;
	align-items: center;
	opacity: 0;
}
.select-item-modal p{
	margin: 0;
}
.remove-selected{
	margin-left: 10px;
}
.select-content{
	padding-left: 10px;
}

#ticketList .dataTables_length{
	display: none;
}
.dataTable tr{
	cursor: pointer;
	vertical-align: middle;
}


.btn.btn-hours{
	color: #fff;
	background-color: #ff43af;
	border-color: #ff43af;
}