:root {
    --mot-primary-color: #8A1538;
    --mot-secondary-color: #A29475;
    --mot-BGbase-color: #FBFBF9;
    --mot-black-color: #000000;
    --mot-white-color: #FFFFFF;
    --mot-PrimeGray-color: #374151;
    --mot-PrimeGraylight-color: #F3F4F6;
    --mot-Blue-color: #4F46E5;
    --mot-BlueLight-color: #EEF2FF;
    --mot-navyBlue-color: #0D4261;
    --mot-ashBlue-color: #CFD9DF;
    --mot-lightgray-color: #ECEAE3;
    --mot-lightAsh-color: #F7F6F3;
    --mot-gray-color: #333333;
    --mot-ash-color: #FAFAFA;
    --mot-light-color: #E5E5E5;
    --mot-darkash-color: #666666;
    --mot-darkGray-color: #333333;
    --mot-lightOrange-color: #FFF9F5;
    --mot-Orange-color: #FF6017;
    --mot-danger-color: #FF5E5E;
    --mot-dangerLight-color: #FFF0F0;
    --mot-sucesss-color: #10A957;
    --mot-Lightsucesss-color: #10A957;
    --mot-Lightyellow-color: #FFFBEB;
    --mot-yellow-color: #FE9239;
    --mot-ashBlueLight-color: #EFFEF5;
    --mot-transparent-black-2: rgba(0, 0, 0, 0.02);
    --mot-transparent-black-5: rgba(0, 0, 0, 0.05);
    --mot-transparent-black-10: rgba(0, 0, 0, 0.10);
    --mot-transparent-black-15: rgba(0, 0, 0, 0.15);
    --mot-transparent-black-25: rgba(0, 0, 0, 0.25);
    --mot-transparent-black-35: rgba(0, 0, 0, 0.35);
    --mot-transparent-black-50: rgba(0, 0, 0, 0.50);
    --mot-transparent-black-60: rgba(0, 0, 0, 0.60);
    --mot-transparent-black-65: rgba(0, 0, 0, 0.65);
    --mot-transparent-black-85: rgba(0, 0, 0, 0.85);
    /* BAGE COLORS FOR STATUS START */
    --mot-bage-blue-color: #007bff;
    --mot-bage-bluelight-color: #e6f4ff;
    --mot-bage-brightgreen-color: #28a745;
    --mot-bage-brightgreenlight-color: #f0fff4;
    --mot-bage-crimson-color: #c82333;
    --mot-bage-crimsonlight-color: #f8d7da;
    --mot-bage-darkgreen-color: #155724;
    --mot-bage-darkgreenlight-color: #d4edda;
    --mot-bage-darkyellow-color: #b28704;
    --mot-bage-darkyellowlight-color: #fdf7e3;
    --mot-bage-deepred-color: #e3342f;
    --mot-bage-deepredlight-color: #fbe6e6;
    --mot-bage-gold-color: #d39e00;
    --mot-bage-goldlight-color: #fff3e0;
    --mot-bage-gray-color: #6c757d;
    --mot-bage-graylight-color: #f0f0f0;
    --mot-bage-green-color: #2e7d32;
    --mot-bage-greenlight-color: #e2f0d9;
    --mot-bage-lightblue-color: #e6f7ff;
    --mot-bage-lightgray-color: #f8f9fa;
    --mot-bage-mediumgray-color: #6c757d;
    --mot-bage-pink-color: #ff3b3b;
    --mot-bage-pinklight-color: #ffe8e8;
    --mot-bage-red-color: #dc3545;
    --mot-bage-redlight-color: #fdecea;
    --mot-bage-softgreen-color: #198754;
    --mot-bage-softgreenlight-color: #e2ffe5;
    --mot-bage-teal-color: #0c5460;
    --mot-bage-teallight-color: #d1ecf1;
    --mot-bage-yellow-color: #856404;
    --mot-bage-yellowlight-color: #fff3cd;
    /* BAGE COLORS FOR STATUS END */
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

[dir="rtl"] {
    text-align: right;
}

[dir="ltr"] {
    text-align: left;
}

body {
    font-feature-settings: "liga", "kern";
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body,
a,
button,
.btn-brand,
.btn-primary,
.btn.pull-right.action,
.header-icon-box,
.header-icon-box .header-icon {
    -webkit-transition: all 400ms ease, outline 0ms;
    -moz-transition: all 400ms ease, outline 0ms;
    -ms-transition: all 400ms ease, outline 0ms;
    -o-transition: all 400ms ease, outline 0ms;
    transition: all 400ms ease, outline 0ms;
}

a {
    color: var(--mot-primary-color);
    text-decoration: none;
}

a:hover {
    color: var(--mot-black-color);
    text-decoration: none !important;
}

input:active,
input:hover {
    outline: 0;
    box-shadow: none;
}

#mainContentSection {
    min-height: 50vh;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden !important;
    transform: translateZ(0) scale(1, 1) !important;
}

#mainContentSection .ms-webpart-cell-vertical,
#mainContentSection .ms-webpart-chrome-vertical,
#mainContentSection .ms-webpart-zone,
#mainContentSection div.ms-webpart-cell-vertical-inline-table {
    display: block;
}

#mainContentSection .ms-webpartzone-cell {
    margin: 0 auto;
}

h1 {
    font-size: 2.44rem;
}

h2 {
    font-size: 1.88rem;
}

h3 {
    font-size: 1.66rem;
}

h4 {
    font-size: 1.22rem;
}

.text-bold {
    font-weight: bold !important;
}

.brand-color {
    color: var(--mot-primary-color) !important;
}

.btn-brand,
.btn-primary,
.btn-brand-primary,
.btn-brand-outline,
.btn.pull-right.action,
.btn-default,
.btn-brand-bg,
.btn-brand-white,
.btn-primary-outline {
    border-radius: 0.25rem;
    text-align: center;
    padding: 0.4rem 1.5rem;
    display: inline-block;
    border: 1px solid var(--mot-primary-color);
}

    .btn-brand,
    .btn-primary,
    .btn-brand-white.active,
    .btn-brand-primary,
    .btn.pull-right.action,
    a.btn-brand,
    a.btn-primary,
    a.btn-brand-white.active,
    a.btn-brand-primary {
        background-color: var(--mot-primary-color);
        color: var(--mot-white-color);
    }

.btn-brand-outline,
.btn-default,
.btn-brand-white {
    background-color: var(--mot-white-color);
    color: var(--mot-primary-color);
}

.btn-brand-outline,
.btn-default {
    font-size: 0.833rem;
    padding: 0.5rem 0.75rem;
}

.btn-brand-white {
    border: 0;
    box-shadow: 0 19px 33px 0 rgba(0, 72, 118, 0.1);
}

.btn-primary-outline {
    background-color: var(--mot-white-color);
    border: 1px solid var(--mot-secondary-color);
    color: var(--mot-secondary-color);
}

.btn-primary-outline:hover {
    background-color: var(--mot-secondary-color);
    color: var(--mot-white-color);
}

.btn-brand-primary {
    padding: 0.75rem 2rem;
}

    .btn-brand:hover,
    .btn-brand:focus,
    .btn-primary:hover,
    .btn-primary:focus,
    .btn.pull-right.action:hover,
    .btn.pull-right.action:focus,
    .btn-brand-primary:hover,
    .btn-brand-primary:focus {
        background: var(--mot-white-color);
        color: var(--mot-primary-color);
        text-decoration: none;
    }

.btn-brand-outline:hover,
.btn-brand-outline:focus,
.btn-default:hover,
.btn-default:focus {
    background-color: var(--mot-primary-color);
    color: var(--mot-white-color);
}

.btn-small {
    padding: 0.25rem 0.5rem;
    font-size: 0.833rem;
}

.btn-link {
    text-transform: uppercase;
    font-size: 0.875rem;
    text-decoration: none;
    color: var(--mot-primary-color) !important;
}

/* Default styles */
.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
}

.color-brand {
    color: var(--mot-primary-color);
}

.border-radius-0 {
    border-radius: 0px !important;
}

.col-container {
    display: flex;
    flex-direction: column;
}

.col-container .card {
    flex: 1;
    position: relative;
}

.sub-heading h3 {
    font-size: 1.5rem;
    font-weight: normal;
    color: var(--mot-transparent-black-65);
    margin-bottom: 0.7rem;
    margin-top: 2.5rem;
}



.main-heading {
    font-size: 2.25rem;
    font-weight: 500;
    color: var(--mot-gray-color);
}

.main-wrapper {
    min-height: 100vh;
    background-color: var(--mot-BGbase-color);
}


/*Sidebar menu  */
.main-sidebar .card {
    background-color: var(--mot-primary-color);
    border-radius: 0rem;
    min-height: 100vh;
    border: none;
}

