/* You can add global styles to this file, and also import other style files */

@import url("https://fonts.googleapis.com/css?family=Cairo:400,300,700");
/* You can add global styles to this file, and also import other style files */


@font-face {
    font-family: 'ibmplexsansarabic-regular';
    src: url('/fonts/ibmplexsansarabic/ibmplexsansarabic-regular.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'ibmplexsansarabic-bold';
    src: url('/fonts/ibmplexsansarabic/ibmplexsansarabic-bold.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'ibmplexsansarabic-semibold';
    src: url('/fonts/ibmplexsansarabic/ibmplexsansarabic-semibold.ttf') format('truetype');
    font-display: swap;
}

:root {
    --dga-background-color: white
}
body {
    min-height: 100%;
    overflow-x: hidden;
    background: #F8F9F9 no-repeat bottom left;
    background-color: #F8F9F9 !important;
    background-size: 35%;
}

/* Card shadow by interactivity: informational cards have no shadow; add .shadow or .shadow-sm only to clickable cards (with links/buttons/actions). */
.card {
    box-shadow: none;
    border:none;
}


.body-content {
    /* background: linear-gradient(174.32deg, rgba(6, 29, 82, 0.58) 14.7%, rgba(21, 40, 82, 0.285841) 52.43%),
    linear-gradient(180.05deg, rgba(6, 29, 82, 0.58) 11.21%, rgba(21, 40, 82, 0.285841) 95.39%),
    url(/Logisti/img/containers.png) no-repeat center center; */
    background: linear-gradient(359.25deg, rgba(2, 22, 45, 0.44) 28.73%, rgba(0, 26, 54, 0.278943) 55.04%, rgba(12, 51, 94, 0.1452) 76.89%, rgba(219, 232, 245, 0.1452) 87.61%), url(/Logisti/img/containers-2.jpg) no-repeat center center;
    background-size: cover;
    width: 100vw;
    height: auto;
    transition: all 0.5s ease-in-out;
}

.bg-lg {
    height: 20vw !important;
}

.bg-md {
    height: 40vw;
}

.bg-sm {
    height: 25vw;
}

.bg-top {
    background-position-y: 0px;
}

a {
    text-decoration: none !important;
    color: #01527a;
}

a:hover,
a:active,
a:focus {
    color: #1a4c82;
}

a:not(.btn):hover,
a:not(.btn):active,
a:not(.btn):focus {
    text-decoration: underline;
}

a.disabled {
    pointer-events: none;
}

b,
strong {
    font-weight: bold !important;
}

.img,
.icon {
    vertical-align: middle;
}

/* DEPRECATED: Prefer DGA buttons (dga-btn, dga-btn--primary, etc.). See wwwroot/Logisti/css/buttons.css and DgaButton component. */
.btn {
    vertical-align: middle;
}

.btn-link {
    color: #1b8253;
}

.btn:hover,
.btn:active,
.btn:focus,
.ant-btn:hover,
.ant-btn:active,
.ant-btn:focus {
    background-color: #eff8f2 !important;
    border-color: transparent !important;
    color: #1b8253 !important;
}

.previous-btn {
    background: #f3f4f6 !important;
}

#FloatingDiv {
    height: 45px;
    position: fixed;
    z-index: 10 !important;
    top: 60% !important;
    inset-inline-start: 45px;
    inset-inline-end: auto;
    transform: rotate(270deg) !important;
    -ms-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform-origin: bottom left;
    background-color: #01527a;
    border-radius: 0px 0px 20px 20px;
}

[dir="rtl"] #FloatingDiv {
    transform-origin: bottom right;
}

.navbar-nav .nav-link {
    color: #001b28;
    border-bottom: 3px solid transparent;
}

.navbar-nav .nav-link.active {
    color: #005f8e !important;
    border-bottom-color: #005f8e;
}

.btn-primary {
    background-color: #01527a !important;
    border-color: #01527a !important;
}

.btn-default {
    background-color: white !important;
    border-color: #C7C8C8 !important;
    color: black !important;
}

.nav-pills .nav-link {
    color: #606161 !important;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: #005f8e !important;
    color: #fff !important;
}


.ant-btn-primary,
.btn-secondary {
    background-color: #1b8354 !important;
    border-color: #1b8354 !important;
}

.ant-btn {
    border-radius: var(--bs-border-radius-sm) !important;
    border: transparent !important;
}

.btn-danger {
    --bs-btn-color: #fff;
    --bs-btn-bg: #dc3545 !important;
    background-color: #dc3545 !important;
}


.text-primary {
    color: #337fa5 !important;
}

.text-secondary {
    color: #008f6a !important;
}

.w-10 {
    width: 10%;
}

.w-15 {
    width: 15%;
}

.RadioButton, .ant-radio-wrapper {
    /* border: 1px solid #E3E4E4 !important; */
    padding: 0px !important;
    margin: 0px !important;
    /* border-radius: 3.82px !important; */
}

.ant-radio-wrapper-checked {
    /*border: 1px solid #1b8354 !important;*/
    padding: 0px !important;
    margin: 0px !important;

    /*border-radius: 3.82px !important;*/
    color: #1b8354 !important;
}

.ant-radio-checked > .ant-radio-inner {
    border-color: #1b8354 !important;
}

.ant-radio-checked > .ant-radio-inner::after {
    background-color: #1b8354 !important;
}

.ant-radio-input:focus-visible + .ant-radio-inner,
.ant-radio-wrapper:hover .ant-radio-inner {
    border-color: #1b8354 !important;
}

.ant-radio-input:focus-visible + .ant-radio-inner {
    box-shadow: 0 0 0 2px rgba(27, 131, 84, 0.2) !important;
}

.ant-radio-group {
    display: flex;
    flex-direction: column;
}

.ant-badge-count,
.ant-badge-dot,
.ant-badge .ant-scroll-number-custom-component {
    border: none !important;
}

.ant-select-selector, .form-select {
    border-radius: var(--bs-border-radius-sm) !important;
    padding: 4px 13px !important;
    background-color: #fefefe;
    border: 1px solid #d0d5dd;
    border-color: #d0d5dd;
    height: 39px !important;
}

.ant-select-multiple .ant-select-selector {
    height: auto !important;
}

.ant-input-affix-wrapper {
    border-radius: 11px !important;
    padding: 0px !important;
}

.ant-input,
.form-control {
    border-radius: var(--bs-border-radius-sm) !important;
    padding: 8px !important;
    background-color: #fefefe;
    border: 1px solid #d0d5dd;
    border-color: #d0d5dd;
}

.border-gray {
    border-color: #d0d5dd !important;
}

.border-gray-dark {
    border-color: #dde1e7 !important;
}

.bg-primary-color {
    background-color: #01527a !important;
}

.bg-primary-light {
    background-color: #ecf2ff !important;
}

.text-land {
    color: #c59915 !important;
}

.text-maritime {
    color: #1378c2 !important;
}

.text-railway {
    color: #15c39a !important;
}

.text-air {
    color: #13adc2 !important;
}

.text-ports {
    color: #36a4bb !important;
}

.text-zatca {
    color: #4fbbbd !important;
}

.bg-land {
    background-color: #c59915 !important;
}

.bg-maritime {
    background-color: #1378c2 !important;
}

.bg-railway {
    background-color: #15c39a !important;
}

.bg-air {
    background-color: #13adc2 !important;
}

.bg-ports {
    background-color: #36a4bb !important;
}

.bg-zatca {
    background-color: #4fbbbd !important;
}

.border-land {
    border-color: #c59915 !important;
}

.border-maritime {
    border-color: #1378c2 !important;
}

.border-railway {
    border-color: #15c39a !important;
}

.border-air {
    border-color: #13adc2 !important;
}

.border-ports {
    border-color: #36a4bb !important;
}

.border-zatca {
    border-color: #4fbbbd !important;
}

.bg-greylight {
    background-color: #f5f6fa66 !important;
}

.bg-whitesmoke {
    background-color: whitesmoke !important;
}

.text-gray {
    color: #7f8187 !important;
}

.text-lightgreen {
    color: #009970 !important;
}

.text-darkred {
    color: #8b3c45 !important;
}

.text-primary,
.color-primary, label {
    color: #161616 !important;
}

.text-primary-dark {
    color: #01527a !important;
}

.text-warning {
    color: #fc7b04 !important;
}

.text-danger {
    color: #fb2727 !important;
}

.text-danger-dark {
    color: #fb2727 !important;
}

.text-blue {
    color: #005F8E !important;
}

.border-danger-dark {
    border-color: #fb2727 !important;
}

.border-warning {
    border-color: #fc7b04 !important;
}

.text-success-light {
    color: #29be38 !important;
}

.text-success {
    color: #1a9226 !important;
}

.text-secondary {
    color: #00b384 !important;
}

.border-success-light {
    border-color: #29be38 !important;
}

.border-blue {
    border-color: #005F8E !important;
}

.border-secondary {
    border-color: #00b384 !important;
}

.list-inline li {
    display: inline-block;
}

/*.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #D0D5DD;
    background-color: #fff;
    margin: 0px;
    padding: 0px;
}

    .pagination .page-item {
        margin: 0px;
        padding: 0px;
    }

        .pagination .page-item .page-link {
            margin: 0px;
            padding: 12px 24px;
            color: #7F8187;
            border-radius: 0px !important;
            border-top-width: 0px;
            border-bottom-width: 0px;
            font-size: 12pt;
        }

        .pagination .page-item.active {
        }

            .pagination .page-item.active .page-link {
                font-weight: bold;
                background-color: #FAFAFA !important;
                color: #009970 !important;
            }*/

:: placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #7f8187;
    opacity: 1;
    /* Firefox */
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #7f8187;
}

::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #7f8187;
}

.form-title {
    color: #161616 !important;
    margin: 48px 0;
    font-weight: bold;
}

input[disabled],
input[readonly],
input.disabled,
textarea[disabled],
textarea[readonly],
textarea.disabled {
    background-color: #e7e4e4;
    color: #888;
}

input[disabled]::placeholder,
input[readonly]::placeholder,
input.disabled::placeholder,
textarea[disabled]::placeholder,
textarea[readonly]::placeholder,
textarea.disabled::placeholder {
    color: #888;
}

.table-list {
    max-height: 50vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.border-dashed {
    border: var(--bs-border-width) dashed var(--bs-border-color) !important;
}

.border-dotted {
    border: var(--bs-border-width) dotted var(--bs-border-color) !important;
}

.input-file-hidden {
    width: 1px;
    height: 1px;
    visibility: collapse;
}

.c-pointer {
    cursor: pointer;
}

.c-none {
    pointer-events: none;
}

.ng-valid[required],
.ng-valid.required,
.form-control.is-valid,
.form-select.is-valid,
.was-validated .form-control:valid,
.was-validated .form-select:valid {
    border-right: 5px solid #42a948;
    /* background-image: none !important; */
}

.ng-invalid:not(form),
.form-control.is-invalid,
.form-select.is-invalid,
.was-validated .form-control:invalid,
.was-validated .form-select:invalid {
    /* border-right: 5px solid #a94442; */
}

.mdc-text-field--filled:not(.mdc-text-field--disabled) {
    background-color: transparent !important;
}

.mdc-checkbox .mdc-checkbox__native-control:enabled:checked ~ .mdc-checkbox__background,
.mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate ~ .mdc-checkbox__background,
.mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true]:enabled ~ .mdc-checkbox__background {
    background-color: #008f6a !important;
    border-color: #008f6a !important;
}

.mdc-checkbox .mdc-checkbox__native-control:focus:checked ~ .mdc-checkbox__ripple {
    background-color: #008f6a50 !important;
}

.mat-step-icon-state-edit,
.mat-step-icon-selected {
    background-color: #01527a !important;
}

input {
    /* color-scheme: dark; */
}

input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    color-scheme: dark;
    border-radius: 4px;
    opacity: 0.6;
    filter: invert(0.8);
}

input[type="date"]::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
}

.p-10 {
    padding: 6rem !important;
}

.px-10 {
    padding-right: 6rem !important;
    padding-left: 6rem !important;
}

.py-10 {
    padding-top: 6rem !important;
    padding-bottom: 6rem !important;
}

.pt-10 {
    padding-top: 6rem !important;
}

.pb-10 {
    padding-bottom: 6rem !important;
}

.p-15 {
    padding: 9rem !important;
}

.px-15 {
    padding-right: 9rem !important;
    padding-left: 9rem !important;
}

.py-15 {
    padding-top: 9rem !important;
    padding-bottom: 9rem !important;
}

.p-20 {
    padding: 12rem !important;
}

.px-20 {
    padding-right: 12rem !important;
    padding-left: 12rem !important;
}

.py-20 {
    padding-top: 12rem !important;
    padding-bottom: 12rem !important;
}

.m-10 {
    margin: 6rem !important;
}

.mx-10 {
    margin-right: 6rem !important;
    margin-left: 6rem !important;
}

.my-10 {
    margin-top: 6rem !important;
    margin-bottom: 6rem !important;
}

.mt-10 {
    margin-top: 6rem !important;
}

.mb-10 {
    margin-bottom: 6rem !important;
}

.m-15 {
    margin: 9rem !important;
}

.mx-15 {
    margin-right: 9rem !important;
    margin-left: 9rem !important;
}

.my-15 {
    margin-top: 9rem !important;
    margin-bottom: 9rem !important;
}

.m-20 {
    margin: 12rem !important;
}

.mx-20 {
    margin-right: 12rem !important;
    margin-left: 12rem !important;
}

.my-20 {
    margin-top: 12rem !important;
    margin-bottom: 12rem !important;
}

.vh-75 {
    height: 75vh !important;
}

.mvh-75 {
    min-height: 75vh !important;
}

.vh-50 {
    height: 50vh !important;
}

.mvh-50 {
    min-height: 50vh !important;
}

.vh-25 {
    height: 25vh !important;
}

.mvh-25 {
    min-height: 25vh !important;
}

.vh-15 {
    height: 15vh !important;
}

.mvh-15 {
    min-height: 15vh !important;
}

.vh-10 {
    height: 10vh !important;
}

.mvh-10 {
    min-height: 10vh !important;
}

.bg-white-50 {
    background-color: #ffffff50;
}

.bg-white {
    background-color: white !important;
}

.dropdown.caret-none .dropdown-toggle::after {
    content: none;
}

.news-container {
    border: 1px solid rgba(208, 213, 221, 0.4);
    border-radius: 2px;
    min-height: 420px;
}

.news-img {
    height: 250px;
    width: 100%;
}

.news-date {
}

.news-title {
    color: #5a6785;
}

.img-responsive {
    max-width: 100%;
}

.img-h-12 {
    height: 12px;
}

.img-h-18 {
    height: 18px;
}

.img-h-24 {
    height: 24px;
}

.img-h-32 {
    height: 32px;
}

.img-h-64 {
    height: 64px;
}

.fw-200 {
    font-weight: 200;
}

.navbar-toggler {
    border-width: 0px;
}

@media (max-width: 992px) {
    .bg-sm-dark {
        background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
    }

    .bg-sm-light {
        background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
    }
}

