@import url("https://fonts.googleapis.com/css2?family=Noto+Emoji:wght@300..700&display=swap");

@font-face {
    font-family: "Open-Sans";
    src: url("/fonts/Marianne-Light.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
}

@font-face {
    font-family: "Inter";
    src: url("/fonts/Inter-Variable.ttf") format("ttf");
    font-style: normal;
}

.badge {
    display: inline-block;
    padding: 0.25em 0.4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
}

body {
    overflow-x: hidden;
}

.bold {
    font-weight: 600;
}

.badge-sm {
    font-size: 75%;
    padding: 0.15em 0.3em;
}

.badge-lg {
    font-size: 125%;
    padding: 0.75em 1em;
}

.badge-danger {
    color: #fff;
    background-color: #dc3545;
}

.badge-success {
    color: #fff;
    background-color: #28a745;
}

.badge-primary {
    color: #fff;
    background-color: #007bff;
}

.badge-secondary {
    color: #fff;
    background-color: #6c757d;
}

.badge-info {
    color: #fff;
    background-color: #17a2b8;
}

.wizard-page-label {
    margin: 0 5px;
}

.custom-max-width-xl {
    max-width: 783px;
}

.custom-max-width-l {
    max-width: 705px;
}

.input-group-append .input-group-text {
    display: none;
}

.custom-max-width-m {
    max-width: 630px;
}

.custom-max-width-s {
    max-width: 500px;
}

.w-40 {
    width: 40%;
}

.wizard-page h2 {
    margin-bottom: 35px;
}

.wizard-page h3 {
    margin-top: 20px;
}

.text-small p {
    font-size: 9px !important;
}

.wizard-page p {
    margin-bottom: 30px;
    margin-top: 30px;
}

.wizard-page .alert-warning p,
.wizard-page .alert-secondary p {
    margin: 0;
    padding: 0;
    border-radius: 2px;
    font-size: 11px;
}

.wizard-page .alert-warning,
.wizard-page .alert-secondary,
.wizard-page .alert-info,
.wizard-page .alert-danger {
    border-radius: 5px;
    border: 1px solid #fff7e5;
    background-color: #fff7e5;
    font-family: Open-Sans, sans-serif;
    font-style: italic;
    margin-bottom: 24px;
    padding: 13px;
    display: flex;
    gap: 7px;
    align-items: center;
    box-shadow: 0 -5.8px 0.3px -5.5px rgba(182.75, 182.75, 182.75, 0.33);
}

div.formio-component-htmlelement h2 {
    font-size: 19px;
    font-weight: 700;
    line-height: 1em;
    letter-spacing: 0;
    font-family: Open-Sans, sans-serif;
    margin-top: 23px;
}

.custom-divider {
    border-top: 1px solid darkgray;
    margin-top: 44px;
    margin-bottom: 30px;
}

.custom-divider-email {
    border-top: 1px solid darkgray;
    margin-top: 36px;
    margin-bottom: 14px;
}

div.formio-component-htmlelement h3 {
    font-size: 13px;
    font-weight: 700 !important;
    line-height: 1em;
    letter-spacing: 0;
    font-family: Open-Sans, sans-serif;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #111111;
}

.custom-form-title-h2 span {
    font-size: 19px !important;
    font-weight: 400 !important;
    line-height: 1em;
    letter-spacing: 0;
    font-family: Open-Sans, sans-serif;
    margin-top: 23px;
}

/*Remove blur on inputs when focus*/
textarea:focus,
input[type="text"]:focus,
input[type="textarea"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
input[type="checkbox"]:focus,
.form-control:focus,
.uneditable-input:focus {
    box-shadow: none;
    outline: none;
}

/*custom form style*/

.form-check-input[type="radio"] {
    border: 1px solid darkgray;
    margin-top: 6px;
}

nav[aria-label="Wizard navigation"] > ul.pagination[role="tablist"] {
    display: none;
}

.btn-wizard-nav-next,
.btn-wizard-nav-previous,
.btn-wizard-nav-submit,
.formio-button-add-row,
.formio-component-submit .btn-primary,
.size-btn {
    min-width: 8em;
    min-height: 3em;
    border-width: 1px;
}

.custom-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-wizard-nav-next,
.btn-wizard-nav-previous,
.btn-wizard-nav-submit {
    margin-top: 2em;
    font-family: Open-Sans, sans-serif;
    font-size: 12px;
    font-weight: 500;
    background-color: #000091;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #000091;
    padding: 12px 30px 12px 30px;
    display: flex;
    gap: 9px;
    box-shadow: none;
    border-radius: 4px;
}

.btn-wizard-nav-next:hover,
.btn-wizard-nav-submit:hover {
    background-color: #000091;
    border-color: #3795f7;
}

.btn-wizard-nav-previous,
.formio-button-add-row {
    font-family: Inter, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: #111111;
    background-color: white;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #e9e9e9 !important;
    padding: 012px 30px 12px 30px;
}

.btn-wizard-nav-previous:hover,
.formio-button-add-row:hover {
    background-color: #fefefe;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #e9e9e9;
    color: #111111;
}

.btn-wizard-nav-previous:focus,
.formio-button-add-row:focus {
    background-color: #faf9f6 !important;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #e9e9e9 !important;
    color: #111111 !important;
}

.btn-wizard-nav-next i,
.btn-wizard-nav-submit i {
    font-size: 12px;
    font-weight: 500;
    background-color: #3789f7 !important;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #3795f7 !important;
    padding: 12px 30px 12px 30px;
}

.btn-wizard-nav-previous i {
    margin-right: 8px;
}

.rtl .btn-wizard-nav-next i,
.rtl .btn-wizard-nav-submit i {
    margin-right: 8px;
    margin-left: 0;
}

.rtl .btn-wizard-nav-previous i {
    margin-left: 8px;
    margin-right: 0;
}

.list-inline {
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.list-inline > *:only-child,
.formio-component-submit .btn-primary {
    margin: 0 0 0 auto;
}

.rtl .list-inline > *:only-child {
    margin-right: 100%;
}

.formio-form .col-form-label,
.formio-form h2 {
    color: #111111;
    font-size: 11px;
}

.form-check-input:checked {
    outline: none;
    background-color: black;
    border: none;
}

.form-check-input:checked[type="checkbox"] {
    box-shadow: none !important;
}

.form-check-input:checked[type="radio"] {
    background-image: none;
    border: 3px solid white;
    transform: scale(0.8);
    box-shadow: 0 0 0 1px black;
}

.form-check-input:focus {
    outline: none;
}

.form-check-input {
    outline: none;
    border-radius: 0.25em;
    border: 2px solid grey;
}

.form-check-input:focus {
    border-color: grey;
    box-shadow: none;
}

.title-number {
    color: #aeaeae;
    font-size: 19px !important;
    font-weight: 700;
    line-height: 1em;
    letter-spacing: 0;
    font-family: Inter, sans-serif !important;
}

.custom-text-muted {
    color: #ababab;
    font-family: "Inter", sans-serif !important;
    font-size: 11px;
    font-weight: 400 !important;
    line-height: 1em;
    letter-spacing: 0;
    display: flex;
    gap: 3px;
}

.disclaimer {
    font-size: 9px !important;
    font-weight: 400;
    line-height: 13px;
    letter-spacing: 0;
}

#render {
    margin: -12px 96px 0;
    padding: 78px 75px 58px 75px;
    box-shadow: 0 1.5px 1px 0 #d2d1d1;
    border-style: solid;
    border-width: 0;
    border-color: #111111;
    font-family: "Times New Roman", sans-serif;
}

.formio-wizard-nav-container {
    height: fit-content;
    padding: 0;
    margin: 0;
}

#render h1,
#render h2 {
    font-family: "Open-Sans", sans-serif;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.42em;
    letter-spacing: 0;
    margin-bottom: 28px;
}

#render p {
    font-family: "Times New Roman", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
}

