/*------------------------------------------------------------*/
/*-              Bootstrap v5  vars to rewrite      	  	 -*/
/*------------------------------------------------------------*/

/* BS5 theme colors are now defined in orix-1.2.1.css :root */


/* Badge colors now handled by BS5 text-bg-* utilities */
.badge {
    --bs-badge-border-radius: 100px;
    --bs-badge-padding-y: 0.5em;
    --bs-badge-padding-x: 0.8em;
}

.tooltip {
    --bs-tooltip-font-size: 12px;
    --bs-tooltip-color: #fff;
}
.table{
    --bs-table-border-color: #ddd;
    --bs-table-bg: none;
    border-color: var(--bs-border-color) !important;
}
.table>:not(caption) .label{
   --bs-table-color: #fff;
   white-space: nowrap;
}

.table-striped>tbody>tr:nth-of-type(odd)>* {
    --bs-table-color-type: var(--bs-table-striped-color);
    --bs-table-bg-type: var(--bs-table-striped-bg);
    position: relative;
}

.nk-theme {
    --bs-body-color: var(--main-text-color);
    --main-focus-color: var(--left-menu-bg-second-color);
}

button.close {
    --bs-btn-close-color: var(--secondary-text-color);
    --bs-btn-close-bg: none;
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
}

.alert:has(.close){
    display: flex;
    justify-content: space-between;
    padding: 10px;
}
.alert button.close {
    color: unset;
    padding: 0;
}

.alert-info {
    --bs-info-bg-subtle:  #d8f3ff;
}
.control-group .form-label {
    padding-right: 15px;
}
/*.close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity = 20);
    opacity: .2;
}*/
.breadcrumb {
    --bs-breadcrumb-padding-x: 15px;
    --bs-breadcrumb-padding-y: 8px;
    --bs-breadcrumb-margin-bottom: 20px;
    --bs-breadcrumb-margin-bottom: 20px;
    --bs-breadcrumb-bg: #f5f5f5;
    --bs-breadcrumb-border-radius: 4px;
    --bs-breadcrumb-divider: "/";
}

.btn.active:not(.white), .btn.show:not(.white), .btn:first-child:not(.white):active, :not(.btn-check)+.btn:active:not(.white) {
    background-color: var(--secondary-text-color);
    color: var(--left-menu-bg-second-color);
    border-color: var(--main-menu-bg-hover-color);
}


.nk-theme-white a.btn{
    --bs-btn-color: var(--hyperlink-color);
    --bs-btn-hover-color: var(--hyperlink-color);
}

.btn.light, .btn.label-light, .btn.white {
    --bs-btn-hover-bg: var(--bs-light);
    --bs-btn-active-bg: var(--hyperlink-color);
}

.btn.secondary, .btn.label-secondary {
    --bs-btn-hover-bg: var(--bs-secondary);
    --bs-btn-active-bg: var(--bs-secondary);
}

.btn.success, .btn.label-success {
    --bs-btn-hover-bg: var(--bs-success);
    --bs-btn-active-bg: var(--bs-success);
}

.btn.primary, .btn.label-primary {
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary);
}

.btn.danger, .btn.label-danger {
    --bs-btn-hover-bg: var(--bs-danger);
    --bs-btn-active-bg: var(--bs-danger);
}

.btn.warning, .btn.label-warning {
    --bs-btn-hover-bg: var(--bs-warning);
    --bs-btn-active-bg: var(--bs-warning);
}

.btn.info, .btn.label-info {
    --bs-btn-hover-bg: var(--bs-info);
    --bs-btn-active-bg: var(--bs-info);
}

/* .btn-info colors now defined in orix-1.2.1.css */
.btn.dark, .btn.label-dark {
    --bs-btn-hover-bg: var(--bs-dark);
    --bs-btn-active-bg: var(--bs-dark);
}


