/*Tailwind custom css*/
@layer utilities {
    .accent-primary {
        @apply text-[#0062ed];
    }
    .bg-accent-primary {
        @apply bg-[#0062ed];
    }
    .accent-secondary {
        @apply text-[#ff0058];
    }
    .bg-accent-secondary {
        @apply bg-[#ff0058];
    }
}
.gradient-text {
  background: linear-gradient(90deg, #6B75FF 0%, #a855f7 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.right-section-bg {
  background: linear-gradient(135deg, #4f46e5 0%, #1e1b4b 100%);
}

/* Chrome, Edge, Safari */
body::-webkit-scrollbar {
  width: 10px;
}

body::-webkit-scrollbar-track {
  background: #ececec; /* track color */
}

body::-webkit-scrollbar-thumb {
  background-color: #0062ed;   /* scroll button */
  border-radius: 8px;
}

body::-webkit-scrollbar-thumb:hover {
  background-color: #004fcc; /* slightly darker on hover */
}

/* Firefox */
/*body {*/
/*  scrollbar-width: thin;*/
/*  scrollbar-color: #0062ed rgb(248 250 252);*/
/*}*/

.ff-w svg {
  left: 5px;
  position: absolute;
  top: 3px;
}

.healthgrid .ff-w svg {
  left: 33.5%;
  position: absolute;
  top: 4px;
}

.biotech .ff-w svg {
  left: 65.4%;
  position: absolute;
  top: 4px;
}
.blur-locked {
  filter: blur(6px);
  opacity: 0.55;
  /*pointer-events: none;*/
  user-select: none;
}
@media (max-width: 768px) {
  .ff-w svg {
    left: 18.5%;
    top: 3px;
    transform: translateX(-50%);
  }

  .healthgrid .ff-w svg {
    left: 58.2%;
    top: 5px;
  }

  .biotech .ff-w svg {
    left: 32.4%;
    top: 67px;
  }
}
/*Header Menu*/
.menu-header-menu-container ul{
    display: flex;
    gap: 50px;
}
/* Parent menu item */
.menu-item {
  position: relative;
}

/* Submenu container */
.menu-item-has-children > .sub-menu {
  position: absolute;
  left: 0;
  top: 100%;
  margin-top: 12px;
  width: 220px;

  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(8px);

  border-radius: 16px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 20px 30px rgba(0,0,0,0.12);

  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);

  transition: all 0.25s ease;
  z-index: 999;
}

/* Dark mode */
.dark .menu-item-has-children > .sub-menu {
  background: rgba(15, 23, 42, 0.98);
  border-color: #1e293b;
}

/* Show submenu on hover */
.menu-item-has-children:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  display: block;
}

/* Submenu items */
.sub-menu li a {
  display: block;
  padding: 12px 16px;
  font-size: 14px;
  font-weight: 500;
  color: #334155;
  border-radius: 10px;
  transition: background 0.2s ease;
}

/* Hover */
.sub-menu li a:hover {
  background: #f1f5f9;
}

/* Dark mode hover */
.dark .sub-menu li a {
  color: #e5e7eb;
}
.dark .sub-menu li a:hover {
  background: #1e293b;
}

/* Parent arrow */
.menu-item-has-children > a::after {
  content: "▾";
  font-size: 10px;
  margin-left: 6px;
}

/* Mobile submenu */
@media (max-width: 767px) {
  .menu-item-has-children > .sub-menu {
    position: static;
    width: 100%;
    margin-top: 8px;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    border: none;
    background: transparent;
    display: none;
  }
  
  .menu-item-has-children > .sub-menu .menu-item{
      position: relative;
  }
  .menu-item-has-children > .sub-menu .menu-item::after{
    content: "";
    position: absolute;
    top: 22px;
    left: 0;
    width: 5px;
    height: 5px;
    background: rgb(0 0 0 / 0%);
    transform: rotate(45deg);
    border-top: 1px solid;
    border-right: 1px solid;
  }

  .menu-item-has-children.active > .sub-menu {
    display: block;
  }

  .menu-item-has-children > a::after {
    content: "+";
    float: right;
    font-size: 16px;
    pointer-events: none;
  }

  .menu-item-has-children.active > a::after {
    content: "–";
  }
}