label {
    font-family: Open-Sans, sans-serif;
}

.bg-light {
    background-color: #f4f4f4 !important;
}

.custom-wizard-container {
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #e9e9e9;
    box-shadow: 0 0.9px 0.5px 0 #d2d1d1;
    transition: background 0.3s, border 0.3s, border-radius 0.3s,
        box-shadow 0.3s;
    padding: 30px 45px 30px 45px !important;
    border-radius: 3px 3px 3px 3px;
}

.progress-span {
    font-family: Open-Sans, sans-serif !important;
    font-size: 8px !important;
}

#custom-form-container p,
#custom-form-container span {
    font-size: 11px;
    font-family: Open-Sans, sans-serif;
}

div[ref^="nested-panel"] {
    padding: 0;
    background-color: #ffffff !important;
}

/* components style formio */

div.formio-component-radio {
    margin-bottom: 1em;
}

div.formio-component-textfield input,
.form-control {
    border-radius: 2px;
    border: 1px solid #d0d0d0;
    background-color: #f9f9f9;
    padding-right: 10px;
    height: 36px;
}

.form-control {
    font-size: 12px;
}

div.formio-component-textfield input:hover,
.form-control:hover {
    border: 1px solid #111111;
}

.formio-form .col-form-label {
    color: #111111;
    font-size: 11px;
    padding: 0;
    margin: 15px 0 0;
    font-weight: normal;
}