ngb-datepicker-navigation-select > .form-select {
    padding-top: 3px !important;
    padding-bottom: 3px !important;
}

.services-sectors-list {
}

.services-sectors-list-item {
}

.services-sectors-list-item .services-sectors-list-item-title {
    margin: 1em;
    padding: 0.75em 4em;
    color: #01527a;
    background-color: #fefefe;
    border: 1px solid rgba(208, 213, 221, 0.4);
    border-radius: 20.5px;
}

.services-sectors-list-item .services-sectors-list-item-title.active {
    color: #fff;
    background-color: #009970;
}

.services-sectors-list-item-start {
    color: #009970;
}

.services-list {
}

.services-list .services-list-item {
}

.services-list .services-list-item .services-list-item-container {
    border-top: 7px solid transparent;
}

.services-list .services-list-item .services-list-item-container .services-list-item-start {
    visibility: hidden;
}

.services-list .services-list-item:hover .services-list-item-container .services-list-item-start {
    visibility: visible;
}

.services-list .services-list-item:hover .services-list-item-container {
    border-top-color: #009970;
}

.services-list-item-description {
    min-height: 50px;
}

@media (max-width: 992px) {
    .services-sectors-list-item .services-sectors-list-item-title {
        margin: 0.5em;
        padding: 0.75em;
    }
}

.carousel-item-content {
    min-height: 40vh;
}

.ltr .carousel-item {
    float: left !important;
    margin-left: unset !important;
    margin-right: -100% !important;
}

.rtl .carousel-item {
    float: right !important;
    margin-right: unset !important;
    margin-left: -100% !important;
}

.carousel-control-prev {
    left: unset;
    right: 0;
}

[dir="ltr"] .sidebar,
.ltr .sidebar {
    right: unset !important;
    left: 0 !important;
    border-radius: 0px 16px 16px 0px !important;
}

[dir="ltr"] .sidebar-apps,
.ltr .sidebar-apps {
    right: unset !important;
    left: 0 !important;
}

[dir="ltr"] .main,
.ltr .main {
    direction: ltr;
    margin-right: calc(30px);
    margin-left: calc(270px + 30px);
}

[dir="ltr"] .sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item {
    margin-right: unset !important;
    /*margin-left: 0px !important;*/
}

[dir="ltr"] .sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item.sidebar-menu-list-item-user {
    margin-right: unset !important;
    margin-left: 0px !important;
}

[dir="ltr"] .sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item .sidebar-menu-list-item-icon {
    padding-right: unset !important;
    padding-left: 6px !important;
}

[dir="ltr"] .sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item .sidebar-menu-list-item-title {
    padding-right: unset !important;
    /*padding-left: 10px !important;*/
    text-align: left;
}

[dir="ltr"] .sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item.active {
    border-radius: 32px 0px 0px 32px !important;
}


.ngb-dp-day,
.ngb-dp-weekday,
.ngb-dp-week-number {
    flex-grow: 1;
}

.active .img-svg,
.active .img-svg path {
    fill: #01527a !important;
    stroke: #01527a !important;
}

.img-svg,
.img-svg path {
    fill: #fefefe !important;
    stroke: #fefefe !important;
}

.note {
    background-color: hsl(199.2deg 100% 95.1%);
    border: 1px solid hsl(202.68deg 97.62% 83.53%);
}

.ngb-dp-month {
    width: 100% !important;
}

@font-face {
    font-family: "DIN Next LT Arabic";
    src: local("DIN Next LT Arabic"), url("../fonts/din-next-lt-arabic/ArbFONTS-DINNextLTArabic-Regular-2.ttf");
}

@font-face {
    font-family: 'IBM Plex Sans Arabic Regular';
    font-weight: 400;
    src: url("../../fonts/IBM_Plex_Sans_Arabic/IBMPlexSansArabic-Regular.ttf");
}


html,
body,
input,
textarea,
select,
optgroup,
option,
div,
span,
b,
u,
ul,
ol,
li,
a,
blockquote,
label,
q,
em,
table,
thead,
tbody,
tfoot,
tr,
td,
th,
button,
p,
fieldset,
legend,
    /*h1,
    h2,
    h3,
    h4,
    h5,
    h6,*/
kbd,
canvas,
nav,
main,
section,
header,
footer {
    font-family: "ibmplexsansarabic-regular", sans-serif;
    /*font-family: "DIN Next LT Arabic";*/
    line-height: 1.5em;
    font-weight: 500 !important;
    font-size: 12px;
}

body {
    margin-top: calc(58px + 10px);
    margin-bottom: calc(115px + 10px);
}

.page-loader {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ffffff99;
    z-index: 999;
}

.img-loader {
    height: 120px;
    /*animation: zoominoutsinglefeatured 3s infinite;*/
}

.text-loader {
    animation: fadeIn 2s infinite alternate;
}

.page-title {
    color: #161616 !important;
    font-size: clamp(1.125rem, 2.5vw, 1.25rem);
    font-weight: 700 !important;
    line-height: 1.3;
    text-wrap: balance;
    max-width: 100%;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
    /* Avoid title sitting under fixed topbar when scrolling / anchor */
    scroll-margin-block-start: calc(72px + 16px);
}

/* Ensure anchor targets are not hidden under fixed topbar */
html {
    scroll-padding-block-start: calc(72px + 16px);
}

/* ----- Mobile H1 visibility (≤600px): clarity, spacing, RTL-safe, no clipping ----- */
@media (max-width: 600px) {
    /* ≥16px margin around content (including title) on mobile */
    .main {
        padding-inline: 16px;
    }

    .page-header-section {
        padding-inline: 16px;
        margin-block-start: 2.75rem;   /* ≥ 1.5× bottom margin (44px ≥ 1.5×28) */
        margin-block-end: 0;
    }

    .page-header-section .page-title,
    .page-header-section h1.page-title,
    h1.page-title {
        font-size: clamp(1rem, 4vw, 1.125rem);
        max-inline-size: 100%;
        margin-inline: 0;
        margin-block-end: 1.75rem;     /* 28px, within 24–32px */
        white-space: normal;
        overflow-wrap: break-word;
        word-break: break-word;
        overflow: visible;
        line-height: 1.4;
    }

    /* Standalone .page-title (e.g. list pages without PageHeaderSection): no clip, wrap */
    .page-title {
        font-size: clamp(1rem, 4vw, 1.125rem);
        max-inline-size: 100%;
        white-space: normal;
        overflow-wrap: break-word;
        word-break: break-word;
        overflow: visible;
        line-height: 1.4;
    }

    .page-header-section .page-subtitle {
        margin-block-start: 0.875rem;   /* 14px, within 12–16px */
    }

    /* ≥20px separation between title block and action buttons when stacked */
    .page-header-section .row > div:last-of-type {
        margin-block-start: 1.25rem;
    }
}

@media (max-width: 600px) and (orientation: landscape) {
    .page-header-section .page-title,
    .page-header-section h1.page-title,
    h1.page-title {
        font-size: clamp(0.875rem, 3vw, 1rem);
        max-inline-size: 100%;
    }
}

/* ===== Scrollbar CSS ===== */
/* Firefox */
* {
    scrollbar-width: auto;
    scrollbar-color: #bebebe #ffffff;
}

/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
    width: 16px;
}

*::-webkit-scrollbar-track {
    background: #ffffff;
}

*::-webkit-scrollbar-thumb {
    background-color: #bebebe;
    border-radius: 10px;
    border: 3px solid #ffffff;
}

.breadcrumb {
}

.breadcrumb .breadcrumb-list {
}

.breadcrumb .breadcrumb-list .breadcrumb-list-item {
    display: inline-block;
    margin: 4px 3px;
}

.breadcrumb .breadcrumb-list .breadcrumb-list-item.breadcrumb-list-item-path {
    color: #266a83;
}

.breadcrumb .breadcrumb-list .breadcrumb-list-item.breadcrumb-list-item-path .breadcrumb-list-item-path-icon,
.breadcrumb .breadcrumb-list .breadcrumb-list-item.breadcrumb-list-item-path svg {
    font-size: 6pt;
}

.breadcrumb .breadcrumb-list .breadcrumb-list-item .breadcrumb-list-item-link {
    color: #01527a99 !important;
}

.breadcrumb .breadcrumb-list .breadcrumb-list-item .breadcrumb-list-item-link.active {
    color: #888;
}

.breadcrumb-container .breadcrumb {
    background: transparent;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
}

.breadcrumb-container .breadcrumb-item {
    display: inline-flex;
    align-items: center;
}

.breadcrumb-container .breadcrumb-item + .breadcrumb-item::before {
    float: none !important;
    display: inline-flex;
    align-items: center;
    padding: 0 0.4rem;
    color: #9da4ae;
}

[dir="ltr"] .breadcrumb-container .breadcrumb-item + .breadcrumb-item::before {
    transform: scaleX(-1)
    /*content: " \003E ";*/
}

/*[dir="rtl"] .breadcrumb-container .breadcrumb-item + .breadcrumb-item::before {*/
/*    transform: scaleX(-1);*/
/*}*/

.breadcrumb-container .breadcrumb-item > a,
.breadcrumb-container .breadcrumb-item > .text-secondary {
    color: #9da4ae !important;
    text-decoration: none;
}

.breadcrumb-container .breadcrumb-item > a:hover {
    color: #7d8490 !important;
}

.breadcrumb-container .breadcrumb-item.active,
.breadcrumb-container .breadcrumb-item.text-primary.active {
    color: #384250 !important;
}

.breadcrumb-container .breadcrumb-item.active a,
.breadcrumb-container .breadcrumb-item.text-primary.active .text-secondary {
    color: #384250 !important;
}

.wizard-steps-list {
    overflow-x: auto;
}

.wizard-steps-list:before {
    content: ' ';
    position: absolute;
    top: 42%;
    /* right: 75%; */
    height: 3px;
    width: 85%;
    display: block;
    background: #01527a;
}

.wizard-steps-list-item {
    position: relative;
}

/* .wizard-steps-list-item:after {
    content: ' ';
    position: absolute;
    top: 40px;
    right: 75%;
    height: 3px;
    width: 125%;
    display: block;
    background: #01527a;
}

.wizard-steps-list-item:last-child:after {
    display: none;
}*/

.wizard-steps-list-item .wizard-steps-header-step-link .wizard-steps-header-step-icon {
    font-size: 20px;
    color: #606161;
    border: 1px solid #C7C8C8;
    vertical-align: middle;
    text-align: center;
    line-height: 40px;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    margin: 10px 5px;
    background-color: #fff;
    outline: 5px solid #fff;
}

.wizard-steps-list-item.active .wizard-steps-header-step-link .wizard-steps-header-step-icon {
    color: #01527a;
    border: 1px solid #01527a;
    background-color: #fff;
}

.wizard-steps-list-item.visited .wizard-steps-header-step-link .wizard-steps-header-step-icon {
    color: #fff;
    border: 1px solid #01527a;
    background-color: #01527a;
}

.wizard-steps-list-item.active .wizard-steps-header-step-link .wizard-steps-header-step-title {
    color: #01527a !important;
    font-weight: 700 !important;
    text-align: center;
}


.w-20 {
    width: 20%;
}

.wizard .wizard-header .wizard-steps-list-item .wizard-steps-header-step .wizard-steps-header-step-icon.active {
    border: 1px solid #009970;
    box-shadow: 0px 4px 22px rgba(224, 230, 246, 0.7);
}

.wizard .wizard-header .wizard-steps-list-item .wizard-steps-header-step .wizard-steps-header-step-number {
    color: #7e8494;
    display: block;
}

.wizard .wizard-header .wizard-steps-list-item .wizard-steps-header-step .wizard-steps-header-step-title {
    color: #606161;
    display: block;
}

.wizard .wizard-header .wizard-steps-list-item .wizard-steps-header-step-link {
    text-decoration: none !important;
    border: 3px solid #fff;
}

.wizard .wizard-header .wizard-steps-list-item.active .wizard-steps-header-step-link {
    pointer-events: none;
}

.wizard .wizard-header .wizard-steps-list-item.active .wizard-steps-header-step-link .wizard-steps-header-step-title {
    color: #004c72;
}

.wizard .wizard-header .wizard-steps-list-item.visited .wizard-steps-header-step-link {
    pointer-events: pointer;
}

.wizard .wizard-header .wizard-steps-list-item .wizard-steps-header-step-link {
    pointer-events: none;
}

.wizard .wizard-body {
    margin: 10px 0px;
    background: #ffffff;
    border: 1px solid rgba(208, 213, 221, 0.4);
    /* min-height: 400px; */
    /* box-shadow: 0px 8px 16px rgba(208, 213, 221, 0.4); */
}

.wizard .wizard-step {
    display: none;
}

.wizard .wizard-step.active {
    display: block;
}

.wizard .wizard-footer {
}

.text-justify {
    text-align: justify;
}

.icon-8 {
    height: 8px;
    width: 8px;
}

.icon-12 {
    height: 12px;
    width: 12px;
}

.icon-h-12 {
    height: 12px;
}

.icon-w-12 {
    width: 12px;
}

.icon-18 {
    height: 18px;
    width: 18px;
}

.icon-h-18 {
    height: 18px;
}

.icon-w-18 {
    width: 18px;
}

.icon-24 {
    height: 24px;
    width: 24px;
}

.icon-h-24 {
    height: 24px;
}

.icon-w-24 {
    width: 24px;
}

.icon-32 {
    height: 32px;
    width: 32px;
}

.icon-h-32 {
    height: 32px;
}

.icon-w-32 {
    width: 32px;
}

.icon-64 {
    height: 64px;
    width: 64px;
}

.icon-h-64 {
    height: 64px;
}

.icon-w-64 {
    width: 64px;
}

.icon-128 {
    height: 128px;
    width: 128px;
}

.icon-h-128 {
    height: 128px;
}

.icon-w-128 {
    width: 128px;
}

.icon-256 {
    height: 256px;
    width: 256px;
}

.icon-h-256 {
    height: 256px;
}

.icon-w-256 {
    width: 256px;
}

.icon-512 {
    height: 512px;
    width: 512px;
}

.icon-h-512 {
    height: 512px;
}

.icon-w-512 {
    width: 512px;
}

.fs-22 {
    font-size: 22pt;
}

.fs-20 {
    font-size: 20pt;
}

.fs-xl {
    font-size: 16pt;
}

.fs-15 {
    font-size: 15pt;
}

.fs-lg {
    font-size: 12pt;
}

.fs-md {
    font-size: 10pt;
}

.fs-sm {
    font-size: 9pt;
}

.fs-xs {
    font-size: 8pt;
}

.btn-toolbarx {
    min-height: 42.98px;
}

.btn-filter {
    border-color: #d0d5dd !important;
}

.navbar-toggler {
    margin-top: 2px;
    margin-left: 0px;
    padding: 3px 0px 3px 5px;
    box-shadow: none !important;
}

.icon-menu {
    position: relative;
    display: inline-block;
    width: 35px;
    height: 30px;
    margin-top: 8px;
    zoom: 0.5;
}

.icon-menu span {
    margin: 0 auto;
    position: relative;
    top: 12px;
}

.icon-menu span:before,
.icon-menu span:after {
    position: absolute;
    content: "";
}

