body.menu-on-top.desktop-detected 
{
    min-height: 100vh !important;
}

#extr-page-login body {
    min-height: 100vh !important;
}

#extr-page-login body #main {
    margin-top: 0px !important;
}

.smart-style-3 .header-dropdown-list > li > .dropdown-user {
    margin-top: 12px;
}

img.online {
    width:31px;
    margin-top:-5px;
}

.smart-style-3 img.online {
    width: 26px;
    margin-top: 0px;
}

.bootstrapWizard li {
    width: 33% !important;
}

.bootstrapWizard {
    padding-top: 10px;
}


.pager .next > button {
    float: right;
}

.pager .previous > button {
    float: left;
}

.pager {
    margin-right: 14px;
    margin-left: 14px;
}
.pager li > a {
    border-radius: 2px;
}

.btn-widget {
    box-shadow: none;
    background: transparent;
}

.dt-toolbar-footer>:first-child .dataTables_length {
    padding-right: 10px;
    padding-top: 1px;
    height: 30px !important;
}

.dt-toolbar-footer {
    padding: 4px 6px !important;
    /*height: 41px;*/
}

.dataTables_filter {
    width: 215px !important;
    padding-top: 1px;
}

#dt_basic_nested_filter {
    width: 205px !important;
}

@-moz-document url-prefix() { 
    #dt_basic_nested_filter {
        width: 215px !important;
    }
}

@supports (-ms-ime-align:auto) {
    .dataTables_filter {
        width: 220px !important;
    }

    #dt_basic_nested_filter {
        width: 220px !important;
    }
}

@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
    .dataTables_filter {
        width: 205px !important;
    }
}

.smart-form footer .btn {
    height: 30px;
}

.smart-form footer {
    padding: 5px 6px;
}

.smart-form footer .btn {
    margin: 0 0 0 5px;
}

.form-control {
    height: 30px;
    padding: 4px 12px;
}

.dataTables_filter .input-group-addon {
    height: 30px;
}

div.dataTables_paginate {
    margin-top: -1px;
}

div.dataTables_info {
    padding-top: 8px;
}

.dd3-content {
    padding: 7px 15px;
}

#nestable-menu {
    margin: 15px 15px 0px;
}

@media screen and (max-width: 1048px) {
    .dataTables_info {
        display: none;
    }
}

@media screen and (max-width: 1436px) {
    .info_divided {
        display: none;
    }
}

@media screen and (max-width: 1200px) {
    .length_divided {
        display: none;
    }
}


.btn-header > :first-child > a {
    padding: 1px;
}

.file-upload {
    position: absolute;
    top: 0;
    right: 0;
    padding: 0;
    font-size: 30px;
    cursor: pointer;
    opacity: 0;
}

.jvectormap-region {
    cursor: pointer;
}

.dd-title {
    font-size: 13px;
    color: #333;
    text-decoration: none;
    width: 50%;
}

.smart-style-5 .dd-title {
    color: #fff;
}

.dd-title > span {
    font-size: 13px;
    color: #777;
}

.smart-style-5 .dd-title > span {
    color: #fff;
}

.dd3-nopadding {
    padding: 6px 10px 8px 40px !important;
}



#extr-page-login {
    overflow-y: hidden;
    background: url(../img/mybg.png) #fff;
}

#extr-page-login > body > header {
    display:none;
}

#extr-page-login #main {
    position: static;
}

.lockscreen .logo + div {
    padding: 0 !important;
}

.alert {
    margin-bottom: 0;
}

.fixed-body tbody {
    display: block; 
    height: 333px
}

.fixed-body thead {
    display: block;
}

.table-checkbox i
{
    top: 0 !important;
    margin-top: -10px;
    margin-left: 3px;
}

.dropdown-menu {
    margin: 2px 0 0 !important;
}

.ui-widget {
    font-family: "Open Sans",Arial,Helvetica,Sans-Serif;
}

.ui-autocomplete {
    height: 150px !important;
    overflow-y: auto;
    z-index: 10000 !important;
}

.ui-menu .ui-menu-item a {
    line-height: 1.42857143;
    color: #555;
}

NewEditDelete:hover {

}




.ui-menu .ui-menu-item a:hover {
    font-weight: 400;
}

.dd-cursor {
    cursor: pointer;
}

.nested {
    padding: 4px 0px !important;
    background-color: #fff !important;
}

#dt_basic_nested_wrapper {
    padding-top: 5px;
}

.group-badge {
    padding-left: 10px;
}

.badge {
    margin-top: 2px;
}

.table-semibordered {
    border-top: none;
    border-left: none;
}

.inner-table-wrapper {
    height: 423px;
    border: 1px solid #ddd;
}

.inner-table-wrapper-half {
    height: 233px;
    border: 1px solid #ddd;
}

.inner-treegrid-wrapper {
    border: 1px solid #ddd;
    /*border-top: none !important;*/
}

.inner-tab {
    padding: 0 !important;
}

.inner-tab > .col {
    padding: 0 !important;
}

.inner-tab > .col > .col {
    padding: 0 !important;
}

.right-align {
    text-align: right;
}

.onoffswitch {
    width: 67px !important;
}

.smart-form .toggle i {
    position: relative;
    width: 67px;
    top: 0;
}

.smart-form .toggle input:checked + i::before {
    right: 52px;
}

.smart-form .toggle i::after {
    right: 13px;
}

.input-group-addon {
    padding: 5px 10px;
}

.input-with-toggle {
    padding: 0 10px 0 30px !important;
}

.icon-addon .fa, .icon-addon .glyphicon, .icon-addon.addon-md .fa, .icon-addon.addon-md .glyphicon 
{
    z-index: 10 !important;
    top: 0px !important;
}

.smart-form .toggle input {
    position: absolute;
    left: 0;
    z-index: -9999;
}

.col-12 {
    width: 100%;
}

.col-7 {
        width: 58.3%;
}

.img-container {
    border: 1px solid #BDBDBD;
    height: 398px;
    width: 99%;
}

.img-container img {
    margin: auto;
    display: block;
    width: 95%;
    height: 398px;
}

.img-container.state-error {
    background: #fff0f0 !important;
    border-color: #A90329 !important;
}

.smart-form .input input[disabled]
{
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

.smart-form .select select[disabled] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

.smart-form .select select[disabled] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
}

.smart-form .select select[disabled] + i {
    box-shadow: 0 0 0 9px #eee;
}

.smart-style-5 .smart-form .select select[disabled] {
    cursor: not-allowed;
    background: rgba(255,255,255,.2);
    border-color: rgba(255,255,255,.4);
    color: #FFF;
    opacity: 1;
}

.float-right {
    float: right !important;
}

.padding-right-3 {
    padding-right: 3px;
}

.smart-form .select select
{
    padding: 5px 30px !important;
}

.smart-form .select i {
    right: 0 !important;
    left: 15px !important;
}

.img-upload {
    position: absolute !important;
    width: 99% !important;
    height: 398px !important;
    top: 26px !important;
}

.img-user {
    height: 174px !important;
}

.smart-style-5 .smart-form .state-success select + i {
    background: none !important;
    box-shadow: none !important;
}

.smart-style-5 .smart-form .select i {
    background: none !important;
    box-shadow: none !important;
}

.smart-style-5 .smart-form .select i::before {
    border-bottom: 4px solid #404040 !important;
}

.smart-style-5 .smart-form .select i::before {
    border-bottom: 4px solid #fff !important;
}

.smart-style-5 .smart-form .select i::after {
    border-top: 4px solid #fff !important;
}

.smart-style-5 .nested {
    background: rgba(0, 0, 0, .43) !important;
}

.random-btn {
    height: 30px !important;
    float: right !important;
    margin: 27px 0 0 5px !important;
    padding: 0 22px !important;
    cursor: pointer !important;
    font: 300 15px/29px 'Open Sans', Helvetica, Arial, sans-serif !important;
}

.btn-inline-popup {
    padding: 5px 10px !important;
}

.no-margin {
    margin-top: -2px !important;
    margin-right: -5px !important;
}

.onoffswitch-switch {
    right: 50px !important;
}

.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px !important;
}

.input-with-button {
    padding: 0 0 0 10px !important;
}