div.formio-component-textfield input:focus,
.form-control:focus {
    border-color: #111111;
    background-color: #f9f9f9;
}

.alert-secondary {
    box-shadow: 1px -2px 0 0 rgba(241, 241, 241, 0.81);
}

/* loop form style */

.custom-title-page {
    font-family: "Open-Sans", sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1em;
    letter-spacing: 0;
    margin-bottom: 12px;
}

.progress {
    border-radius: 2px;
    height: 18px !important;
}

.progress-bar {
    align-items: center;
    background-color: #3789f7;
}

.formio-button-remove-row {
    width: 50px;
    height: 50px;
    background: none;
    border: none;
    color: black;
}

.formio-button-remove-row:hover {
    background: none;
    border: none;
    color: black;
}

.table.datagrid-table {
    border: none !important;
}

.table.datagrid-table th,
.table.datagrid-table td {
    border: none !important;
}

.formio-component-panel .card,
.formio-component-panel .card-header {
    border: none !important;
    box-shadow: none !important;
}

div[ref^="nested-panel"] {
    padding: 0;
    background-color: #f8f9fa;
}

tr[ref="datagrid-dataGrid-row"] {
    display: flex;
    flex-direction: column-reverse;
}

.table-bordered > :not(caption) > * {
    border-width: 0;
}

.formio-component .formio-component-datagrid thead tr th {
    display: none;
}

table > tbody > tr > td.col-md-1 {
    display: none;
}

button[ref="datagrid-dataGrid-addRow"] {
    display: none;
}

.formio-component-datagrid {
    overflow-x: unset;
}

.custom-label-loop {
    color: #bf2f70;
    font-weight: 600;
}

.fa-times-circle-o {
    margin-top: 3px;
}

.custom-remove-button {
    margin-top: 20px;
    height: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    box-sizing: border-box;
}

.formio-component-fieldset {
    padding: 5px;
    position: relative;
    border: 1px solid #ccc;
}

.formio-component-fieldset::after {
    content: "";
    position: absolute;
    top: -10px;
    left: 20px;
    margin-top: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #f8f9fa transparent;
}

.radio-container-active {
    background: #efefef;
    border: 1px solid #ccc;
    padding: 0 10px 10px;
    margin-bottom: -1px !important;
    margin-top: 15px;
}

.radio-container {
    padding: 0 10px 10px;
}

/* Other styles remain unchanged */
.formio-component-fieldset::before {
    content: "";
    position: absolute;
    top: -11px;
    left: 19px;
    margin-top: -11px;
    border-width: 11px;
    border-style: solid;
    border-color: transparent transparent #ccc transparent;
}

.formio-hidden {
    display: none;
}