.icon-menu span,
.icon-menu span:before,
.icon-menu span:after {
    width: 35px;
    height: 4px;
    border-radius: 15px;
    background-color: #000;
    display: block;
}

.icon-menu span:before {
    margin-top: -12px;
}

.icon-menu span:after {
    margin-top: 12px;
}

/* --- btn --- */
.icon-menu span {
    -webkit-transition-duration: 0s;
    transition-duration: 0s;
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.icon-menu.active span {
    background-color: rgba(0, 0, 0, 0);
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.icon-menu span:before {
    -webkit-transition-property: margin, -webkit-transform;
    transition-property: margin, transform;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-delay: 0.2s, 0s;
    transition-delay: 0.2s, 0s;
}

.icon-menu.active span:before {
    margin-top: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition-delay: 0s, 0.2s;
    transition-delay: 0s, 0.2s;
}

.icon-menu span:after {
    -webkit-transition-property: margin, -webkit-transform;
    transition-property: margin, transform;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-delay: 0.2s, 0s;
    transition-delay: 0.2s, 0s;
}

.icon-menu.active span:after {
    margin-top: 0;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transition-delay: 0s, 0.2s;
    transition-delay: 0s, 0.2s;
}

.active > .page-link,
.page-link.active {
    background-color: #01527a;
    border-color: #01527a;
}

.page-link,
.page-item.active {
    color: #01527a;
}

@media (min-width: 1300px) {
    .ant-steps:before {
        top: 37% !important;
    }
}

@media (max-width: 992px) {
    .ant-steps:before {
    }

    .wizard-steps-list:before {
        top: 47%;
    }

    .wizard-steps-header-step-link:not(.active) .wizard-steps-header-step-title {
        display: none !important;
    }

    .text-username {
        text-overflow: ellipsis;
        max-width: 100px;
    }

    th,
    td {
        min-width: 150px !important;
    }
}

/*
@media (max-width:1200px) {
    .ant-steps:before {
        width: 85% !important;
    }
}*/

@media (max-width: 1200px) and (min-width: 1600px) {
    .ant-steps:before {
        width: 88% !important;
    }
}

@media (min-width: 1200px) and (max-width: 1600px) {
    .ant-steps:before {
        width: 85% !important;
    }
}

@media (min-width: 1600px) and (max-width: 2000px) {
    .ant-steps:before {
        width: 86% !important;
    }
}

@media (min-width: 2000px) and (max-width: 3000px) {
    .ant-steps:before {
        width: 88% !important;
    }
}

@media (min-width: 3000px) {
    .ant-steps:before {
        width: 90% !important;
        top: 37% !important;
    }
}

@keyframes zoominoutsinglefeatured {
    0% {
        transform: scale(1, 1);
    }

    50% {
        transform: scale(1.2, 1.2);
    }

    100% {
        transform: scale(1, 1);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
}

.effect-3d {
    transform: rotate3d(0.5, -0.866, 0, 15deg) rotate(1deg);
    box-shadow: 2em 4em 6em -2em rgba(0, 0, 0, 0.5), 1em 2em 3.5em -2.5em rgba(0, 0, 0, 0.5);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    border-radius: 0.5em;
}

.effect-3d-container:hover .effect-3d,
.effect-3d:hover {
    transform: rotate3d(0, 0, 0, 0deg) rotate(0deg);
}

.effect-3d-2 {
    transform: rotateX(51deg) rotateZ(43deg);
    transform-style: preserve-3d;
    /* border-radius: 32px; */
    box-shadow: 1px 1px 0 1px #f9f9fb, -1px 0 28px 0 rgba(34, 33, 81, 0.01), 28px 28px 28px 0 rgba(34, 33, 81, 0.25);
    transition: 0.4s ease-in-out transform, 0.4s ease-in-out box-shadow;
}

.effect-3d-container:hover .effect-3d-2,
.effect-3d-2:hover {
    transform: translate3d(0px, -16px, 0px) rotateX(51deg) rotateZ(43deg);
    box-shadow: 1px 1px 0 1px #f9f9fb, -1px 0 28px 0 rgba(34, 33, 81, 0.01), 54px 54px 28px -10px rgba(34, 33, 81, 0.15);
}

.effect-3d-3 {
    transform: perspective(750px) translate3d(0px, 0px, -250px) rotateX(27deg) scale(0.9, 0.9);
    background: #e1c564;
    padding: 10px;
    border-radius: 20px;
    border: 4px solid #bd8b1a;
    /* box-shadow: 0 70px 40px -20px rgba(0, 0, 0, 0.2); */
    transition: 0.4s ease-in-out transform;
}

.effect-3d-container:hover .effect-3d-3,
.effect-3d-3:hover {
    transform: translate3d(0px, 0px, -250px);
}

.border-gold {
    border-color: #bd8b1a !important;
}


html,
body {
    height: 100%;
}

body {
    margin: 0;
    font-family: Roboto, "Helvetica Neue", sans-serif;
}

.dir-ltr {
    direction: ltr;
}

.dir-rtl {
    direction: rtl;
}

.bg-light {
    background-color: #00b38430 !important;
}

.bg-dark {
    background-color: #00b38430 !important;
}

.bg-primary {
    background-color: #00b384 !important;
}

.bg-gray {
    background-color: #f8f9f9 !important;
}

.bg-gray-light {
    background-color: #f1f1f1 !important;
}

.bg-gray-dark {
    background-color: #efefef !important;
}

.bg-red {
    background-color: #fb2727 !important;
}

.bg-blue {
    background-color: #02668E !important;
}

.text-muted {
    color: #a4a4a4 !important;
}

.text-darkgreen {
    color: #008f6a;
}

.text-darkgray {
    color: #606161 !important;
}

.rounded-5 {
    border-radius: 5em;
}

.rounded-4 {
    border-radius: 0.6em;
}

.badge-notification {
    position: absolute;
    top: -1px;
    right: -1px;
}

.dropdown-toggle.no-bs-caret::after {
    display: none;
}

.dropdown-menu-notifications {
    /*max-width: 100%;*/
    width: 300px;
    max-height: 70vh !important;
    overflow-y: auto !important;
}

.border-right-3 {
    border-style: solid;
    border-right-width: 3px;
}

.border-left-3 {
    border-style: solid;
    border-left-width: 3px;
}

.border-top-3 {
    border-style: solid;
    border-top-width: 3px;
}

.border-bottom-3 {
    border-style: solid;
    border-bottom-width: 3px;
}

.bg-opacity-05 {
    --bs-bg-opacity: 0.05;
}

.bg-opacity-06 {
    --bs-bg-opacity: 0.06;
}

.dropdown-item-action {
    margin-inline-end: 10px;
}

.dropdown-item:hover .dropdown-item-action,
.dropdown-item:active .dropdown-item-action {
    color: #009970 !important;
    font-weight: 600 !important;
    margin-inline-end: 0px;
    transition: all 0.1s ease-in-out;
}

.app-body-content {
    /* padding: 10px; */
}

@media (max-width: 992px) {
    .app-body-content {
        margin-block-start: 72px;
        margin: 0;

    }
}

.img-logo {
    height: 45px;
}

.img-menu {
    height: 12px;
}

.topbar {
    width: 100%;
    height: 72px;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.075) 0 2px 4px 0;
    position: fixed;
    inset-block-start: 0;
    inset-inline-start: 0;
    inset-inline-end: 0;
    padding: 24px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    z-index: 1000;
    box-sizing: border-box;
}

.topbar--logisti {
    padding: 24px;
    align-items: center;
    justify-content: space-between;
}

.topbar__start {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: auto;
}

[dir="ltr"] .topbar--logisti .topbar__start {
    order: 1;
    flex: 1 1 auto;
    min-width: fit-content;
    /*flex-direction: row-reverse;*/
    justify-content: space-between;
}

[dir="ltr"] .topbar--logisti .topbar__toggler {
    margin-inline-end: 0;
    margin-inline-start: 8px;
}

[dir="rtl"] .topbar__start {
    /*flex-direction: row-reverse;*/
    order: -1;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: space-between;
}

.topbar__toggler {
    margin-inline-end: 8px;
}

[dir="rtl"] .topbar__toggler {
    margin-inline-end: 8px;
    margin-inline-start: 0;
}

.topbar__toggler-btn {
    padding: 3px 5px;
    font-size: 16px;
    color: #212529;
    background: transparent;
    border: none;
    cursor: pointer;
}

.topbar__logo {
    display: block;
}

.topbar__logo-link {
    display: block;
    color: #212529;
    text-decoration: none;
    font-size: 18.67px;
    line-height: 28px;
}

.topbar__logo-link:hover {
    color: #212529;
}

.topbar__nav {
    margin-inline-start: 16px;
    margin-inline-end: 16px;
    position: relative;
    align-items: center;
    flex: 1 1 auto;
    display: flex;
}

.topbar__nav-inner {
    display: flex;
    flex-basis: auto;
    flex-grow: 1;
    align-items: center;
}

.topbar__nav-list {
    display: flex;
    flex-direction: row;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    gap: 0;
}

.topbar__nav-item {
    margin-inline-start: 4px;
    margin-inline-end: 4px;
    list-style: none;
    padding: 0;
}

.topbar__nav-link {
    display: block;
    padding: 14px 22px;
    font-size: 16px;
    font-weight: 400;
    color: #001b28;
    text-decoration: none;
    transition: 0.2s ease-in-out;
    border-bottom: 4px solid transparent;
    position: relative;
}

.topbar__nav-link:hover {
    color: #001b28;
    text-decoration: none;
}

.topbar__nav-item--active .topbar__nav-link {
    color: #fff;
    background: #1b8354;
}

.topbar__nav-item--active {
    background: #1b8354;
}

.topbar__nav-item--dropdown .dropdown-toggle::after {
    display: none;
}

.topbar__dropdown {
    margin-top: 1px;
    padding: 8px 0;
    border: 0.8px solid #f6f7f7;
    border-radius: 8px;
    box-shadow: #e1e1e1 0 4px 8px 0;
    min-width: 160px;
}

.topbar__dropdown .dropdown-item {
    display: block;
    width: 100%;
    padding: 4px 16px;
    color: #212529;
    text-align: right;
    text-decoration: none;
    background: transparent;
    border: none;
}

.topbar__dropdown .dropdown-item:hover {
    background-color: #e9ecef;
}

[dir="ltr"] .topbar__dropdown .dropdown-item {
    text-align: left;
}

.topbar__end {
    display: flex;
    align-items: center;
}

.topbar__actions {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 8px 0;
}

.topbar__actions > li {
    margin-inline-start: 4px;
    margin-inline-end: 4px;
}

.topbar__action-link {
    display: block;
    padding: 22px 14px;
    font-size: 16px;
    font-weight: 400;
    color: #001b28;
    text-decoration: none;
    transition: 0.2s ease-in-out;
    border-bottom: 4px solid transparent;
}

.topbar__action-link:hover {
    color: #001b28;
    text-decoration: none;
}

.topbar .topbar-title {
    padding: 0.25em 0.15em;
    font-size: 14pt;
}

.topbar .topbar-right {
    float: none;
    margin-inline-start: auto;
    margin-inline-end: 0;
}

.topbar > *:not(.topbar-right) {
    float: none;
    /*margin-inline-end: auto;*/
    /*margin-inline-start: 0;*/
}

[dir="ltr"] .topbar .topbar-right,
html:not([dir="rtl"]) .topbar .topbar-right {
    order: 1;
    margin-inline-end: auto;
    margin-inline-start: 0;
}

[dir="ltr"] .topbar > *:not(.topbar-right),
html:not([dir="rtl"]) .topbar > *:not(.topbar-right) {
    order: 2;
    /*margin-inline-start: auto;*/
    /*margin-inline-end: 0;*/
}

[dir="rtl"] .topbar .topbar-right {
    order: 1;
    margin-inline-end: auto;
    margin-inline-start: 0;
}

[dir="rtl"] .topbar > *:not(.topbar-right) {
    order: 2;
    /*margin-inline-start: auto;*/
    /*margin-inline-end: 0;*/
}

@media (max-width: 991.98px) {
    .topbar {
        padding: 16px;
    }
}

@media (max-width: 575.98px) {
    .topbar {
        padding: 12px;
    }
}

.topbar .dropdown-menu {
    margin-top: 14px !important;
    border-radius: 6px;
    box-shadow: 0px 0px 20px 0px #e1e1e1;
    z-index: 1001;
}

.topbar__account-dropdown {
    position: relative;
    display: inline-block;
}

.topbar__account-dropdown .text-truncate {
    max-width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar__account-dropdown .dropdown-menu {
    min-width: max(100%, 20rem);
    width: max-content;
    box-sizing: border-box;
}

.ant-modal-wrap,
.account-switcher .ant-modal-wrap {
    z-index: 1000000 !important;
}

.ant-modal-mask {
    z-index: 999999 !important;
}

.ant-select-dropdown {
    z-index: 1000001 !important;
}

/* ========== Accessibility widget (Userway): RTL/LTR mirroring, no overlap with nav ==========
   LTR: button on RIGHT (inset-inline-end). RTL: button on LEFT (inset-inline-end flips).
   Positioned below topbar (72px + safe-area) so it never covers hamburger/menu.
   z-index 99 (below topbar 100) so nav stays on top.
*/
#userwayAccessibilityIcon,
[id^="userway"] {
    position: fixed !important;
    inset-inline-end: 1rem !important;
    inset-inline-start: auto !important;
    /*top: calc(72px + env(safe-area-inset-top, 0px)) !important;*/
    bottom: 16px !important;
    z-index: 99 !important;
}

@media (max-width: 767px) {
    #userwayAccessibilityIcon,
    [id^="userway"] {
        inset-inline-end: 0.75rem !important;
        /*top: calc(72px + env(safe-area-inset-top, 0px) + 8px) !important;*/
    }
}

.sidebar {
    width: 270px;
    height: calc(100vh - 98px);
    /*background-color: #f8f9fa !important;*/
    color: #1f2937;
    position: fixed;
    padding: 0px;
    top: 8.8em;
    right: 1.5em;
    left: unset;
    border-radius: unset;
    z-index: 99;
    box-shadow: -3px 3px 6px 0px #d0d4d9;
    border: 0px solid #e5e7eb;
}

.sidebar-apps {
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: fixed;
    bottom: 0;
    top: 0;
    right: 0;
    z-index: 99;
    width: 50px;
    padding: 0px;
    border-radius: 0px;
    background-color: #3c4b6b !important;
}

.sidebar-apps .sidebar-apps-list {
    justify-content: center;
    height: calc(100vh - 60px - 60px);
}

.sidebar-apps .sidebar-apps-list .sidebar-apps-list-item {
    height: 58px;
    border-bottom: 1px solid #3c4b6b;
    border-radius: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sidebar-apps .sidebar-apps-list .sidebar-apps-list-item:last-child {
    border-bottom-width: 0px;
}

.sidebar-apps .sidebar-apps-list .sidebar-apps-list-item.active .sidebar-apps-list-item-link {
    background-color: #01527a !important;
    padding: 8px !important;
    display: inline-block;
    border-radius: 6px !important;
    box-shadow: 0px 1px 4px #1a4c82;
}

.sidebar-apps .sidebar-apps-list .sidebar-apps-list-item .sidebar-apps-list-item-link {
    border-radius: 0px;
}

.sidebar .user-info {
    margin: 50px 0px;
}

.sidebar .user-info .user-info-switch-account-img {
    height: 14px;
    cursor: pointer;
}

.sidebar .user-info .user-info-name {
    font-size: 9pt;
}

.sidebar .sidebar-menu {
    margin: 15px 0px;
    overflow: auto;
    max-height: 100%;
    padding: 0 !important;
}

[dir="rtl"] .sidebar-menu {
    direction: ltr !important;
}

[dir="rtl"] .sidebar .sidebar-menu .sidebar-menu-list {
    direction: rtl !important;
}

[dir="ltr"] .sidebar-menu {
    direction: rtl !important;
}

[dir="ltr"] .sidebar .sidebar-menu .sidebar-menu-list {
    direction: ltr !important;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item {
    margin: 4px 0px;
    padding: 1px !important;
    cursor: pointer;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item.sidebar-menu-list-item-user {
    margin-right: 0px;
    cursor: auto;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item .sidebar-menu-list-item-icon {
    height: 18px;
    padding-right: 6px;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item .sidebar-menu-list-item-title {
    text-align: right;
    font-size: 16px;
    color: #1f2937;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item .sidebar-menu-list-item-link {
    color: #1f2937;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item .sidebar-menu-list-item-link:hover {
    color: #1b8354;
    text-decoration: none !important;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item.active {
    background: #e6f7f3;
    border-radius: 8px;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item.active .sidebar-menu-list-item-title,
.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item .sidebar-menu-list-item-title.active {
    color: #1b8354;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item.active .sidebar-menu-list-item-icon svg path,
svg.active path {
    color: #1b8354 !important;
    fill: #1b8354 !important;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item:hover .sidebar-menu-list-item-title {
    color: #374151;
}

.sidebar .sidebar-menu .collapse > ul li .sidebar-menu-list-item-title:hover {
    color: #1b8354 !important;
}

.sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item:hover .sidebar-menu-list-item-title {
    color: #374151;
}

.sidebar .sidebar-menu .collapse > ul li .sidebar-menu-list-item-title:hover {
    color: #1b8354 !important;
}

/*.collapse .sidebar-menu-list-item-link:hover {
    color: #02537B!important;
}
.collapse .sidebar-menu-list-item:hover .sidebar-menu-list-item-title {
    color: #02537B !important;
}
.collapse .sidebar-menu-list-item .sidebar-menu-list-item-title:hover {
    color: #02537B !important;
}*/

.hide-navbar {
    margin-left: auto !important;
    margin-right: auto !important;
}

[dir="ltr"] .ltr .hide-navbar {
    margin-left: auto !important;
    margin-right: auto !important;
}
.page-wrapper {
    background: var(--dga-background-color);
}
.main {
    width: calc(100% - (270px + 35px));
    /*margin-top: calc(72px + 25px);*/
    margin-top: calc(25px);
    margin-bottom: calc(60px + 20px);
    margin-left: calc(30px);
    margin-right: calc(270px + 30px);
    padding-bottom: calc(60px);
    /*   padding-right: 15px;
    padding-left: 15px;*/
    min-height: 100vh;
    /*background:var(--dga-background-color);*/
    /*padding: 10px;*/
}

.main-zero-margin {
    margin-left: auto !important;
    margin-right: auto !important;
}

/*.ant-alert-info > .ant-alert-content >.ant-alert-message {*/
/*    color: #fff;*/
/*}*/
.ant-alert-info {
    background-color: #1b825347;
    border: unset;
}

.footer-section {
    --bs-border-color: #dee2e6;
    background-color: #f1f2f4;
    /*margin-top: 50vh;*/
    position: relative;
    z-index: 100;
}

.footer-section .footer-heading::after {
    content: "";
    background: #d2d6db;
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: -8px;
    right: 0;
}

.footer-section .footer-heading {
    position: relative;
    font-size: 12.81px;
    font-weight: 600;
    color: #343a40;
    margin-bottom: 0.75rem;
}

.footer-section a {
    color: #495057;
    text-decoration: none;
    font-size: 11.21px;
}

.footer-section a:hover {
    text-decoration: underline;
}

.footer-section ul li a {
    min-height: 24px;
    padding: 4px 0;
    display: inline-block;
}

.footer-section .social-icons a {
    /*margin-left: 0.5rem;*/
    font-size: 1.2rem;
    color: #495057;
}

.footer-section .social-icons a:hover {
    color: #343a40;
}

.footer-section .accessibility-icons .btn {
    margin-inline-start: 0.5rem;
    font-size: 1rem;
    padding: 0.25rem 0.5rem;
}

.footer-section .footer-logo {
    max-width: 120px;
    height: auto;
}

.form-switch-lg {
    zoom: 1.4;
}

.email-ltr {
    direction: ltr;
    unicode-bidi: bidi-override;
}

.mat-calendar {
    width: 100% !important;
}

.mat-calendar-body-selected {
    background-color: #01527a !important;
}

@media (max-width: 992px) {
    body.navbar-open-mobile {
        overflow: hidden;
        position: fixed;
        width: 100%;
        left: 0;
        right: 0;
    }

    #MainNavbar.navbar-collapse.show,
    #MainNavbar.collapse.show {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        max-height: 100vh;
        margin: 0 !important;
        padding: 0;
        z-index: 1000;
        overflow-x: hidden;
        overflow-y: auto;
        border-radius: 0;
        box-shadow: none;
        z-index: 10000;

    }

    [dir="rtl"] #MainNavbar.navbar-collapse.show,
    [dir="rtl"] #MainNavbar.collapse.show {
        right: 0;
        left: 0;
    }

    #MainNavbar.navbar-collapse.show .sidebar,
    #MainNavbar.collapse.show .sidebar {
        display: flex;
        flex-direction: column;
        width: 100% !important;
        height: 100% !important;
        min-height: 100vh;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        box-shadow: none;
        border-radius: 0;
        margin: 0;
        overflow-x: hidden;
        overflow-y: visible;
    }

    #MainNavbar.navbar-collapse.show .sidebar .sidebar-menu,
    #MainNavbar.collapse.show .sidebar .sidebar-menu {
        flex: 1 1 auto;
        min-height: 0;
        overflow: auto;
    }

    .sidebar-header-mobile {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding: 1rem;
        min-height: 52px;
        border-bottom: 1px solid #e9ecef;
        flex-shrink: 0;
    }

    [dir="rtl"] .sidebar-header-mobile {
        justify-content: flex-start;
    }

    .sidebar-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        padding: 0;
        border: none;
        background: transparent;
        color: #606161;
        cursor: pointer;
        border-radius: 0.375rem;
        font-size: 1.25rem;
        transition: background-color 0.15s ease, color 0.15s ease;
    }

    .sidebar-close:hover {
        background: rgba(0, 0, 0, 0.06);
        color: #333;
    }

    .sidebar-close:focus-visible {
        outline: 2px solid #008F6A;
        outline-offset: 2px;
    }

    .sidebar .user-info {
        margin: 10px 0px;
    }

    .sidebar .sidebar-menu .sidebar-menu-list .sidebar-menu-list-item {
        margin-right: 0px;
    }

    .sidebar-footer.sidebar-mobile-actions {
        padding: 1rem;
        border-top: 1px solid #e9ecef;
        flex-shrink: 0;
        min-width: 0;
        overflow: visible;
    }

    .sidebar-mobile-actions .dropdown {
        position: relative;
    }

    .sidebar-mobile-actions .dropdown-menu {
        position: absolute;
        top: 100%;
        inset-inline-start: 0;
        margin-top: 0.125rem;
        min-width: 100%;
    }

    [dir="rtl"] .sidebar-mobile-actions .dropdown-menu {
        inset-inline-start: auto;
        inset-inline-end: 0;
    }

    .sidebar-mobile-actions-inner {
        min-width: 0;
        overflow-x: hidden;
    }

    .sidebar-mobile-actions-inner ul {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.5rem;
        min-width: 0;
    }

    .sidebar-mobile-actions .dropdown-menu {
        display: none;
        z-index: 1060;
    }

    .sidebar-mobile-actions .dropdown.show .dropdown-menu,
    .sidebar-mobile-actions .dropdown-menu.show {
        display: block !important;
        z-index: 1060;
    }

    .main {
        width: calc(100% - (0px)) !important;
        margin-right: calc(0px) !important;
        margin-left: calc(0px) !important;
        padding-bottom: calc(100px) !important;
    }

    .footer {
        width: calc(100% - (0px));
        margin-right: calc(0px);
    }
}


/* font & color */
.fs-12 {
    font-size: 12px;
}

.fs-14 {
    font-size: 14px;
}

.fs-16 {
    font-size: 16px;
}

.fs-18 {
    font-size: 18px;
}

.fs-20 {
    font-size: 20px;
}

.fs-24 {
    font-size: 24px;
}

.fs-28 {
    font-size: 28px;
}

.fs-32 {
    font-size: 32px;
}

.fs-40 {
    font-size: 40px;
}

.fw-600 {
    font-weight: 600;
}

.text-dark {
    color: #505151;
}

.text-muted {
    color: #606161
}

.text-muted {
    color: #808181;
}

.tx-navy {
    color: #003047;
}

.tx-green {
    color: #00B384;
}

.tx-vdarkgray {
    color: #4D5F69;
}

.tx-darkyellow {
    color: #C59915;
}

.tx-blue {
    color: #337FA5;
}

.tx-darkorange {
    color: #F99207;
}

.tx-softorange {
    color: #B57F58;
}

.bg-color-mint {
    background-color: #CCF0E6;
}

.bg-color-gray {
    background-color: #F7F9FB;
}

.bg-color-green {
    background-color: #00B384;
}

.bg-color-soft-orange {
    background-color: #FFF1C6;
}


.btn-orange {
    color: #B57F58;
    background-color: #FFFAEB;
    border-radius: 8px;
    border: 1px solid #DBC5AD;
}

/*Added*/
.ant-table-pagination {
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-color: var(--bs-link-color);
    --bs-pagination-bg: var(--bs-body-bg);
    --bs-pagination-border-width: var(--bs-border-width);
    --bs-pagination-border-color: var(--bs-border-color);
    --bs-pagination-border-radius: var(--bs-border-radius);
    --bs-pagination-hover-color: var(--bs-link-hover-color);
    --bs-pagination-hover-bg: var(--bs-tertiary-bg);
    --bs-pagination-hover-border-color: var(--bs-border-color);
    --bs-pagination-focus-color: var(--bs-link-hover-color);
    --bs-pagination-focus-bg: var(--bs-secondary-bg);
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: #0d6efd;
    --bs-pagination-active-border-color: #0d6efd;
    --bs-pagination-disabled-color: var(--bs-secondary-color);
    --bs-pagination-disabled-bg: var(--bs-secondary-bg);
    --bs-pagination-disabled-border-color: var(--bs-border-color);
    display: flex;
    padding-right: 0;
    list-style: none;
}

.ant-table-pagination.ant-pagination {
    margin: 10px !important;
}

.ant-pagination-next .ant-pagination-item-link, .ant-pagination-prev .ant-pagination-item-link {
    position: relative;
    display: block;
    padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
    font-size: var(--bs-pagination-font-size);
    color: var(--bs-pagination-color);
    text-decoration: none;
    background-color: var(--bs-pagination-bg);
    border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    --bs-text-opacity: 1;
    color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important;
}


[dir=rtl] .ant-pagination-item {
    margin-left: 0;
    margin-right: 8px;
    height: 32px !important;
}

/*[dir=rtl] .ant-pagination-jump-next, [dir=rtl] .ant-pagination-jump-prev, [dir=rtl] .ant-pagination-prev {
    margin-right: 8px;
    margin-left: 0;
}*/
[dir=rtl] .ant-pagination-item-link .anticon {
    -webkit-transform: rotate(-180deg);
    /* transform: rotate(-180deg); */
}

.ant-pagination-disabled {
    color: var(--bs-secondary-color);
    background-color: var(--bs-secondary-bg) !important;
    height: 32px !important;
}

.ant-pagination.mini .ant-pagination-prev, .ant-pagination.mini .ant-pagination-next {
    height: 32px;
    color: var(--bs-secondary-color);
}

.ant-pagination-jump-next {
    color: var(--bs-secondary-color);
    /*background-color: var(--bs-secondary-bg) !important;*/
    height: 32px !important;
    margin: 0 !important;
    /*border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);*/
}

.ant-pagination-item a {
    position: relative;
    display: block;
    padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
    font-size: var(--bs-pagination-font-size);
    color: var(--bs-pagination-color);
    text-decoration: none;
    border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.ant-pagination-item-active a {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
    background-color: #0d6efd;
}

.ant-pagination-item-active {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
    background-color: #0d6efd;
}

.ant-pagination-item-link {
}

.ant-pagination-item-ellipsis, ant-pagination-item-container {
    padding-top: 3px;
    height: 0 !important;
}

.ant-pagination-options {
    margin-left: 10px !important;
}

.ant-pagination-options .ant-select-selector {
    height: 32px !important
}

.ant-pagination-options .ant-select-selector .ant-select-selection-item {
    padding-top: 2px !important
}

/*[dir=rtl] .ant-pagination-item-link .anticon {
    transform: rotate(180deg)
}*/


.ant-table table {
    padding: 0
}

.ant-table table th {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
    padding-left: .5rem !important;
    padding-right: .5rem !important;
}

th.ant-table-cell.ant-table-column-has-sorters.ant-table-column-sort {
    color: #009970 !important;
    font-weight: bold !important;
}

.ant-table-column-sort .ant-table-column-title {
    font-weight: bold !important
}

.ant-table-column-sorter {
    color: var(--bs-emphasis-color) !important;
}

.ant-table-column-sorter-up.active, .ant-table-column-sorter-down.active {
    color: #009970 !important;
}

td, th {
    text-align: start !important;
    padding: 0 6px;
}

.MediumAvatar {
    display: inline-flex;
    width: 48px;
    height: 48px;
    background-color: darkgoldenrod !important;
    border-radius: 100%;
    color: #fff;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 20px 0 5px;
    font-size: 1.1rem;
    vertical-align: middle
}

.VipAvatar {
    display: inline-flex;
    width: 34px;
    height: 32px;
    background-color: darkgoldenrod !important;
    border-radius: 100%;
    color: #fff;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.1rem;
    vertical-align: middle;
}

.PrimeAvatar {
    display: inline-flex;
    width: 33px;
    height: 31px;
    background-color: silver !important;
    border-radius: 100%;
    color: #fff;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.1rem;
    vertical-align: middle
}

.ant-tabs-tab + .ant-tabs-tab {
    margin: 10px;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    -webkit-box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    right: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    left: 0.75rem;
    top: 0.5rem;
}

.ant-dropdown-menu-submenu .ant-dropdown-menu-submenu-inline .ant-dropdown-menu-submenu-open {
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
    border-color: var(--bs-border-color);
    border-width: var(--bs-border-width);
    border-radius: var(--bs-border-radius);
    border-radius: calc(var(--bs-border-radius) - (var(--bs-border-width)));
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    color: var(--bs-body-color);
}

.ant-dropdown-menu-root {
    --bs-dropdown-zindex: 1000;
    --bs-dropdown-min-width: 10rem;
    --bs-dropdown-padding-x: 0;
    --bs-dropdown-padding-y: 0.5rem;
    --bs-dropdown-spacer: 0.125rem;
    --bs-dropdown-font-size: 1rem;
    --bs-dropdown-color: var(--bs-body-color);
    --bs-dropdown-bg: var(--bs-body-bg);
    --bs-dropdown-border-color: var(--bs-border-color-translucent) !important;
    --bs-dropdown-border-radius: var(--bs-border-radius) !important;
    --bs-dropdown-border-width: var(--bs-border-width) !important;
    --bs-dropdown-inner-border-radius: calc(var(--bs-border-radius) - var(--bs-border-width)) !important;
    --bs-dropdown-divider-bg: var(--bs-border-color-translucent) !important;
    --bs-dropdown-divider-margin-y: 0.5rem;
    --bs-dropdown-box-shadow: var(--bs-box-shadow);
    --bs-dropdown-link-color: var(--bs-body-color);
    --bs-dropdown-link-hover-color: var(--bs-body-color);
    --bs-dropdown-link-hover-bg: var(--bs-tertiary-bg);
    --bs-dropdown-link-active-color: #fff;
    --bs-dropdown-link-active-bg: #0d6efd;
    --bs-dropdown-link-disabled-color: var(--bs-tertiary-color);
    --bs-dropdown-item-padding-x: 1rem;
    --bs-dropdown-item-padding-y: 0.25rem;
    --bs-dropdown-header-color: #6c757d;
    --bs-dropdown-header-padding-x: 1rem;
    --bs-dropdown-header-padding-y: 0.5rem;
    /*position: absolute;*/
    z-index: var(--bs-dropdown-zindex);
    min-width: var(--bs-dropdown-min-width);
    padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);
    margin: 0;
    font-size: var(--bs-dropdown-font-size);
    color: var(--bs-dropdown-color);
    text-align: right;
    list-style: none;
    background-color: var(--bs-dropdown-bg);
    background-clip: padding-box;
    border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
    border-radius: var(--bs-dropdown-border-radius);
}


.list-group {
    --bs-list-group-color: var(--bs-body-color);
    --bs-list-group-bg: var(--bs-body-bg);
    --bs-list-group-border-color: var(--bs-border-color);
    --bs-list-group-border-width: var(--bs-border-width);
    --bs-list-group-border-radius: var(--bs-border-radius);
    --bs-list-group-item-padding-x: 1rem;
    --bs-list-group-item-padding-y: 0.5rem;
    --bs-list-group-action-color: var(--bs-secondary-color);
    --bs-list-group-action-hover-color: var(--bs-emphasis-color);
    --bs-list-group-action-hover-bg: var(--bs-tertiary-bg);
    --bs-list-group-action-active-color: var(--bs-body-color);
    --bs-list-group-action-active-bg: var(--bs-secondary-bg);
    --bs-list-group-disabled-color: var(--bs-secondary-color);
    --bs-list-group-disabled-bg: var(--bs-body-bg);
    --bs-list-group-active-color: #fff;
    --bs-list-group-active-bg: #0d6efd;
    --bs-list-group-active-border-color: #0d6efd;
    display: flex;
    flex-direction: column;
    padding-right: 0;
    margin-bottom: 0;
    border-radius: var(--bs-list-group-border-radius);
}

.ant-dropdown-menu {
    text-align: inherit !important;
    border-radius: 10px !important;
}

.list-group-item {
    position: relative !important;
    display: block !important;
    color: #000 !important;
    text-decoration: none !important;
    background-color: #fff !important;
    border: unset !important;
}

.list-group-item + .list-group-item {
    border-top-width: 0 !important;
}

.ant-dropdown-menu-submenu-title {
    padding: 5px 12px;
}


/**/
.ant-dropdown-menu-submenu-arrow::before {
    transform: rotate(-45deg) translateX(4.5px);
}

.ant-dropdown-menu-submenu-open > .ant-dropdown-menu-submenu-title > .ant-dropdown-menu-submenu-arrow::before {
    transform: rotate(45deg) translateX(4.5px) !important;
}

.ant-dropdown-menu-submenu-arrow::after {
    transform: rotate(45deg) translateX(-4.5px);
}

.ant-dropdown-menu-submenu-open > .ant-dropdown-menu-submenu-title > .ant-dropdown-menu-submenu-arrow::after {
    transform: rotate(-45deg) translateX(-4.5px) !important;
}

.ant-dropdown-menu-submenu-open > .ant-dropdown-menu-submenu-title > .ant-dropdown-menu-submenu-arrow {
    top: 13px !important;
}

.ant-dropdown-menu-submenu-expand-icon, .ant-dropdown-menu-submenu-arrow {
    position: absolute !important;
    top: 19px !important;
    left: 10px !important;
    width: 10px !important;
    color: rgba(0, 0, 0, 0.85) !important;
    transform: translateY(-50%) !important;
    transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
}

.ant-dropdown-menu-submenu-arrow::before, .ant-dropdown-menu-submenu-arrow::after {
    position: absolute;
    width: 8px;
    height: 1px;
    background-color: #292D31;
    border-radius: 2px;
    transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), top 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    content: '';
}

/**/
.ant-dropdown-menu-submenu-open .ant-dropdown-menu-submenu-title {
    color: var(--bs-accordion-active-color);
    background-color: #cfe2ff;
    box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}

.ant-dropdown-menu-sub {
    border-bottom-left-radius: var(--bs-accordion-border-radius) !important;
    border-bottom-right-radius: var(--bs-accordion-border-radius) !important;
    box-shadow: unset !important;
    border-radius: var(--bs-border-radius-xl) !important;
    padding: 0 !important;
    margin: .50rem !important;
}

.ant-modal,
.ant-form-item-label {
    text-align: start !important;
}

.ant-modal,
.ant-form-item-label label {
    font-weight: bold !important;
}

.ant-table {
    border-left: unset !important;
    border-right: unset !important;
}

/*ant-steps*/

.ant-steps-item-container {
    text-align: center !important;
}

.ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
    color: #384250 !important;
    /*font-weight: 700 !important;*/
    /*text-align: center;*/
}

.ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
    color: #606161 !important;
    display: block;
    font-family: "ibmplexsansarabic-regular", sans-serif;
    line-height: 1.5em;
    font-weight: 500 !important;
    font-size: 10pt;
    padding: 0 0 0 11px;

}

.ant-steps-icon > .anticon.anticon-check > svg.icon {
    /* Your styles here */
    font-size: 20px;
    text-align: center;
    margin-right: -5px;
    margin-left: -5px;
    margin-top: 5px;
}


:root[lang="en"] .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
    padding: 0 11px 0 0;

}

.ant-steps {
    gap: 4px !important;
    flex-wrap: wrap;
}

.ant-steps-label-vertical .ant-steps-item-content {
    width: 100%
}

.ant-steps-label-vertical .ant-steps-item-icon {
    margin: 10px 25px;
}

.ant-steps-item-icon {
    margin: 10px 5px;
}

@media (min-width: 1280px) {
    .container {
        max-width: 1216px !important;
    }
}

.ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-icon {
    color: #fff !important;
    border: 2px solid #1b8354 !important;
    background-color: #1b8354 !important;
}

.ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-icon {
    color: #1b8354 !important;
    border: 2px solid #1b8354 !important;
    background-color: #fff !important;
}

.ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-tail::after {
    background-color: #1b8354 !important;
}

.ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
    color: #6c737f !important;
}

.ant-steps-item-process > .ant-steps-item-container > .ant-steps-item-icon .ant-steps-icon {
    color: #1b8354 !important;
}

.ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-icon .ant-steps-icon {
    color: white !important;
}

.ant-steps-item-icon {
    padding: 17px !important;
}

.ant-steps-icon {
    color: #7e8494 !important;
    top: -15px !important;
    left: 5px !important;
    font-size: 20px !important;
}

[dir= ltr] .ant-steps-icon {
    left: -6px !important;
}

/*step tail*/
.ant-steps-label-vertical .ant-steps-item-content {
    text-align: start !important;
}

.ant-steps-item-container {
    text-align: start !important;
}

.ant-steps-item-tail {
    padding: 4px 44px 0 0 !important;
    margin-left: -20px !important;
}

[dir= ltr] .ant-steps-item-tail {
    padding: 4px 60px 0 0 !important;
    margin-left: 75px !important;
}

.ant-steps-item-tail::after {
    /*background: #d2d6db !important;*/
    height: 2.7px !important;
}

/**/

[type=number] {
    text-align: end !important;
}

label {
    font-weight: 600 !important;
}

/*Requests*/
.card:has(.steps-header) {
    background: transparent;
    border: 0;
}

.card-body:has(.steps-header) {
    padding: 0 !important;
}

.steps-header {
    padding: 10px;
    --bs-card-spacer-y: 1rem;
    --bs-card-spacer-x: 1rem;
    --bs-card-title-spacer-y: 0.5rem;
    --bs-card-border-width: var(--bs-border-width);
    --bs-card-border-color: var(--bs-border-color-translucent);
    --bs-card-border-radius: var(--bs-border-radius);
    --bs-card-inner-border-radius: calc(var(--bs-border-radius) - (var(--bs-border-width)));
    --bs-card-cap-padding-y: 0.5rem;
    --bs-card-cap-padding-x: 1rem;
    --bs-card-cap-bg: rgba(var(--bs-body-color-rgb), 0.03);
    --bs-card-bg: var(--bs-body-bg);
    --bs-card-img-overlay-padding: 1rem;
    --bs-card-group-margin: 0.75rem;
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: var(--bs-card-height);
    color: var(--bs-body-color);
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    /*border: var(--bs-card-border-width) solid var(--bs-card-border-color);*/
    border-radius: 16px;
    margin-bottom: 1rem;
}

@media (max-width: 768px) {
    .steps-header .ant-steps.ant-steps-horizontal {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
    }

    .steps-header .ant-steps:before {
        display: none;
    }

    .steps-header .ant-steps-item-title::after {
        display: none;
    }

    .steps-header .ant-steps-item {
        display: block;
        flex: 1 0 auto;
        overflow: visible;
        padding-inline-start: 0;
        width: 100%;
    }

    .steps-header .ant-steps-item-container {
        position: relative;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        text-align: start;
    }

    .steps-header .ant-steps-item-icon {
        float: none;
        display: inline-block;
        margin: 0 16px 0 0;
        flex-shrink: 0;
    }

    [dir="rtl"] .steps-header .ant-steps-item-icon {
        margin: 0 0 0 16px;
    }

    .steps-header .ant-steps-item-content {
        display: block;
        min-height: 48px;
        overflow: hidden;
        flex: 1;
        width: auto;
        margin-top: 0;
        text-align: start;
    }

    .steps-header .ant-steps-item-tail {
        position: absolute;
        top: 0;
        inset-inline-start: 16px;
        width: 1px;
        height: 100%;
        padding: 38px 0 6px;
        margin: 0;
    }

    .steps-header .ant-steps-item-tail::after {
        width: 1px;
        height: 100%;
        background: #f0f0f0;
    }

    .steps-header .ant-steps-item-process .ant-steps-item-tail::after,
    .steps-header .ant-steps-item-finish .ant-steps-item-tail::after {
        background: #1b8354;
    }

    .steps-header .ant-steps-item:last-child .ant-steps-item-tail {
        display: none;
    }
}

.ant-steps-item-icon {
    border: 2px solid #d2d6db;
}

.ant-steps-item-tail {
    padding: 4px 34px 0 0 !important;
    margin-left: -28.6px !important;
}

/*.ant-modal .steps-action {
    width: 100% !important;
    background-color: var(--bs-card-bg) !important;
    float: inherit !important;
    flex-direction: column !important;
}
.ant-modal .steps-action > button {
    width: 10% !important;
}*/

.step-action {
    margin-top: 25px;
    margin-bottom: 10px;
    border: 0;
    background-color: transparent;
    display:flex;
    gap:5px;
    align-content: center;
    align-items: center;
    width:100%;
    justify-content: end;
}

.steps-content {
    padding: 10px;
    top: 15px;
    --bs-card-spacer-y: 1rem;
    --bs-card-spacer-x: 1rem;
    --bs-card-title-spacer-y: 0.5rem;
    --bs-card-border-width: var(--bs-border-width);
    --bs-card-border-color: var(--bs-border-color-translucent);
    --bs-card-border-radius: var(--bs-border-radius);
    --bs-card-inner-border-radius: calc(var(--bs-border-radius) - (var(--bs-border-width)));
    --bs-card-cap-padding-y: 0.5rem;
    --bs-card-cap-padding-x: 1rem;
    --bs-card-cap-bg: rgba(var(--bs-body-color-rgb), 0.03);
    --bs-card-bg: var(--bs-body-bg);
    --bs-card-img-overlay-padding: 1rem;
    --bs-card-group-margin: 0.75rem;
    position: relative;
    display: flex !important;
    flex-direction: column;
    min-width: 0;
    height: var(--bs-card-height);
    color: var(--bs-body-color);
    word-wrap: break-word;
    background-color: var(--bs-card-bg);
    background-clip: border-box;
    /*border: var(--bs-card-border-width) solid rgb(203, 204, 205);*/
    border-radius: 16px;
}

/*requests*/
[dir="ltr"] .ant-modal-close {
    right: 0 !important;
    left: auto !important;
}

[dir="rtl"] .ant-modal-close {
    left: 0 !important;
    right: auto !important;
}


.ant-modal-max-btn {
    left: 54px !important;
    right: auto !important;
}

.ant-modal-footer {
    text-align: end !important;
}

.ant-input-group-addon {
    width: fit-content !important;
    padding: 0 !important;
}

.ant-select-dropdown div {
    width: 100% !important;
}

.ant-select-item.ant-select-item-option {
    width: auto !important;
}

.ant-input-group-addon:first-child {
    border-right: 1px solid #d9d9d9 !important;
}

.ant-notification-notice-close {
    left: 22px !important;
    right: auto !important;
}

ul {
    padding-left: 0;
    list-style-type: none;
    margin-bottom: 0;
    padding-right: 0;
    text-align: justify;
}


/*view Mode*/

.viewMode input.ant-input, .viewMode textarea, .viewMode .ant-input-number-input, .viewMode select,
.viewMode .ant-input-number {
    border: none !important;
    background: white !important;
    padding: 0 !important;
    color: var(--primaryDark) !important;
}

.viewMode .ant-select .ant-select-selection-item {
    color: black !important;
    padding: 0 !important;
}

/*.viewMode button.ant-switch,*/
.viewMode span.ant-select-arrow {
    display: none
}

.ant-select-disabled .anticon-down {
    display: none !important;
}

.ant-input-group-addon:has(~ .ant-input-disabled) {
    border: 0px !important;
}

.viewMode .ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {
    border: none;
    background: transparent;
    padding: 0 !important;
}

.viewMode .ant-form-item-label > label,
.viewMode .ant-form-item-control-input-content label {
    color: #98A2A8;
    font-weight: normal
}

.card:has(.viewMode) {
    border: 0 !important;
}

.card-body:has(.viewMode),
.steps-content:has(.viewMode) {
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.card .card-header h4 {
    padding: 0 2%;
    margin: 0;
}

.ant-input[disabled], .ant-picker-input > input[disabled], .ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {
    color: rgb(0 0 0 / 55%) !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}

.ant-input ant-input-lg ant-input-disabled {
    color: rgb(0 0 0 / 55%) !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}

.border-dashed {
    border-style: dashed !important;
}

.ant-form-horizontal .ant-form-item {
    align-items: center;
}

/*ant-cascader-picker-arrow*/

.ant-cascader-picker-arrow {
    right: 12px;
    left: auto;
}

.ant-input-lg.ant-cascader-input.ant-input {
    padding: 6.5px 11px;
    padding-right: 24px;
}

.ant-cascader-menu-item {
    color: initial;
}

.ant-cascader-menu {
    width: auto !important;
}

.ant-cascader-menus {
}

.ant-cascader-menu-item-expand .ant-cascader-menu-item-expand-icon {
    right: 12px;
    left: auto;
}

.ant-cascader-picker-clear {
    right: 12px;
    left: auto;
}

[dir= rtl] .ant-cascader-menu-item-expand .ant-cascader-menu-item-expand-icon {
    transform: rotate(180deg);
}

/*dropdown-menu*/
.dropdown-menu {
    background-color: #fff;
    box-shadow: 0 3px 6px -4px rgb(0 0 0 / 12%), 0 6px 16px 0 rgb(0 0 0 / 8%), 0 9px 28px 8px rgb(0 0 0 / 5%);
    border: 1px solid #F7F7F7;
    border-radius: 4px;
}

.dropdown-item {
    border: 1px solid transparent;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: #1e2125;
    background: #eff8f2;
    border: 1px solid #eff8f2;
}

.dropdown-item a,
.dropdown-item button,
.dropdown-item button:hover,
.dropdown-item button:focus,
.ant-dropdown-menu button,
.ant-dropdown-menu button:hover,
.ant-dropdown-menu button:focus {
    color: #6A7881;
    font-weight: normal;
    font-size: 1rem;
    /*   padding: 0;*/
}

.ant-modal-header, .ant-modal-content {
    border-radius: 10px !important;
}

.ant-modal-title {
    margin: 0.5rem !important;
    font-size: 13pt !important;
    color: #161616 !important;
    font-weight: bold !important;
    display:inline;
}

[dir= rtl] .ant-select-single.ant-select-show-arrow .ant-select-selection-item, .ant-select-single.ant-select-show-arrow .ant-select-selection-placeholder
.ant-menu-inline.ant-menu-root .ant-menu-submenu-title {
    padding-right: unset !important;
    padding-left: 18px !important;
}

.ant-input-group-addon .ant-select-single.ant-select-show-arrow .ant-select-selection-item {
    padding-left: 5px !important;
}

[dir= rtl] .ant-input-group .ant-input {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-top-left-radius: 11px;
    border-bottom-left-radius: 11px;
}

[dir= rtl] .ant-select-arrow {
    left: 11px !important;
    right: unset !important;
}

[dir= rtl] .ant-select-selection-placeholder {
    padding-right: 0px !important;
}

.ant-table-cell {
    /*padding: 1% 0px !important;*/
}

.ant-table table th {
    padding: 1.2rem 1rem !important;
}

.anticon-delete {
    color: #FB2727 !important;
}

.ant-upload-list-item.ant-upload-list-item-done.ant-upload-list-item-list-type-picture {
    border-radius: 0.25rem !important;
    background: #f3f4f6 !important
}

.ant-select-dropdown {
    border-radius: 6px !important;
}

.ant-dropdown-menu:Empty:After {
    content: 'This div is empty';
}

#bg-text {
    opacity: 0.5;
    position: absolute;
    z-index: 0;
    background: transparent;
    display: block;
    color: red;
    font-size: 80px;
    transform: rotate(300deg);
    -webkit-transform: rotate(300deg);
    height: 50%;
}

/*added*/

.validation-errors {
    --bs-alert-padding-x: 1rem;
    --bs-alert-padding-y: 1rem;
    --bs-alert-margin-bottom: 1rem;
    --bs-alert-border: var(--bs-border-width) solid var(--bs-alert-border-color);
    --bs-alert-border-radius: var(--bs-border-radius);
    position: relative;
    color: var(--bs-alert-color);
    background-color: var(--bs-alert-bg);
    border: var(--bs-alert-border);
    border-radius: var(--bs-alert-border-radius);
    --bs-alert-color: var(--bs-danger-text-emphasis);
    --bs-alert-bg: var(--bs-danger-bg-subtle);
    --bs-alert-border-color: var(--bs-danger-border-subtle);
    --bs-alert-link-color: var(--bs-danger-text-emphasis);
    margin-bottom: 1rem !important;
    padding: .5rem !important;
}

.validation-message {
    color: #fb2727 !important;
    --bs-text-opacity: 1;
}

.bgWorldMap {
    background-image: url(/Logisti/img/MapWorldBg.png);
    /* background-position: left; */
    background-repeat: no-repeat;
    background-size: contain;
    /* width: 100%; */
    /* height: 80vh; */
    z-index: 9;
    overflow: hidden;
    background-size: 100% 100%;
}

.bgCountryMap {
    background-image: url(/Logisti/img/FrameLogin.png);
    background-position: 0vh 14vh;
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    min-height: 81vh;
    z-index: 999;
    background-size: 98% 72%;
}

[dir="ltr"] .homeArrowSVG {
    transform: rotate(180deg);
}

.ant-select-multiple .ant-select-selection-item-content {
    margin: 0 4px 0 4px !important;
}

.danger, .danger > td {
    background-color: #ffccc7 !important;
}

.danger:hover, .danger:hover > td {
    background-color: #ffa39e !important;
}

}


