.btn-green,
.btn-grey:hover,
.badge.badge-green,
.custom-control-input:checked ~ .custom-control-label::before,
.btn-green-line:hover
{
background:#ff6b02;
color:#fff !important;
}
ul.top-menu a:hover,
.list-inline a:hover,
.menu-category a:hover,
.siderbar-menu li.active a,
#menu-category .col a.active,
.btn.normal:hover,
.text-green,
a:hover,
.menu-carousel a.active,
.menu-carousel a:hover
{
color:#ff6b02 !important;
}
.btn-white
{
  background: #fff;
  color: #ff6b02;
}
.badge.small.rounded-pill{
width: 15px;
height: 15px;
line-height: 15px;
font-size: 10px;
background-color: red;
}
.full-text {
  color: #ffffff; /* White text */
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7); /* Shadow to make text more legible */
  font-size: 2em; /* Adjust based on your design needs */
  font-weight: bold; /* Makes the text bold */
  text-align: center;
  max-width: 80%; /* Ensures text doesn't span the full width of the header */
  margin: 0 auto; /* Centers the text block if it's less than max-width */
}
@media (max-width: 768px) {
  .full-text {
    color: #000000; /* Black text for mobile screens */
	text-shadow: none;
  }
}
.image-text {
  color: #ffffff; /* Blanco */
  text-shadow: 3px 3px 12px rgba(0, 0, 0, 0.9); /* Sombra más notable */
  font-size: 2em; /* Ajusta según tus necesidades */
  font-weight: bold; /* Negrita */
  text-align: center;
  max-width: 80%; /* Evita que el texto abarque todo el ancho */
  margin: 0 auto; /* Centra el bloque de texto si es menos del ancho máximo */
}

.image-text:hover {
  color: #ff6b02; /* Cambia el color a naranja al pasar el ratón */
}
#vue-widget-nav {
  margin-top:5px; / Desplazamiento de widget del menu de navegación superior.
}
:root {
  --hk-brand: #ff6b02;   /* naranja corporativo Happy Kosher */
  --hk-ink:   #000000;   /* texto principal */
  --hk-muted: #737373;   /* texto secundario */
  --hk-bg:    #f6f7f8;   /* fondo suave */
  --hk-card:  #ffffff;   /* fondo tarjetas */
  --hk-border:#e5e5e5;   /* borde suave */
}

.hk-cta {
  position: relative;
  color: var(--hk-ink);
  overflow: hidden;
  padding: 2.2rem 0;
}

/* Luces suaves del fondo */
.hk-cta::before {
  content: "";
  position: absolute;
  right: -20%;
  top: -20%;
  width: 60vw;
  height: 26vw;
  max-width: 900px;
  border-radius: 999px;
  filter: blur(60px);
  background: radial-gradient(closest-side, rgba(255,107,2,.12), transparent 65%);
}
.hk-cta::after {
  content: "";
  position: absolute;
  left: -20%;
  bottom: -30%;
  width: 70vw;
  height: 30vw;
  max-width: 1000px;
  border-radius: 999px;
  filter: blur(70px);
  background: radial-gradient(closest-side, rgba(0,0,0,.06), transparent 65%);
}

/* Tarjetas */
.hk-card {
  background: var(--hk-card);
  border: 1px solid var(--hk-border);
  border-radius: .95rem;
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
  display: flex;
  flex-direction: column;
  height: 100%;
}
.hk-card .hk-media {
  width: 100%;
  height: 0;
  padding-top: 56.25%;
  background: #e6e6e6;
  border-top-left-radius: .95rem;
  border-top-right-radius: .95rem;
}
.hk-card .hk-body {
  padding: 1.1rem 1.1rem .6rem;
}
.hk-chip {
  display: inline-block;
  color: var(--hk-brand);
  background: rgba(255,107,2,.10);
  border: 1px solid rgba(255,107,2,.20);
  border-radius: 999px;
  font-size: .75rem;
  padding: .25rem .55rem;
}
.hk-title {
  font-weight: 700;
  font-size: 1.05rem;
  margin: .5rem 0 .35rem;
}
.hk-text {
  color: var(--hk-muted);
  font-size: .95rem;
  line-height: 1.45;
}
.hk-actions {
  padding: 1rem 1.1rem 1.2rem;
  margin-top: auto;
}

/* Botones estilo HappyKosher */
.btn.hk-primary {
  background: var(--hk-brand);
  border-color: var(--hk-brand);
  color: #fff;
}
.btn.hk-primary:hover {
  filter: brightness(.92);
  color: #fff;
}
.btn.hk-outline {
  background: #fff;
  border: 1.5px solid rgba(255,107,2,.45);
  color: var(--hk-brand);
}
.btn.hk-outline:hover {
  background: var(--hk-brand);
  border-color: var(--hk-brand);
  color: #fff;
}

.maxw-760 {
  max-width: 760px;
}
.hk-actions { position:relative; z-index:2; }
.hk-actions .btn { pointer-events:auto; }
/* Color de texto SIEMPRE blanco en el botón primario */
.btn.hk-primary,
.btn.hk-primary:link,
.btn.hk-primary:visited {
  color: #fff !important;
}

:root{
  --hk-brand: #ff6b02;
  --hk-brand-darker: #e25f02; /* tono más oscuro para hover */
}

.btn.hk-primary:hover,
.btn.hk-primary:focus,
.btn.hk-primary:active {
  background-color: var(--hk-brand-darker) !important;
  border-color: var(--hk-brand-darker) !important;
  color: #fff !important;
}

/* Outline: al pasar el ratón, texto también blanco */
.btn.hk-outline:hover,
.btn.hk-outline:focus,
.btn.hk-outline:active {
  color: #fff !important;
}

/* Por si algún estilo global pone a los <a> color naranja dentro de .hk-actions */
.hk-actions .btn { color: inherit; }
.hk-actions .btn:hover { color: inherit; }