.text-disable {
    color: #9a9b9d;
}

.bolder {
    font-weight: bolder;
}

/*pricing page */
.price-card {
    max-width: 35em;
    box-shadow: 4px 6px 4px 0 #00000042;
}

.media-container {
    margin-top: 30px;
    gap: 58px;
}

.media-item {
    max-width: 10em;
}

.price-title {
    font-weight: 700;
    color: rgba(255, 0, 97, 0.66);
    font-size: 36px;
}

.text {
    background: #f0f;
}

/* payment style */

.custom-payment-card {
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #e9e9e9;
    box-shadow: 0 0.9px 0.5px 0 #d2d1d1;
    transition: background 0.3s, border 0.3s, border-radius 0.3s,
        box-shadow 0.3s;
    padding: 30px 45px 10px 45px;
    max-width: 390px;
    border-radius: 3px 3px 3px 3px;
    font-family: "Inter", sans-serif !important;
}

.modal-backdrop.show {
    opacity: 0.85 !important;
    background-color: black !important;
}

.payment-page-title {
    color: #05164c;
    font-family: "Inter", sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 1em;
    margin-bottom: 1.4em;
}

.payment-title {
    color: #050f5a;
    font-family: "Inter", sans-serif;
    font-size: 22px;
    font-weight: 600;
    line-height: 1em;
    letter-spacing: 0;
    margin-top: -6px;
}

.invoice-title {
    font-size: 14px !important;
    font-weight: 700;
}

#payment-form {
    background-color: #f5f9fc;
    padding: 17px;
    border-radius: 5px;
}

.payment-price {
    color: #fd6680;
    font-family: "Inter", sans-serif;
    font-size: 25px;
    font-weight: 600;
    line-height: 1em;
    letter-spacing: 0;
    display: flex;
    justify-content: center;
    gap: 6px;
}

.payment-options {
    color: black;
    font-family: "Inter", sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1em;
    letter-spacing: 0;
    margin: 0;
}

.payment-divider {
    border-top: 1px solid darkgray;
    margin: 12px 0 12px 0;
}

.payment-button,
#payment-button {
    font-family: "Inter", sans-serif;
    font-size: 12px;
    font-weight: 500;
    background-color: #3789f7;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #3795f7;
    padding: 12px 35px 12px 35px;
    color: white;
    display: flex;
    justify-content: center;
    gap: 15px;
    border-radius: 4px;
    min-width: 8em;
    min-height: 3em;
}

.payment-button:hover,
#payment-button:hover {
    background-color: #3789f7e0;
    border-color: #3795f7;
}

.payment-info {
    font-family: "Inter", sans-serif;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
}

.payment-tooltip {
    background-color: #fff7e5;
    border-radius: 5px;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 400;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.14em;
}

.payment-tooltip > p {
    margin: 0;
}

#light {
    margin-top: -3px;
}

.payment-badge {
    font-family: "Inter", sans-serif;
    font-size: 13px;
    font-weight: 400;
    background-color: #18ce96;
    border-style: none;
    border-radius: 40px 40px 40px 40px;
    padding: 5px 50px 05px 50px;
    color: white;
    text-align: center;
    margin-top: -45px;
    margin-bottom: 20px;
    width: 79%;
}

.payment-brand-title {
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
}

.payment-brand-text {
    text-align: center;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    color: #666666;
}

.payment-faq-section-title {
    color: #050f5a;
    font-family: "Open Sans", sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 1em;
    letter-spacing: 0;
}

.payment-faq {
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #e9e9e9;
    box-shadow: 0 0.9px 0.5px 0 #d2d1d1;
    transition: background 0.3s, border 0.3s, border-radius 0.3s,
        box-shadow 0.3s;
    padding: 30px 45px 30px 45px;
    border-radius: 3px 3px 3px 3px;
    width: 600px;
}

.payment-faq-title {
    color: #050f5a;
    font-family: "Inter", sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 1em;
    letter-spacing: 0;
    margin-bottom: 10px;
}

.payment-faq-content {
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 0;
}

