/*!
 * CustomFixC24
 */

/*GENERAL*/

body.auth-page.auth.login-page {
    background-color: transparent !important;
    background-image: url(/images/sfondo-min.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 100vh;
}

.auth .login-container, .auth .client-pannel {
    background-color: transparent;
}

.auth button.btn.btn-primary {
    width: 100%;
}

body.auth-page.auth.login-page main#app {
    background: transparent !important;
}

.auth img {
    width: 5% !important;
}

a.dashbord-icon {
    background: #fff !important;
}

 .btn-outline-azzurro:hover {
    color: #555555;
    background: #fff;
}

a.fa.fa-pen {
    color: #00bd00;
}

a.fa.fa-trash {
    color: #555555;
}

.vertical-nav li {
    margin: 10px 0;
}

.ticektuser p, .ticektuser strong {
    font-size: 1rem;
    text-align: right;
    color: #555555;
    font-weight: 300;
}

img.icon-tab {
    width: 20px;
}

.horizontal-nav-links li.active a {
    color: #373736 !important;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus {
    box-shadow: none;
}

.vertical-nav li.active {
    background: transparent;
}

.vertical-nav li.active a img {
    opacity: 0.5;
}

.panel-title.header-section i {
    font-style: normal;
}

.alert-success, .alert-error {
    z-index: 9;
    position: absolute;
    right: 0;
    top: -15px;
}

/**GENERAL**/

/*DASHBOARD*/

.dashimage {
    background: #9fe0ff;
}

img.img-fluid.main-image {
    width: 65%;
    margin: 0 auto;
    text-align: center;
    display: block;
    padding: 10%;
}

.dashimage a {
    position: absolute;
    right: 15px;
    bottom: 25px;
    text-decoration: underline;
}

.admin-page.dashboard-section {
    padding: 55px 15px 0 65px;
}

.customStyleSection .list.d-flex {
    font-size: 18px;
    color: #555555;
    line-height: 55px;
}

span.color-total {
    color: #12b1ff;
}

span.color-open {
    color: #3366cc;
}

span.color-elaborate {
    color: #dc3912;
}

span.color-pending {
    color: #ff9900;
}

span.color-closed {
    color: #109618;
}

/**DASHBOARD**/


/*ELENCO-UTENTI*/
.main-panel {
    background: #fff;
    padding-bottom: 30px;
}

main#app {
    background: #e2e2e2 !important;
}

.navbar .horizontal-nav-links {
    background: transparent;
    margin: 0 115px;
    margin-top: 10px;
}

.horizontal-nav-links {
    width: 100%;
    margin-bottom: -10px;
    margin-left: 15px;
    display: flex;
}

.horizontal-nav-links li {
    width: 100%;
    max-width: 290px;
    display: inline-block;
    padding: 15px !important;
    float: left;
    text-align: center;
}

.horizontal-nav-links a {
    font-size: 16px !important;
}

.horizontal-nav .horizontal-nav-links li a span {
    display: contents;
}

.horizontal-nav-links li {
    background: #f6f6f6;
    border: 1px solid #eee;
}

.admin-page {
    padding: 90px 15px 0 115px;
}

.main-panel.col-md-10 {
    flex: 100% !important;
    max-width: 92.8% !important;
}

.horizontal-nav-links li {
    background: #f6f6f6;
    border: 1px solid #eee;
    border-top: 5px solid #f6f6f6 !important;
}

.horizontal-nav-links li.active {
    border-top: 5px solid #42b0fd !important;
    background: #fff;
    border-bottom: 1px solid#fff;
}

.horizontal-nav-links li:nth-child(1).active {
    border-right: 1px solid #eee;
    margin-left: -15px;
}

.horizontal-nav-links li:nth-child(2).active {
    border-right: 1px solid #eee;
    border-left: 1px solid #eee;
}

.text-right button.btn {
    float: left;
    background: #12b1ff;
    border-radius: 5px;
    color: #fff;
    padding: 12px 30px;
    font-size: 15px;
}

thead {
    background: #d2eefa;
    color: #6c757d;
}

.table {
	color: #6c757d;
}

th, td {
    border: 1px solid #fff;
}

table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc, table.dataTable thead .sorting_asc_disabled, table.dataTable thead .sorting_desc_disabled {
    background-position: center left !important;
}

table.dataTable thead th, table.dataTable thead td {
    padding: 15px 18px;
    border-bottom: 1px solid #fff;
    font-size: 14px;
}