.btn-draft {
    background-color: #17A2B8;
    color: #FFFFFF;
    border: none;
    font-weight: bold;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.3s ease-in-out, transform 0.2s;
}

.btn-draft:hover {
    background-color: #138496; /* Darker teal for hover */
    transform: scale(1.05);
}

.btn-draft:active {
    background-color: #117A8B; /* Even darker teal for click effect */
    transform: scale(0.98);
}

.blazored-typeahead__active-item,
.blazored-typeahead__result:hover,
.blazored-typeahead__result:focus {
    background-color: #e6f7ff;
    border-top: 1px solid #e6f7ff;
    border-bottom: 1px solid #e6f7ff;
    color: var(--bs-body-color);
    cursor: pointer;
}

.blazored-typeahead__input-icon:focus {
    outline: none;
    box-shadow: unset;
}

.blazored-typeahead {
    background: white;
    border: unset;
    border-radius: unset;
}

.blazored-typeahead:focus-within {
    box-shadow: unset;
}

.blazored-typeahead.valid.modified {
    border: unset !important;
}

.anticon {
    vertical-align: .20em;
}

.blazored-typeahead.valid.modified {
    border: unset !important;
}

.ImageBox {
    width: 80px;
    height: 80px;
    background: #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    border-radius: 5px;
}