.btn-inline-popup {
    background-color: #eee !important;
}

.smart-style-5 .btn-inline-popup {
    background: rgba(0, 0, 0, .5) !important;
    color: #fff !important;
    border-color: transparent !important;
}

.smart-form .select-multiple select {
    padding: 5px !important;
}

.smart-form .input .icon-prepend + input, .smart-form .textarea .icon-prepend + textarea {
    padding-left: 30px !important;
}

.smart-form .icon-prepend {
    border-right: none !important
}

.data-tables-form {
    height: 30px !important;
}

.table-treegrid tr:first-child td {
    font-size: 12px;
    font-weight: 700;
}

.table-treegrid > tbody > tr > td {
    border: none;
}

.table-treegrid tr:first-child .treegrid-expander, .treegrid-indent {
    cursor: pointer;
}

.table-treegrid tr:not(:first-child) .treegrid-expander {
    border-left: 4px solid #666;
    border-bottom: 4px solid #666;
    top: -4px;
    left: -23px;
}

.table-treegrid tr:not(:first-child) .first {
    margin-left: -24px;
}

.table-treegrid tr:not(:first-child) .first .glyphicon {
    top: 0px;
}

.table-treegrid tr:nth-child(odd) .treegrid-indent {
    left: -9px;
    border-right: 4px solid #666;
    top: -21px;
}

.table-treegrid tr:nth-child(odd) .first {
    margin-left: -16px;
}

.table-treegrid tr:nth-child(even) .treegrid-indent {
    border-right: 4px solid #666;
    top: -21px;
    left: -9px;
}

.table-treegrid tr:nth-child(even) .treegrid-middle {
    border-right: 4px solid #666;
    top: 4px;
    left: -14px;
}

.table-treegrid tr:nth-child(odd) .treegrid-expander {
    left: -15px;
}

.table-treegrid tr:nth-child(even) .treegrid-odd {
    border-left: 4px solid #666;
    top: -29px;
    left: -18px;
}

.table-treegrid tr:last-child .treegrid-middle {
    top: -5px;
}

.smart-style-5 .smart-form .input input[disabled]
{
    cursor: not-allowed;
    background: rgba(255,255,255,.2);
    border-color: rgba(255,255,255,.4);
    color: #FFF;
    opacity: 1;
}

.smart-style-5 .table-treegrid tr:not(:first-child) .treegrid-expander {
    border-color: #fff;
}

.smart-style-5 .table-treegrid tr:nth-child(odd) .treegrid-indent {
    border-color: #fff;
}

.smart-style-5 .table-treegrid tr:nth-child(even) .treegrid-indent {
    border-color: #fff;
}

.smart-style-5 .table-treegrid tr:nth-child(even) .treegrid-middle {
    border-color: #fff;
}

.smart-style-5 .table-treegrid tr:nth-child(even) .treegrid-odd {
    border-color: #fff;
}

.treegrid-expander.fa {
    left: 3px !important;
    font-size: 14px;
    top: -1px;
}

.treegrid-indent.fa {
    left: 3px !important;
    font-size: 14px;
    top: -1px;
}

body.smart-style-6 .table > tbody > tr > td, body.smart-style-6 .table > tbody > tr > th, body.smart-style-6 .table > tfoot > tr > td, body.smart-style-6 .table > tfoot > tr > th, body.smart-style-6 .table > thead > tr > td, body.smart-style-6 .table > thead > tr > th {
    padding: 8px;
}

body.smart-style-6 #content {
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
}

.smart-form .label {
    color: #BDBDBD;
}

#logo {
    margin-top: 7px;
}

#logo img
{
    width: 180px;
    margin-top: -1px !important;
}

.input-group {
    width: 100%;
}

#tbProducts td {
    white-space: nowrap;
}

#tbOthers td {
    white-space: nowrap;
}

#tbTributes td {
    white-space: nowrap;
}

@media (max-width: 979px) and (min-width: 768px) {
    #left-panel {
        left: 0px;
    }

    .hidden-menu #left-panel {
        left: -210px;
    }

    .hidden-menu #main {
        left: 0px;
        width: 99% !important;
    }

    .jarviswidget header h2 {
        width: 310px;
    }

    .widget-header-dynamic {
        width: 310px !important;
    }
}

@media (max-width: 767px) {
    .hidden-menu #left-panel {
        left: -210px;
    }

    .hidden-menu #main {
        left: 0px;
        width: 99% !important;
    }

    #hide-menu > :first-child > a {
        margin: 10px 0 0 !important;
        width: 30px !important;
        height: 30px !important;
        line-height: 24px !important;
    }

    .btn-header a {
        margin: 10px 0 0 !important;
        width: 30px !important;
        height: 24px !important;
        line-height: 1.42857143 !important;
    }

    .btn-header ul {
        margin-top: 8px !important;
    }

    .btn-header > li > ul > li > a {
        width: 158px !important;
        margin: 0 !important;
    }
    
    .jarviswidget header h2 {
        width: 310px;
    }

    .widget-header-dynamic {
        width: 310px !important;
    }

    .style-options .btn {
        width: 165px !important;
    }
}

@media (max-width: 610px)
{
    #configurations, #analysis, #notifications, #operations, #help, #fullscreen, #styleoptions {
        display: none;
    }
}

@media (max-width: 320px)
{
    .header-dropdown-list {
        display: none;
    }
}

@media only screen and (max-width: 679px) and (min-width: 0) {
    .jarviswidget header h2 {
        width: 230px;
    }

    .widget-header-dynamic {
        width: 230px !important;
    }
}

@media only screen and (max-width: 479px) and (min-width: 320px) {
    .jarviswidget header h2 {
        display: none; 
    }

    .widget-header-dynamic {
        display: none !important;
    }
}

@media only screen and (max-width: 320px)
{
    .jarviswidget header h2 {
        display: none;
    }

    .widget-header-dynamic {
        display: none !important;
    }
}

@media (max-width: 979px)
{
    .menu-on-top #main {
        margin-top: 69px!important;
    }

    .menu-on-top #left-panel {
        display: block; 
    }

    .menu-on-top aside#left-panel nav {
        height: auto !important;
        overflow: visible!important;
    }

    .menu-on-top aside#left-panel nav>ul>li {
        width: auto;
    }

    .menu-on-top aside#left-panel nav>ul>li>a {
        height: 68px;
        display: inline-block;
        padding: 10px 9px!important;
        border-bottom: none;
    }

    .menu-on-top aside#left-panel nav > ul > li > a > i {
        display: block!important;
    }

    .menu-on-top .menu-item-parent {
        white-space: nowrap; 
        overflow: hidden; 
        text-overflow: ellipsis; 
        text-align: center; 
        min-width: 50px; 
        max-width: 55px; 
        padding: 0;
    }

    .menu-on-top nav>ul>li>a:after {
        top: 76%!important;
        left: 46% !important;
        margin-top: 0px !important;
        font-size: 13px !important;
    }

    .menu-on-top aside#left-panel nav>ul li ul {
        position: absolute!important;
        top: inherit;
    }
    
    .menu-on-top nav ul ul {
        width: 200px !important;
    }
}

.smart-style-3 #logo img {
    width: 180px;
}

body.smart-style-6 #logo img {
    display: block;
}

body.smart-style-6 #logo-group>span#logo:before {
    display: none;
}

.col-11 {
    width: 91.6%;
}

.dropzone .dz-preview .dz-details {
    padding: 0px !important;
    padding-top: 2em !important;
}

.widget-header-dynamic { 
    margin-left: 10px;
    float: left;
    height: 100%;
    width: auto;
    display: inline-block;
    font-size: 14px;
    position: relative;
    line-height: 34px;
    font-weight: 400;
    letter-spacing: 0;
    font-family: "Open Sans",Arial,Helvetica,Sans-Serif;
}

.smart-form .state-error em {
    display: block;
    margin-top: 6px;
    padding: 0 1px;
    font-style: normal;
    font-size: 11px;
    line-height: 15px;
    color: #D56161;
}

.input-group-addon .onoffswitch, .input-group-addon .onoffswitch-label {
    margin-left: 10px !important;
}

.input-group-addon-search .onoffswitch, .input-group-addon-search .onoffswitch-label {
    margin-left: 40px !important;
}