table.dataTable tbody tr {
    background-color: #f6f6f6;
}

tr.data-row.even {
    background: #fcfcfc;
}

.table th, .table td {
    border-top: 1px solid #fff;
}

.page-item.active .page-link, .page-item .page-link {
    border-radius: 5px;
}

table.dataTable.no-footer {
    border-bottom: 0px solid;
}

table.dataTable tbody th, table.dataTable tbody td {
    padding: 15px !important;
    padding-bottom: 0 !important;
    font-size: 14px;
    font-weight: 700;
}

i.fa.fa-trash {
    color: #555555;
}

/**ELENCO-UTENTI**/

/*ELENCO-TICKET*/

/*APRI-TICKET*/

.main-panel.col-md-12 {
    margin-top: 0;
    margin-left: 0;
    max-width: 98% !important;
}

.main-panel.col-md-12 {
    padding: 2%;
}

.top-message p {
    background: #fff;
    width: 200px;
    text-align: center;
    padding: 15px;
    margin: 0px;
    margin-bottom: -10px;
    border-top: 5px solid #42b0fd;
}

.create-ticket .note-editor.note-frame.card {
    width: 100%;
    float: left;
}

.create-ticket a.btn.btn-outline-grey.text-uppercase {
    width: 100%;
    height: 50px;
    line-height: 35px;
}

/**APRI-TICKET**/

/*ELENCO-TICKET*/

.custom-datatable-col.pagination {
    display: grid !important;
    text-align: right !important;
}

ul.list-inline.filterEl {
    text-align: left;
}

a#idlink1 {
    background: url(../images/icone-tab-ezyline-07.png);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 15px;
    background-position-x: 15%;
    background-color: #f6f6f6;
}

a#idlink2 {
    background: url(../images/icone-tab-ezyline-09.png);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 15px;
    background-position-x: 15%;
    background-color: #f6f6f6;
}

a#idlink3 {
    background: url(../images/icone-tab-ezyline-08.png);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 15px;
    background-position-x: 15%;
    background-color: #f6f6f6;
}

a#idlink4 {
    background: url(../images/icone-tab-ezyline-04.png);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 15px;
    background-position-x: 15%;
    background-color: #f6f6f6;
}

a#idlink1.active {
    background: url(../images/icone-tab-ezyline-07.png) !important;
    background-repeat: no-repeat !important;
    background-position: left !important;
    background-size: 15px !important;
    background-position-x: 15% !important;
    background-color: #fff !important;
}

a#idlink2.active {
    background: url(../images/icone-tab-ezyline-09.png) !important;
    background-repeat: no-repeat !important;
    background-position: left !important;
    background-size: 15px !important;
    background-position-x: 15% !important;
    background-color: #fff !important;
}

a#idlink3.active {
    background: url(../images/icone-tab-ezyline-08.png) !important;
    background-repeat: no-repeat !important;
    background-position: left !important;
    background-size: 15px !important;
    background-position-x: 15% !important;
    background-color: #fff !important;
}

a#idlink4.active {
    background: url(../images/icone-tab-ezyline-04.png) !important;
    background-repeat: no-repeat !important;
    background-position: left !important;
    background-size: 15px !important;
    background-position-x: 15% !important;
    background-color: #fff !important;
}

.col-md-12.border-bottom-azzurro.text-md-right.mt-4 {
    margin-top: -60px !important;
    border-bottom: 0px !important;
    margin-left: -61px;
}

.list-inline-item:not(:last-child) {
    margin-right: -4px;
}

.btn-outline-azzurro i {
    color: #fff !important;
}

.search-form div#tickets_filter {
    text-align: left;
}

li.list-inline-item:last-child {
    display: block;
    margin-top: 35px;
    margin-left: 35px;
}

.status_ticket {
    background: #f6f6f6;
    border: 1px solid #eee;
    border-top: 5px solid #f6f6f6 !important;
    border-radius: 0px;
    padding: 15px 30px !important;
    width: 100%;
}

li.list-inline-item:nth-child(1){
    display: none;
    width: 0px;
}

li.list-inline-item:nth-child(1) a {
    display: none;
    width: 0px;
}

.list-inline-item {
    display: inline-block;
    max-width: 16vw;
    width: 100%;
}


.status_ticket.active {
    border-top: 5px solid #42b0fd !important;
    background: #fff !important;
    border-left: 1px solid #f6f6f6 !important;
    border-right: 1px solid #f6f6f6 !important;
    border-bottom: 1px solid #fff !important;
    padding: 15px 30px;
}

