/* Variables */
:root {
    --color-primary: #098aff;
    --color-primary-light: #1e6a9a;
    --color-primary-dark: #103e5b;
    --color-gray: #dfdfdf;
}

@font-face {
    font-family: 'Nexa Light';
    font-style: normal;
    font-weight: normal;
    src: local('Nexa Light'), url('fonts/Nexa-Light.otf') format('opentype');
}

@font-face {
    font-family: 'Nexa Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Nexa Regular'), url('fonts/NexaRegular.otf') format('opentype');
}

@font-face {
    font-family: 'Nexa Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Nexa Bold'), url('fonts/Nexa-Bold.otf') format('opentype');
}

@font-face {
    font-family: 'Formula Condensed Ultralight';
    font-style: normal;
    font-weight: normal;
    src: local('Formula Condensed Ultralight'), url('fonts/FormulaCondensed-Ultralight.otf') format('opentype');
}

@font-face {
    font-family: 'Formula Condensed Light';
    font-style: normal;
    font-weight: normal;
    src: local('Formula Condensed Light'), url('fonts/FormulaCondensed-Light.otf') format('opentype');
}

@font-face {
    font-family: 'Formula Condensed Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Formula Condensed Regular'), url('fonts/FormulaCondensed-Regular.otf') format('opentype');
}

@font-face {
    font-family: 'Formula Condensed Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Formula Condensed Bold'), url('fonts/FormulaCondensed-Bold.otf') format('opentype');
}

/*RESET*/
p {
    margin: 0
}

h1, h2, h3, h4, h5 {
    font-family: 'Formula Condensed Light', "Open Sans", sans-serif
}

h5 {
    font-size: 1.27rem;
}

h5,
h6 {
    margin: 0
}

html {
    height: 100vh;
}

body {
    background:  no-repeat center 0 url("images/background-login.webp");
    background-attachment: fixed;
    background-size: cover;
    font-family: 'Nexa Regular', sans-serif
}

.bg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background:  no-repeat center 0 url("https://www.misterbooking.net/wp-content/uploads/2021/07/misterbooking-leader-pms-cloud.jpg");
    background-size: 100%;
    background-attachment: fixed;
}

.mainContainer {
    display: flex;
    position: absolute;
    width: 100%;
    height: 100%;
    margin: auto;
}

.subContainer {

    padding: 10px;
    margin-left: auto;
    margin-right: auto;
}

.segment {
    width: 370px;
    margin: auto;
    border-radius: 25px;
}

/*BOOTSTRAP*/
.bootstrap-select .filter-option-inner-inner {
    color: #ffffff;
}
.bootstrap-select .dropdown-toggle:active, .bootstrap-select .dropdown-toggle:focus {
    background: var(--color-primary);
}


/*HEADER*/
.segment-header {
    position: relative;
    padding: 1rem !important;
    display: flex;
    flex-direction: column;
    border-bottom: 0;
    border-top-left-radius: 25px !important;
    border-top-right-radius: 25px !important;
}

.segment-header {
    background-color: var(--color-primary) !important;
}

.segment-header p {
    color: white;
}

.segment-header p:first-of-type {
    margin-top: 0.875rem;
}

.logo {
    margin: 5px 0;
}

.title {
    margin-top: 0.875rem;
    text-align: center;
    text-transform: uppercase;
    color: white;
    font-size: 1.7rem;
}

.subtitle {
    font-size: 0.87rem;
}

.langs {
    position: absolute;
    top: 0.875rem;
    right: 0.875rem;
    color: white;
}

.lang-item {
    color: white;
    text-decoration: none;
    border: none;
    background-color: transparent;
    padding: 2px 4px;
    border-radius: 8px;
}

.lang-item:hover {
    color: white;
    background: rgba(186, 186, 184, 0.1);
}

.lang-item.selected {
    font-weight: bold;
    background: rgba(186, 186, 184, 0.3);
}

/*BODY*/
.segment-body {
    text-align: center;
}

.form-control {
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
    box-shadow: rgba(99, 133, 150, 0.3) 0 1px 8px 0;
}

.form-control:focus {
    border: 1px solid #ced4da;
    ;
    box-shadow: rgba(99, 133, 150, 0.3) 0 1px 4px 0 !important;
}

.btn {
    background-color: var(--color-primary);
    border: 0;
    border-radius: 25px;
    font-family: 'Nexa Light', sans-serif;
}

.btn.btn-primary {
    white-space: nowrap;
    height: 30px;
    width: 170px;
}

.btn:hover {
    background-color: var(--color-primary-light);
}

.btn-light {
    background-color: var(--color-primary-dark);
    color: white;
}

.btn-light:hover {
    color: white;
}

input.form-control {
    height: 36px;
    border-color: var(--color-gray);
}

input::placeholder {
    text-transform: uppercase;
    color: var(--color-gray) !important;
}

.input-group {
    border-radius: 10px;
}

input,
.input-group-text {
    box-shadow: rgba(99, 133, 150, 0.3) 0 1px 5px 0;
}

.input-group .form-control:focus {
    box-shadow: none !important;
}

.input-group-text {
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
}

.btn {
    box-shadow: rgba(99, 133, 150, 0.3) 0 1px 5px 0;
    text-transform: uppercase;
}

.btn-custom-grey {
    box-shadow: rgba(99, 133, 150, 0.3) 0 1px 2px 0;
    width: 100%;
    background-color: #ebebeb;
    border: none;
    font-size: 1rem;
    font-weight: bold;
}

.btn-custom-grey:hover {
    box-shadow: rgba(99, 133, 150, 0.3) 0 1px 2px 0;
    background-color: #dddddd;
}

.btn-custom-unstyled {
    border: none;
    background: none;
    text-decoration: underline;
    text-transform: uppercase;
    font-size: 0.675rem;
    letter-spacing: initial;
}


.bg-red-mb {
    background-color: #C1282E;
}

.bg-soft-grey-mb {
    background-color: #dddddd;
}

.bg-grey-mb {
    background-color: #454749;
}

#togglePassword {
    cursor: pointer;
}

/* Fill info */
img.flag {width:16px;}
.widthSelectFlag {
    height: calc(100% + 2px);
    top: -1px;
}
#formFillInfos .input-group>.bootstrap-select {
    height:36px;
    max-width:105px!important;
    border : 1px solid #ced4da;
}
.widthSelectFlag .filter-option {
    height:auto!important;
}
.widthSelectFlag .filter-option span.namePays {
    display:none;
}
/* END Fill info */

.action-login-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.action-login-container__bloc {
    display: flex;
    flex: 1
}

.action-login-container__bloc:nth-child(2) {
    justify-content: center;
}

.action-login-container__bloc:last-child {
    justify-content: flex-end;
}

.dba-logo {
    width: 34px;
    height: auto;
}

label.agree-to-terms {
    font-family: 'nexa bold';
    letter-spacing: 0.01em;
}