.hidden {
  display: none;
}
.py-n1 {
    padding-bottom: -1px !important;
    margin-top: -1px !important;
    margin-bottom: -1px !important;
}
.py-n2 {
    padding-bottom: -2px !important;
    margin-top: -2px !important;
    margin-bottom: -2px !important;
}
.py-n3 {
    padding-bottom: -3px !important;
    margin-top: -3px !important;
    margin-bottom: -3px !important;
}

.mdi-30px.mdi-set, .mdi-30px.mdi:before {
    font-size: 30px;
}

.mdi-48px.mdi-set, .mdi-48px.mdi:before {
    font-size: 48px;
}
.mdi-52px.mdi-set, .mdi-52px.mdi:before {
    font-size: 52px;
}

.border-top-1 {
    border-top: 1px solid !important;
}
.border-top-2 {
    border-top: 2px solid !important;
}
.border-bottom-1 {
    border-bottom: 1px solid !important;
}
.border-bottom-2 {
    border-bottom: 2px solid !important;
}

.bg-success-900 {
    background-color: #387F39 !important;
}

.ls-1 {
    letter-spacing: 1px !important;
}
.ls-2 {
    letter-spacing: 2px !important;
}
.ls-3 {
    letter-spacing: 3px !important;
}
.ls-4 {
    letter-spacing: 4px !important;
}
.ls-5 {
    letter-spacing: 5px !important;
}

.multiline-ellipsis-1 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 1 !important; /* start showing ellipsis when 3rd line is reached */
    /* white-space: pre-wrap; */ /* let the text wrap preserving spaces */
}
.multiline-ellipsis-2 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important; /* start showing ellipsis when 3rd line is reached */
    /* white-space: pre-wrap; */ /* let the text wrap preserving spaces */
}
.multiline-ellipsis-3 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important; /* start showing ellipsis when 3rd line is reached */
    /* white-space: pre-wrap; */ /* let the text wrap preserving spaces */
}
.multiline-ellipsis-4 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 4 !important; /* start showing ellipsis when 3rd line is reached */
    /* white-space: pre-wrap; */ /* let the text wrap preserving spaces */
}
.multiline-ellipsis-5 {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 5 !important; /* start showing ellipsis when 3rd line is reached */
    /* white-space: pre-wrap; */ /* let the text wrap preserving spaces */
}

.sticky-button {
    text-decoration: none;
    justify-content: center;
    flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    box-shadow: none;
    align-items: center;
    text-align: center;
    position: fixed;
    top: 70px;
    left: 50px;
    transform: translateX(-50%);
    z-index: 1000;
}

.rounded-pill-left {
    border-radius: 50rem !important;
    border-top-right-radius: 10rem !important;
    border-bottom-right-radius: 10rem !important;
}

.nowrap {
    white-space: nowrap !important;
}

ul.pagination li.page-item.active .page-link {
    border-color: #fdb528;
    background-color: #fdb528;
    color: #fff;
}

div.sticky {
    position: sticky;
    top: 65px;
    font-size: 20px;
    z-index: 100;
}
.content-below-sticky {
    padding-top: 100px; /* اضبط هذه القيمة بناءً على ارتفاع العنصر المثبت */
}

.page-link.waves-effect {
    font-family: Tajawal !important;
}

h1, h2, h3, h4, h5, h6{
    color:#343a40 !important
}

tbody > tr > * {
    font-size: 14px;
    color:#212529 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.number {
    font-family: Tajawal !important;
    font-weight: 600;
    /* color:#000 !important; */
}

.tooltip-inner {
    font-size: 16px; /* يمكنك تغيير القيمة حسب الحاجة */
    font-weight: normal;
}

.form-check-input:checked {
    background-color: #F2BB34 !important;
    border-color: #F2BB34 !important;
    border-radius: 50% !important;
    transform: translateY(-0.075em);
    /* background-color: transparent !important;
    border-color: transparent !important; */
}
input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    align-content: center;
    justify-content: center;
    font-size: 0.9rem;
    border: 0.1rem solid #F2BB34;
    border-radius: 50%;
    display: grid;
    place-content: center;
    transform: translateY(-0.075em);
}
input[type="checkbox"]::before {
    content: "";
    width: 1rem;
    height: 1rem;
    transform: scale(0);
    border-radius: 50%;
    color: #F2BB34;
    background-color: #F2BB34;
    transform-origin: bottom left;
    transition: 120ms transform ease-in-out;
    box-shadow: inset 1em 1em #F2BB34;
}
input[type="checkbox"]:checked::before {
    transform: scale(1);
}