.nav {
    --bs-nav-link-padding-x: 15px; /* 1rem is approximately 15px in Bootstrap 3 */
    --bs-nav-link-padding-y: 10px; /* 0.5rem is approximately 10px in Bootstrap 3 */
    --bs-nav-link-font-weight: normal; /* Default font weight in Bootstrap 3 */
    --bs-nav-link-color: #337ab7; /* Link color in Bootstrap 3 */
    --bs-nav-link-hover-color: #23527c; /* Link hover color in Bootstrap 3 */
    --bs-nav-link-disabled-color: #777; /* Disabled color in Bootstrap 3 */
}

/*------------------------------------------------------------*/
/*-             @Migration from Bootstrap v3 -> v5  	  	 -*/
/*------------------------------------------------------------*/
html {
    font-size: 14px;
}

.hide, .hidden {
    display: none !important;
}

/* todo later, remove all cols from the website to change for a flex way */

.flr, .btn-toolbar .right {
    margin-left: auto;
}

.btn-group-vertical>.btn-group:after, .btn-toolbar:after, .clearfix:after, .container-fluid:after, .container:after, .dl-horizontal dd:after, .form-horizontal .form-group:after, .modal-footer:after, .nav:after, .navbar-collapse:after, .navbar-header:after, .navbar:after, .pager:after, .card-body:after, .row:after {
    clear: both;
}

:after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

@media (min-width : 480px) {
    .main-left-submenu.show {
        transition: width .25s ease;
        height: 100%;
        width: calc(var(--left-menu-open-width) + 30px);
    }
}
.main-left-submenu.collapsing {
    transition: none;
    height: 100%;
    width: 0;
}

.container-fluid{
    width: auto;
}
/** NAV **/

.nav-tabs>li>a.active, .nav-tabs>li>a.active:focus, .nav-tabs>li>a.active:hover {
    color: #555;
    cursor: default;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
}

.nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
}

.nav-tabs.nav-justified>li {
    display: table-cell;
    width: 1%;
    float: none;
}

.nav-tabs.nav-justified {
    display: block;
    width: auto !important;
}
.nav-tabs.nav-justified>li>a {
    text-align: center;
}
/** buttons **/
.btn-xs{padding:1px 5px;font-size:12px;line-height:1.5;border-radius:3px}

/*.btn-toolbar>.btn, .btn-toolbar>.btn-group, .btn-toolbar>.input-group {
    margin-left: 5px;
}
*/
.btn-group-justified {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
}

.btn-group-justified>.btn, .btn-group-justified>.btn-group {
    display: table-cell;
    float: none;
    width: 1%;
}

.btn-toolbar.d-flex:has(span.center), .form-inline.d-flex:has(span.text-center){
    justify-content: center;
}

/** panels **/
.card-header {
    padding: 10px 15px;
    border-bottom: 1px solid #eff2f7;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.card-header a:has(span.float-end){
    width: 100%;
}

.card-body {
    padding: 15px;
}

.card {
    margin-bottom: 20px;
    --bs-card-bg: #fff;
}
.nav-tabs {
    --bs-nav-tabs-link-active-bg: #fff;
}

.card-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}


/** for the feedback button **/
#footer-help-btn-container ul.list-group.show{
    display: block;
}
#footer-help-btn-container .dropdown-menu{
    width: max-content;
}
#footer-help-btn-container .dropdown-menu>li>a:hover {
    background-color: var(--main-bg-color);
    color: #FFFFFF;
    text-decoration: none;
}

.dropdown-menu>li>a.disable:focus{
    color: #333;
}


/** for the breacrumbs **/
.breadcrumb>li {
    display: inline-block;
}
.breadcrumb {
    display: block;
}

.breadcrumb>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "/\00a0";
}



.nav>li {
    position: relative;
    display: block;
}

@media  (min-width: 768px){
    .profile-nav ul>li {
        width: 100%;
    }
}


/** dropdowns **/

