/*
    0 - BOOTSTRAP OVERWRITE
    1 - DEFAULT
    2 - LAYOUT
    3 - TABLE
    4 - VALIDATE MSG
    5 - LOGIN
    6 - IRO
    7 - LIGHTCASE
    8 - BOX TOOLS
    9 - FULL CALENDAR
    10 - BOX TOOLS ACTIONS
    11 - MODAL DEFAULT
    12 - SIDEBAR
    13 - DATATABLE
    14 - SMALL BOX
    15 - CALLOUT FILTERS
    16 - TIMELINE PESSOA
    17 - BTN AÇÕES
    18 - PAINEL DE MANUTENÇÕES, KANBAN
    19 - GALLERY
    20 - CUSTOM COLLAPSE
    21 - DROPDOWN HEADER CUSTOM
    22 - INFO CONTENT
    23 - LIGHTCASE - GALLERY
    24 - BTN GROUP INLINE
    25 - AUTOCOMPLETE
    26 - MODAL FILE UPLOAD
    27 - CHECKIN
    28 - CARD BOX
    29 - TAB, CONTENT ALERT

    - MOBILE
*/
:root {
    --btn-primary-background: #edce8d;
    --btn-primary-border: #d9bd81;
    --btn-primary-box-shadow: 0px 4px 0px #a57632;

    --btn-primary-background-hover: #d1b579;
    --btn-primary-border-hover: #bda36b;
    --btn-primary-box-shadow-hover: 0px 4px 0px #946a2e;

    --btn-primary-background-focus: #b19864;
    --btn-primary-border-focus: #8d7a50;
    --btn-primary-box-shadow-focus: 0px 4px 0px #805b28;

    --bg-menu-hover: #5f5134;
    --bg-menu-hover-open: #473d27;

    --btn-primary-color: #333;
}

/* ***************************
    0 - BOOTSTRAP OVERWRITE
*************************** */
.btn-primary {
    box-shadow: var(--btn-primary-box-shadow-hover) !important;
    -moz-box-shadow: var(--btn-primary-box-shadow-hover) !important;
    -webkit-box-shadow: var(--btn-primary-box-shadow-hover) !important;
    background-color: var(--btn-primary-background);
    border-color: var(--btn-primary-border);
    color: var(--btn-primary-color);
}
.btn-primary:hover,
.btn-primary:active {
    box-shadow: var(--btn-primary-box-shadow-hover) !important;
    -moz-box-shadow: var(--btn-primary-box-shadow-hover) !important;
    -webkit-box-shadow: var(--btn-primary-box-shadow-hover) !important;
    background-color: var(--btn-primary-background-hover);
    border-color: var(--btn-primary-border-hover);
    color: var(--btn-primary-color);
}
.btn-primary:focus,
.btn-primary:hover:focus,
.btn-primary:active:focus {
    box-shadow: var(--btn-primary-box-shadow-focus) !important;
    -moz-box-shadow: var(--btn-primary-box-shadow-focus) !important;
    -webkit-box-shadow: var(--btn-primary-box-shadow-focus) !important;
    background-color: var(--btn-primary-background-focus);
    border-color: var(--btn-primary-border-focus);
    color: var(--btn-primary-color);
}
.box.box-primary {
    border-top-color: var(--btn-primary-border);
}
.skin-blue .main-header .logo,
.skin-blue .main-header .navbar {
    background-color: #000;
}
.skin-blue .main-sidebar {
    background: var(--btn-primary-background-hover) !important;
    background: linear-gradient(90deg, var(--btn-primary-background-focus) 0%, var(--btn-primary-background) 100%) !important;
}
.skin-blue .sidebar a {
    color: #333;
}
.skin-blue .sidebar-menu>li.active>a {
    border-left-color: #333;
    background: var(--bg-menu-hover);
    color: #fff;
}
.skin-blue .sidebar-menu>li:hover>a {
    background: var(--bg-menu-hover);
    color: #fff;
}
.skin-blue .sidebar-menu>li.menu-open>a {
    background: var(--bg-menu-hover);
}
.skin-blue .sidebar-menu>li>.treeview-menu {
    background: var(--bg-menu-hover-open);
}
.skin-blue .sidebar-menu .treeview-menu>li>a {
    color: #ddd;
}
.skin-blue .main-header li.user-header {
    background-color: var(--btn-primary-background);
}
.navbar-nav>.user-menu>.dropdown-menu>li.user-header>p {
    color: #333;
}
a {
    color: var(--btn-primary-border-focus);
}
a:hover {
    color: var(--btn-primary-border-hover);
}