#extr-page-error {
    overflow-y: hidden;
    background: url(../img/mybg.png) #fff;
}

#extr-page-error > body > header {
    display:none;
}

#extr-page-error #main {
    position: static;
    margin-left: 0px;
    margin-top: 0px;
}

#extr-page-error #left-panel {
    display: none;
}

#extr-page-error .page-footer {
    display: none;
}


#extr-page-fullscreen {
    overflow-y: hidden;
    background: url(../img/mybg.png) #fff;
}

#extr-page-fullscreen > body > header {
    display:none;
}

#extr-page-fullscreen #main {
    position: static;
    margin: 0;
}

#extr-page-fullscreen #left-panel {
    display: none;
}

#extr-page-fullscreen .page-footer {
    display: none;
}

.style-options
{
    padding: 5px 7px 7px;
    width: 180px;
}

.style-options .btn {
    font-size: 13px !important;
    line-height: 1.5 !important;
    border-radius: 3px !important;
    padding: 3px 7px !important;
    height: auto !important;
}

.smart-form .input input[readonly] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
    border-color: #BDBDBD;
}

.smart-form .input:hover input[readonly] {
    border-color: #5D98CC !important;
}

.smart-style-5 .smart-form .input input[readonly] {
    cursor: not-allowed;
    background: rgba(255,255,255,.2);
    border-color: rgba(255,255,255,.4);
    color: #FFF;
    opacity: 1;
}

.smart-style-5 .smart-form .input:hover input[readonly] {
    border-color: rgba(255,255,255,.4) !important;
}

.smart-form .textarea textarea[readonly] {
    cursor: not-allowed;
    background-color: #eee;
    opacity: 1;
    border-color: #BDBDBD;
}

.smart-form .textarea:hover textarea[readonly]
{
    border-color: #5D98CC !important;
}

.smart-style-5 .smart-form .textarea textarea[readonly] {
    cursor: not-allowed;
    background: rgba(255,255,255,.2);
    border-color: rgba(255,255,255,.4);
    color: #FFF;
    opacity: 1;
}

.smart-style-5 .smart-form .textarea:hover textarea[readonly] {
    border-color: rgba(255,255,255,.4) !important;
}

#activity b.badge {
    top: 3px !important;
    right: 0px !important;
    width: 20px !important;
}

.ajax-dropdown {
    left: -156px !important;
    height: 410px !important;
}

.ajax-notifications {
    margin-right: -10px !important;
    margin-left: -10px !important;
}

.notification-body {
    padding: 0px !important;
}

.ajax-dropdown > :first-child {
    margin-bottom: 0px !important;
}

.smart-style-5 .input-group-addon-search {
    background-color: rgba(0,0,0,0) !important;
}

.smart-style-5 .input-group-addon-search {
    border-color: rgba(0,0,0,.4) !important;
}

.discount.input-with-toggle {
    padding: 0 10px 0 10px !important;
}

.discount .toggle i {
    width: 40px !important;
}

.discount .toggle input:checked + i::before {
    right: 25px !important;
}

.discount .toggle i::after {
    right: 8px !important;
}

.discount.onoffswitch {
    width: 40px !important;
    margin-left: 22px !important;
}

.discount .toggle i:after {
    font-size: 13px !important;
}

.youtube-player {
    position: relative;
    padding-bottom: 56.23%;
    /* Use 75% for 4:3 videos */
    height: 0;
    overflow: hidden;
    max-width: 100%;
    background: #000;
    margin: 5px;
}
    
.youtube-player iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    background: transparent;
}
    
.youtube-player img {
    bottom: 0;
    display: block;
    left: 0;
    margin: auto;
    max-width: 100%;
    width: 100%;
    position: absolute;
    right: 0;
    top: 0;
    border: none;
    height: auto;
    cursor: pointer;
    -webkit-transition: .4s all;
    -moz-transition: .4s all;
    transition: .4s all;
}
    
.youtube-player img:hover {
    -webkit-filter: brightness(75%);
}
    
.youtube-player .play {
    height: 72px;
    width: 72px;
    left: 50%;
    top: 50%;
    margin-left: -36px;
    margin-top: -36px;
    position: absolute;
    background: url(../img/play.png) no-repeat;
    cursor: pointer;
}


@media (max-width: 1368px) and (min-width: 1138px) {
    .jarviswidget header .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100px;
        overflow: hidden;
    }

    .jarviswidget header .nav-tabs > li > a > i {
        display: none;
    }

    .smart-form .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        /*width: 100px;*/
        overflow: hidden;
    }
}

@media (max-width: 1137px) and (min-width: 783px) {
    .jarviswidget header .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 80px;
        overflow: hidden;
    }

    .jarviswidget header .nav-tabs > li > a > i {
        display: none;
    }

    .smart-form .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        /*width: 75px;*/
        overflow: hidden;
    }
}

@media (max-width: 782px) and (min-width: 624px) {
    .jarviswidget header .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 60px;
        overflow: hidden;
    }

    .jarviswidget header .nav-tabs > li > a > i {
        display: none;
    }

    .smart-form .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        /*width: 55px;*/
        overflow: hidden;
    }
}

@media (max-width: 623px) and (min-width: 482px) {
    .jarviswidget header .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 40px;
        overflow: hidden;
    }

    .jarviswidget header .nav-tabs > li > a > i {
        display: none;
    }

    .smart-form .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 35px;
        overflow: hidden;
    }
}

@media (max-width: 481px) and (min-width: 413px) {
    .jarviswidget header .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 20px;
        overflow: hidden;
    }

    .jarviswidget header .nav-tabs > li > a > i {
        display: none;
    }

    .smart-form .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 15px;
        overflow: hidden;
    }
}

@media screen and (max-width: 412px) {
    .jarviswidget header .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 10px;
        overflow: hidden;
    }

    .jarviswidget header .nav-tabs > li > a > i {
        display: none;
    }

    .smart-form .nav-tabs > li > a {
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 10px;
        overflow: hidden;
    }
}

.dropdown-backdrop {
    display:none;
}

.action-hide {
    display: none !important;
}

.svg {
    width: 12px;
    height: 13px;
    vertical-align: middle;
}

.svg path {
    fill: #333;
}

.smart-style-3 .svg path {
    fill: #4E361B;
}

.smart-style-5 .svg path {
    fill: #fff;
}

.dropzone.dz-clickable .dz-message * {
    margin-top: 7.4%;
}

.select-footer {
    position: fixed; 
    left: 0; 
    bottom: 0px; 
    width: 96%; 
    height: 50px;
    float:left;
}

.select-shutdown {
    position: fixed;
    bottom: 0px;
    height: 50px;
    float: right;
    right: 0px;
    width: 3%;
}

.advancedFilter > .ui-datepicker {
    width: 100%;
    padding: 1px;
    display: none;
    height: 100%;
}

.advancedFilter > .datepickerFilter {
    padding:5px; 
    box-sizing: border-box;
}

.advancedFilter > .ui-datepicker td .ui-state-active {
    color: #fff !important;
    background-color: #A90329 !important;
    text-shadow: 0 -1px 0 rgba(0,0,0,.25) !important;
    border-radius: 0 !important;
}

.advancedFilter > .ui-datepicker td .ui-state-highlight {
    border: 0;
    background: 0 0;
    margin-bottom: 0;
    padding: 5px;
    color: #333;
    background-color: #ebebeb;
    text-align: center;
    filter: none;
}

.unselectable{
  background-color: #ddd;
  cursor: not-allowed;
}



.smart-style-5 .widget-toolbar .btn-widget:hover {
    color: #FFD600 !important;
}

.col-lg-4-alt {
    width: 31.33333333% !important;
    padding-left: 13px !important;
    padding-right: 13px !important;
}

.headline-margin {
    margin-top: 9px !important;
    margin-bottom: 9px !important;
}

.dropdown-menu>li>a.disabled {
    color: #999 !important;
}

.dropdown-menu>li>a.disabled:hover {
    background-color: #fff !important;
}

.smart-style-3 .dropdown-menu>li>a.disabled:hover {
    background-color: #FDDFB3 !important;
}

.smart-style-5 .dropdown-menu>li>a.disabled:hover {
    background: rgba(0,0,0,.63) !important;
}