.dropdown-item {
    display: block;
    width: 100%;
    padding: .25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    font-size: 12px;
}

 .dropdown-item:hover a {
    color: white;
    text-decoration: none;
}


/* TODO remove the caret from the code
.dropup .dropdown-toggle::after, .dropdown-toggle::after{
    display: none;
}*/

.text-bg-warning {color: #fff !important;}
.text-bg-success {background-color: var(--bs-success) !important;color: #fff !important;}
.text-bg-primary {background-color: #59ace2 !important;color: #fff !important;}
.text-bg-info {background-color: #8175c7 !important;color: #fff !important;}
.dropdown-menu a{padding: 0.5em 1em;margin: 0px;}
.dropdown-menu {
    --bs-dropdown-bg: #fff;
    background-clip : border-box;
}


/** forms and labels **/
.label {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
}
.form-label {font-weight: 700}
.form-label strong {font-weight: 700}

.nk-theme label:not(.rx-option-label) {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
}

.label:empty {
    display: none;
}

.input-small.input.date {
    width: 7rem;
}


.input-group>.form-control.ui-phone-region-b, .input-group>.form-control.ui-phone-region{
    flex: none;
    margin-bottom: 0;
}
.input-group>.form-control.ui-phone-region{
    z-index: 2;
}
.input-group {
    flex-wrap: nowrap;
}
.input-group .input-group.input-group-btn{
    width: auto;
}
.form-control.form-select{
    font-size: .875rem;
    padding: .25rem 2.2rem 0.25rem 0.5rem;
}
.form-select.form-control-sm {border-radius: var(--bs-border-radius-sm);font-size: .875rem}

legend {
    border-bottom: 1px solid #e5e5e5;
}

.row.table-row>*, .ui-gd-multiple-group .row>span{
    width:auto;
}

.row {
    --bs-gutter-x: 0.8rem;
    --bs-gutter-y: 0;
}

li.form-group{
    display: flex;
    gap: 15px;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.nk-theme .form-horizontal .form-group:not(:has(textarea, p)) {display: flex;align-items: center;flex-wrap: wrap;}
.nk-theme .form-horizontal .form-group:has(.controls.sub) {display: flex;align-items: center;flex-wrap: wrap;}
.nk-theme .form-horizontal .form-group label{margin:0;}

/** MODAL **/

.modal-dialog {
    pointer-events: auto;
    max-width: 95vw;
}

.modal-footer {
    justify-content: center;

}

.modal-footer .btn+.btn {
    margin-bottom: 0;
    margin-left: 5px;
}

/** PROFIL PAGE **/

.main-my-info .card{
    --bs-card-cap-padding-y: 0rem;
    --bs-card-cap-padding-x: 0rem;
}

/** tooltip transition **/
/* Animation pour faire grandir le tooltip de l'intérieur */
@keyframes growFromInside {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}


.gd-container {
    overflow: scroll;
}
.collapsing {
    height: 0;
    overflow: hidden;
}

/* Initial state of the tooltip (hidden and small) */
.tooltip {
    opacity: 0;
    transform: scale(0.2);
    transition: opacity 0.3s ease-in-out;
}

/* Transition for showing the tooltip */
.tooltip.show-animation {
    opacity: 1;
    transform: scale(1);
}

@media (max-width: 768px) {
    .form-group .btn {
        margin-bottom: 0px;
    }
}


.form-control, .form-select {background-color: var(--nk-input-bg);}
.form-check.controls  {padding-left:0}
.form-check.controls .form-check-input {margin-left:0}
.btn-toolbar .btn-sm {--bs-btn-padding-y: 0.35rem;--bs-btn-padding-x: 0.65rem;--bs-btn-font-size: 0.875rem;}
.btn.disabled, .btn:disabled {
    --bs-btn-disabled-bg: var(--bs-gray-200);
    --bs-btn-disabled-border-color: var(--bs-gray-200);
    opacity: 0.45;
    pointer-events: none;
}
.no-caret::after {display: none !important}