.required-label::after {
    content: " *";
    color: red;
}

.ant-input-textarea-show-count::after {
    float: none;
}

.collapse-header {
    /* background-color: #f9f9f9; */
    border: 1px solid #ddd;
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
    cursor: pointer;
    position: relative;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.arrow-icon {
    transition: transform 0.3s ease;
}

.arrow-icon.rotate {
    transform: rotate(180deg);
}

.card-body-custom {
    border: 1px solid #ddd;
    border-top: none;
    border-radius: 0 0 0.5rem 0.5rem;
    padding: 1.5rem;
    background-color: #fff;
}

.servicesCard {
    border-width: 2px;
    min-height: 200px;
}

.tooltip-custom {
    position: relative;
    display: inline-block;
}

.breadcrumb-container .breadcrumb-item.text-primary.active {
    color: #9DA4AE !important;
}

.breadcrumb-container .breadcrumb-item > .text-secondary {
    color: #384250 !important;
}

.ant-switch-checked {
    background-color: #1b8354;
}

.ant-switch {
    border-radius: 3px;
    margin: 6px !important;
}

.ant-switch-handle::before {
    border-radius: 3px;
}

.ant-switch-handle {
    top: 3px;
    width: 16px;
    height: 16px;
}

/*.form-title.modal-title::before {*/
/*    content: "";*/
/*    display: inline-block;*/
/*    margin-right: -12px; !* Space between icon and text *!*/
/*    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPgo8c3ZnIHdpZHRoPSI4MDBweCIgaGVpZ2h0PSI4MDBweCIgdmlld0JveD0iMCAwIDI0IDI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xMiA3aDF2N2gtMXptMS41IDkuNWExIDEgMCAxIDAtMSAxIDEuMDAyIDEuMDAyIDAgMCAwIDEtMXptOS4zLTRBMTAuMyAxMC4zIDAgMSAxIDEyLjUgMi4yYTEwLjI5NyAxMC4yOTcgMCAwIDEgMTAuMyAxMC4zem0tMSAwYTkuMyA5LjMgMCAxIDAtOS4zIDkuMyA5LjMxIDkuMzEgMCAwIDAgOS4zLTkuM3oiLz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDI0djI0SDB6Ii8+PC9zdmc+") no-repeat center center;*/
/*    background-size: contain; !* Ensures the SVG scales properly *!*/
/*    top: 23px;*/
/*    position: absolute;*/
/*    width: 27px;*/
/*    height: 27px;*/
/*    color: #9da4ae;*/
/*    OUTLINE: #9da4ae;*/
/*    OPACITY: 0.5;*/
/*}*/

/*.ant-upload.ant-upload-drag {*/
/*    border: unset !important;*/
/*    border-radius: unset !important;*/
/*    transition: unset !important;*/
/*    background: unset !important;*/

/*}*/

.ant-upload {
    text-align: start;
}

.anticon.anticon-check > svg {
    filter: drop-shadow(0.2px 0 0 currentColor) drop-shadow(-0.2px 0 0 currentColor) drop-shadow(0 0.2px 0 currentColor) drop-shadow(0 -0.2px 0 currentColor);
}

.attachment-uploader-details .text-muted,
.attachment-uploader-details .text-info {
    color: #64748b !important;
}

/* Add the heavier weight only to .text-info */
.attachment-uploader-details .text-info {
    font-weight: 800 !important;
}

.attachment-uploader-button {
    background: #0d121c !important;
    color: #fff !important;
}

.attachment-name > span {
    font-size: 16px !important;
}

/*.ant-upload-list-picture .ant-upload-list-item-thumbnail img,*/
/*.ant-upload-list-picture-card .ant-upload-list-item-thumbnail img {*/
/*    display: block;*/
/*    width: 0px;*/
/*    height: 0px;*/
/*    overflow: hidden;*/
/*}*/

.ant-upload-list-item-thumbnail {
    position: relative;
}

/* 1) the green circle behind */
/*.ant-upload-list-item-thumbnail::after {*/
/*    content: "";*/
/*    position: absolute;*/
/*    top: 50%;*/
/*    left: 50%;*/
/*    width: 32px;*/
/*    height: 32px;*/
/*    background-color: #067647;*/
/*    border-radius: 50%; !* full circle *!*/
/*    transform: translate(-50%, -50%) scale(0); !* start hidden *!*/
/*    z-index: 0; !* behind the check *!*/
/*    animation: circle-pop 0.3s ease-out forwards;*/
/*}*/

/* 2) the checkmark on top */
/*.ant-upload-list-item-thumbnail::before {*/
/*    content: "";*/
/*    position: absolute;*/
/*    top: 50%;*/
/*    left: 50%;*/
/*    width: 20px;*/
/*    height: 20px;*/
/*    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik00IDEyLjYxMTFMOC45MjMwOCAxNy41TDIwIDYuNSIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPg0KPC9zdmc+");*/
/*    background-repeat: no-repeat;*/
/*    background-size: contain; !* keep it sharp *!*/
/*    background-position: center;*/
/*    transform: translate(-50%, -50%) scale(0); !* start hidden *!*/
/*    transform-origin: center; !* pivot for shake *!*/
/*    z-index: 1; !* on top *!*/
/*    animation: check-pop 0.3s ease-out 0.3s forwards, !* pop in *! shake 0.5s ease-in-out 0.7s forwards; !* then shake *!*/
/*}*/

@keyframes circle-pop {
    to {
        transform: translate(-50%, -50%) scale(1);
    }
}

@keyframes check-pop {
    to {
        transform: translate(-50%, -50%) scale(1);
    }
}

@keyframes shake {
    /* start and end upright */
    0%, 100% {
        transform: translate(-50%, -50%) scale(1) rotate(0deg);
    }
    /* tilt left */
    20%, 60% {
        transform: translate(-50%, -50%) scale(1) rotate(-10deg);
    }
    /* tilt right */
    40%, 80% {
        transform: translate(-50%, -50%) scale(1) rotate(10deg);
    }
}

/*.ant-upload-list-item-progress {*/
/*    width: 0px !important;*/
/*    height: 0px !important;*/
/*}*/

.ant-upload{
    padding: 0 20px;
}
.anticon.anticon-delete > svg {
    width: 0 !important;
}


.anticon.anticon-delete {
    position: relative;
}

.anticon.anticon-delete::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KDTwhLS0gVXBsb2FkZWQgdG86IFNWRyBSZXBvLCB3d3cuc3ZncmVwby5jb20sIEdlbmVyYXRvcjogU1ZHIFJlcG8gTWl4ZXIgVG9vbHMgLS0+DQo8c3ZnIHdpZHRoPSI4MDBweCIgaGVpZ2h0PSI4MDBweCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPg0KPGcgaWQ9Ik1lbnUgLyBDbG9zZV9MRyI+DQo8cGF0aCBpZD0iVmVjdG9yIiBkPSJNMjEgMjFMMTIgMTJNMTIgMTJMMyAzTTEyIDEyTDIxLjAwMDEgM00xMiAxMkwzIDIxLjAwMDEiIHN0cm9rZT0iIzAwMDAwMCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4NCjwvZz4NCjwvc3ZnPg==");
    background-repeat: no-repeat;
    background-size: contain; /* keep it sharp */
    background-position: center;
    transform: translate(-50%, -50%); /* start hidden */
    transform-origin: center; /* pivot for shake */
    z-index: 1; /* on top */
    /*animation: check-pop 0.3s ease-out 0.3s forwards, !* pop in *! shake 0.5s ease-in-out 0.7s forwards; !* then shake *!*/
}