.container-illustration-img{
    background: linear-gradient(to bottom, #05B3C6, #013E56);
    width: 100%;
    height: 100%;
    border: 1px solid #05B3C6 !important;
    display: flex;
    justify-content: center;
    align-items: center;

}
/* وضع صورة كخلفية لل Sidebar */
.container-sidebar-img{
    background: linear-gradient(to bottom, #e7e300, #564601);
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('../../img/pattern/sidebar.jpg') !important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* وضع خلفية لل Navbar */
.container-navbar{
    background: linear-gradient(to bottom, #05B3C6, #02b6bd);
    width: 100%;
    height: 100%;
    /* border: 1px solid #02b6bd !important; */
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url('../../img/pattern/navbar.jpg') !important;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* لون الكتابة على ال Navbar */
/* .bg-navbar-theme .navbar-nav > .nav-link, .bg-navbar-theme .navbar-nav > .nav-item > .nav-link, .bg-navbar-theme .navbar-nav > .nav > .nav-item > .nav-link {
    color: #ffffff !important
} */

.bg-navbar-theme .navbar-nav > .nav-item > .nav-link > i {
    color: #FDF4DF !important
}
.bg-navbar-theme .navbar-nav > .nav-item > .nav-link.btn:hover {
    background-color: #999999 !important
}

/* لون خلفية li ال active في ال Navbar */
.bg-menu-theme .menu-item.active > .menu-link:not(.menu-toggle) {
    background-color: #CEAE87 !important;
    font-weight: 100 !important;
}

.bg-menu-theme-tadqiq .menu-item-tadqiq.active > .menu-link-tadqiq:not(.menu-toggle) {
    background-color: #E1B766 !important;
    font-weight: 100 !important;
}

.app-brand .layout-menu-toggle svg {
    color: #ffffff !important;
    margin-left: -30px !important;
}

.bg-menu-theme .menu-inner-shadow {
    background: linear-gradient(#ffffff 5%, rgba(180, 180, 180, 0.75) 45%, rgba(243, 193, 16, 0.2) 80%, transparent) !important;
}

.menu-sub {
    border-left: 3px solid #ffffff !important;
    border-right: 3px solid #ffffff !important;
    border-bottom: 1px solid #ffffff !important;
    border-radius: 20px !important;
    margin: 6px !important;
    margin-top: 0px !important;
}

/* لون النص في ال menu في ال Navbar */
.menu-item> .menu-link> * {
    color: #ffffff !important;
    font-weight: 100 !important;
}

.menu-item.active> .menu-link> * {
    font-weight: bold !important;
    color: #000 !important;
}
.layout-wrapper:not(.layout-horizontal) .menu-vertical .menu-inner > .menu-item > .menu-sub > .menu-item > .menu-link::before {
    color: #ffffff!important;
}

/* لون السهم للقوائم الفرعية */
.menu-toggle::after {
    color: #ffffff !important;
}

.app-brand-text {
    color: #ffffff !important;
}

.alert.alert-solid-warning {
    color: #000 !important;
}

/* تنسيق للزر warning */
.btn.btn-warning, .alert.alert-solid-warning {
    background-color: #377641 !important;
    border: 0px solid #27532e !important;
    background-image: url('../../img/pattern/btn.jpg') !important;
    background-position: 0% 0% !important;
    background-repeat: no-repeat !important;
    background-size: 200% 200% !important;
    transition: background-position 0.5s ease !important;
}
.btn.btn-warning:hover {
    background-position: 100% 100% !important;
}

input, select {
    color: #000 !important;
}

select> option, .select2-results .select2-results__options {
    color : #000000 !important;
    background-color : #fffab1 !important;
    font-weight: normal !important;
}

/* لون الاطار الخارجي لل input */
.form-control:focus, .form-select:focus, .light-style .form-floating .select2-container--default .select2-selection--single:focus {
    border-color : #377641 !important;
}

/* لون ال label لل input */
.form-floating.form-floating-outline> label {
    color : #8a8a8a !important;
    /* font-weight: normal !important; */
}

/* تنسيقات للتقويم */
.dayContainer .flatpickr-day, .dayContainer .flatpickr-day.today, .dayContainer .flatpickr-day.selected {
    font-family: Tajawal !important;
}
.dayContainer .flatpickr-day.today, .flatpickr-day.selected {
    border-color: #377641 !important;
    font-family: Tajawal !important;
}
.dayContainer .flatpickr-day.selected, .dayContainer .flatpickr-day.selected:hover {
    border-color: #377641 !important;
    background-color: #377641 !important;
    font-family: Tajawal !important;
}
.dayContainer .flatpickr-day:hover, .dayContainer .flatpickr-day.selected:hover, .dayContainer .flatpickr-day.selected {
    font-size: 27px !important;
}
.flatpickr-monthDropdown-months {
    font-size: 14px !important;
}
.numInput.cur-year {
    font-family: Tajawal !important;
}

.loader {
    height: 10px;
    width: 130px;
    border-radius: 10px;
    --c:no-repeat linear-gradient(#6100ee 0 0);
    background: var(--c),var(--c),#d7b8fc;
    background-size: 60% 100%;
    animation: l16 3s infinite;
}
@keyframes l16 {
    0%   {background-position:-150% 0,-150% 0}
    66%  {background-position: 250% 0,-150% 0}
    100% {background-position: 250% 0, 250% 0}
}

.rounded-tab {
    --r: 25px; /* control the radius */

    line-height: 1.8; /* control the height */
    padding-inline: .5em;
    border-inline: var(--r) solid #0000;
    border-radius: calc(2*var(--r)) calc(2*var(--r)) 0 0/var(--r);
    mask:
        radial-gradient(var(--r) at var(--r) 0,#0000 98%,#000 101%)
        calc(-1*var(--r)) 100%/100% var(--r) repeat-x,
        conic-gradient(#000 0 0) padding-box;
    background: #377641 border-box; /* border-box is needed for a gradient coloration */
    width: fit-content;
    height: fit-content;
}
.right-rounded-tab {
    --r: 25px; /* control the radius */

    line-height: 1.8; /* control the height */
    padding-inline: .5em;
    border-left: var(--r) solid #0000;
    border-top-right-radius: 10px !important;
    border-top-left-radius: 50px !important;
    /* border-radius: calc(2*var(--r)) var(--r) 0 0/var(--r) var(--r) 0 0; */
    mask:
        radial-gradient(var(--r) at 0 0,#0000 98%,#000 101%)
        0 100%/var(--r) var(--r) no-repeat,
        conic-gradient(#000 0 0) padding-box;
    background: #377641 border-box; /* border-box is needed for a gradient coloration */
    width: fit-content;
    height: fit-content;
    background-image: url('../../img/pattern/right-rounded-tab.jpg') !important;
    color: #fff !important;
    /* background-position: 0% 0% !important;  */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.right-rounded-tab > h4, .right-rounded-tab > .d-flex h6 {
    color: #fff !important;
}
.vertical-rounded-tab {
    --r: 30px; /* control the radius */

    line-height: 1.7; /* control the height */
    padding-inline: .5em;
    border-block: var(--r) solid #0000;
    border-radius: var(--r) 0 0 var(--r)/calc(2*var(--r));
    mask:
        radial-gradient(var(--r) at 0 var(--r),#0000 98%,#000 101%)
        100% calc(-1*var(--r))/var(--r) 100% repeat-y,
        conic-gradient(#000 0 0) padding-box;
    background: #377641 border-box; /* border-box is needed for a gradient coloration */
    width: fit-content;
}

.divider.divider-warning .divider-text:before {
    border: 1px solid !important;
    border-color: #377641 !important;
}

.text-small {
    font-size: 85%;
}

.green {
    background: radial-gradient(
      ellipse at right top,
      #107667ed 0%,
      #151419 47%,
      #151419 100%
    );

    &:before {
      background: linear-gradient(
          45deg,
          #232228,
          #232228,
          #232228,
          #232228,
          #377641
        )
        border-box;
    }
    .btn-add {
      background: #377641;
    }
    .progress-bar:after {
      width: 90%;
      background: #377641;
    }

    .btn-countdown {
      &:hover {
        background: #377641;
      }
    }
}
.border-green {
  border: 1px solid #107667ed !important;
}

.text-golden {
  color: #FDF4DF !important;
}