.main-sidebar .card .card-body {
    padding: 1rem 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.main-sidebar .brand-logo {
    text-align: center;
    padding: 0 1rem;
}

.main-sidebar .nav-list {
    list-style: none;
    padding: 0;
    margin-top: 2rem;
}

.main-sidebar .nav-list li {
    margin-top: 0.5rem;
}

.main-sidebar .nav-list a {
    color: var(--mot-white-color);
    padding: 0.4rem 1rem;
    display: inline-block;
    width: 100%;
    position: relative;
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    font-weight: normal;

}

.main-sidebar .nav-list a img {
    width: 1.2rem;
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(96deg) brightness(96%) contrast(108%);
}

.main-sidebar .nav-list a.active {
    color: var(--mot-white-color);
    font-weight: 600;
}


.main-sidebar .nav-list a.active span {
    width: 2rem;
    height: 2rem;
    border-radius: 100%;
    background-color: var(--mot-white-color);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
}

.main-sidebar .nav-list a.active img {
    filter: brightness(0) saturate(100%) invert(12%) sepia(87%) saturate(3119%) hue-rotate(328deg) brightness(90%) contrast(94%);
}

.main-sidebar .nav-list a.sub-manu:after {
    content: "\f107";
    position: absolute;
    top: 0.4rem;
    color: var(--mot-white-color);
    font-family: 'FontAwesome';
}


.main-sidebar .sub-manu-list ul li {
    margin-top: 0rem;
}

.main-sidebar .card .card-footer {
    padding-top: 0;
    border: none;
}

.main-sidebar .card .card-footer h5 {
    color: var(--mot-white-color);
    font-size: 1.5rem;
    font-weight: 700;
    margin-top: 0.5rem;
}

.main-sidebar .card .card-footer h6 {
    color: var(--mot-white-color);
    font-size: 1rem;
    font-weight: normal;
}

.search-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease-in-out;
}

.search-box input {
    width: 0;
    opacity: 0;
    padding: 0;
    box-shadow: none !important;
    outline: 0;
    transition: all 0.2s ease-in-out;
    margin: 0 0.3rem;
}

.search-box:focus-within input {
    width: 100%;
    opacity: 1;
    padding: 0.2rem 0.5rem;
}

.header-notification .btn {
    padding: 0;
    border: none !important;
}

.header-notification .btn .img-wraper {
    position: relative;
}

.header-notification .btn .img-wraper span {
    position: absolute;
    background-color: var(--mot-danger-color);
    border-radius: 100%;
    color: var(--mot-white-color);
    text-align: center;
    width: 0.9rem;
    height: 0.9rem;
    top: -4px;
    font-size: 0.8rem;
    line-height: 0.8rem;
}

.header-notification .btn img {
    width: 1.5rem;
    object-fit: cover;
}

.check-in-out .card {
    border: none;
    margin: 0.7rem;
    border-radius: 0.5rem;
    min-height: auto;
    background-image: linear-gradient(138deg, rgba(255, 255, 255, 0) -5%, #cb931b 62%, rgba(255, 255, 255, 0.11) 123%);
}

.check-in-out .card .card-body {
    padding: 0.7rem;
    display: unset;
    flex-direction: unset;
}

.check-in-out .card h5 {
    color: var(--mot-white-color);
    font-size: 1rem;
    margin: 0.7rem 0 0.5rem 0;
    font-weight: 500;
}

.check-in-out .card p {
    color: var(--mot-white-color);
    margin-bottom: 0.3rem;
    font-size: 0.875rem;
}


.check-in-out .card h6 {
    color: var(--mot-white-color);
    font-weight: 600;
    font-size: 0.875rem;

}

/*header*/
header .user-info {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0.5rem 0;
}

header .user-bio {
    display: flex;
    align-items: center;
}

header .user-bio .dropdown .btn {
    display: flex;
    align-items: center;
    border: none;
}

header .user-bio .img-wraper {
    border-radius: 100%;
    width: 2.5rem;
    height: 2.5rem;
    margin: 0 0.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--mot-secondary-color);
}

header .user-bio .img-wraper img {
    object-fit: cover;
    border-radius: 100%;
}

header .login-btns .btn-brand-outline {
    padding: 0.2rem 1.2rem;
    text-transform: capitalize;
    border-radius: 0.25rem;
}

header .user-bio .dropdown-menu {
    width: 100%;
}

header .user-bio h6 {
    font-size: 0.95rem;
    margin-bottom: 0;
    color: var(--mot-gray-color);
}

header .user-bio p {
    font-size: 0.875rem;
    color: var(--mot-light-color);
    margin-bottom: 0;
}



header .header-title {
    color: var(--mot-primary-color);
    font-weight: bold;
    font-size: 2rem;
}

header .nav-toggler {
    background-color: transparent;
    border: none;
    font-size: 1.5rem;
    color: var(--mot-white-color);
}

.user-info .prayer-info {
    display: flex;
    margin: 0 0.8rem;
}

.user-info .prayer-info .img-wraper {
    width: 2.8rem;
    height: 2.8rem;
    background-color: var(--mot-primary-color);
    border-radius: 100%;
    text-align: center;
    padding-top: 9px;
    margin: 0 0.3rem;
}

.user-info p a {
    color: var(--mot-primary-color);
    margin: 0 0.5rem;
    font-weight: bold;
}

.user-info .prayer-info h6 {
    font-size: 1rem;
    font-weight: 600;
    color: var(--mot-primary-color);
    margin-bottom: 0.2rem;
}

.user-info .prayer-info p {
    color: var(--mot-primary-color);
    opacity: 0.7;
    font-size: 0.875rem;
    margin-bottom: 0;
}

.user-info .prayer-info .word-icon {
    color: var(--mot-primary-color);
    font-size: 1.2rem;
}

.user-info .prayer-info .dropdown-toggle {
    background-color: transparent;
    border: none;
    color: var(--mot-primary-color);
    font-weight: 600;

}

/* main */

.view-all {
    margin-bottom: 0;
    font-size: 0.875rem;
    color: var(--mot-primary-color);
}


.main-sidebar.collapse:not(.show) {
    display: block;
    position: fixed;
}

.signUp-now {
    background-color: var(--mot-lightgray-color);
    border-radius: 0.5rem;
    padding: 1rem;
    margin: 1rem 0;
}

.signUp-now h5 {
    font-size: 2.563rem;
    color: var(--mot-primary-color);
    font-weight: normal;
    margin-bottom: 0;
}

.signUp-now p {
    font-size: 1rem;
    margin: 0;
    color: var(--mot-black-color);
    font-weight: 300;
    text-transform: capitalize;
}

.signUp-now .btn-brand {
    padding: 0.75rem 2rem;
}

.signUp-wraper .row {
    display: flex !important;
    flex-wrap: nowrap;
    width: 100%;
}

    .signUp-wraper .row > .col-xl-6 {
        width: 50% !important;
        flex-shrink: 0;
        display: flex;
        flex-direction: column;
    }

.signUp-wraper .col-xl-6.px-0.d-none.d-xl-block {
    height: 100vh;
    padding: 0 !important;
}

.signUp-wraper .signUp-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
}

.nas-box .row.align-items-center {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
}

    .nas-box .row.align-items-center > .col-lg-10 {
        flex: 0 0 83.3333% !important;
        max-width: 83.3333%;
    }

    .nas-box .row.align-items-center > .col-lg-2 {
        flex: 0 0 16.6667% !important;
        max-width: 16.6667%;
        text-align: right !important;
    }

.login-pane {
    margin-top: 1rem;
}

.signIn-box {
    margin-top: 2.5rem;
}

.nas-box {
    background-color: #ebebeb;
}

.cards-listing .card {
    border-radius: 0.5rem;
    border: 1px solid var(--mot-light-color);
    margin-top: 1rem;
}

.iconRound-wraper {
    width: 3rem;
    height: 3rem;
    min-width: 3rem;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background-color: var(--mot-navyBlue-color);
    margin-bottom: 0.5rem;
}

.cards-listing .card h5,
.cards-listing .card h5 a {
    color: var(--mot-black-color);
    font-size: 1.5rem;
    text-transform: capitalize;

}

.cards-listing .card h5:hover a {
    color: var(--mot-primary-color);

}

.cards-listing .card p {
    font-weight: 300;
}

.iconRound-wraper.bg-disable {
    background-color: var(--mot-ashBlue-color);
}

.theme-form .form-group {
    margin-bottom: 1.5rem;
}

.theme-form .form-label {
    color: var(--mot-darkash-color);
    font-size: 0.875rem;
    font-weight: 500;
    display: block;

}

.theme-form .form-control,
.theme-form .form-select {
    color: var(--mot-black-color);
    font-size: 1rem;
    padding: 0.7rem 0.5rem;
    box-shadow: none !important;
    outline: none !important;
    border: 1px solid var(--mot-light-color);
    border-radius: 0.25rem;
    resize: none;

}