.uwaw-footer > .uwaw-footer__i {
    width: 0 !important;
}

.ant-input-group-addon .ant-select {
    margin: 0px;
}

.list-group-item:first-child {
    border-top-right-radius: unset;
    border-top-left-radius: unset;
    border-color: #989898 !important;
}

.list-group-item:last-child {
    border-bottom-left-radius: unset;
    border-bottom-right-radius: unset;
    border-color: #989898 !important;

}

.list-group-item.ant-dropdown-menu-item:hover {
    background-color: #f3f3f3 !important;
    /*color: #fff !important;*/
}

.list-group-item.ant-dropdown-menu-item {
    background-color: #f9fafb !important;
    margin-bottom: 2px;
    border-radius: 6px;
}

.form-divider {
    font-size: 14px;
    border-bottom: 1px #e0e0e0 solid;
    width: 66%;
}

.form-row-col-8 {
    --bs-columns: 8 !important;
    gap: 1rem !important;
}

.table-design {
    background-color: #ff3a00 !important;
}

.ant-table-thead > tr > th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before {
    position: absolute;
    top: 50%;
    right: 0;
    width: 1px;
    height: 1.6em;
    background-color: rgba(0, 0, 0, 0.06);
    transform: translateY(-50%);
    transition: background-color 0.3s;
    content: unset !important;
}