/* ***************************
    1 - DEFAULT
*************************** */
.d-block {
    display: block;
}
.d-none {
    display: none;
}
.mg-tp30 {
    margin-top: 30px;
}
.pd-bt0 {
    padding-bottom: 0;
}
.nowrap {
    white-space: nowrap;
}
.popover .table {
    margin-bottom: 0;
}
hr.separator {
    border-color: #eee;
    margin-top: 5px;
}
.border-separator:after {
    top: 5px;
    right: 0px;
    width: 1px;
    bottom: 5px;
    content: "";
    position: absolute;
    background-color: rgba(0,0,0,0.1);
}
.text-overflow {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.pd-bt10 {
    padding-bottom: 10px;
}
.c-pointer {
    cursor: pointer;
}
.bg-white {
    background-color: #FFF !important;
}
.br-l5-info {
    border-left: 4px solid #0097bc !important;
}
.br-l5-danger {
    border-left: 4px solid #c23321 !important;
}
.text-white {
    color: #fff;
}
.pl-1 {
    padding-left: 1.75rem;
}
.pt-0 {
    padding-top: 0 !important;
}
.pb-0 {
    padding-bottom: 0 !important;
}
.p-10 {
    padding: 10px !important;
}
.mb-10 {
    margin-bottom: 10px !important;
}
.border-radius-none {
    border-radius: 0;
}
.position-relative {
    position: relative;
}
@media (max-width: 767px) {
    .no-padding-x-xs {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* ***************************
    2 - LAYOUT
*************************** */
.checkbox, .radio {
    margin-top: 0;
}
.dl-horizontal dd img {
    margin-top: 5px;
}
span.mceEditor, span.mceEditor * {
    max-width: 100% !important;
}
table.mceLayout, textarea.tinyMCE, textarea.form-control {
    width: 100% !important;
    max-width: 100% !important;
}
table.table > thead > tr > th,
table.table > tbody > tr > td,
table.table > tbody > tr > th {
    vertical-align: middle;
}
.btn-social-custom>:first-child {
    line-height: 50px;
}
.btn-social-custom p {
    overflow: hidden;
    text-overflow: ellipsis;
}
.main-header .logo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 70px;
}
.main-header .logo>span.logo-lg img {
    margin: auto;
    margin-top: 8px;
}
.main-header .logo>span.logo-mini img {
    margin: auto;
    margin-top: 10px;
}

@media (min-width: 992px) {
    .content-header>.breadcrumb {
        float: left;
        position: initial;
    }
}
/* ***************************
    3 - TABLE
*************************** */
td .row, td .col-xs-12 {
    margin: 0;
    padding: 0;
}
td .alert {
    margin-bottom: 0;
}
/* .table .dropdown-menu {
    right: 0;
    left: auto;
} */
table .btn-box-tool {
    padding: 0;
}
.filtros th {
    white-space: nowrap;
}
.filtros .fa-stack {
    width: 1.5em;
    height: 1.5em;
    line-height: 1.5em;
}
.alert-custom .alert {
    padding: 5px 35px 5px 15px;
}
.table label.checkbox {
    margin: 0;
}
.table th .btn-group>.btn {
    float: none;
}
/* ***************************
    4 - VALIDATE MSG
*************************** */
.form .state-error label, .form .error label {
    color: #dd4b39;
}
.form .state-error .form-control, .form .error .form-control {
    border-color: #dd4b39;
    box-shadow: none;
}
.form .error-message {
    color: #dd4b39;
}
/* ***************************
    5 - LOGIN
*************************** */
.login-box .login-logo img {
    margin: auto;
}
.login-box .login-box-body img {
    height: 88px;
}
.login-box .form label {
    font-weight: unset;
}
/* ***************************
    6 - IRO
*************************** */
#color-picker-container .iro__colorPicker {
    margin: auto;
}

.embarcacao-color {
    width: 15px;
    height: 15px;
    display: inline-block;
    border-radius: 8px;
    margin-top: 3px;
}
/* ***************************
    7 - LIGHTCASE
*************************** */
.lightcase img {
    max-height: 80px;
}
.lightcase img.img-lg {
    margin: 0 5px 5px 0;
    float: none;
}
/* ***************************
    8 - BOX TOOLS
*************************** */
.box-tools.box-tools-custom {
    position: relative;
    right: 0;
    top: 11px;
}
.nav-tabs-custom {
    margin-bottom: 0;
    background: transparent;
    box-shadow: 0 0 1px rgba(0,0,0,0.1);
    border-radius: 3px;
    margin-top: -13px;
    transition-duration: 1s;
}
.box-tools-custom .nav-tabs-custom {
    margin-top: -24px;
}
@media(max-width: 991px) {
    .box-tools.box-tools-custom {
        top: 5px;
        float: none !important;
    }
    .box-tools-custom .nav-tabs-custom {
        margin-top: 0;
    }
}
/* ***************************
    9 - FULL CALENDAR
*************************** */
@media(max-width: 991px) {
    #calendar .fc-left {
        margin-bottom: 15px;
    }
    #calendar .fc-left, #calendar .fc-right {
        float: none;
    }
    #calendar .fc-left>*, #calendar .fc-right>* {
        float: none;
    }
}
@media(max-width: 767px) {
    #calendar .fc-right>.btn-group {
        width: 100%;
        margin: auto;
    }
    #calendar .fc-right>.btn-group>button {
        float: none;
    }
    #calendar .fc-right>.btn-group:first-of-type {
        margin-bottom: 5px;
    }
}
.fc-view .alert-info {
    background-color: var(--btn-primary-background) !important;
}
.fc-highlight {
    background-color: var(--btn-primary-background) !important;
}