.theme-form .form-select {
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23800000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.theme-form .form-control::placeholder {
    color: var(--mot-transparent-black-35);
}

.theme-form .form-label span {
    color: var(--mot-transparent-black-35);
    font-weight: 300;
}

.theme-form .form-check-input[type="radio"] {
    border: 1px solid var(--mot-transparent-black-35);
    background-color: white;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
    position: relative;
    box-shadow: none;
}

.theme-form .form-check-input[type="radio"]:checked {
    border: 1px solid maroon;
}

.theme-form .form-check-input[type="radio"]:checked::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.6em;
    height: 0.6em;
    background-color: maroon;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.theme-form .form-check-label {
    font-size: 1rem;
    color: var(--mot-black-color);
}

.theme-form .form-group small {
    color: var(--mot-transparent-black-35);
}

.theme-form input[type=number]::-webkit-inner-spin-button,
.theme-form input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

.theme-form input[type=number] {
    -moz-appearance: textfield;
}

.theme-form .inputNumber {
    position: relative;
}

.theme-form .inputNumber span {
    position: absolute;
    top: 0.8rem;
    color: var(--mot-primary-color);
}

.theme-form .form-control, .theme-form .form-select {
    padding: 0.7rem 0.5rem !important;
}

.theme-form .control {
    position: relative;
}

    .theme-form .control .icon-calendar {
        position: absolute;
        top: 0.5rem;
        color: var(--mot-primary-color)
    }

    .theme-form .control .input-group-btn {
        position: absolute;
        left: calc(100% - 2rem);
        top: 0.5rem;
        color: var(--mot-primary-color)
    }

        .theme-form .control .input-group-btn span {
            color: var(--mot-primary-color)
        }

    .theme-form .control .icon-calendar {
        z-index: 5;
    }

.theme-form .text-muted {
    display: none;
}

.theme-form .control .form-control.picklist:after {
    position: absolute;
    content: '/f06';
}

.theme-form .control:has(select.form-control.picklist)::after {
    position: absolute;
    content: '\f107';
    font-family: 'FontAwesome';
    font-size: 1rem;
    color: var(--mot-primary-color);
    top: 0.7rem;
}

.theme-form .control .readonly.form-control,
.theme-form .control .form-control:disabled {
    background-color: var(--mot-light-color);
}

.theme-form .file-control-container {
    margin-top: 1.5rem;
}

.theme-form .btn-for-file-input {
    background-color: var(--mot-white-color);
    color: var(--mot-primary-color);
    white-space: nowrap;
    padding: 0.5rem 1rem !important;
    cursor: pointer;
    border: 1px solid var(--mot-primary-color);
}

.list-group-item.text-muted {
    display: block;
}

.upload-wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 1rem;
}

.upload-wrapper .text-info small {
    color: var(--mot-transparent-black-35);
    font-size: 0.875rem;
    display: block;

}

.upload-wrapper .file-info {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 500;
    width: 100%;
    justify-content: space-between;
}

.upload-wrapper .file-info #fileName {
    color: var(--mot-black-color);
}

.upload-wrapper .file-info .delete-icon {}

.upload-wrapper .upload-btn {
    position: relative;

}

.upload-wrapper .upload-btn .fileInput {
    color: transparent;
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    top: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer;
}


.upload-wrapper .upload-btn .btn-brand-outline {
    white-space: nowrap;
    padding: 0.7rem 1rem;
    font-size: 1rem;
    cursor: pointer;
}

.form-submit h5 {
    font-size: 1.5rem;
    color: var(--mot-black-color);
    margin: 1rem 0;
}

.form-submit p {
    color: var(--mot-transparent-black-60);

}

.contant-area {
    min-height: 65vh;
}

.signUp-wraper .signUp-img {
    min-height: 100vh;
    height: 100%;
}

.mobile-num .iti {
    width: 100%;
}

.mobile-num .iti--separate-dial-code .iti__selected-flag {
    background-color: var(--mot-white-color);
}

.vessels-types {
    margin-top: 2rem;
}

.vessels-types .nav .nav-link {
    color: var(--mot-gray-color);
    font-size: 1.25rem;
    border-radius: 0;
    border-bottom: 2px solid transparent;
}

.vessels-types .nav .nav-link.active {
    background: transparent;
    border-bottom: 2px solid var(--mot-primary-color);
    font-size: 1.5rem;
    font-weight: 600;
}

.cards-listing .card {
    position: relative;
}

.card .dropdown-types {
    position: absolute;
    top: 0.5rem;
}

.card .dropdown-types button {
    background-color: transparent;
    border: none;
    padding: 0;
}

.card .dropdown-types .dropdown-menu {
    position: absolute;
    inset: unset !important;
    top: -3rem !important;
    transform: unset !important;
    min-width: 16rem;
    padding: 1rem 0.5rem;
    box-shadow: 0px 0px 4px 0px #00000040;
    border: none;
    border-radius: 1rem;

}

.card .dropdown-types .dropdown-menu:after {
    content: '';
    position: absolute;
    border-top: 0.6rem solid transparent;
    border-bottom: 0.6rem solid transparent;
    top: 3rem;
    filter: drop-shadow(0px 2px 2px #00000033);

}

.card .dropdown-types button {
    position: relative;
    color: var(--mot-primary-color);
    font-size: 1.25rem;
    padding: 0.7rem;
}

.card .dropdown-types button span {
    margin: 0 0.2rem;
    width: 1.2rem;
    min-width: 1.2rem;
    height: 1.2rem;
    background-color: var(--mot-Orange-color);
    color: var(--mot-white-color);
    font-size: 0.75rem;
    border-radius: 100%;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -0px;
}

.card .dropdown-types .dropdown-menu h5 {
    font-size: 1rem;
    margin-bottom: 0;
    font-weight: 700;
}

.card .dropdown-types .dropdown-item {
    padding: 0.4rem 0;
}



.card .dropdown-types .dropdown-menu h5 span {
    margin: 0 0.2rem;
    width: 1.2rem;
    min-width: 1.2rem;
    height: 1.2rem;
    background-color: var(--mot-Orange-color);
    color: var(--mot-white-color);
    font-size: 0.75rem;
    border-radius: 100%;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;

}

.bage {
    font-size: 0.875rem;
    padding: 0.4rem 1rem;
    border-radius: 2rem;
    width: fit-content;
}

.bage-success {
    background-color: var(--mot-ashBlueLight-color);
    color: var(--mot-sucesss-color);
}

.bage-secondary {
    background-color: var(--mot-Lightyellow-color);
    color: var(--mot-yellow-color);
}

.vessels-list {
    min-height: 70vh;
    background-color: #F7F7F3;
    height: 100%;
    max-height: 100vh;
    overflow: auto;
}

.vessels-list .form-group {
    position: relative;
    margin-bottom: 1rem;
}

.vessels-list .form-control {
    border-radius: 2rem;
    box-shadow: none;
    outline: none;
    border: 1px solid var(--mot-lightgray-color);
}

.vessels-list .form-group a {
    position: absolute;
    top: 0.6rem;
}

.vessels-list .cards-listing h5 {
    color: var(--mot-gray-color);
    font-weight: normal;
    font-size: 1.125rem;
}

.vessels-list .cards-listing p {
    font-size: 0.875rem;
    color: var(--mot-transparent-black-60);
}

.vessels-list .single-item {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--mot-transparent-black-15);
    padding: 0.7rem 0.5rem;

}

.vessels-list .single-item:last-child {
    border: none;
}


.vessels-list .single-item.active h5 {
    color: var(--mot-primary-color);
    font-weight: 600;
}

.vessels-list .single-item:hover h5 {
    color: var(--mot-primary-color);
}

.vessels-requestes {
    padding: 1rem;
}