.dd3-content-tree {
    display: block !important;
    margin: 3px 0 !important;
    padding: 7px 15px !important;
    font-size: 13px !important;
    color: #333 !important;
    text-decoration: none !important;
    border: 1px solid #cfcfcf !important;
    background: #fbfbfb !important;
}

.action-hide {
display:none
}

.action-show {
display:table-cell
}

.modal-body {
    padding: 20px !important;
}

.modal-footer {
    padding: 20px !important;
}

.btn-modal {
    padding: 6px 12px !important;
}
.mycontent-left {
  border-right: 1px solid #CCC;
}
.mycontent-right {
  border-left: 1px solid #CCC;
}

    /*h2 {
      margin: 30px 0 0 0;
    }
    fieldset {
      border: 0;
    }
    label {
      display: block;
    }*/
 
    /* select with custom icons */
    .ui-selectmenu-menu .ui-menu.customicons .ui-menu-item-wrapper {
      padding: 0.5em 0 0.5em 3em;
    }
    .ui-selectmenu-menu .ui-menu.customicons .ui-menu-item .ui-icon {
      height: 24px;
      width: 24px;
      top: 0.1em;
    }
    .ui-icon.video {
      background: url("images/24-video-square.png") 0 0 no-repeat;
    }
    .ui-icon.podcast {
      background: url("images/24-podcast-square.png") 0 0 no-repeat;
    }
    .ui-icon.rss {
      background: url("images/24-rss-square.png") 0 0 no-repeat;
    }
 
    /* select with CSS avatar icons */
    option.avatar {
      background-repeat: no-repeat !important;
      padding-left: 20px;
    }
    .avatar .ui-icon {
      background-position: left top;
    }



    .ui-corner-bottom, .ui-corner-br, .ui-corner-right {
     -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomright: 0px;
     border-bottom-right-radius: 0px; 
}
    .ui-corner-bl, .ui-corner-bottom, .ui-corner-left {
    -webkit-border-bottom-left-radius: 0px; 
    -moz-border-radius-bottomleft: 0px;
    border-bottom-left-radius: 0px; 
}

    .ui-menu {
    width: 155px;
    padding: 2px;
    -webkit-box-shadow: 0 0px 0px rgba(30,30,100,.25);
    -moz-box-shadow: 0 0px 0px rgba(30,30,100,.25);
    box-shadow: 0 0px 0px rgba(30,30,100,.25);
    background: #fff;
    border: 1px solid rgba(0,0,0,.2);
    z-index: 1;
}

    .table tbody tr.highlight td {
  background-color: #3292E2!important;
}

.buttonsRight {
    float: right !important;
}

.cHideImportant {
    display: none !important;
}

.cHide {
    display: none;
}
.cShow {

}

.cCheckboxCenter {
  text-align: center; /* center checkbox horizontally */
  vertical-align: middle; /* center checkbox vertically */
}

.smart-style-5 select:not([multiple]) option {
    background:none;
    border-color:none;
    /* background: rgba(255,255,255,.2); */
    /* border-color: rgba(255,255,255,.4); */
    /* color: #FFF; */
    /* background: #000; */
    /* border-color: rgba(0,0,0,.4); */
    /* color: #FFF; */
}


.dd-item > button {
    margin: 7px 3px;
}

.labelTable {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
}



.TreeEmphighlight
{
    font-weight: bold;
}

.dayhighlight
{
    font-weight: bold;
    background:rgba(0,0,0,.2);
    -webkit-border-radius:0px;
    -moz-border-radius:0px;
    border-radius:0px;
}

.dayhighlight-end
{
    border-top-right-radius:4px;
    border-bottom-right-radius:4px;
}

.dayhighlight-start
{
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
}


.dd-list .dd-list {
    padding-left: 16px;
}

/*@media (max-width: 767px) {
    .table-responsive .dropdown-menu {
        position: static !important;
    }
}
@media (min-width: 768px) {
    .table-responsive {
        overflow: inherit;
    }
}*/

/*.table {
  overflow-x: visible !important;
  overflow-y: visible !important;
}*/

.btDetect {
    /*color : white;
    background-color: #3b9ff3;
    border-color: #3292E2;*/
    color : white !important;
    background-color: #3b9ff3 !important;
    border-color: #3292E2 !important;
}

.btEditAcessProfile {
    margin-top: -4px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
    padding-top: 1px !important;
    padding-bottom: 1px !important;
    color: #fff !important;
    background-color: #57889c !important;
    border-color: #4e7a8c !important;
}

/*table tbody tr.over {
  background-color: #ff00ff;
}

table tbody tr.over > .sorting_1 {
  background-color: #ff00ff;
}

table tbody td:hover {
background-color: #06c;
}

table tbody tr.over {
background-color: #06f;
}

table tbody tr.over {
background-color: #ff00FF;
}



table tbody tr.overCell {
  background-color: #ff00ff;
}

table tbody tr.overCell > .sorting_1 {
  background-color: #ff00ff;
}

table tbody td:hover {
background-color: #06c;
}

table tbody tr.overCell {
background-color: #06f;
}*/

.overCell {
background-color: #F39814 !important;
}

/*.dataTable tbody .odd {
    background: #f9f9f9 !important;
}

.dataTable tbody .even {
    background: #ffffff !important;
}*/

#nestablePlanosTrabalho .dd-item > button { 
    position: relative;
    cursor: pointer;
    float: left;
    width: 25px;
    height: 25px;
    margin: 25px 3px 7px 3px;
    line-height: 22px!important;
    padding: 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    border: 0;
    background: rgba(0,0,0,0);
    text-align: center;
    display: inline-block;
    font-family: FontAwesome;
    font-style: normal;
    font-size: 18px;
}

.classAnoAnterior:hover {
    color: #333;
    background-color: #ebebeb;
    border-color: #adadad;
    text-decoration: none
}

.classMes:hover {
    color: #fff;
    background: #428bca;
    text-shadow: 0 -1px 0 rgba(0,0,0,.25);
    border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
    -moz-border-radius: 0;
    border-radius: 0;
}

.classMes:hover a{
    color: #fff;
    background: #428bca;
    text-shadow: 0 -1px 0 rgba(0,0,0,.25);
    border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
    -moz-border-radius: 0;
    border-radius: 0;
}

