:root {
    --yellow-color: #f8d571;
    --dark-green-color: #00a295;
    --light-green-color: #d9f2ef;
    --light-green-color2: #def8cb;
}

.alert-message {
    background-color: #def8cb;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid #a1bc8e;
    color: #5d744d;
    font-weight: 600;
    font-size: 14px;
}

.language-header-wrapper {
    background-color: #09386c;
    padding: 6px;
    font-size: 14px;
}

.nav-item .dropdown button {
    pointer-events: none;
}

/* Open dropdown on hover */
.nav-item .dropdown:hover .dropdown-menu {
    display: block;
    opacity: 1;
    visibility: visible;
}

/* Ensure smooth hover behavior */
.nav-item .dropdown-menu {
    display: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    position: absolute; /* Ensure proper positioning */
}

/* Style for sub-dropdowns */
.sub-dropdowns {
    display: none !important;
    position: relative;
}

.dropdownmainMenu:hover .sub-dropdowns {
    display: block !important;
    position: absolute;
    top: 0;
    right: -80px;
    background-color: white;
    list-style: none;
    margin: 0;
    padding: 10px;
}

/* Dropdown menu */
.dropdown-menu {
    display: none; /* Ensure all dropdowns are hidden initially */
    position: absolute;
    /* left: 100%;
    top: 0; */
    min-width: 150px;
}

/* Positioning for submenu */
.dropdown-submenu {
    position: relative;
}

/* Show submenu when hovered */
.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}

/* Timesheet Ads module start */
.ads-image {
    width: 100%;
    margin-bottom: 20px;
}

.ads-image img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
}

.ads-image-bottom {
    width: 100%;
    height: 200px;
    margin-bottom: 20px;
}

.ads-image-bottom img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
}
/* Timesheet Ads module end */

/* Slider css */

.swiper-button-next:after {
    font-size: 25px;
    background-color: rgba(0, 0, 0, 0.118);
    padding: 10px;
    border-radius: 5px;
}

.swiper-button-prev:after {
    font-size: 25px;
    background-color: rgba(0, 0, 0, 0.118);
    padding: 10px;
    border-radius: 5px;
}

.ad-card {
    padding: 2px;
    background-color: #f8d571;
}

/* Styles for desktop screens (768px and above) */
@media (min-width: 768px) {
    .ad-card {
        height: 250px;
    }
}

/* Styles for mobile screens (767px and below) */
@media (max-width: 767px) {
    .ad-card {
        height: 400px;
    }
}

.ads-card .ads-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Navigation header */
.main-nav {
    list-style: none;
    position: relative;
}

.main-nav > li {
    position: relative; /* Ensures submenus are positioned relative to their parent */
}

.main-nav > li > a {
    text-decoration: none;
    font-size: 14px;
    color: #4d4d4d;
    font-weight: 500;
    text-transform: uppercase;
    display: block;
    padding: 10px 5px;
    font-weight: 600;
}

.main-nav .sub-nav {
    top: 40px;
}

/* Hide sub-menus by default */
.main-nav .sub-nav,
.main-nav .child-sub-nav {
    display: none;
    background-color: white;
    position: absolute;
    margin: 0;
    min-width: 150px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
}

/* Show sub-menu when hovering over the parent */
.main-nav li:hover > .sub-nav {
    display: block;
}

/* Style for sub-navigation links */
.main-nav .sub-nav li {
    position: relative;
}

.main-nav .sub-nav li a {
    display: block;
    text-decoration: none;
    color: #4d4d4d;
    padding: 8px 15px;
    border-bottom: 1px solid #eee;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 600;
}

.main-nav .sub-nav li a:hover {
    background-color: orangered;
    color: white;
}

/* Child submenu positioning */
.child-sub-nav {
    position: absolute;
    left: 100%;
    top: 0;
}

.child-sub-nav li a {
    font-size: 13px !important;
    font-weight: 600;
}

/* Show child submenu when hovering */
.sub-nav li:hover > .child-sub-nav {
    display: block;
}

.brandLogo {
    font-size: 25px;
    font-weight: 800;
}

.navigation-item {
    font-size: 14px;
    font-weight: 500;
}

.mobile-navigation {
    width: 250px;
    height: 100vh;
    position: fixed;
    top: 0;
    left: -250px; /* Initially hidden */
    background: white;
    box-shadow: 2px 0 5px rgba(0, 0, 0, 0.2);
    transition: left 0.3s ease-in-out;
    z-index: 1000;
    overflow-y: auto;
}

.mobile-navigation.active {
    left: 0; /* Slide-in when active */
}
.custom-tooltip {
  cursor: pointer;
  display: inline-block;
}

.tooltip-content{
    position: absolute;
    right: 0;
    top: 0;
    background-color: rgb(41, 40, 40);
    width: 100%;
    height: max-content;
    display: none;
    padding: 10px;
    z-index: 1000;
    border-radius: 7px;
    font-size: 14px;
}

.custom-tooltip:hover .tooltip-content{
   display: block;
}