.table-design > .card,
.table-design > .card-body,
.table-container,
.table-responsive,
.tab-content,
.ant-table-wrapper,
.ant-spin-nested-loading,
.ant-table,
.ant-table-container,
.ant-table-content,
.ant-table-tbody,
.ant-empty,
.ant-drawer,
.ant-table-cell, .ant-table-column-has-sorters {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
}

.ant-table-thead .ant-table-cell {
    position: relative;
}


.ant-table-thead {
    background-color: #f3f4f6 !important;
}

.ant-table-row {
    border-bottom: 1px solid #eaeaea !important;
}

.table-design > .card {
}

.ant-table-pagination.ant-table-pagination-right.ant-pagination.ant-pagination-mini {
    display: flex !important;
    justify-content: center !important;
}

.ant-spin-container {
    position: relative;
    display: flex;
    flex-direction: column;
    /*justify-content: center;*/
    /*align-items: center;*/
}

.ant-table {
    width: 100%;
    /*border:1px solid #d2d6db !important;*/
    /*padding: 6px;*/
}

.badge {
    pointer-events: none; /* Prevent interactions */
    user-select: none; /* Prevent text selection */
    font-size: 12px;
    font-weight: 600 !important;
}

.badge-soft {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    padding: 0.35em 0.75em;
    border-radius: 0.375rem;
    border: 1px solid transparent;
    min-width: 57px;
    min-height: 29px;
    text-align: center;
    white-space: nowrap;
    font-weight: 600 !important;
    border:none;
}

/* Primary */
.badge-soft-primary {
    background-color: #edf6fd;
    color: #1848a8;
    border-color: #b1dbfd;
}

/* Secondary */
.badge-soft-secondary {

    background-color: #fafafa;
    color: #434343;
    border-color: #ededed;
}

/* Success */
.badge-soft-success {
    background-color: #eafbf1;
    color: #085c3a;
    border-color: #aaedc4;
}

/* Danger */
.badge-soft-danger {
    background-color: #fcf1f0;
    color: #902018;
    border-color: #fccbc8;
}

/* Warning */
.badge-soft-warning {
    background-color: #fff9ec;
    color: #996800;
    border-color: #ffe2a7;
}

/* Info */
.badge-soft-info {
    background-color: #e8f4f8;
    color: #0a6c8c;
    border-color: #a7e3f6;
}

/* Light */
.badge-soft-light {
    background-color: #fefefe;
    color: #7b7b7b;
    border-color: #dedede;
}

/* Dark */
.badge-soft-dark {
    background-color: #e6e6e6;
    color: #212529;
    border-color: #999999;
}

.datagrid-tabs > li > div > .nav-link.active {
    background-color: transparent !important;
    color: #161616 !important;
    font-weight: 700 !important;
}

.datagrid-tabs button {
    transition: all 0.2s !important;
    border: unset !important;
    background: unset !important;
    position: relative;
}

.datagrid-tabs button.active {
    color: #1b8354 !important;
    font-weight: bold !important;
}

.datagrid-tabs button:hover {
    color: #1b8354 !important;

}

.datagrid-tabs button::after {
    width: 100%;
    transform: scaleX(0);
    transform-origin: inset-inline-start;
    transition: transform 0.25s ease-out !important;
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-inline-end: 0;
    bottom: -4px;
    margin-inline: auto;
    height: 3px;
    background-color: #198754; /* green underline */
    border-radius: 2px;
    z-index: 1;
}

.datagrid-tabs button.active::after,
.datagrid-tabs button:hover::after {
    transform: scaleX(1);
}


@media (max-width: 768px) {

}

.search-container {
    background-color: #fff;
    /*border-radius: 20px;*/
    /*padding: 19px 24px 50px 0px;*/
    /*margin: 40px 0px;*/
}

.search-container label {
    margin-bottom: 6px;
}


.icon-container {
    width: 40px !important;
    height: 40px !important;
    /*background: #f1faf4;*/
    border-radius: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.icon-container {
    width: 46px!important;
    height: 46px!important;
}


.icon-container img {
    width: 24px !important;
    height: 24px !important;
}


/*.ant-modal-header {
    padding: 40px 26px 0px 30px !important;
}*/

.ant-modal-header::before {
    content: "";
    display: inline-block;
    /*margin-right: 8px;*/ /* Space between icon and text */
    background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPgo8c3ZnIHdpZHRoPSI4MDBweCIgaGVpZ2h0PSI4MDBweCIgdmlld0JveD0iMCAwIDI0IDI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xMiA3aDF2N2gtMXptMS41IDkuNWExIDEgMCAxIDAtMSAxIDEuMDAyIDEuMDAyIDAgMCAwIDEtMXptOS4zLTRBMTAuMyAxMC4zIDAgMSAxIDEyLjUgMi4yYTEwLjI5NyAxMC4yOTcgMCAwIDEgMTAuMyAxMC4zem0tMSAwYTkuMyA5LjMgMCAxIDAtOS4zIDkuMyA5LjMxIDkuMzEgMCAwIDAgOS4zLTkuM3oiLz48cGF0aCBmaWxsPSJub25lIiBkPSJNMCAwaDI0djI0SDB6Ii8+PC9zdmc+") no-repeat center center;
    background-size: contain; /* Ensures the SVG scales properly */
    top: 7px;
    position: relative;
    width: 27px;
    height: 27px;
    color: #9da4ae;
    OUTLINE: #9da4ae;
    OPACITY: 0.5;
}

@keyframes dga-modal-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes dga-modal-dialog-in {
    from { opacity: 0; transform: scale(0.96); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes dga-modal-fade-out {
    from { opacity: 1; }
    to { opacity: 0; }
}

@keyframes dga-modal-dialog-out {
    from { opacity: 1; transform: scale(1); }
    to { opacity: 0; transform: scale(0.98); }
}

.dga-modal-mask {
    animation: dga-modal-fade-in 0.22s ease-out forwards;
}

.dga-modal-wrap--closing .dga-modal-mask {
    animation: dga-modal-fade-out 0.25s ease-in forwards;
}

.dga-modal-wrap--closing .dga-modal .dga-modal-dialog {
    animation: dga-modal-dialog-out 0.25s ease-in forwards;
}

.dga-modal .dga-modal-dialog {
    animation: dga-modal-dialog-in 0.22s ease-out forwards;
}

.dga-modal .dga-modal-dialog,
.dga-modal .dga-modal-content {
    transition: max-height 0.28s ease-out;
}

.dga-modal .dga-modal-body {
    transition: height 0.3s ease-out;
    /*overflow: scroll;*/
}

.dga-modal .dga-modal-body-inner {
    height: auto;
}

.dga-modal:not(.account-switcher) .dga-modal-body-inner {
    overflow-y: auto;
    max-height: min(70vh, 500px);
    min-height: 0;
}

.dga-modal.account-switcher .dga-modal-body .dga-modal-body-inner {
    display: flex;
    flex-direction: column;
}

.dga-modal.account-switcher .dga-modal-body {
    overflow: hidden;
}

.account-switcher .account-switcher-search {
    flex-shrink: 0;
}

.account-switcher .account-list {
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
    flex: 0 0 auto;
    height: 60vh;
}

.account-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    border: 1px solid #f0f0f0;
    border-radius: 6px;
    margin: 3px;
}

.dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    background: #B33A02;
    border-radius: 50%;

}

.badge-icon {
    background-color: rgba(75, 203, 119, 0.2) !important;
    color: #4BCB77 !important;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.rtl {
    direction: rtl;
}

.active-account {
    background: #d5ece0;
}

.account-switcher .ant-modal-footer .ant-btn-primary {
    display: none !important;
}

.table-responsive {
    border-radius: 16px !important;
}

.table thead tr {
    background-color: #f0f0f0;
}

/* ========== Table → Cards on mobile (< 768px) ==========
   Applies to all .table-responsive and .ant-table-wrapper tables.
   Opt-out: add class .table-no-cards on the wrapper.
   Requires data-label on each cell (injected by tableCardsMobileInit() in site.js).
*/
@media (max-width: 767px) {
    .table-responsive:not(.table-no-cards),
    .ant-table-wrapper:not(.table-no-cards) {
        /*margin-inline: 16px;*/
        max-inline-size: calc(100% - 32px);
        overflow-x: visible;
    }

    .table-responsive:not(.table-no-cards) table,
    .ant-table-wrapper:not(.table-no-cards) .ant-table table {
        display: block;
        width: 100%;
        border-collapse: collapse;
    }

    .table-responsive:not(.table-no-cards) thead,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    .table-responsive:not(.table-no-cards) tbody,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody {
        display: block;
    }

    .table-responsive:not(.table-no-cards) tbody tr,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr {
        display: block;
        margin-block-end: 12px;
        padding: 18px 20px;
        background: #fff;
        border: 1px solid #dee2e6;
        border-radius: 8px;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
        line-height: 1.5;
    }

    .table-responsive:not(.table-no-cards) tbody tr:last-child,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr:last-child {
        margin-block-end: 0;
    }

    .table-responsive:not(.table-no-cards) tbody td,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr > td.ant-table-cell {
        display: block;
        padding: 6px 0;
        border: none !important;
        line-height: 1.5;
        font-size: 1rem;
    }

    .table-responsive:not(.table-no-cards) tbody td::before,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr > td.ant-table-cell::before {
        content: attr(data-label);
        font-weight: 600;
        display: block;
        margin-block-end: 4px;
        font-size: 0.875rem;
        color: #495057;
    }

    .table-responsive:not(.table-no-cards) tbody td:first-child::before,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr > td.ant-table-cell:first-child::before {
        margin-block-start: 0;
    }

    /* Min tap target 44×44 for interactive elements inside cards */
    .table-responsive:not(.table-no-cards) tbody tr a:not(.btn),
    .table-responsive:not(.table-no-cards) tbody tr button:not(.btn),
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr a:not(.btn),
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr button:not(.btn) {
        min-height: 44px;
        min-width: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 10px 12px;
    }

    .table-responsive:not(.table-no-cards) tbody tr .btn,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr .btn {
        min-height: 44px;
        min-width: 44px;
        padding: 10px 16px;
    }

    /* Spacing between controls to prevent mis-taps */
    .table-responsive:not(.table-no-cards) tbody tr .btn + .btn,
    .table-responsive:not(.table-no-cards) tbody tr .btn + a,
    .table-responsive:not(.table-no-cards) tbody tr a + .btn,
    .ant-table-wrapper:not(.table-no-cards) .ant-table-tbody > tr .ant-space-item + .ant-space-item {
        margin-inline-start: 12px;
    }

    /* Pagination below table stays usable */
    .ant-table-wrapper:not(.table-no-cards) .ant-table-pagination {
        margin-inline: 16px;
    }
}

.ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
    color: rgba(0, 0, 0, 0.85);
    font-weight: 600;
    background-color: #eff8f2;
}



.text-success-dark {
    color: #1B8354 !important;
    font-size: 14px;
}

.text-primary.text-muted {
    color: #1F2A37 !important;
}

.fa-circle-plus:before,
.fa-plus-circle:before {
    content: "" !important;
    display: inline-block;
    width: 22px;
    height: 22px;
    background: url("/themes/marines/img/plus.svg") no-repeat center center;
    background-size: contain;
}

.ant-input-disabled:hover {
    cursor: default !important;
}

.ant-input-disabled {
    border: none !important;
}

.tooltip-custom .tooltip-box {
    visibility: hidden;
    background-color: #fff;
    color: #000;
    text-align: center;
    padding: 8px 12px;
    border-radius: 6px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    position: absolute;
    z-index: 1;
    bottom: 125%;
    right: 50%;
    transform: translateX(50%);
    width: 100%;
    /*white-space: nowrap;*/
}

.tooltip-custom .tooltip-box::after {
    content: "";
    position: absolute;
    top: 100%;
    right: 50%;
    transform: translateX(50%);
    border-width: 6px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
}

.tooltip-custom:hover .tooltip-box {
    visibility: visible;
}

.badge-disable {
    background-color: #f8d775;
    color: #000;
    font-size: 0.75rem;
    padding: 6px 10px;
    border-radius: 0.5rem;
    cursor: default;
}

.status-active {
    background-color: #d1f7d6;
    color: #2e7d32;
    padding: 0.25rem 0.75rem;
    border-radius: 1rem;
    font-size: 0.875rem;
}

.status-exired {
    background-color: #fb2727;
    color: #fff;
    padding: 0.25rem 0.75rem;
    border-radius: 1rem;
    font-size: 0.875rem;
}

.status-suspended {
    background-color: #fc7b04;
    color: #fff;
    padding: 0.25rem 0.75rem;
    border-radius: 1rem;
    font-size: 0.875rem;
}

.navigationpermit-background {
    background-image: url(/logisti/img/icons/navigation-permit-icon.svg);
    background-repeat: no-repeat;
    background-position-x: center;
    background-size: contain;
}

.radiolicence-background {
    background-image: url(/logisti/img/icons/radio-licence-icon.svg);
    background-repeat: no-repeat;
    background-position-x: center;
    background-size: contain;
}

.cargoship-background {
    background-image: url(/logisti/img/icons/cargo-ship-icon.svg);
    background-repeat: no-repeat;
    background-position-x: center;
    background-size: contain;
}

.routeblock-background {
    background-image: url(/logisti/img/icons/route-block-icon.svg);
    background-repeat: no-repeat;
    background-position-x: center;
    background-size: contain;
}

.ant-radio-button-wrapper:not(:first-child)::before {
    display: none !important;
}

[dir= rtl] .ant-input-number-input {
    text-align: right;
    margin-right: 16px;
}

.ant-radio-button-wrapper {
    /*margin: 3px;*/
    /*border-left-width: 0;*/
    border: 1px solid #d9d9d9;
}


/* Container Styles */
.datepicker-container {
    position: relative;
    width: 100%;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.datepicker-container.rtl {
    direction: rtl;
}

.datepicker-container.ltr {
    direction: ltr;
}

/* Header Section */
.calendar-header-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 6px 6px 0 0;
    height: 15px;
}

.calendar-label {
    font-weight: 600;
    font-size: 14px;
    color: #262626;
    margin: 0;
}

.required-indicator {
    color: #ff4d4f;
    margin-left: 4px;
}