/* ***************************
    10 - BOX TOOLS ACTIONS
*************************** */
.btn-box-tool-actions {
    margin: -5px 0 0 5px !important;
}
li.div-box-tool-actions>a {
    padding-right: 45px;
}
li.div-box-tool-actions>div.btn-group {
    position: absolute;
    right: 15px;
    top: 13px;
}
li.div-box-tool-actions>div.btn-group>ul.dropdown-menu {
    margin-top: 2px;
}
/* ***************************
    11 - MODAL DEFAULT
*************************** */
#modal-default {
    z-index: 1070;
}
/* ***************************
    12 - SIDEBAR
*************************** */
.user-panel {
    display: table-cell;
    vertical-align: middle;
    width: 100vw;
}
.user-panel>.image {
    min-width: 30px;
    min-height: 30px;
}
.user-panel>.image img {
    margin: auto;
}
.user-panel>.info {
    top: 50%;
    right: 0;
    padding: 15px 10px 5px 15px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.user-panel>.info .icon-to-profile {
    float: right;
    padding-left: 1px;
}
/* ***************************
    13 - DATATABLE
*************************** */
#datatable-manutencao, #datatable-reserva {
    width: 100% !important;
}
#datatable-manutencao thead label, #datatable-reserva thead label {
    margin-bottom: 0;
}
/* ***************************
    14 - SMALL BOX
*************************** */
.modal .small-box h3 {
    font-size: 30px;
}
.modal .small-box:hover {
     color: inherit;
}
/* ***************************
    15 - CALLOUT FILTERS
*************************** */
.box-body.no-padding .callout-filters {
    margin: 10px;
}
/* ***************************
    16 - TIMELINE PESSOA
*************************** */
.timeline>li>.timeline-item {
    box-shadow: none;
    border: 1px solid #ddd;
}
.timeline>li>.timeline-item dl {
    margin-bottom: 0;
}
/* ***************************
    17 - BTN AÇÕES
*************************** */
.btn-group ul.dropdown-menu>li>a>i {
    width: 15px;
    text-align: center;
    margin-left: -5px;
}
/* ***************************
    18 - PAINEL DE MANUTENÇÕES, KANBAN
*************************** */
.qb {
    position: relative;
    min-height: 1px;
    float: left;
    padding-right: 15px;
    padding-left: 15px;
}
.qb .box {
    box-shadow: none;
    margin-bottom: 15px;;
}
.qb .box-header h3 {
    padding: 0 5px;
}
.qb ul.qb-content {
    margin-bottom: 0;
}
.qb ul.qb-content>li.qb-item {
    margin-top: 3px;
    margin-bottom: 0;
    border: none;
    padding: 0;
}
.qb .qb-item-header {
    padding: 10px 15px;
}
.qb .qb-item-header>a {
    color: inherit;
}
.qb .qb-item-body {
    border-bottom: 3px solid;
}
.qb .qb-item.bg-danger .qb-item-body {
    border-color: #f2dede;
}
.qb .qb-item.bg-gray-light .qb-item-body {
    border-color: #f7f7f7;
}
.qb .qb-item-header a i {
    width: 25px;
    text-align: center;
}
.qb .qb-item-more {
    background-color: #d2d6de;
}
.qb .qb-item-more>div {
    -webkit-transition: background-color 5s ease-out;
    -moz-transition: background-color 5s ease-out;
    -o-transition: background-color 5s ease-out;
    transition: background-color 5s ease-out;
}
.qb .qb-item-more.bg-danger.qb-item-more-load>div {
    background-color: #f56954;
}
.qb .qb-item-more.bg-gray-light.qb-item-more-load>div {
    background-color: #d2d6de;
}
@media (min-width: 992px) {
    /* .qb:last-child .qb-item-header ul.dropdown-menu {
        right: 0;
        left: auto;
    } */
}
@media (max-width: 991px) {
    .qb {
        width: 100% !important;
    }
    /* .qb .dropdown-menu {
        left: unset;
        right: 0;
    } */
}