.payment-faq-content {
    margin: 0 !important;
}

.custom-payment-modal {
    width: auto;
}

.custom-payment-modal * {
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
}

#terms {
    margin-bottom: 66px !important;
}

.contract-guarantee {
    font-size: 15px !important;
}

.payment-success-title {
    color: #05164c;
    font-family: "Inter", sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 1em;
    margin-bottom: 1.4em;
}

.ht {
    color: #0e0f50;
    font-family: "Inter", sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 1em;
    letter-spacing: 0;
    margin-top: 3px;
}

.custom-success-card {
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #e9e9e9;
    box-shadow: 0 0.9px 0.5px 0 #d2d1d1;
    transition: background 0.3s, border 0.3s, border-radius 0.3s,
        box-shadow 0.3s;
    padding: 30px 45px 10px 45px;
    max-width: 460px;
}

.payment-success-contract-title {
    font-family: "Inter", sans-serif;
    font-size: 22px;
    font-weight: 600;
    line-height: 1em;
    letter-spacing: 0;
}

.btn-font {
    font-family: "Inter", sans-serif;
    font-size: 12px;
    font-weight: 500;
}

.invoice {
    background-color: #fff7e5;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
    font-weight: 400;
    padding: 15px;
    margin-left: 10px;
    margin-right: 10px;
}

.form-label {
    margin-bottom: 0;
}

.formio-error-wrapper {
    background-color: initial !important;
    border: none !important;
    padding: 0 !important;
}

/* stripe input */
#card-element {
    padding: 9px;
}

iframe[src*="stripe.com"] {
    font-size: 12px !important;
    margin-top: 2px !important;
}

.secure-payment {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 8px;
}

#securePaymentContent {
    margin-top: 4px;
}

.stamp-lawyer {
    max-width: 300px;
}

.custom-lawyer-card {
    border: 1px solid #e9e9e9;
}

.alert-lawyer {
    background-color: #adebff;
    border-radius: 10px;
    margin: 1rem;
    padding: 1rem;
    font-size: 13px;
    font-weight: 700 !important;
    line-height: 1em;
    letter-spacing: 0;
    font-family: Open-Sans, sans-serif;
}

.alert-lawyer h3 {
    margin: 0;
}

.lawyer-options-container {
    margin: 0 15px 15px;
    padding-left: 15px;
    padding-right: 15px;
    background-color: #fbfaf8;
}

/**/
.lawyer-options-title h4 {
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    font-size: 11px !important;
    color: #05164c;
}

.lawyer-options-content p {
    font-size: 11px !important;
    margin: 0 !important;
}

.lawyer-options-content:last-child {
    font-size: 11px !important;
}

.text-warning-lawyer {
    position: absolute;
    width: 49%;
    bottom: 0;
}

.text-warning-lawyer p {
    margin: 0 !important;
    font-size: 9px !important;
    font-weight: 400;
    line-height: 13px;
    letter-spacing: 0;
}

.stamp-details p {
    margin: 15px 0 0 0;
}

.lawyer-form-title h3 {
    margin: 0 !important;
}

.custom-lang-form {
    background-color: #05164c;
    color: white;
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
}

.error-container {
    height: 80vh;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.error-title {
    font-size: 19px;
    font-weight: 700;
    line-height: 1em;
    letter-spacing: 0;
    font-family: "Inter", sans-serif;
    margin-bottom: 30px;
}

.error-content {
    font-family: "Open Sans", sans-serif;
    font-size: 11px;
}

@media (min-width: 768px) {
    .custom-payment-modal {
        width: 600px;
    }
}

@media (max-width: 1400px) {
    .custom-tooltip {
        margin-top: 1em;
        position: initial;
        margin-right: auto;
    }
}

@media (max-width: 768px) {
    .w-md-40 {
        width: 40%;
    }

    .text-warning-lawyer {
        position: relative;
        width: 100%;
        margin-bottom: 15px;
    }

    #render {
        padding: 96px 20px;
        margin: 15px 48px 0;
    }

    .payment-faq {
        width: 100%;
    }
}