.CellData.ui-selecting { background: #FECA40 !important; }
.CellData.ui-selected { background: #F39814 !important; color: black !important; }

.classtdText{
  text-overflow: ellipsis; 
  white-space: nowrap;
  overflow: hidden;
}

.progress.active .progress-bar{
    -webkit-animation:progress-bar-stripes 0.3s linear infinite;
    -o-animation:progress-bar-stripes 0.3s linear infinite;
    animation:progress-bar-stripes 0.3s linear infinite
}

/*.progress {
    margin: 15px;
}

.progress .progress-bar.active {
    font-weight: 700;
    animation: progress-bar-stripes .5s linear infinite;
}

.dotdotdot:after {
    font-weight: 300;
    content: '...';
    display: inline-block;
    width: 20px;
    text-align: left;
    animation: dotdotdot 1.5s linear infinite;
}

@keyframes dotdotdot {
  0%   { content: '...'; }
  25% { content: ''; }
  50% { content: '.'; }
  75% { content: '..'; }
}*/


/*.progress-bar-value {
  width: 100%;
  height: 100%;
  background-color: #57889c;
  animation: indeterminateAnimation 10s infinite linear;
  transform-origin: 0% 50%;
}

@keyframes indeterminateAnimation {
  0% {
    transform:  translateX(0) scaleX(0);
  }
  40% {
    transform:  translateX(0) scaleX(0.4);
  }
  100% {
    transform:  translateX(100%) scaleX(0.5);
  }
}*/



/*@-webkit-keyframes greenglow {
    from {
        left:-120px;
    }
    to {
        left:100%;
    }
}
@-moz-keyframes greenglow {
    from {
        left:-120px;
    }
    to {
        left:100%;
    }
}
@-o-keyframes greenglow {
    from {
        left:-120px;
    }
    to {
        left:100%;
    }
}
@keyframes greenglow {
    from {
        left:-120px;
    }
    to {
        left:100%;
    }
}
.loader8 {
    width:50px;
    height:16px;
    border:1px solid #bbb;
    border-radius:0px;
    position:relative;
    overflow:hidden;
    background: #E6E6E6;
    margin:5px;
}

.loader8:after {
    content: " ";
    display:block;
    width:120px;
    top:-50%;
    height:250%;
    position:absolute;
    animation: greenglow 3s linear infinite;
    -webkit-animation: greenglow 3s linear infinite;
    z-index:2;
    background: #1CAE30;
}*/



/* FULLSCREEN */
.modal-fullscreen .modal-dialog {
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  max-width:none;          /* evita limite do Bootstrap */
}
.modal-fullscreen .modal-content {
  height:100%;
  border:0;
  border-radius:0;
  display:flex;
  flex-direction:column;
}
.modal-fullscreen .modal-body { flex:1; padding:0; }

/* layout interno */
.at-body { flex:1; display:flex; flex-direction:column; gap:16px; background:#f3f4f6; }
.at-center {
  flex:1; display:flex; flex-direction:column;
  justify-content:center; align-items:center; gap:10px; text-align:center;
}

/* TAMANHOS RESPONSIVOS (baseado no viewport) */
.at-time { font-weight:700; letter-spacing:2px;
  font-size: 12vw;      /* relógio grande e responsivo */
  line-height: 1;
}
.at-date { color:#6b7280; text-transform:capitalize;
  font-size: 2.2vw;     /* responsivo */
}

/* fallback para ecrãs muito pequenos/grandes */
@media (max-width: 768px){
  .at-time { font-size: 16vw; }
  .at-date { font-size: 4vw; }
}
@media (min-width: 1600px){
  .at-time { font-size: 180px; }
  .at-date { font-size: 34px; }
}

.at-status { margin-top:6px; color:#6b7280; }
.at-actions { margin-top:12px; }

/* feed */
.at-feed { flex:1; overflow:auto; padding:12px; display:flex; flex-direction:column-reverse; gap:12px; }
.at-card { display:flex; align-items:center; gap:14px; }

/* relógio */
.at-time { font-size: 96px; }
.at-date { font-size: 34px; }

/* estado (bolinha) */
.dot{
  display:inline-block;
  width:10px;
  height:10px;
  border-radius:50%;
  margin-left:6px;
  vertical-align:middle;
  background:#9ca3af; /* default (muted) */
}
.dot.green{ background:#16a34a; }  /* verde  */
.dot.red  { background:#dc2626; }  /* vermelho */
.dot.amber{ background:#f59e0b; }  /* amarelo */
.dot.muted{ background:#9ca3af; }  /* cinza   */

/* opcional: cor do texto do estado */
.at-status { margin-top:10px; color:#6b7280; }
.at-status.active  { color:#16a34a; }
.at-status.stopped { color:#dc2626; }

#access-terminal.modal {
    padding-right: 0 !important;
    padding-bottom: 0 !important;
}

/* ===== Cartão centrado de marcação ===== */
.at-body { position: relative; }

.at-toast {
  position: absolute;
  left: 50%;
  top: 56%;
  transform: translate(-50%, -50%);
  pointer-events: none;           /* não bloqueia cliques na modal */
  width: min(760px, 90vw);
  max-width: 760px;
  display: none;                  /* aparece por JS */
  z-index: 5;
}

.at-card-center {
  display: flex;
  gap: 16px;
  padding: 18px 22px;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0,0,0,.10);
  border: 2px solid transparent;
  align-items: center;
}

.at-card-center.ok   { border-color: #28a745; box-shadow: 0 10px 30px rgba(40,167,69,.15); }
.at-card-center.bad  { border-color: #dc3545; box-shadow: 0 10px 30px rgba(220,53,69,.15); }

.at-card-center .pic {
  width: 72px; height: 72px; border-radius: 10px; overflow: hidden;
  flex: none; background: #f3f5f7; display:flex; align-items:center; justify-content:center;
}
.at-card-center .pic img { width: 100%; height: 100%; object-fit: cover; }

.at-card-center .info { flex: 1 1 auto; min-width: 0; }
.at-card-center .top  { display:flex; align-items:center; gap:10px; margin-bottom:4px; }

.at-badge {
  font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 999px;
  border: 1px solid currentColor; white-space: nowrap;
}
.at-badge.ok  { color:#155724; background:#e6ffed; border-color:#28a745; }
.at-badge.bad { color:#721c24; background:#ffecec; border-color:#dc3545; }

.at-title {
  font-weight: 700; font-size: 18px; line-height: 1.2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.at-sub {
  color:#6c757d; font-size: 13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* animação simples */
.at-toast.showing { animation: atToastIn .18s ease-out both; }
.at-toast.hiding  { animation: atToastOut .18s ease-in  both;  }

@keyframes atToastIn  { from { opacity:0; transform: translate(-50%, -54%); } to { opacity:1; transform: translate(-50%, -50%);} }
@keyframes atToastOut { from { opacity:1; transform: translate(-50%, -50%);} to { opacity:0; transform: translate(-50%, -46%);} }

th.th-weekend {
    background-color: #f0f8ff; /* vermelho claro */
    color: rgb(0,0,0);
}

td.td-weekend {
    background-color: #f0f8ff !important; /* azul clarinho */
}

.img-container {
    position: relative;
    display: inline-block;
}

.btn-delete-image {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    border-radius: 4px;
    background-color: #c3c3c3;
    color: black;
    cursor: pointer;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-delete-image:hover {
    background-color: #c3c3c3;
}


/* Melhorias na guia oval */
#face-guide {
    transition: all 0.3s ease;
    pointer-events: none;
}

/* Animação de pulso quando deteta ecrã */
@keyframes screenPulse {
    0%, 100% { box-shadow: 0 0 30px #ff4400; }
    50% { box-shadow: 0 0 50px #ff4400, inset 0 0 30px rgba(255,68,0,0.3); }
}

#face-guide.screen-detected {
    animation: screenPulse 1s infinite;
    border-color: #ff4400 !important;
}

/* Melhoria no debug */
#face-debug {
    line-height: 1.5;
}

#face-debug div {
    margin: 2px 0;
}

#dt_basic_overflow {
    overflow-y: auto !important;
    max-height: calc(100vh - 250px);
}

#dt_basic thead th {
    position: sticky;
    top: 0;
    z-index: 10;
    background-color: #fafafa;
}

#dt_basic thead th.th-weekend {
    background-color: #f0f8ff;
}




/* ========================================================================
   Range picker inline (jQuery UI datepicker em modo range com 2 meses)
   Usado em: Clockings.cshtml, Corrections.cshtml, ...
   ======================================================================== */

#filter1 section.col-md-12 {
    text-align: center;
}

/* Caixa exterior: calendário + texto */
#rangePickerBox {
    display: block;
    width: 100%;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 8px 6px 10px 6px;
    box-sizing: border-box;
    text-align: left;
}

/* Container onde o jQuery UI datepicker renderiza */
#inlineRange {
    display: block;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
}

/* Datepicker base */
#inlineRange .ui-datepicker {
    width: 100% !important;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

/* Forçar 2 meses lado a lado e ocupar a largura toda */
#inlineRange .ui-datepicker-multi {
    width: 100% !important;
    display: flex !important;
    align-items: flex-start;
}

/* Cada mês ocupa metade da caixa */
#inlineRange .ui-datepicker-group,
#inlineRange .ui-datepicker-multi-2 .ui-datepicker-group {
    float: none !important;
    width: 50% !important;
    padding: 0 6px;
    box-sizing: border-box;
}

/* Separador entre os meses */
#inlineRange .ui-datepicker-group-first {
    border-right: 1px solid #eee;
    padding-right: 8px;
}

#inlineRange .ui-datepicker-group-last {
    padding-left: 8px;
}

/* Não é necessário com flex */
#inlineRange .ui-datepicker-row-break {
    display: none;
    clear: none;
}

/* Cabeçalho do mês */
#inlineRange .ui-datepicker-header {
    background: transparent;
    border: none;
    font-weight: 500;
    padding: 4px 0 8px 0;
    margin: 0;
}

#inlineRange .ui-datepicker-title {
    font-size: 13px;
    color: #333;
    text-align: center;
}

/* Setas anterior / seguinte */
#inlineRange .ui-datepicker-prev,
#inlineRange .ui-datepicker-next {
    top: 4px;
    cursor: pointer;
}