h5 a.badge {
    width: 100%;
    color: #fff !important;
    font-size: 14px;
    border-radius: 3px;
}

.btn-outline-azzurro {
    background: #12b1ff;
    border-radius: 5px;
    color: #fff;
    padding: 12px 30px;
    font-size: 15px;
}

#tickets_wrapper .btn-outline-azzurro {
    background: #12b1ff;
    border-radius: 3px;
    color: #fff;
    padding: 5px 30px;
    font-size: 12px;
    display: inline;
}

td a.btn.btn-outline-azzurro {
    padding: 5px 15px !important;
    font-size: 12px !important;
    display: inline-block !important;
    width: 40%;
    margin: 0 5px;
}

.btn-outline-azzurro:hover i {
    color: #12b1ff !important;
}

/**ELENCO-TICKET**/

/*SINGOLA-CHAT*/

span.badge {
    color: #fff;
}

table#tickets tbody {
    background: whitesmoke;
}

#accordion .bg-green.panel {
    background: #12b1ff;
    color: #fff;
}

#accordion .bg-green .panel-title {
    background: #12b1ff;
}

#accordion .bg-green .panel-title a {
    color: #fff;
}

#accordion .bg-blue .panel-title {
    background: #e2e6ea;
}

#accordion .bg-blue.panel {
    background: #e2e6ea;
}

#accordion span {
    font-weight: 100 !important;
    width: 100%;
    display: block;
    padding-top: 10px;
    opacity: 0.5;
}

.container.float-left.col-md-12.chatleft {
    max-width: 50%;
}

.container.float-left.col-md-12.chatconv {
    max-width: 85%;
}

.container.float-right.col-md-12.chatconv {
    max-width: 85%;
}

.chatconv div#accordion {
    width: 50%;
}

button.btn.btn-orange.text-uppercase.mt-2 {
    background: #12b1ff;
    color: #fff;
    padding: 10px 30px;
    font-size: 14px;
}

.border-bottom-azzurro {
    border-bottom: 0px solid #12b1ff !important;
}

.note-editor.note-frame.card {
    width: 80%;
    float: left;
}

.addfile {
    background: #6c757d;
    border-color: #6c757d;
}

.addfile span {
    text-transform: uppercase;
}

.addfile i {
    color: #fff !important;
}

.addfile:hover {
    color: #fff;
    background: #12b1ff;
}

/*CONFIGURAZIONI*/

.admin-page.config .horizontal-nav-links li:nth-child(1).active {
    margin-left: 0px !important;
}

.admin-page.config .horizontal-nav-links {
    margin-left: 0;
}

.flip {
    width: 20px !important;
    height: 20px !important;
}

.btn-light {
    background: #e2e2e2;
    padding: 15px;
}

/**CONFIGURAZIONI**/
@media (max-width: 1680px) {

    td a.btn.btn-outline-azzurro {
        width: auto;
    }
}

@media (max-width: 1440px) {

    .top-message {
    margin-top: 0px;
    }

    .main-panel {
        margin: 65px auto;
    }

    .status_ticket {
        padding: 5px 15px !important;
    }

    .col-md-12.border-bottom-azzurro.text-md-right.mt-4 {
        margin-top: -40px !important;
    }

    .ticektuser {
    right: 0;
    top: 65px;
    z-index: 9;
    background: #12b1ff;
    padding: 0 15px;
    }

    .ticektuser .text-dark, .ticektuser .text-dark strong {
        color: #fff !important;
    }
}

@media (min-width: 1225px) {
    .main-panel {
        margin: 10px 15px;
    }
}

@media (max-width: 991px) {
    .admin-page, .admin-page.dashboard-section {
        padding: 0;
        margin: 15px;
    }

    .list-inline-item {
        max-width: 100%;
    }

    .col-md-12.border-bottom-azzurro.text-md-right.mt-4 {
        margin-left: 0;
    }

    .note-editor.note-frame.card {
        width: 100%;
    }

    .container.float-left.col-md-12.chatleft, .container.float-right.col-md-12.chatconv, .chatconv div#accordion {
        max-width: 100%;
        width: 100%;
    }

    .horizontal-nav-links li {
        width: 100%;
        max-width: 100%;
        margin-top: 55px;
    
    }

    .ticektuser {
        top: 50px;
        padding: 0 5px;
        width: auto;
        left: auto;
    }
}