/* ***************************
    19 - GALLERY
*************************** */
/*.gallery-custom .gallery-custom-item {
    height: 85px;
    border-left: 2px solid #EFEFEF;
}
.gallery-custom .gallery-custom-item {
    overflow: hidden;
}
.gallery-custom .gallery-custom-item img {
    width: 100%;
}*/

/* ***************************
    20 - CUSTOM COLLAPSE
*************************** */
.cs-collapse > .checkbox {
    margin-top: -5px;
}
.cs-collapse > .checkbox:first-child {
    margin-top: 0;
}
.cs-collapse .cs-collapse-checkbox {
    margin: -7px 0 7px 8px;
    padding-left: 11px;
    border-left: 2px solid #0e76a8;
}
.cs-collapse .cs-collapse-checkbox > div:first-child {
    padding-top: 5px;
}

/* ***************************
    21 - DROPDOWN HEADER CUSTOM
*************************** */
.dropdown-header-custom {
    margin-left: -5px;
}
.dropdown-header-custom > div {
    font-weight: bold;
}

/* ***************************
    22 - INFO CONTENT
*************************** */
.info-content>span {
    display: block;
    margin-bottom: 10px;
}
.info-content .info-action {
    display: inline-block;
}
@media (max-width: 991px) {
    .info-content .info-action {
        float: right;
    }
    /* .info-content .info-action .dropdown-menu {
        right: 0;
        left: auto;
    } */
}

/* ***************************
    23 - LIGHTCASE - GALLERY
*************************** */
.lightcase-gallery > div {
    padding: 0 5px;
}
.lightcase-gallery > div:last-of-type {
    padding-bottom: 0;
}
.lightcase-gallery .lightcase-item {
    margin-bottom: 5px;
}
.lightcase-gallery .lightcase-midia {
    display: inline-block;
    margin: 0 5px 15px 0;
}
.lightcase-gallery .lightcase-action {
    display: inline-block;
}
.lightcase-gallery .lightcase-midia > .lightcase-action {
    display: block;
    text-align: right;
}
.lightcase-gallery .lightcase-item h4 {
    padding-bottom: 5px;
}
.lightcase-gallery .lightcase-item a img {
    width: 80px;
    height: 80px;
    max-height: 80px;
    border-radius: 0;
    margin-bottom: 5px;
}
.lightcase-gallery .lightcase-item button {
    margin-left: 5px !important;
    float: right !important;
}

.lightcase-gallery.lightcase-gallery-md .lightcase-midia {
    display: inline-block;
    margin: 5px 5px 0 0;
}
.lightcase-gallery.lightcase-gallery-md  .lightcase-item a img {
    width: 60px;
    height: 60px;
    max-height: 60px;
}
.lightcase-gallery.lightcase-gallery-md  .lightcase-item.lightcase-file {
    margin-bottom: 0;
}

/* ***************************
    24 - BTN GROUP INLINE
*************************** */
.btn-group-inline a:not(.link-inline-block) {
    line-height: 0;
    font-size: 0 !important;
    color: transparent;
    visibility: hidden;
    margin: 0;
    padding: 0;
}
.btn-group-inline a.link-inline-block {
    display: block;
    white-space: nowrap;
    text-align: left;
}
.btn-group-inline a>i {
    font-size: 16px;
    line-height: 1.5;
    color: #3c8dbc;
    visibility: visible;
    padding: 1px 5px;
    background-color: transparent;
}
.btn-group-inline a:hover>i {
    color: #72afd2;
}