/* Tabela dos dias */
#inlineRange .ui-datepicker table {
    width: 100%;
    table-layout: fixed;
    margin: 0;
    border-collapse: collapse;
}

#inlineRange th {
    padding: 6px 0;
    text-align: center;
    font-size: 12px;
    color: #666;
    font-weight: 600;
}

#inlineRange td {
    width: 14.285%;
    padding: 1px;
    text-align: center;
}

#inlineRange td a,
#inlineRange td span {
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    padding: 6px 0 !important;
    border: none !important;
    background: transparent;
    border-radius: 6px;
    font-size: 12px;
    color: #333;
    text-decoration: none;
}

#inlineRange td a:hover {
    background: #f0f0f0 !important;
}

/* Dias dentro do intervalo */
#inlineRange .ui-state-highlight-range a,
#inlineRange .ui-state-highlight-range span {
    background: #e6f1fb !important;
    color: #185fa5 !important;
    border-radius: 0 !important;
}

/* Início/fim do intervalo */
#inlineRange .ui-state-range-start a,
#inlineRange .ui-state-range-start span,
#inlineRange .ui-state-range-end a,
#inlineRange .ui-state-range-end span,
#inlineRange .ui-datepicker-current-day a,
#inlineRange .ui-datepicker-current-day span,
#inlineRange .ui-state-active {
    background: #185fa5 !important;
    color: #fff !important;
    border-radius: 6px !important;
    font-weight: 500;
}

/* Dia selecionado mantém azul escuro mesmo com hover */
#inlineRange .ui-state-range-start a:hover,
#inlineRange .ui-state-range-start span:hover,
#inlineRange .ui-state-range-end a:hover,
#inlineRange .ui-state-range-end span:hover,
#inlineRange .ui-datepicker-current-day a:hover,
#inlineRange .ui-datepicker-current-day span:hover,
#inlineRange td a.ui-state-active:hover {
    background: #185fa5 !important;
    color: #fff !important;
    border-radius: 6px !important;
}

/* Texto do intervalo dentro da borda */
#rangeLabelBox {
    margin-top: 8px;
    text-align: center;
    font-weight: bold;
}

#rangeLabel {
    display: block;
    margin-left: 0 !important;
}

/* ===== Cantos arredondados nos painéis (jarviswidget) ===== */
:root { --tr-radius: 8px; }

.jarviswidget > header {
    border-radius: var(--tr-radius) var(--tr-radius) 0 0;
}

.jarviswidget > div {
    border-radius: 0 0 var(--tr-radius) var(--tr-radius);
}

/* ===== Árvore de funcionários (Nestable) ===== */
.dd-handle,
.dd3-content {
    border-radius: 6px;
}

/* Botões pequenos no header dos painéis (filtro, olho, ajuda...) */
.jarviswidget > header .btn-widget {
    border-radius: 5px;
}


    #calendar td.day.dayhighlight .day-content {
        background: rgba(47,120,212,.20) !important;
        box-shadow: inset 0 0 0 1px rgba(47,120,212,.55) !important;
        color: #1f2d3d !important;
    }
    #calendar td.day.dayhighlight-start .day-content,
    #calendar td.day.dayhighlight-end .day-content {
        box-shadow: inset 0 0 0 2px rgba(47,120,212,.85) !important;
    }

    .tr6-detail-chip {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 5px;          /* mesmo arredondado dos dias */
    vertical-align: -2px;
    margin-right: 6px;
    flex: none;
}
 
#detail p {
    line-height: 1.9;            /* respirar um pouco entre linhas (opcional) */
}

    /* ===== 1) Geometria uniforme em TODAS as células (com e sem cor) ===== */
#calendar table.month td.day .day-content {
    margin: 2px;
    border-radius: 6px;
}

/*/* ===== 2) Cabeçalhos (Se Te Qu...) com a mesma caixa dos dias ===== */
#calendar table.month td.day-header {
    padding: 4px 0;
    border-radius: 6px;
}*/

/* ===== 3) Cinzento do drag por cima do pastel (classes do plugin) ===== */
#calendar table.month td.day.range .day-content {
    background: rgba(0, 0, 0, .22) !important;
    box-shadow: none !important;
}

#calendar table.month td.day.range-start .day-content,
#calendar table.month td.day.range-end .day-content {
    background: rgba(0, 0, 0, .32) !important;
}

/* ===== 4) Azul da seleção final, uniforme e a ganhar ao inline ===== */
#calendar td.day.dayhighlight .day-content {
    background: rgba(47, 120, 212, .20) !important;
    box-shadow: inset 0 0 0 1px rgba(47, 120, 212, .55) !important;
    color: #1f2d3d !important;
}

#calendar td.day.dayhighlight-start .day-content,
#calendar td.day.dayhighlight-end .day-content {
    box-shadow: inset 0 0 0 2px rgba(47, 120, 212, .85) !important;
}


    .tr6-weekend-strip {
    position: absolute;
    z-index: 0;
    border-radius: 8px;       /* arredonda só nas pontas da faixa, como querias */
    pointer-events: none;     /* cliques e hover passam para os dias */
}

#calendar .month-container table.month {
    position: relative;
    z-index: 1;               /* dias e títulos por cima da faixa */
}

/* respiro entre meses - resolve o "muito em cima uns dos outros" */
#calendar .month-container {
    margin-bottom: 14px;
}

    /* grelha de meses: linhas dimensionadas pelo mês mais alto, com gap a sério */
#calendar .months-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 18px 12px;
}

#calendar .month-container {
    height: auto !important;    /* mata o height:200px do plugin */
    width: auto !important;     /* o grid trata da largura, nao o col-xs-4 */
    float: none !important;
    margin-bottom: 0;           /* o gap do grid substitui o nosso margin */
}

/* === seleção em curso (drag) - tem de ganhar ao pastel inline === */
#calendar td.range .day-content,
#calendar td.day-selected .day-content {
    background: rgba(0, 0, 0, .22) !important;
    box-shadow: none !important;
    color: #1f2d3d !important;
}

#calendar td.range-start .day-content,
#calendar td.range-end .day-content {
    background: rgba(0, 0, 0, .32) !important;
}

/* === seleção confirmada (azul) === */
#calendar td.day.dayhighlight .day-content {
    background: rgba(47, 120, 212, .20) !important;
    box-shadow: inset 0 0 0 1px rgba(47, 120, 212, .55) !important;
    color: #1f2d3d !important;
}

#calendar td.day.dayhighlight-start .day-content,
#calendar td.day.dayhighlight-end .day-content {
    box-shadow: inset 0 0 0 2px rgba(47, 120, 212, .85) !important;
}

.calendar-context-menu {
    z-index: 1080;                      /* acima dos popovers do tooltip (1060) */
    background: #ffffff;
    border: 1px solid #e3e7eb;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .15);
    overflow: hidden;                   /* recorta os itens aos cantos redondos */
}

.calendar-context-menu .item,
.calendar-context-menu .item a {
    background: #ffffff;
    display: block;
    padding: 6px 14px;
    color: #1f2d3d;
    white-space: nowrap;
    cursor: pointer;
}

.calendar-context-menu .item:hover,
.calendar-context-menu .item:hover a {
    background: #f2f5f8;
}

.tr6-tooltip-scroll {
    max-height: 280px;
    overflow-y: auto;
    padding-right: 4px;
}

.tr6-tooltip-more {
    text-align: center;
    color: #6b7785;
    font-weight: 600;
    padding: 4px 0 2px;
}