.calendar-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.today-button {
    font-size: 13px;
    padding: 4px 12px;
    transition: all 0.3s ease;
    border: unset !important;

}

.today-button:hover {
    color: #2f855a;
}

.calendar-switch {
    min-width: 60px;
}

/* Input Styles */
.calendar-input {
    width: 100%;
    padding: 8px 12px;
    padding-inline-end: 36px;
    font-size: 14px;
    line-height: 1.5715;
    color: #262626;
    background-color: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 0.25rem;
    transition: all 0.3s ease;
    cursor: pointer;
    outline: none;
    margin-top: 10px;
}

.calendar-input-wrapper {
    position: relative;
}

.calendar-input-clear {
    position: absolute;
    top: 50%;
    inset-inline-end: 12px;
    transform: translateY(-50%);
    border: none;
    background: transparent;
    padding: 0;
    color: #98a2b3;
    cursor: pointer;
    line-height: 1;
}

.calendar-input-clear:hover {
    color: #667085;
}

.calendar-input:hover:not(.disabled) {
    border-color: #2f855a;
}

.calendar-input:focus:not(.disabled) {
    border-color: #2f855a;
    box-shadow: 0 0 0 2px rgba(47, 133, 90, 0.1);
}

.calendar-input.disabled {
    background-color: #fff;
    color: rgba(0, 0, 0, 0.25);
    cursor: not-allowed;
    border: 0;
    color: black;
    margin: 5px 0 0 0;
    padding: 0;
}
.calendar-input.error {
    border-color: #ff4d4f;
}

.calendar-input.error:focus {
    border-color: #ff4d4f;
    box-shadow: 0 0 0 2px rgba(255, 77, 79, 0.1);
}

/* Validation Message */
.validation-message {
    margin-top: 4px;
    font-size: 13px;
    color: #ff4d4f;
    line-height: 1.5;
}

/* Calendar Popup */
.calendar-popup {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    background: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12);
    z-index: 1050;
    padding: 16px;
    min-width: 280px;
    animation: slideDown 0.2s ease-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.calendar-popup.popup-enter {
    animation: slideDown 0.2s ease-out;
}

/* Calendar Navigation */
.calendar-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #f0f0f0;
}

.month-year-display {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    font-size: 15px;
    color: #262626;
}

.month-selector-button,
.year-selector-button {
    display: flex;
    align-items: center;
    gap: 4px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s ease;
    color: inherit;
    font-weight: inherit;
}

.month-selector-button:hover,
.year-selector-button:hover {
    background-color: #f5f5f5;
}

.dropdown-icon {
    transition: transform 0.2s ease;
}

.dropdown-icon.expanded {
    transform: rotate(180deg);
}

.navigation-buttons {
    display: flex;
    gap: 8px;
}

.nav-button {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #262626;
}

.nav-button:hover:not(:disabled) {
    background-color: #f5f5f5;
    border-color: #d9d9d9;
}


.compare-footer {
    border-radius: 10px;
    position: fixed;
    bottom: 0;
    width: 96rem;
    left: 50%;
    transform: translateX(-50%);
    background: white;
    border-top: 1px solid #ddd;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1000;
}

.compare-footer .left {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: bold;
}

.compare-footer .right {
    display: flex;
    gap: 10px;
}

.clear-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    /*@* font-size: 16px; *@*/
background: #eee;
    color: black;
}

.compare-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    /*@* font-size: 16px; *@*/
/*@* background: red; *@*/
color: white;
}

.ant-modal-max > .ant-modal-content {
    width: 100% !important;
}

.comparison-table {
    width: 100%;
    max-width: 900px;
    margin: auto;
    border-collapse: collapse;
    background: white;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.comparison-table th,
.comparison-table td {
    padding: 15px;
    border: 1px solid #ddd;
}

.comparison-table th {
    background: #f1f1f1;
    font-size: 16px;
}



.tags {
    display: flex;
    justify-content: center;
    gap: 5px;
    flex-wrap: wrap;
}

.tag {
    background: #ddd;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 14px;
}

.check {
    color: green;
    font-size: 20px;
    font-weight: bold;
}

.cross {
    color: gray;
    font-size: 20px;
}

.nav-button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* Calendar Grid */
.calendar-grid {
    width: 100%;
}

.weekday-headers {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 8px;
}

.weekday-header {
    text-align: center;
    font-weight: 600;
    font-size: 12px;
    color: #8c8c8c;
    padding: 4px 0;
}

.weekday-header abbr {
    text-decoration: none;
    cursor: help;
}

.days-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.day-cell {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    cursor: pointer;
    border: 1px solid transparent;
    background: none;
    font-size: 14px;
    color: #262626;
    transition: all 0.2s ease;
    position: relative;
}

.day-cell:not(.empty):not(.disabled):hover {
    background-color: #f5f5f5;
    border-color: #d9d9d9;
}

.day-cell.empty {
    cursor: default;
}

.day-cell.selected {
    background-color: #2f855a !important;
    color: #fff !important;
    font-weight: 600;
    border-color: #2f855a !important;
}

.day-cell.today:not(.selected) {
    border:1px solid #2f855a;
    /*color: #fff;*/
    font-weight: 600;
}

.day-cell.disabled {
    color: #d9d9d9;
    cursor: not-allowed;
    background-color: #fafafa;
}

.day-number {
    display: block;
}

/* Year Selector Grid */
.year-selector-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    max-height: 280px;
    overflow-y: auto;
    padding: 4px;
}

.year-selector-grid::-webkit-scrollbar {
    width: 6px;
}

.year-selector-grid::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 3px;
}

.year-selector-grid::-webkit-scrollbar-thumb {
    background: #bfbfbf;
    border-radius: 3px;
}

.year-selector-grid::-webkit-scrollbar-thumb:hover {
    background: #8c8c8c;
}

.year-cell {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
    border: 1px solid transparent;
    background: none;
    font-size: 14px;
    color: #262626;
    transition: all 0.2s ease;
}

.year-cell:hover {
    background-color: #f5f5f5;
    border-color: #d9d9d9;
}

.year-cell.current:not(.selected) {
    border:1px solid #2f855a;
    /*color: #fff;*/
    font-weight: 600;
}

.year-cell.selected {
    background-color: #2f855a !important;
    color: #fff !important;
    font-weight: 600;
    border-color: #2f855a !important;
}

/* Month Selector Grid */
.month-selector-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding: 4px;
}

.month-cell {
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
    border: 1px solid transparent;
    background: none;
    font-size: 13px;
    color: #262626;
    transition: all 0.2s ease;
    padding: 8px;
    text-align: center;
}

.month-cell:hover {
    background-color: #f5f5f5;
    border-color: #d9d9d9;
}

.month-cell.current:not(.selected) {
    border:1px solid #2f855a;
    /*color: #fff;*/
    font-weight: 600;
}

.month-cell.selected {
    background-color: #2f855a !important;
    color: #fff !important;
    font-weight: 600;
    border-color: #2f855a !important;
}

/* Time Selector */
.time-selector {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.time-label {
    font-weight: 600;
    font-size: 13px;
    color: #262626;
    margin: 0;
}

.time-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
}

.time-input {
    width: 50px;
    padding: 4px 8px;
    font-size: 14px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    text-align: center;
    transition: all 0.2s ease;
}

.time-input:focus {
    border-color: #2f855a;
    box-shadow: 0 0 0 2px rgba(47, 133, 90, 0.1);
    outline: none;
}

.time-separator {
    font-weight: 600;
    color: #262626;
}

/* Calendar Footer */
.calendar-footer {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.action-button {
    padding: 6px 16px;
    font-size: 14px;
    border-radius: 6px;
    border: 1px solid #d9d9d9;
    cursor: pointer;
    transition: all 0.2s ease;
    font-weight: 500;
}

.cancel-button {
    background: #fff;
    color: #262626;
}

.cancel-button:hover {
    color: #2f855a;
    border-color: #2f855a;
}

.confirm-button {
    background: #2f855a;
    color: #fff;
    border-color: #2f855a;
}

.confirm-button:hover {
    background: #276a47;
    border-color: #276a47;
}

/* Responsive Adjustments */
@media (max-width: 480px) {
    .calendar-popup {
        position: fixed;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: calc(100% - 32px);
        max-width: 320px;
    }

    .calendar-header-section {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .calendar-actions {
        width: 100%;
        justify-content: space-between;
    }
}

/* Focus Visible Styles for Accessibility */
.day-cell:focus-visible,
.year-cell:focus-visible,
.month-cell:focus-visible,
.nav-button:focus-visible,
.year-selector-button:focus-visible,
.month-selector-button:focus-visible {
    outline: 2px solid #2f855a;
    outline-offset: 2px;
}

.calendar-input:focus-visible {
    outline: none;
}

.ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-tail::after {
    background-color: #1b8354!important;
}

.SystemCard{
    transition: all 200ms ease-in-out;
}
.SystemCard:hover {
    box-shadow: 0 5px 20px 4px rgba(36, 36, 36, 0.5) !important;
}


.ehbar-bahri-switch {
    display: flex;
    background-color: #f1f2f4;
    padding: 0;
    margin: 0;
    margin-top: 72px;
    /*border-bottom: 1px solid #e5e7eb;*/
    min-height: 52px;
    width: 100%;
}


.ehbar-bahri-switch__item {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    text-decoration: none;
    color: #374151;
    font-weight: 500;
    font-size: 0.9375rem;
    background-color: transparent;
    border: none;
    position: relative;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.ehbar-bahri-switch__item::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 3px;
    background-color: #1B8253;
    transform: scaleX(0);
    transform-origin: center bottom;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ehbar-bahri-switch__item:hover {
    background-color: #e5e7eb;
    color: #161616;
}

.ehbar-bahri-switch__item--active {
    background-color: #fff;
    color: #161616;
}

.ehbar-bahri-switch__item--active::after {
    transform: scaleX(1);
}

.ehbar-bahri-switch__icon {
    width: 2.5rem;
    height: 2.5rem;
    object-fit: contain;
    transition: transform 0.25s ease;
}

.ehbar-bahri-switch__item:hover .ehbar-bahri-switch__icon,
.ehbar-bahri-switch__item--active .ehbar-bahri-switch__icon {
    transform: scale(1.05);
}

.ehbar-bahri-switch__label {
    white-space: nowrap;
}

.system-content-transition--enter {
    animation: system-content-enter 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes system-content-enter {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.yacht-services-details-page {
    padding-bottom: 2rem;
}

.yacht-services-details-page .breadcrumb-container {
    margin-bottom: 0.5rem;
}

.yacht-services-details-page .yacht-details-header {
    margin-bottom: 0.75rem;
}

.yacht-services-details-page .yacht-title-row {
    align-items: center;
    row-gap: 0.75rem;
}

.yacht-services-details-page .page-title {
    font-size: 1.25rem;
    font-weight: 700;
}

.yacht-services-details-page .yacht-status-cards {
    row-gap: 1rem;
}

.yacht-services-details-page .yacht-status-card {
    background-color: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1rem;
    /*min-height: 96px;*/
}

.yacht-services-details-page .yacht-status-card .text-muted {
    color: #6b7280 !important;
    font-size: 0.875rem;
}

.yacht-services-details-page .yacht-status-card > div:not(.text-muted) {
    font-weight: 600;
    color: #111827;
}

.yacht-services-details-page .yacht-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.2rem 0.7rem;
    border-radius: 999px;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.4;
    background-color: #f1f5f9;
    color: #334155;
    border: 1px solid #e2e8f0;
    white-space: nowrap;
}

.yacht-services-details-page .yacht-status-badge--neutral {
    background-color: #f1f5f9;
    color: #334155;
    border-color: #e2e8f0;
}

.yacht-services-details-page .yacht-status-badge--success {
    background-color: #dcfce7;
    color: #166534;
    border-color: #bbf7d0;
}

.yacht-services-details-page .yacht-status-badge--warning {
    background-color: #fef3c7;
    color: #92400e;
    border-color: #fde68a;
}

.yacht-services-details-page .yacht-status-badge--danger {
    background-color: #fee2e2;
    color: #991b1b;
    border-color: #fecaca;
}

.yacht-services-details-page .yacht-services-section {
    margin-top: 0.5rem;
}

.yacht-services-details-page .collapse-header {
    background-color: #fff;
    border: none;
    border-radius: 14px;
    padding: 0.75rem 1.5rem;
    min-height: 56px;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
}

.collapse-header::before {
    content: "";
    position: absolute;
    /* left: 1.5rem; */
    right: 28%;
    top: 50%;
    height: 0.5px;
    background-color: #dadada;
    /* transform: translate(-50%,50%); */
    width: 50%;
    /* text-align: center; */
}

.yacht-services-details-page .card-body-custom {
    background-color: #f9fafb;
    border-color: #e5e7eb;
    padding: 1.5rem;
}

.yacht-services-details-page .yacht-services-grid {
    row-gap: 1.25rem;
}

.yacht-services-details-page .servicesCard {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background-color: #fff;
    min-height: 367px;
    max-width: 233px;
    min-width: 233px;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.yacht-services-details-page .servicesCard.border-success {
    border-color: #1b8354 !important;
}

.yacht-services-details-page .servicesCard .card-body {
    background-position: left 1rem bottom 1rem;
    background-size: 120px;
    padding: 1rem 1rem 0.5rem;
}

[dir="rtl"] .yacht-services-details-page .servicesCard .card-body {
    background-position: right 1rem bottom 1rem;
}

.yacht-services-details-page .servicesCard .card-title {
    color: #111827;
}

.yacht-services-details-page .servicesCard .card-text {
    color: #6b7280;
    font-size: 0.875rem;
}

.yacht-services-details-page .servicesCard .card-footer .btn {
    border-radius: 10px;
    font-weight: 600;
}

.yacht-services-details-page .servicesCard .btn-success {
    background-color: #1b8354 !important;
    border-color: #1b8354 !important;
}

.yacht-services-details-page .status-active,
.yacht-services-details-page .status-exired,
.yacht-services-details-page .status-suspended,
.yacht-services-details-page .badge-disable {
    font-size: 0.8125rem;
    border-radius: 999px;
}

.visa-fees-invoice-table {
    background: #fff;
    border: 1px solid #e6edef;
    border-radius: 8px;
    overflow: hidden;
}

.visa-fees-invoice-table__title {
    font-weight: 600;
    color: #1f2937;
    font-size: 1rem;
}

.visa-fees-invoice-table .table {
    border-collapse: collapse;
}

.visa-fees-invoice-table .table th,
.visa-fees-invoice-table .table td {
    padding: 10px 12px;
    vertical-align: middle;
}

.visa-fees-invoice-table__th {
    background-color: #f3f4f6;
    font-weight: 600;
    color: #1f2937;
    border-color: #e6edef;
}

.visa-fees-invoice-table__th--sub {
    font-weight: 500;
    font-size: 0.9rem;
}

.visa-fees-invoice-table__footer {
    background-color: #f0fdf4;
    font-weight: 600;
}

.visa-fees-invoice-table__footer th {
    border-color: #e6edef;
    padding: 12px;
}
.decision-button {
    display: flex;
    justify-content: flex-end;
}