/* ***************************
    25 - AUTOCOMPLETE
*************************** */
.ui-autocomplete {
    max-height: 300px;
    border-color: #ddd !important;
    overflow: scroll;
    overflow-x: hidden;
}
.ui-autocomplete li>div {
    padding: 1px 12px !important;
    font-size: 14px;
    color: #555;
}

/* ***************************
    26 - MODAL FILE UPLOAD
*************************** */
#modal-fileupload {
    z-index: 1051;
}

/* ***************************
    27 - CHECKIN
*************************** */
#modal-checkin-reserva .content-itens {
    max-height: 40vh;
    overflow: hidden;
    overflow-y: scroll;
}

/* ***************************
    28 - CARD BOX
*************************** */
.box .box-header .box-title > i {
    width: 20px;
    text-align: center;
    padding-right: 3px;
}

/* ***************************
    29 - TAB, CONTENT ALERT
*************************** */
.content-alert-warning::before {
    content: "";
    position: absolute;
    top: 0;
    left: 5px;
    bottom: 35px;
    width: 3px;
    background: #e08e0b;
}
.content-alert-message {
    margin: 7px 0 10px;
}

/* ***************************
    - MOBILE
*************************** */

@media (min-width: 673px) {
    .content-logo-mobile {
        display: none;
    }
}

@media (max-width: 672px) {
    .main-sidebar {
        margin-top: 0;
        padding-top: 50px;
    }

    html, body {
        font-size: 18px;
    }

    body * {
        font-size: 1rem !important;
    }

    h1 { font-size: 1.4rem !important; }
    h2 { font-size: 1.3rem !important; }
    h3 { font-size: 1.2rem !important; }
    h4 { font-size: 1.1rem !important; }
    h5 { font-size: 1rem !important; }
    h6 { font-size: 0.9rem !important; }
    small { font-size: 85% !important; }

    .navbar-custom-menu .navbar-nav>li>a {
        line-height: 1.45rem;
    }

    .navbar-nav>.user-menu>.dropdown-menu>li.user-header {
        height: auto;
    }

    .main-sidebar {
        width: 100%;
        margin-top: 1rem;
        -webkit-transform: translate(-100%, 0);
        -ms-transform: translate(-100%, 0);
        -o-transform: translate(-100%, 0);
        transform: translate(-100%, 0);
    }

    .main-sidebar .sidebar-menu li a>.fa,
    .main-sidebar .sidebar-menu li a>.glyphicon,
    .main-sidebar .sidebar-menu li a>.ion {
        width: 1.7rem;
        text-align: center;
        padding-right: 3px;
    }
    .sidebar-menu>li>a {
        padding: 1rem;
        display: block;
    }
    .sidebar-menu>li li>a {
        padding: 0.8rem 1.2rem;
        display: block;
    }

    .box-header>.box-tools {
        top: 0.4rem;
    }

    .form-control,
    select.input-sm {
        height: 2.2rem;
    }

    [data-dismiss="modal"] > span {
        font-size: 1.5rem !important;
    }

    .btn,
    .btn * {
        font-size: 0.7rem !important;
    }

    /* Hidden breadcrumb */
    section.content-header  {
        padding: 0;
    }
    section.content-header > * {
        margin: 15px 15px 0 15px;
    }
    section.content-header > ul.breadcrumb {
        display: none;
    }

    /* Logo */
    .main-header > .logo {
        display: none;
    }
    .main-header .navbar-static-top .content-logo-mobile {
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        height: 70px;
    }
}
.skin-blue .main-sidebar {
    padding-top: 70px;
}
.main-header .content-logo-mobile img {
    margin: 0;
    padding: 0;
}
.main-header .sidebar-toggle,
.main-header .navbar-custom-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 70px;
}
.skin-blue .main-header .logo:hover,
.skin-blue .main-header .navbar .sidebar-toggle:hover {
    background-color: var(--bg-menu-hover);
}
.nav-tabs-custom>.nav-tabs>li.active {
    border-top-color: var(--btn-primary-border-focus);
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
    background-color: var(--btn-primary-background);
    border-color: var(--btn-primary-border);
}