/*.label-AccessClocking {
    background-color: #99CC00;
}

.label-PointClocking {
    background-color: #0070C0;
}

.label-IncidentsClocking {
    background-color: #FF00FF;
}

.label-AutomaticClocking {
    background-color: #FF9900;
}

.label-InvalidClocking {
    background-color: #FF0000;
}

.label-RegistadaClocking {
    background-color: #A6A6A6;
}

.label-ENT {
    background-color: #0070C0;
}

.label-SAI {
    background-color: #0070C0;
}

.label-DES {
    background-color: #A6A6A6;
}

.label-INC {
    background-color: #FF9900;
}

 
.label-odd {
    background-color: #0070C0;
}

.label-even {
    background-color: #FF0000;
}

.label-f {
    background-color: #99CC00;
}



.label-removal {
    background-color: #92a2a8;
}

.label-supply {
    background-color: #ac5287;
}

.label-cash {
    background-color: #356e35;
}

.label-close-cash {
    background-color: #D6A848;
}

.label-black {
    background-color: #000;
}

.label-order {
    background-color: #4387bf;
}

.label-delete {
    background-color: #fb3c4a;
}

.label-credit {
    background-color: #ac5287;
}

.label-terror {
    background-color: #CB33CA;
}


.smart-style-6 .label-warning {
    color: #fff !important;
}

.label-success {
    background-color:#99cc00 !important

}

.label-IMPARES {
    background-color: #FF0000;
}

.label-PARES {
    background-color: #99CC00;
}

.label-FERIAS {
    background-color: #99CC00;
}

.labelTable.label-Pending {
    background-color: #f0ad4e;  
    color: white;
}

.labelTable.label-Approved {
    background-color: #5cb85c;  
    color: white;
}

.labelTable.label-Rejected {
    background-color: #d9534f;   
    color: white;
}

.labelTable.label-Disabled {
    background-color: #777;      
    color: white;
}*/