.vessels-requestes .main-heading {
    font-size: 2.25rem;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.vessels-requestes .main-heading .bage-success {
    background-color: var(--mot-sucesss-color);
    color: var(--mot-white-color);
}

.vessels-requestes .sub-heading {
    color: var(--mot-transparent-black-60);
    font-size: 1.125rem;
    font-weight: normal;
}

.vessels-requestes h5 {
    font-size: 1rem;
    margin-bottom: 0.3rem;
}

.vessels-requestes p {
    color: var(--mot-transparent-black-50);
    font-size: 0.875rem;
}

.vessels-requestes .status-contant {
    display: flex;
    align-items: center;
}

.vessels-requestes .status-contant .bage {
    padding: 0.3rem 0.5rem;
    margin-bottom: 0.3rem;
}

.vessels-requestes .status-contant .bage i {
    line-height: 0;
}

.vessels-requestes .status-contant .beside-bodrer {
    padding: 0 0.8rem;
}

.vessels-requestes .requestes-item {
    padding: 1rem 0;
    border-bottom: 1px solid var(--mot-lightgray-color);
}

.vessels-requestes .requestes-item:last-child {
    border: none;
}

.vessels-requestes .requestes-pending .iconRound-wraper {
    background: var(--mot-Lightyellow-color);
    border: 1px solid var(--mot-yellow-color);
}

.vessels-requestes .requestes-pending .bage-secondary {
    border: 1px solid var(--mot-yellow-color);
}

.vessels-requestes .requestes-approvad .iconRound-wraper {
    background: var(--mot-ashBlueLight-color);
    border: 1px solid var(--mot-sucesss-color);
}

.vessels-requestes .requestes-approvad .bage-success {
    border: 1px solid var(--mot-sucesss-color);
}

.vessels-requestes .requestes-rejected .iconRound-wraper {
    background: var(--mot-dangerLight-color);
    border: 1px solid var(--mot-danger-color);
}

.vessels-requestes .requestes-rejected .bage-danger {
    border: 1px solid var(--mot-danger-color);
    color: var(--mot-danger-color);
}




/*footer*/
.footer {
    border-top: 1px solid var(--mot-light-color);
    padding: 2rem 0;
    /*margin-top: 3rem;*/
}

.footer p {
    margin-bottom: 0.7rem;
    color: var(--mot-transparent-black-50);
    font-weight: normal;

}

.footer a {
    color: var(--mot-black-color);
    font-size: 1rem;
}

.footer a:hover {
    color: var(--mot-primary-color);
}

.my-task {
    margin-bottom: 3rem;
}

.my-task .card {
    border-radius: 0.5rem;
    border: 1px solid var(--mot-light-color);
    margin-top: 1rem;
}

.my-task .card-header {
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0;
    margin: 0.5rem;
}

.my-task .card-header p {
    color: var(--mot-transparent-black-50);
    font-size: 0.875rem;
}

.my-task .card-body {
    display: flex;
}

.my-task .card-body .iconRound-wraper {
    background-color: var(--mot-lightgray-color);

}

.my-task .card-body h5 {
    font-weight: normal;
    color: var(--mot-transparent-black-60);
    font-size: 0.875rem;

}

.my-task .card-body h6 {
    font-size: 1rem;
    color: var(--mot-black-color);
    font-weight: normal;
    margin-bottom: 0.3rem;
}

.my-task .card-body p {
    color: var(--mot-transparent-black-50);
    font-size: 0.875rem;
}


.stepWizerd-form {
    display: flex;
    justify-content: space-between;
    margin: 2rem 0;
}

.stepWizerd-form .step {
    flex: 1;
    position: relative;
}

.stepWizerd-form .step .circle:after {
    content: '';
    position: absolute;
    width: calc(100% - 3rem);
    height: 2px;
    background-color: var(--mot-lightgray-color);
    top: 0.7rem;
}

.stepWizerd-form .step:last-child .circle:after {
    display: none;
}

.stepWizerd-form .step .circle {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background-color: var(--mot-lightgray-color);
    text-align: center;
    color: white;
    font-weight: bold;
}

/*.stepWizerd-form .step.active .circle {
    background-color: var(--mot-primary-color);
}*/

.stepWizerd-form .step.completed .circle {
    background-color: var(--mot-primary-color);
}

.stepWizerd-form .step.completed .circle::before {
    content: "\F272";
    font-family: bootstrap-icons;
    background-color: var(--mot-primary-color);
}

.stepWizerd-form .step.active .circle {
    background-color: var(--mot-white-color);
    /*position: relative;*/
    border: 1px solid var(--mot-primary-color);
}

.stepWizerd-form .step.active .circle:before {
    content: '';
    position: absolute;
    width: 1rem;
    height: 1rem;
    border-radius: 100%;
    background-color: var(--mot-primary-color);
    top: 4px;
}

.stepWizerd-form .step .label {
    margin-top: 5px;
}

.stepWizerd-form .step.active .label {
    color: var(--mot-primary-color);
}

.stepWizerd-form .step:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 1.25rem;
    width: 100%;
    height: 2px;
    background-color: #ccc;
    z-index: -1;
}

/*.stepWizerd-form .step.completed:not(:last-child)::after {
    background-color: #28a745;
}*/

#wizardForm .btns-group {
    display: flex;
}

ol.progress.list-group.top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-direction: unset;
    background: transparent;
    overflow: visible;
    margin-top: 2rem;
}

ol.progress .list-group-item {
    background: transparent !important;
    border: none !important;
    position: relative;
    color: var(--mot-black-color);
    font-size: 1rem;
    width: calc(100% - 28rem);
}

    ol.progress .list-group-item.active {
        color: var(--mot-primary-color) !important;
    }

ol.progress.list-group.top .list-group-item.list-group-item-success::before {
    content: "\F272";
    font-family: bootstrap-icons;
    background-color: var(--mot-primary-color);
}

ol.progress.list-group.top .list-group-item:before {
    content: '';
    position: absolute;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 100%;
    background-color: var(--mot-primary-color);
    top: -0.9rem;
    color: var(--mot-white-color);
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}



ol.progress.list-group.top .list-group-item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 1.25rem;
    width: calc(100% - 3rem);
    height: 2px;
    background-color: #ccc;
    z-index: 0;
    left: 3rem;
    right: 0;
    top: -5px;
}

ol.progress.list-group.top .list-group-item.incomplete:before {
    background-color: var(--mot-lightgray-color);
}

.dateCalender {
    position: relative;
}

.dateCalender {
    position: relative;
}

.dateCalender i {
    color: var(--mot-primary-color);
    position: absolute;
    top: 2.7rem;
}

.permanent-registration {
    margin-bottom: 2rem;
}

.view-reuest .bage-secondary {
    border: 1px solid var(--mot-yellow-color);
}

.view-reuest .bage-secondary {
    border: 1px solid var(--mot-yellow-color);
}

.theme-nav .nav {
    border-bottom: 1px solid var(--mot-lightgray-color);
}

.theme-nav .nav .nav-link {
    color: var(--mot-transparent-black-60);
    font-weight: 500;
    font-size: 0.875rem;
    border: none;
    border-bottom: 2px solid transparent;
}

.theme-nav .nav .nav-link.active {
    color: var(--mot-black-color);
    border: none;
    border-bottom: 2px solid var(--mot-primary-color);
    background: transparent;

}

.theme-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.description.below span {
    display: inline-block;
    padding-top: 0.5rem !important;
    font-size: 0.77rem;
    font-weight: bold;
    color: var(--mot-secondary-color);
}

