/* Quitar bullet por defecto */
#menu-menufooter li {
  list-style: none;
}

/* Items top-level */
#menu-menufooter > li > a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 0;
  color: #5D666F;
  text-decoration: none;
  font-size: 16px;
  font-family: "DM Sans", sans-serif;
  white-space: nowrap;
}

/* Items SIN hijos: flecha → SVG */
#menu-menufooter > li:not(.menu-item-has-children) > a::before {
  content: '';
  display: inline-block;
  width: 14.5px;
  height: 14.5px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23556068' d='M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  flex-shrink: 0;
}

#menu-menufooter > li:not(.menu-item-has-children) > a {
  transition: transform 0.2s ease;
}

#menu-menufooter > li:not(.menu-item-has-children) > a:hover {
  transform: translateX(4px);
  opacity: 1;
}

/* Color texto general */
#menu-menufooter a {
  color: #5D666F;
  text-decoration: none;
  font-family: "DM Sans", sans-serif;
  font-size: 16px;
}

/* Flecha chevron inyectada por JS */
.footer-arrow {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
}

.footer-arrow svg {
  width: 10px;
  height: 10px;
  fill: #5D666F;
  transition: transform 0.25s ease;
  flex-shrink: 0;
}

/* Ocultar submenús por defecto */
#menu-menufooter .sub-menu {
  display: none;
}

/* =====================
   DESKTOP: card flotante
   ===================== */
@media (min-width: 769px) {
  #menu-menufooter > li.menu-item-has-children {
    position: relative;
  }

  #menu-menufooter > li.menu-item-has-children.open > .sub-menu {
    display: block;
    position: absolute;
    left: 0;
    top: calc(100% + 4px);
    z-index: 9999;
    background: #fff;
    border: 1px solid #e8eaed;
    border-top: 2px solid #9b1c1c;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.10);
    padding: 6px 0;
    min-width: 230px;
    width: max-content;
    max-height: 320px;
    overflow-y: auto;
    animation: footerCardIn 0.18s ease;
  }

  @keyframes footerCardIn {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  #menu-menufooter .sub-menu li a {
    display: block;
    padding: 8px 18px;
    font-size: 13px;
    font-family: "DM Sans", sans-serif;
    color: #5D666F;
    white-space: nowrap;
    transition: background 0.15s ease, color 0.15s ease;
  }

  #menu-menufooter .sub-menu li a:hover {
    background: #fdf2f2;
    color: #9b1c1c;
    opacity: 1;
  }
}

/* =====================
   MÓVIL: acordeón inline
   ===================== */
@media (max-width: 768px) {
  #menu-menufooter > li.menu-item-has-children.open > .sub-menu {
    display: block;
    position: static;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 4px 0 4px 16px;
    animation: none;
  }

  #menu-menufooter .sub-menu li a {
    display: block;
    padding: 5px 0;
    font-size: 14px;
    font-family: "DM Sans", sans-serif;
    color: #5D666F;
    white-space: normal;
    transition: color 0.15s ease;
  }

  #menu-menufooter .sub-menu li a:hover {
    color: #9b1c1c;
    opacity: 1;
  }
}

/* Sin flecha en subitems en ambos */
#menu-menufooter .sub-menu li a::before {
  content: none !important;
}

/* Rotar flecha al abrir */
#menu-menufooter > li.menu-item-has-children.open > a .footer-arrow svg {
  transform: rotate(180deg);
}

.menu-menufooter-container ul#menu-menufooter {
  padding-left: 19px !important;
  margin: 0 !important;
}