/* ===== Labels pastel (formula tr6: fundo 80% branco, texto com contraste 4.5:1) ===== */
.label-AccessClocking    { background-color: #EBF5CC; color: #567522 !important; box-shadow: inset 0 0 0 1px #C7E373; }
.label-PointClocking     { background-color: #CCE2F2; color: #0663A6 !important; box-shadow: inset 0 0 0 1px #73B0DC; }
.label-IncidentsClocking { background-color: #FFCCFF; color: #A512B1 !important; box-shadow: inset 0 0 0 1px #FF73FF; }
.label-AutomaticClocking { background-color: #FFEBCC; color: #8F631E !important; box-shadow: inset 0 0 0 1px #FFC773; }
.label-InvalidClocking   { background-color: #FFCCCC; color: #BC0E12 !important; box-shadow: inset 0 0 0 1px #FF7373; }
.label-RegistadaClocking { background-color: #E1E2E4; color: #5C6470 !important; box-shadow: inset 0 0 0 1px #ABAFB5; }

.label-ENT { background-color: #CCE2F2; color: #0663A6 !important; box-shadow: inset 0 0 0 1px #73B0DC; }
.label-SAI { background-color: #CCE2F2; color: #0663A6 !important; box-shadow: inset 0 0 0 1px #73B0DC; }
.label-DES { background-color: #E1E2E4; color: #5C6470 !important; box-shadow: inset 0 0 0 1px #ABAFB5; }
.label-INC { background-color: #FFEBCC; color: #8F631E !important; box-shadow: inset 0 0 0 1px #FFC773; }

.label-odd  { background-color: #CCE2F2; color: #0663A6 !important; box-shadow: inset 0 0 0 1px #73B0DC; }
.label-even { background-color: #FFCCCC; color: #BC0E12 !important; box-shadow: inset 0 0 0 1px #FF7373; }
.label-f    { background-color: #EBF5CC; color: #567522 !important; box-shadow: inset 0 0 0 1px #C7E373; }

.label-removal    { background-color: #E9ECEE; color: #586872 !important; box-shadow: inset 0 0 0 1px #C3CCCF; }
.label-supply     { background-color: #EEDCE7; color: #904B78 !important; box-shadow: inset 0 0 0 1px #D1A0BD; }
.label-cash       { background-color: #D7E2D7; color: #356E35 !important; box-shadow: inset 0 0 0 1px #90AF90; }
.label-close-cash { background-color: #F7EEDA; color: #7A6A42 !important; box-shadow: inset 0 0 0 1px #E8CF9A; }
.label-black      { background-color: #CCCCCC; color: #000000 !important; box-shadow: inset 0 0 0 1px #737373; }
.label-order      { background-color: #D9E7F2; color: #366892 !important; box-shadow: inset 0 0 0 1px #98BDDC; }
.label-delete     { background-color: #FED8DB; color: #AE3745 !important; box-shadow: inset 0 0 0 1px #FD949B; }
.label-credit     { background-color: #EEDCE7; color: #904B78 !important; box-shadow: inset 0 0 0 1px #D1A0BD; }
.label-terror     { background-color: #F5D6F4; color: #A032A7 !important; box-shadow: inset 0 0 0 1px #E28FE2; }

.smart-style-6 .label-warning { color: #fff !important; }
.label-success { background-color: #DEF1DE !important; color: #3E724C !important; box-shadow: inset 0 0 0 1px #A5D8A5; }

.label-IMPARES { background-color: #FFCCCC; color: #BC0E12 !important; box-shadow: inset 0 0 0 1px #FF7373; }
.label-PARES   { background-color: #EBF5CC; color: #567522 !important; box-shadow: inset 0 0 0 1px #C7E373; }
.label-FERIAS  { background-color: #EBF5CC; color: #567522 !important; box-shadow: inset 0 0 0 1px #C7E373; }

.labelTable.label-Pending  { background-color: #FCEFDC; color: #7D6745 !important; box-shadow: inset 0 0 0 1px #F7D29E; }
.labelTable.label-Approved { background-color: #DEF1DE; color: #3E724C !important; box-shadow: inset 0 0 0 1px #A5D8A5; }
.labelTable.label-Rejected { background-color: #F7DDDC; color: #A1484A !important; box-shadow: inset 0 0 0 1px #EAA09E; }
.labelTable.label-Disabled { background-color: #E4E4E4; color: #616468 !important; box-shadow: inset 0 0 0 1px #B4B4B4; }


.modal-content {
    border-radius: 10px;
}

.modal-header {
    border-radius: 10px 10px 0 0;
}

.modal-footer {
    border-radius: 0 0 10px 10px;
}

/* ===== Dropdowns (menu do olho, Ações, e todos os .dropdown-menu) ===== */
.dropdown-menu {
    border-radius: 8px;
    overflow: hidden;               /* recorta o hover dos itens aos cantos */
    box-shadow: 0 6px 18px rgba(0, 0, 0, .15);
    border: 1px solid #e3e7eb;
}

/* ===== Menu de navegação do topo (Resultados, etc.) ===== */
nav ul ul,
.header-dropdown-list .dropdown-menu {
    border-radius: 0 0 8px 8px;     /* so em baixo - em cima cola ao botao do menu */
    overflow: hidden;
}

body.menu-on-top nav ul ul {
    border-radius: 0 0 8px 8px;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}

body.menu-on-top nav ul ul li:last-child,
body.menu-on-top nav ul ul li:last-child a {
    border-radius: 0 0 8px 8px;
}

body.menu-on-top nav ul ul {
    border-radius: 0 8px 8px 8px;   /* cima-esq reto (cola ao botao), resto redondo */
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}

body.menu-on-top nav ul ul li:last-child,
body.menu-on-top nav ul ul li:last-child a {
    border-radius: 0 0 8px 8px;
}

body.menu-on-top nav > ul > li > a {
    border-radius: 8px 8px 0 0;
}

body.menu-on-top nav > ul > li {
    border-radius: 8px 8px 0 0;
    overflow: hidden;
}

/* ===== Formularios arredondados ===== */
.form-control,
input[type="text"].form-control,
select.form-control,
textarea.form-control {
    border-radius: 6px;
}

/* botoes */
.btn {
    border-radius: 6px;
}

/* separadores (Endereco / Contatos / ...) */
.nav-tabs > li > a {
    border-radius: 8px 8px 0 0;
}

/* campos arredondados - forcar por cima do flatten do tema */
.form-control,
input.form-control,
select.form-control,
textarea.form-control {
    border-radius: 6px !important;
}

.btn {
    border-radius: 6px !important;
}

/* repor os cantos interiores retos nos grupos colados
   (o !important acima parte a gestao do Bootstrap, repomos aqui) */
.input-group .form-control:not(:last-child),
.input-group-btn:not(:last-child) > .btn {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.input-group .form-control:not(:first-child),
.input-group-btn:not(:first-child) > .btn {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.btn-group > .btn:not(:first-child) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}


/* campos dos smart-forms (TextBoxFor sem classe, como no EmployeesCreate) */
.smart-form .input input,
.smart-form .select select,
.smart-form .textarea textarea,
.smart-form input[type="text"],
.smart-form input[type="password"],
.smart-form input[type="email"],
.smart-form input[type="number"] {
    border-radius: 6px !important;
}

.smart-form .select i {
    border-radius: 0 6px 6px 0;   /* acompanha o canto direito do select */
}



input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    border: 1px solid #b9c2cb;
    border-radius: 4px;
    background: #fff;
    vertical-align: -2px;
    cursor: pointer;
}

input[type="checkbox"]:checked {
    background: #3276b1;
    border-color: #3276b1;
}

input[type="checkbox"]:checked::after {
    content: "";
    display: block;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    margin: 1px 0 0 4px;
    transform: rotate(45deg);
}

.ui-datepicker {
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .15);
    border: 1px solid #e3e7eb;
}

.ui-datepicker .ui-datepicker-header {
    border-radius: 6px 6px 0 0;
}

.ui-datepicker td a,
.ui-datepicker td span {
    border-radius: 5px;
    text-align: center;
}

/* ===== Arredondamento opt-in: so tabelas com a classe tr6-rounded ===== */
table.tr6-rounded {
    border-collapse: separate !important;
    border-spacing: 0;
    border-radius: 8px;
}

table.tr6-rounded thead tr:first-child > th:first-child { border-top-left-radius: 8px; }
table.tr6-rounded thead tr:first-child > th:last-child { border-top-right-radius: 8px; }
table.tr6-rounded tbody tr:last-child > td:first-child { border-bottom-left-radius: 8px; }
table.tr6-rounded tbody tr:last-child > td:last-child { border-bottom-right-radius: 8px; }

/* DataTables com scroll: a moldura redonda vai ao contentor */
div.dt-scroll:has(table.tr6-rounded),
.dataTables_scroll:has(table.tr6-rounded) {
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #ddd;
}

div.dt-scroll:has(table.tr6-rounded) table,
.dataTables_scroll:has(table.tr6-rounded) table {
    border: 0 !important;
}

div:has(> table.tr6-rounded) {
    border-radius: 8px;
    overflow: hidden;
}

.smart-form .checkbox i,
label.checkbox i,
label.toggle i {
    border-radius: 5px !important;
}

/* ===== Select com popup estilizavel (Chrome/Edge 135+) =====
   Browsers sem suporte ignoram e mantem a lista nativa - sem estragos.
   Exclui selects com size/multiple (caixas de lista, ex. Planos de Acesso). */
select:not([size]):not([multiple]),
.smart-form .select select,
select:not([size]):not([multiple])::picker(select) {
    appearance: base-select !important;
}

select::picker(select) {
    border-radius: 8px;
    border: 1px solid #e3e7eb;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .15);
    padding: 4px;
}

select:not([size]):not([multiple]) option {
    padding: 5px 10px;
    border-radius: 5px;
}

select:not([size]):not([multiple]) option:hover {
    background: #eef3f8;
}

select:not([size]):not([multiple]) option:checked {
    background: #3276b1;
    color: #fff;
}

/* sem o visto (checkmark) no item selecionado */
select option::checkmark {
    display: none;
}

/* ===== Caixas de lista (size): 3 colunas iguais com scroll ===== */
select[size].form-control {
    height: 210px !important;
    overflow-y: auto;
    border-radius: 6px;
    padding: 4px;
}

select[size].form-control option {
    padding: 4px 8px;
    border-radius: 4px;
}

.CodeMirror {
    border-radius: 6px;
    border: 1px solid #c9d1d9;
}

.CodeMirror-lines {
    padding: 6px 4px;
}

.smart-form .textarea {
    border-radius: 6px;
    overflow: hidden;    /* recorta o CodeMirror interior aos cantos */
}

div.CodeMirror {
    border-radius: 6px !important;
}

/* foto do funcionario: moldura e imagem arredondadas */
.smart-form .img-container {
    border-radius: 8px;
    overflow: hidden;        /* recorta a img e o botao de eliminar aos cantos */
}

.smart-form .img-container img {
    border-radius: 8px;
}

.smart-form .img-container {
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #e3e7eb;
}

.smart-form .select select {
    line-height: 30px;          /* mesma altura util dos inputs do smart-form */
    padding: 0 10px;
    display: flex;
    align-items: center;
}

.smart-form .label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
}

#tr6-page-loader {
    position: fixed;
    inset: 0;
    z-index: 20000;
    background: #f5f6f8;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity .25s;
}

#tr6-page-loader.tr6-loader-hide {
    opacity: 0;
    pointer-events: none;
}

.tr6-loader-box {
    text-align: center;
    color: #556677;
    font-weight: 600;
}

.tr6-spinner {
    width: 34px;
    height: 34px;
    margin: 0 auto 10px;
    border: 3px solid #d7dde3;
    border-top-color: #3276b1;
    border-radius: 50%;
    animation: tr6spin .8s linear infinite;
}

@keyframes tr6spin {
    to { transform: rotate(360deg); }
}


#main {
    position: relative;      /* ancora do loader */
}

#tr6-page-loader {
    position: absolute;      /* era fixed */
    inset: 0;
    z-index: 950;            /* acima do conteudo, abaixo do header/menus do SmartAdmin */
    background: #f5f6f8;
    display: flex;
    align-items: flex-start;      /* topo em vez de centro vertical... */
    justify-content: center;
    padding-top: 18vh;            /* ...senao em paginas compridas o spinner fica la em baixo */
    transition: opacity .25s;
}

/* smart-forms ja desenha a seta no wrapper (label.select):
   esconde o picker-icon nativo do modo base-select para nao duplicar */
.select select::picker-icon {
    display: none;
}

/* dropdowns do header: overflow visivel para os submenus de 2. nivel
   (Codigos > ...) nao ficarem cortados; os cantos redondos passam a
   ser aplicados ao primeiro/ultimo item em vez de clipar o menu */
.dropdown-menu {
    overflow: visible !important;
    border-radius: 10px;
}
.dropdown-menu > li:first-child > a {
    border-radius: 10px 10px 0 0;
}
.dropdown-menu > li:last-child > a {
    border-radius: 0 0 10px 10px;
}
/* submenus tambem redondos, todos os cantos */
.dropdown-menu .dropdown-menu,
.dropdown-menu ul {
    border-radius: 10px;
}
.dropdown-menu .dropdown-menu > li:first-child > a,
.dropdown-menu ul > li:first-child > a {
    border-radius: 10px 10px 0 0;
}
.dropdown-menu .dropdown-menu > li:last-child > a,
.dropdown-menu ul > li:last-child > a {
    border-radius: 0 0 10px 10px;
}

/* aba Tabela do Filtrar: checkbox custom unico (esconde o nativo,
   redefine o ::after que a regra global de checkboxes desenhava) */
.tr6-dt2-panel-table input.tr6-col-visible {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border: 1px solid #bcc9d4;
    border-radius: 5px;
    background: #fff;
    vertical-align: middle;
    cursor: pointer;
    position: relative;
    margin: 0;
}
.tr6-dt2-panel-table input.tr6-col-visible:checked {
    background: #3276b1;
    border-color: #3276b1;
}
.tr6-dt2-panel-table input.tr6-col-visible::after {
    content: none;                    /* neutraliza o visto global */
}
.tr6-dt2-panel-table input.tr6-col-visible:checked::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 2px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* aba Tabela do Filtrar: grelha com cantos arredondados */
.modal .tr6-dt2-panel-table {
    border-collapse: separate !important;
    border-spacing: 0;
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
}
/* fallback para browsers onde overflow em <table> nao clipa */
.modal .tr6-dt2-panel-table thead th:first-child { border-top-left-radius: 10px; }
.modal .tr6-dt2-panel-table thead th:last-child { border-top-right-radius: 10px; }
.modal .tr6-dt2-panel-table tbody tr:last-child td:first-child { border-bottom-left-radius: 10px; }
.modal .tr6-dt2-panel-table tbody tr:last-child td:last-child { border-bottom-right-radius: 10px; }