.view-reuest .count-wraper {
    width: 1.8rem;
    min-width: 1.8rem;
    height: 1.8rem;
    background-color: var(--mot-primary-color);
    color: var(--mot-primary-color);
    color: var(--mot-white-color);
    border-radius: 100%;
    text-align: center;
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.delegation-list table {
    width: 100%;
    border-collapse: separate;
    padding: 0 0.3rem;
    border-spacing: 0 15px;
    /* space between rows */
}

.delegation-list table thead th {
    text-align: satrt;
    font-weight: normal;
    color: var(--mot-transparent-black-35);
    padding: 0.3rem;
    font-size: 0.875rem;
}

.delegation-list table thead tr {
    border: transparent;
}

.delegation-list table tbody tr {
    background: #fff;
    border-radius: 0.75rem;
    box-shadow: 0 0px 1px rgb(33 15 15 / 60%);
}

.delegation-list table tbody td {
    padding: 1rem;
    vertical-align: middle;
}

.delegation-list table tbody td h6 {
    margin-bottom: 0;
    font-size: 1.125rem;
}

.delegation-list .bage-secondary {
    border: 1px solid var(--mot-yellow-color);
}

.delegation-list .bage-success {
    border: 1px solid var(--mot-sucesss-color);
}

.delegation-list .bage-gray {
    color: var(--mot-black-color);
    background-color: var(--mot-transparent-black-5);
    border: 1px solid var(--mot-transparent-black-50);

}

.delegation-list .bage {
    white-space: nowrap;
}

.captcha-cell {
    padding: 1rem;
}

    .captcha-cell input {
        padding: 0.2rem 0.5rem;
        margin-top: 2rem;
    }

.captcha-cell {
    border: 1px solid var(--mot-light-color);
    background: var(--mot-white-color);
    max-width: 28rem;
    border-radius: 0.5rem;
    position: relative;
    padding: 1.5rem;
    padding-bottom: 0;
    margin-bottom: 0;
    position: relative;
}

    .captcha-cell input {
        border: 1px solid var(--mot-light-color);
        background: var(--mot-white-color);
        max-width: 28rem;
        width: 100%;
        border-radius: 0.5rem;
        margin-bottom: 0.5rem;
        margin-top: 0.8rem;
    }

    .captcha-cell img {
        margin: auto;
    }

    .captcha-cell a {
        position: absolute;
        top: 0.5rem;
    }

        .captcha-cell a:nth-child(2) {
            top: 2.5rem;
        }

        .captcha-cell a.rcCaptchaAudioLink {
            background-image: url(/assets/v2/img/captcha-voice.svg);
            background-position: center;
            background-repeat: no-repeat;
            color: transparent;
            width: 2rem;
            height: 2rem;
            overflow: hidden;
        }

        .captcha-cell a.rcRefreshImage {
            background-image: url(/assets/v2/img/captcha-reload.svg);
            background-position: center;
            background-repeat: no-repeat;
            color: transparent;
            width: 2rem;
            height: 2rem;
            overflow: hidden;
        }

    .captcha-cell .tooltip {
        position: absolute !important;
    }

.vessel-services button {
    color: var(--mot-primary-color);
    font-weight: 500;
    font-size: 1.2rem;
}

footer.footer:not([data-version="v2"]) {
    display: none !important;
}

/******* CLASSES - BAGE COLORS START *******/
.bage-status {
    border-radius: 1rem;
    padding: 0.5rem 1rem;
    line-height: 1;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.bage-blue {
    background-color: var(--mot-bage-blue-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-bluelight {
    background-color: var(--mot-bage-bluelight-color);
    color: var(--mot-bage-blue-color);
    border: 1px solid var(--mot-bage-blue-color);
}

.bage-brightgreen {
    background-color: var(--mot-bage-brightgreen-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-brightgreenlight {
    background-color: var(--mot-bage-brightgreenlight-color);
    color: var(--mot-bage-brightgreen-color);
    border: 1px solid var(--mot-bage-brightgreen-color);
}

.bage-crimson {
    background-color: var(--mot-bage-crimson-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-crimsonlight {
    background-color: var(--mot-bage-crimsonlight-color);
    color: var(--mot-bage-crimson-color);
    border: 1px solid var(--mot-bage-crimson-color);
}

.bage-darkgreen {
    background-color: var(--mot-bage-darkgreen-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-darkgreenlight {
    background-color: var(--mot-bage-darkgreenlight-color);
    color: var(--mot-bage-darkgreen-color);
    border: 1px solid var(--mot-bage-darkgreen-color);
}

.bage-darkyellow {
    background-color: var(--mot-bage-darkyellow-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-darkyellowlight {
    background-color: var(--mot-bage-darkyellowlight-color);
    color: var(--mot-bage-darkyellow-color);
    border: 1px solid var(--mot-bage-darkyellow-color);
}

.bage-deepred {
    background-color: var(--mot-bage-deepred-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-deepredlight {
    background-color: var(--mot-bage-deepredlight-color);
    color: var(--mot-bage-deepred-color);
    border: 1px solid var(--mot-bage-deepred-color);
}

.bage-gold {
    background-color: var(--mot-bage-gold-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-goldlight {
    background-color: var(--mot-bage-goldlight-color);
    color: var(--mot-bage-gold-color);
    border: 1px solid var(--mot-bage-gold-color);
}

.bage-gray {
    background-color: var(--mot-bage-gray-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-graylight {
    background-color: var(--mot-bage-graylight-color);
    color: var(--mot-bage-gray-color);
    border: 1px solid var(--mot-bage-gray-color);
}

.bage-green {
    background-color: var(--mot-bage-green-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-greenlight {
    background-color: var(--mot-bage-greenlight-color);
    color: var(--mot-bage-green-color);
    border: 1px solid var(--mot-bage-green-color);
}

.bage-lightblue {
    background-color: var(--mot-bage-lightblue-color);
    color: var(--mot-bage-blue-color);
    border: 1px solid var(--mot-bage-blue-color);
}

.bage-lightgray {
    background-color: var(--mot-bage-lightgray-color);
    color: var(--mot-bage-mediumgray-color);
    border: 1px solid var(--mot-bage-mediumgray-color);
}

.bage-pink {
    background-color: var(--mot-bage-pink-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-pinklight {
    background-color: var(--mot-bage-pinklight-color);
    color: var(--mot-bage-pink-color);
    border: 1px solid var(--mot-bage-pink-color);
}

.bage-red {
    background-color: var(--mot-bage-red-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-redlight {
    background-color: var(--mot-bage-redlight-color);
    color: var(--mot-bage-red-color);
    border: 1px solid var(--mot-bage-red-color);
}

.bage-softgreen {
    background-color: var(--mot-bage-softgreen-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-softgreenlight {
    background-color: var(--mot-bage-softgreenlight-color);
    color: var(--mot-bage-softgreen-color);
    border: 1px solid var(--mot-bage-softgreen-color);
}

.bage-teal {
    background-color: var(--mot-bage-teal-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-teallight {
    background-color: var(--mot-bage-teallight-color);
    color: var(--mot-bage-teal-color);
    border: 1px solid var(--mot-bage-teal-color);
}

.bage-yellow {
    background-color: var(--mot-bage-yellow-color);
    color: var(--mot-white-color);
    border: 1px solid var(--mot-white-color);
}

.bage-yellowlight {
    background-color: var(--mot-bage-yellowlight-color);
    color: var(--mot-bage-yellow-color);
    border: 1px solid var(--mot-bage-yellow-color);
}
/******* CLASSES - BAGE COLORS END *******/

/******* CLASSES - ICON BACK-GROUND COLORS START *******/
.icon-blue .iconRound-wraper {
    background-color: var(--mot-bage-blue-color);
    border: 1px solid var(--mot-white-color);
}

.icon-bluelight .iconRound-wraper {
    background-color: var(--mot-bage-bluelight-color);
    border: 1px solid var(--mot-bage-blue-color);
}

.icon-brightgreen .iconRound-wraper {
    background-color: var(--mot-bage-brightgreen-color);
    border: 1px solid var(--mot-white-color);
}

.icon-brightgreenlight .iconRound-wraper {
    background-color: var(--mot-bage-brightgreenlight-color);
    border: 1px solid var(--mot-bage-brightgreen-color);
}

.icon-crimson .iconRound-wraper {
    background-color: var(--mot-bage-crimson-color);
    border: 1px solid var(--mot-white-color);
}

.icon-crimsonlight .iconRound-wraper {
    background-color: var(--mot-bage-crimsonlight-color);
    border: 1px solid var(--mot-bage-crimson-color);
}

.icon-darkgreen .iconRound-wraper {
    background-color: var(--mot-bage-darkgreen-color);
    border: 1px solid var(--mot-white-color);
}

.icon-darkgreenlight .iconRound-wraper {
    background-color: var(--mot-bage-darkgreenlight-color);
    border: 1px solid var(--mot-bage-darkgreen-color);
}

.icon-darkyellow .iconRound-wraper {
    background-color: var(--mot-bage-darkyellow-color);
    border: 1px solid var(--mot-white-color);
}

.icon-darkyellowlight .iconRound-wraper {
    background-color: var(--mot-bage-darkyellowlight-color);
    border: 1px solid var(--mot-bage-darkyellow-color);
}

.icon-deepred .iconRound-wraper {
    background-color: var(--mot-bage-deepred-color);
    border: 1px solid var(--mot-white-color);
}

.icon-deepredlight .iconRound-wraper {
    background-color: var(--mot-bage-deepredlight-color);
    border: 1px solid var(--mot-bage-deepred-color);
}

.icon-gold .iconRound-wraper {
    background-color: var(--mot-bage-gold-color);
    border: 1px solid var(--mot-white-color);
}

.icon-goldlight .iconRound-wraper {
    background-color: var(--mot-bage-goldlight-color);
    border: 1px solid var(--mot-bage-gold-color);
}

.icon-gray .iconRound-wraper {
    background-color: var(--mot-bage-gray-color);
    border: 1px solid var(--mot-white-color);
}

.icon-graylight .iconRound-wraper {
    background-color: var(--mot-bage-graylight-color);
    border: 1px solid var(--mot-bage-gray-color);
}

.icon-green .iconRound-wraper {
    background-color: var(--mot-bage-green-color);
    border: 1px solid var(--mot-white-color);
}

.icon-greenlight .iconRound-wraper {
    background-color: var(--mot-bage-greenlight-color);
    border: 1px solid var(--mot-bage-green-color);
}

.icon-lightblue .iconRound-wraper {
    background-color: var(--mot-bage-lightblue-color);
    border: 1px solid var(--mot-bage-blue-color);
}

.icon-lightgray .iconRound-wraper {
    background-color: var(--mot-bage-lightgray-color);
    border: 1px solid var(--mot-bage-mediumgray-color);
}

.icon-pink .iconRound-wraper {
    background-color: var(--mot-bage-pink-color);
    border: 1px solid var(--mot-white-color);
}

.icon-pinklight .iconRound-wraper {
    background-color: var(--mot-bage-pinklight-color);
    border: 1px solid var(--mot-bage-pink-color);
}

.icon-red .iconRound-wraper {
    background-color: var(--mot-bage-red-color);
    border: 1px solid var(--mot-white-color);
}

.icon-redlight .iconRound-wraper {
    background-color: var(--mot-bage-redlight-color);
    border: 1px solid var(--mot-bage-red-color);
}

.icon-softgreen .iconRound-wraper {
    background-color: var(--mot-bage-softgreen-color);
    border: 1px solid var(--mot-white-color);
}

.icon-softgreenlight .iconRound-wraper {
    background-color: var(--mot-bage-softgreenlight-color);
    border: 1px solid var(--mot-bage-softgreen-color);
}

.icon-teal .iconRound-wraper {
    background-color: var(--mot-bage-teal-color);
    border: 1px solid var(--mot-white-color);
}

.icon-teallight .iconRound-wraper {
    background-color: var(--mot-bage-teallight-color);
    border: 1px solid var(--mot-bage-teal-color);
}

.icon-yellow .iconRound-wraper {
    background-color: var(--mot-bage-yellow-color);
    border: 1px solid var(--mot-white-color);
}

.icon-yellowlight .iconRound-wraper {
    background-color: var(--mot-bage-yellowlight-color);
    border: 1px solid var(--mot-bage-yellow-color);
}
/******* CLASSES - ICON BACK-GROUND COLORS END *******/

/******* ICON COLORS STARTS *******/
.icon-blue .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-bluelight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(42%) sepia(86%) saturate(5088%) hue-rotate(200deg) brightness(102%) contrast(106%);
}

.icon-brightgreen .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-brightgreenlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(51%) sepia(17%) saturate(1870%) hue-rotate(81deg) brightness(99%) contrast(88%);
}

.icon-crimson .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-crimsonlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(16%) sepia(55%) saturate(4156%) hue-rotate(335deg) brightness(108%) contrast(104%);
}

.icon-darkgreen .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-darkgreenlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(22%) sepia(83%) saturate(415%) hue-rotate(82deg) brightness(103%) contrast(97%);
}

.icon-darkyellow .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-darkyellowlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(51%) sepia(30%) saturate(5461%) hue-rotate(26deg) brightness(98%) contrast(97%);
}

.icon-deepred .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-deepredlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(33%) sepia(63%) saturate(6592%) hue-rotate(349deg) brightness(97%) contrast(83%);
}

.icon-gold .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-goldlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(60%) sepia(90%) saturate(2066%) hue-rotate(14deg) brightness(98%) contrast(101%);
}

.icon-gray .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-graylight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(50%) sepia(9%) saturate(419%) hue-rotate(167deg) brightness(88%) contrast(88%);
}

.icon-green .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-greenlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(39%) sepia(11%) saturate(2921%) hue-rotate(73deg) brightness(96%) contrast(80%);
}

.icon-lightblue .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(31%) sepia(95%) saturate(2822%) hue-rotate(200deg) brightness(103%) contrast(108%);
}

.icon-lightgray .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(49%) sepia(6%) saturate(667%) hue-rotate(167deg) brightness(90%) contrast(90%);
}

.icon-pink .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-pinklight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(42%) sepia(65%) saturate(5782%) hue-rotate(340deg) brightness(104%) contrast(116%);
}

.icon-red .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-redlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(77%) saturate(3146%) hue-rotate(334deg) brightness(88%) contrast(96%);
}

.icon-softgreen .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-softgreenlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(41%) sepia(58%) saturate(553%) hue-rotate(100deg) brightness(90%) contrast(92%);
}

.icon-teal .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-teallight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(28%) sepia(19%) saturate(1748%) hue-rotate(141deg) brightness(90%) contrast(96%);
}

.icon-yellow .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(25%) hue-rotate(23deg) brightness(105%) contrast(106%);
}

.icon-yellowlight .iconRound-wraper img {
    filter: brightness(0) saturate(100%) invert(26%) sepia(76%) saturate(2603%) hue-rotate(45deg) brightness(95%) contrast(97%);
}
/******* ICON COLORS ENDS *******/



/* End */

.mot-btn-icon-normalized {
    padding: 0.35rem 0.6rem !important;
}

.entity-form select {
    min-height: 2.5rem;
}

.entity-form table .control [readonly] {
    border: 1px solid var(--mot-light-color);
    background-color: var(--mot-lightAsh-color);
    padding: 0.7rem 0.5rem !important;
    color: var(--mot-black-color) !important;
    font-size: 1rem;
    border-radius: 0.25rem;
    display: block;
    font-weight: 400;
    line-height: 1.5;
}

.entity-action-button .btn.btn-primary.button.next.submit-btn {
    background-color: var(--mot-primary-color);
    color: var(--mot-white-color);
}

.vessel-services .dropdown-menu {
    min-width: max-content;
}

.theme-form .crmEntityFormView .actions btn:hover,
.theme-form .crmEntityFormView .actions .btn:active {
    background-color: var(--mot-primary-color);
    color: var(--mot-white-color);
    border: var(--mot-primary-color) !important;
}


.dropdown-menu .dropdown-item:active,
.dropdown-menu .dropdown-item:hover {
    background-color: var(--mot-light-color) !important;
    color: var(--bs-dropdown-link-color) !important;
    margin: 0 !Important;
    border: none !important
}

.modal-dialog {
    display: flex;
    flex-direction: column;
    max-height: 80vh; /* Limit dialog height to 80% of viewport */
    max-width: 80vw;
    margin: 10vh 10vw auto auto;
}

.modal-content {
    flex: 1 1 auto;
    overflow: hidden; /* Prevent content overflow outside modal */
}

.modal-body {
    overflow-y: auto; /* Enable vertical scrolling inside modal body */
    max-height: 80vh; /* Limit modal body height (adjust as needed) */
}

/* Media Queries */
@media all and (min-width: 576px) {}

@media all and (min-width: 768px) {}

@media all and (min-width: 992px) {
    .footer p {
        margin-bottom: 0;
    }
}

@media all and (min-width: 1024px) {}

@media all and (min-width: 1200px) {
    .contant-area {
        min-height: 75vh;
    }
}

@media screen and (max-width: 1400px) and (min-width: 1200px) {
    html {
        font-size: 14px;
    }

}

@media all and (min-width: 1440px) {
    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl {
        max-width: 1320px;
    }
}

@media all and (min-width: 1600px) {

    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl {
        max-width: 1440px;
    }
}

@media all and (min-width: 1920px) {
    html {
        font-size: 18px;
    }

    .container,
    .container-sm,
    .container-md,
    .container-lg,
    .container-xl {
        max-width: 1600px;
    }
}

@media all and (max-width: 1199px) {
    header .user-info {
        background-color: var(--mot-primary-color);
    }

    header .user-info a {
        color: var(--mot-white-color);
    }

    header .user-info a.dropdown-item {
        color: var(--mot-black-color);
    }

    header .user-info a.btn-brand-outline {
        color: inherit;
    }

    header .user-bio button,
    header .user-bio .color-brand {
        color: var(--mot-white-color);
    }

    header .user-bio {
        justify-content: center;
    }

    header .user-bio.border-0 {
        margin-top: 1rem !important;
    }

    .main-sidebar {
        position: relative;
        top: 0;
        width: 100%;
        z-index: 9;
    }

    .main-sidebar .card {
        position: fixed;
        width: 100%;
        left: 0;
        right: 0;
        top: 0;
    }

    .main-sidebar .nav-toggler {
        background-color: transparent;
        border: none;
        position: absolute;
        top: 0.5rem;
        color: var(--mot-white-color);
        font-size: 1.5rem;
    }

    .row-revers {
        flex-direction: column-reverse;
    }

    header .header-title {
        text-align: center;
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }

    .user-info .prayer-info h6 {
        font-size: 0.875rem;
    }

    .main-sidebar.collapse:not(.show) {
        display: none;
    }

    .stepWizerd-form {
        display: block;
    }

    .stepWizerd-form .step {
        margin-bottom: 1rem;
    }

    .stepWizerd-form .step:not(:last-child)::after {
        display: none;
    }

    .stepWizerd-form .step:last-child .circle:after {
        display: block;
    }
}

@media all and (max-width: 1023px) {
    h1 {
        font-size: 2.22rem;
    }

    h2 {
        font-size: 1.22rem;
    }

    h3 {
        font-size: 1.44rem;
    }

    h4 {
        font-size: 1.11rem;
    }
}

@media all and (max-width: 991px) {
    .vessels-list {
        min-height: auto;
    }

    .vessels-requestes .status-contant {
        justify-content: end;
    }

    .vessels-requestes .main-heading {
        font-size: 1.5rem;
    }

    .vessels-requestes {
        padding: 1rem 0;
    }
}

@media all and (max-width:767px) {
    .search-box input {
        position: absolute;

        min-width: 13rem;
        top: 100%;
        z-index: 2;
    }

    .search-box {
        position: relative;
    }
}

@media all and (max-width: 575px) {}

@media(max-width: 991px) {
    .list-group-item {
        width: 100%;
        margin-bottom: 1.5rem
    }

    ol.progress.list-group.top {
        display: block;
    }

        ol.progress.list-group.top .list-group-item:last-child::after {
            display: block;
        }

        ol.progress.list-group.top .list-group-item::after {
            content: "";
            position: absolute;
            top: 1.25rem;
            width: calc(100% - 3rem);
            height: 2px;
            background-color: #ccc;
            z-index: 0;
            left: 3rem;
            right: 0;
            top: -5px;
        }
}

/*# sourceMappingURL=styles.css.map */

@media(max-width: 991px) {
    .bage-status {
        border-radius: 1rem;
        margin: 0.5rem 0;
        font-size: 0.85rem;
        display: inline-block;
    }
}

.icon-time::before {
    content: "\1F553";
    font-size: 18px;
}

.vessels-requestes.tab-content .dropdown-menu a.dropdown-item {
    padding: 0.3rem !important;
    border: none !important;
}

.theme-form .control .readonly.form-control, .theme-form .control .form-control:disabled {
    border: 1px solid var(--mot-light-color);
    background-color: var(--mot-lightAsh-color);
}

.theme-form .control span.input-group-addon {
    background: transparent !important;
    border: none !important;
}

/*MOT-Land Transport Licensing css start*/

.main-wrapper.Landtransport-menu {
    background-color: var(--mot-white-color);
}

.l-request .signUp-wraper h1 {
    font-weight: 500;
}

.Landtransport-menu .card {
    background-color: var(--mot-lightgray-color);
}

.Landtransport-menu .main-sidebar .nav-list a {
    color: var(--mot-transparent-black-65);
}

.Landtransport-menu .main-sidebar .nav-list a.active span {
    background-color: transparent;
    padding: 0;
}

.Landtransport-menu .main-sidebar .nav-list a.active {
    border-right: 4px solid var(--mot-primary-color);
    color: var(--mot-primary-color);
}

.Landtransport-menu .main-sidebar .nav-list a img {
    filter: unset;
}

.Landtransport-menu .main-sidebar .card .card-footer h6 {
    color: var(--mot-black-color);
}

.Landtransport-menu .main-sidebar .card .card-footer h5 {
    color: var(--mot-primary-color);
}

.Landtransport-menu .main-sidebar .card .card-footer {
    background-color: transparent;
}

.l-request .imgIcon-wraper {
    width: 7rem;
    height: 7rem;
    background-color: var(--mot-lightgray-color);
    border-radius: 100%;
    margin: 0.5rem auto;
    padding: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.l-request .motLtl-company .card {
    background-color: var(--mot-white-color);
}

.motLtl-company .card .bage {
    margin-left: auto;
    margin-right: 1.3rem;
}

.l-request .motLtl-company .iconRound-wraper {
    background-color: var(--mot-lightgray-color);
}

.l-request .motLtl-company .dropdown-types button span,
.l-request .motLtl-company .dropdown-types .dropdown-menu h5 span {
    width: 0.8rem;
    height: 0.8rem;
    min-width: 0.8rem;
}

.l-request .motLtl-company .card .dropdown-types .dropdown-menu {
    top: 100% !important;
    border-radius: 0.5rem
}

.l-request .motLtl-company .dropdown-types .dropdown-menu:after {
    transform: rotate(151deg);
    top: -13px;
}

.l-request .cards-listing .fee-card {
    border-radius: 4px;
    border: 1px solid var(--mot-lightgray-color);
    background: rgba(236, 234, 227, 0.30);
}

.l-request .cards-listing .fee-card hr {
    border-color: var(--mot-secondary-color);
}

.l-request .cards-listing .fee-card p {
    color: var(--mot-transparent-black-60);
}

.l-request .cards-listing .fee-card .price-sign {
    font-weight: 600;
    font-size: 1rem;
    color: var(--mot-secondary-color);
}

.l-request .cards-listing .fee-card h6 {
    font-size: 1.125rem;
    font-weight: normal;
}

.l-request .cards-listing .fee-card h5 {
    font-size: 1.25rem;
}

.l-request .bage-danger {
    background-color: var(--mot-dangerLight-color);
    color: var(--mot-danger-color);
}

.l-request .btn-brand-outline.with-img img {
    filter: brightness(0) saturate(100%) invert(11%) sepia(39%) saturate(6759%) hue-rotate(329deg) brightness(95%) contrast(93%);
}

.l-request .btn-brand-outline.with-img:hover img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(96deg) brightness(96%) contrast(108%);
}

.l-request .btn-brand.with-img img {
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(96deg) brightness(96%) contrast(108%);
}

.l-request .btn-brand.with-img:hover img {
    filter: brightness(0) saturate(100%) invert(11%) sepia(39%) saturate(6759%) hue-rotate(329deg) brightness(95%) contrast(93%);
}

.l-request .add-license.stepWizerd-form .step:last-child .circle:after {
    display: block;
}

.l-request .add-license.stepWizerd-form .step .circle:after {
    background-color: #CFD6DC;
    height: 1px;
}

.l-request .add-license.stepWizerd-form .step .label {
    color: var(--mot-darkash-color);
}

.l-request .license-table table thead th {
    font-weight: normal;
    color: var(--mot-darkash-color);
    padding: 0.3rem;
    font-size: 0.875rem;
}

.l-request .license-table table tbody td {
    padding: 1rem 0.3rem;
    vertical-align: middle;
    font-size: 1rem;
    color: var(--mot-black-color);
}

.l-request .empty-records {
    background-color: var(--mot-Lightyellow-color);
    border: 1px solid var(--mot-yellow-color);
    padding: 1rem;
    text-align: center;
    border-radius: 0.5rem;
    color: var(--mot-black-color);
    font-size: 1rem;
    font-style: normal;
}

.l-request .license-table .hover-table tbody tr:hover {
    background-color: var(--mot-transparent-black-5);
}

.l-request .license-table .hover-table tbody tr .delTr-btn {
    opacity: 0;
    visibility: hidden;
}

.l-request .license-table .hover-table tbody tr:hover .delTr-btn {
    opacity: 1;
    visibility: visible;
}

.l-request .price-value {
    color: var(--mot-transparent-black-35);
    text-edge: capitalize;
    font-size: 1rem;
    font-weight: 400;
}

.l-request .brand-check .form-check-input:checked {
    background-color: var(--mot-primary-color);
    border-color: var(--mot-primary-color);
    box-shadow: none !important;
    outline: none !important;
}

.modal-search button {
    margin: unset !important;
}

.modal-search .form-control {
    font-size: 0.875rem;
}

.l-request .pagination-wraper li {
    margin: 0.25rem;
}

.l-request .pagination-wraper li .page-link {
    border: none;
    padding: 0.2rem 0.8rem;
    border-radius: 0.2rem !important;
    color: var(--mot-primary-color);
}

.l-request .pagination-section  li.page-item.active .page-link ,
.l-request .pagination-section  li.page-item:hover .page-link  {
    color: var(--mot-white-color)!important;
    background-color: var(--mot-primary-color)!important;
    border-color: var(--mot-primary-color)!important;
}

.l-request .pagination-section  li .page-link.disabled .page-item  {
    cursor: none;
    background-color: transparent;
    color: var(--mot-secondary-color);
}

.l-request .pagination-wraper li .page-link.disabled {
    cursor: none;
    background-color: transparent;
    color: var(--mot-secondary-color);
}

.l-request .selected-actives {
    padding: 1rem;
    border-radius: 0.3rem;
    background-color: var(--mot-lightgray-color);
}

.l-request .selected-actives .bages-wraper {
    display: flex;
    flex-wrap: wrap;

}

.l-request .selected-actives .bage {
    background-color: var(--mot-white-color);
    border: 1px solid var(--mot-secondary-color);
    color: var(--mot-black-color);
    text-align: center;
    font-size: 0.875rem;
    margin: 0.2rem;
    display: inline-flex;
}

.l-request .AddActivities-modal .modal-header {
    border: none;
}

.l-request .AddActivities-modal .modal-content {
    border-radius: 1rem;
}

.l-request .AddActivities-modal .modal-header .modal-title {
    color: var(--mot-black-color);
    font-size: 1.5rem;
    font-weight: 600;
}

.l-request .AddActivities-modal .btn-close {
    opacity: 1;
    color: var(--mot-primary-color);
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 100%;
    background-color: var(--mot-lightgray-color);
    background-image: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.l-request .color-gray {
    color: var(--mot-transparent-black-50) !important;
}

.l-request .listing-search .form-group {
    position: relative;
}

.listing-search .form-group .search-btn {
    position: absolute;
    top: 0.8rem;
}

.l-request .listing-search .btn-brand,
.l-request .listing-search .btn-brand-outline {
    padding: 0.7rem 1.2rem;
    font-size: 1rem;
    border-radius: 0.35rem;
    margin: 0 0.2rem;
}

.l-request .bage-gray {
    background-color: var(--mot-PrimeGraylight-color);
    color: var(--mot-PrimeGray-color);
}

.l-request .TermsConditions-wraper {
    max-height: 20rem;
    overflow: auto;
}

.l-request .TermsConditions-wraper::-webkit-scrollbar {
    width: 6px;
}

.l-request .TermsConditions-wraper::-webkit-scrollbar-track {
    background: var(--mot-ashBlue-color);
    border-radius: 2rem;
}


.l-request .TermsConditions-wraper::-webkit-scrollbar-thumb {
    background: var(--mot-primary-color);
    border-radius: 0.5rem;
}

.l-request .brand-check .form-check-input:disabled {
    background-color: var(--mot-transparent-black-15);
}

.l-request .faqs-wraper .accordion-item {
    margin-bottom: 1rem;
    border: none;
}

.l-request  .faqs-wraper .accordion-body {
    padding: 0;
    padding-top: 1rem;
}

.l-request .faqs-wraper  .faqs-wraper .accordion-header {
    display: flex;
    align-items: center;
    border-radius: 8px;
    border: 1px solid var(--mot-light-color);
    background: var(--mot-white-color);
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.04);
    padding: 0.5rem 2.5rem 0.5rem 1rem;
    position: relative;
}

.l-request .faqs-wraper .accordion-header a {
    font-size: 1rem;
}

.l-request .faqs-wraper .accordion-button {
    box-shadow: none !important;
    padding: 0;
    position: unset;
    color: var(--mot-darkGray-color);
    font-size: 1.125rem;
}

.l-request .faqs-wraper .accordion-button:not(.collapsed) {
    background-color: transparent;
}

.l-request .accordion-button::after {
    position: absolute;
    right: 0.5rem;
    content: '\f107';
    background-image: none !important;
    font-family: 'FontAwesome';
    transform: unset !important;
    color: var(--mot-primary-color);
}

.l-request .bage-blue {
    background-color: var(--mot-BlueLight-color);
    color: var(--mot-Blue-color);
}

.l-request .accordion-button:not(.collapsed)::after {
    content: '\f106';
    color: var(--mot-secondary-color);
}

/*.accordion-button:not(.collapsed)::after {
    background-image: var(--bs-accordion-btn-active-icon);
    transform: var(--bs-accordion-btn-icon-transform);
}*/

.l-request .motLand-table table thead th {
    font-weight: normal;
    color: var(--mot-darkash-color);
    padding: 0.3rem;
    font-size: 0.875rem;
}

.l-request .motLand-table table tbody td {
    padding: 1rem 0.3rem;
    vertical-align: middle;
    font-size: 1rem;
    color: var(--mot-black-color);
}

.l-request .motLand-table table tbody tr:last-child td {
    border: none;
}

.l-request .motLand-table table tbody tr td:last-child {
    text-align: end;
}

.l-request .card.bulk-renewal {
    background-color: rgba(236, 234, 227, 0.30);
}
.l-request .theme-form .control .input-group-btn .btn:hover span {
    color: var(--mot-white-color);
}
.tooltip{
    position: absolute !important;
}
.l-request  .theme-form .control .input-group-btn button{
    margin:0 0.3rem;
    min-width: 2.5rem;
}
@media (min-width:991px) {
   .l-request .table-responsive.license-table {
        overflow: visible;
    }
}

@media (max-width: 1199px) {
    .l-request .stepWizerd-form.add-license {
        display: flex;
    }

   .l-request  .Landtransport-menu header .user-bio.border-0 {
        margin-top: 0.3rem !important;
    }
}

@media (max-width:991px) {
  .l-request  .listing-search .form-group {
        margin-bottom: 1rem;
    }

   .l-request .Landtransport-menu header .user-bio .dropdown .btn {
        font-size: 0.875rem;
    }

  .l-request  .listing-search .form-group {
        margin-bottom: 1rem;
    }

  .l-request  header .user-bio {
        margin: 0 !important;
        padding: 0 !important;
    }

   .l-request .add-license.stepWizerd-form .step .label {
        margin: 0 0.2rem;
    }
}

@media (max-width:650px) {

  .l-request  .listing-search .btn-brand,
  .l-request  .listing-search .btn-brand-outline {
        width: 100%;
        margin-bottom: 1rem;
    }
}

@media (max-width:410px) {
   .l-request .Landtransport-menu header .user-bio .dropdown .btn {
        font-size: 0.75rem;
    }
}

@media (max-width: 1199px) and (min-width:600px) {
  .l-request  .Landtransport-menu .main-sidebar .card {
        max-width: 22rem;
    }
}

.l-request .cards-listing .card .dropdown-types .dropdown-item i{
    font-size:1.4rem;
    color:var(--mot-primary-color)
}

.l-request .theme-form .form-control,
 .l-request .theme-form .form-select {
    color: #999999;
}
.l-request .card .dropdown-types .dropdown-menu {
    min-width: 12rem;
}

.l-request  .cards-listing .card .dropdown-types .dropdown-item i{
    font-size:1.4rem;
    color:var(--mot-primary-color)
}

.l-request  .theme-form .form-control,
.l-request   .theme-form .form-select {
    color: var(--mot-black-color);
}
.l-request  .card .dropdown-types .dropdown-menu {
    min-width: 12rem;
}
.l-request  .dropdown-menu>li>a{
        padding: 0.25rem 0.5rem!important;
}
.l-request  .dropdown-menu>li>a:focus,
.l-request  .dropdown-menu>li>a:hover{
    border:none!important;
        padding: 0.25rem 0.5rem!important;
}
.l-request  .subHeading-wraper{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.l-request  .theme-form .control .input-group-btn {
    top:0.4rem;
    z-index: 7;
}

.l-request .cards-listing.motLtl-company.card-pagination-wrapper {
    min-height: 60vh;
}
.l-request .pagination-section .pagination {
        justify-content: end!important;
}
.l-request .pagination-section  .page-link{
    margin: 0 0.3rem;
    border-radius: 100% !important;
    width: 2.3rem;
    height: 2.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.l-request .theme-form .control .input-group-btn button {
    border-radius: 0.2rem !important;
}

.l-request .accordion .item-wraper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.l-request .card-header-company {
    margin-bottom: 0.5rem !important;
    display: flex;
    align-items: center;
}

    .l-request .card-header-company .subcat {
        margin: 0rem !important;
    }

#BulkDriverActionModal .modal-dialog {
    max-width: 400px;
    margin: auto;
    height: 100%;
    align-items: center;
    max-height: unset;
    min-height: min-content;
    flex-direction: unset;
}

#BulkDriverActionModal .modal-dialog  .modal-body p{
    font-size: 1.2rem;
    text-align: center;
    font-weight: 600;
}
#TermsConditionsModal .modal-dialog {
    max-width: 1000px;
    height: 100%;
    max-height: unset;
    min-height: min-content;
    flex-direction: unset;
}

.l-request .OperationalDetailsModal .modal-dialog {
    max-width: 33rem;
    margin: 2rem auto;
    height: 100%;
    justify-content: center;
    align-items: center;
    max-height: unset;
}

.l-request .OperationalDetailsModal .modal-content {
    flex: none;
}

.l-request .OperationalDetailsModal .btn-close {
    opacity: 1;
    color: var(--mot-primary-color);
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 100%;
    background-color: var(--mot-lightgray-color);
    background-image: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.l-request .accordion .item-wraper {
    display: flex;
    align-items: center;
    border-radius: 8px;
    border: 1px solid var(--mot-light-color);
    background: var(--mot-white-color);
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.04);
    padding: 0.5rem 2.5rem 0.5rem 1rem;
    position: relative;
} 
 
/*MOT-Land Transport Licensing css End*/


.text-danger .fa-exclamation-triangle {
    color: var(--bs-danger-rgb) !important;
}

#MessagePanel.alert-danger #btnCloseMessage.close {
    display: none;
}

/* Fix the alert at the top */
body:has(.alert-danger .text-danger) .alert-danger {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
}

/* Push main-wrapper below the fixed alert */
body:has(.alert-danger .text-danger) .main-wrapper {
    margin-top: 3rem !important; /* <-- set this to match alert height */
}

@media (max-width:766px){
    body:has(.alert-danger .text-danger) .alert-danger {
        position: relative;
        margin-bottom:0.5rem
    }

    /* Push main-wrapper below the fixed alert */
    body:has(.alert-danger .text-danger) .main-wrapper {
        margin-top: 0rem !important; /* <-- set this to match alert height */
    }
}

.crmEntityFormView .actions .col-sm-6.clearfix, .crmEntityFormView .col-sm-6.clearfix {
    width: 100%;
    text-align: end;
}

.btn-for-delete {
    padding: 0.5rem 1rem !important;
    height: inherit !important;
    background-color: var(--mot-BGbase-color);
    font: inherit !important;
}

.crmEntityFormView .validation-summary.alert-danger.alert-block {
    color: var(--mot-bage-crimson-color) !important;
    background-color: var(--mot-dangerLight-color) !important;
    border-color: var(--mot-crimson-color) !important;
}

    .crmEntityFormView .validation-summary.alert-danger.alert-block h2.validation-header {
        color: var(--mot-bage-crimson-color) !important;
    }

.crmEntityFormView .validation-summary a, .crmEntityFormView .validation-summary li {
    color: var(--mot-bage-crimson-color) !important;
    text-decoration: none !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    margin: unset !important;
}

@media (max-width:991px) {
    #content-container.wrapper-body form#content_form .tab-column {
        padding: 10px !important;
    }
}

@media (max-width:991px) {
    .signUp-wraper .row > .col-xl-6.d-none {
        display: none
    }

    .signUp-wraper {
        padding: 0 1rem;
    }

        .signUp-wraper .row > .col-xl-6 {
            width: 100% !important;
        }

        .signUp-wraper .row {
            display: block !important;
            flex-wrap: nowrap;
            width: auto;
        }

    .nas-box .row.align-items-center > .col-lg-10 {
        flex: 0 0 100% !important;
        max-width: 100%;
    }

    .nas-box .row.align-items-center > .col-lg-2 {
        flex: 0 0 100% !important;
        max-width: 100%;
        margin-top: 1rem;
        text-align: start !Important;
    }

    .nas-box .row.align-items-center {
        display: block !important;
    }

    .signUp-wraper .row.mx-0 {
        margin: 0
    }

    [dir="ltr"] .signUp-wraper .row > .col-xl-6.login-pane {
        padding-left: 1rem !important;
    }

    [dir="rtl"] .signUp-wraper .row > .col-xl-6.login-pane {
        padding-right: 0 !important;
    }
}