:root {
  /* accent folosit la text-uri (text-accent, etc.) */
  --color-accent: #fff;               /* #ad0106 */
  --color-accent-content: 255 255 255;
  /* accent folosit la fundaluri (bg-contrast-accent) */
  --color-contrast-accent: 173 1 6;      /* #ad0106 */
}

/* Utilitar pentru fundal rosu identic cu butonul Get started */
.bg-button {
  background-color: #ad0106 !important;
}

.from-\[\#D3F36B\]{
  --tw-gradient-from: #ad0106 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(173 1 6 / 0) var(--tw-gradient-to-position);
  /* păstrează roșu “plin” mai mult timp și abia apoi îl stinge */
  --tw-gradient-stops:
    #ad0106 0%,
    #ad0106 55%,
    #ff4d4d 100%;
}
.cta-gradient {
    background-image: linear-gradient(to bottom right, #ffffff, #ff0000) !important;
    background-color: transparent !important;
}
.button.text-white {
 color:#fff !important;
}
.text-white {
  color:#fff !important;
}
.hero-tooltip-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
  margin-left: 0.25rem;
  cursor: help;
}

/* Tooltip bubble for hero info icon */
.hero-tooltip-bubble {
  position: absolute;
  bottom: 100%;                 /* show above the icon */
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 0.4rem;
  padding: 0.3rem 0.6rem;
  white-space: normal;          /* allow wrapping on multiple lines */
  width: 260px;            /* keep tooltip within card width */
  font-size: 0.75rem;
  line-height: 1.3;
  color: #fff;
  background: #2f2f2f;
  border-radius: 4px;           /* slightly rounded corners */
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  opacity: 0;
  pointer-events: none;
  z-index: 100;
  transition: opacity 0.1s ease-out;
}

.hero-tooltip-wrapper:hover .hero-tooltip-bubble {
  opacity: 1;
}
/* Light mode tooltip (current dark bubble) */
[data-mode="light"] .hero-tooltip-bubble {
  background: #2f2f2f;        /* dark background */
  color: #fff;                /* white text */
}
/* Dark mode tooltip (white bubble) */
[data-mode="dark"] .hero-tooltip-bubble {
  background: #ffffff;        /* white background */
  color: #111111;             /* dark text */
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
}
@media (max-width: 768px) {
  .hero-tooltip-bubble {
    width:200px !important;
    left: calc(100% - 50px) !important;
  }
}
/* Shrink locale and theme toggle buttons on mobile */
@media (max-width: 640px) {
  /* language selector & light/dark toggle buttons */
  header .w-10.h-10 {
    width: 24px;
    height: 24px;
    font-size: 16px;
  }
 
  /* optional: tighten gaps if needed */
  header .w-0.h-6 {
    display: none;
  }
}