/* Clickable/disabled span that replaces menu links */
.smt-span {
  color: #1c1d1f;
  font-weight: 400;
  display: block;
  min-height: 40px;
  padding: 10px 0;
  height: auto;
  line-height: 24px !important;
  text-transform: uppercase;
  font-size: 11px;
  font-family: "Jost", sans-serif;
  letter-spacing: 2px;
  margin-bottom: 0;
  position: relative;
  cursor: pointer; /* pointer icon */
  text-decoration: none; /* match anchors */
}

/* Hover/focus states to mimic your theme’s links */
.smt-span:hover,
.smt-span:focus,
.smt-span:focus-visible {
  text-decoration: none;            /* or underline if your theme underlines */
  outline: 2px solid transparent;   /* avoid ugly default outline */
  outline-offset: 2px;
}

/* If your menu has specific colors on hover, mirror them here
#navigation .menu .smt-span:hover {
  color: #...;
} */

/* Keep existing hide utility */
.smt-hidden {
  display: none !important;
}
/* Mobile menu span styles (only under #mobile-header) */
#mobile-header .smt-span {
  /* your requested styles */
  letter-spacing: 2px;
  display: block;
  border-top: 1px solid #e6e6e6;
  position: relative;
  padding: 15px 0;
  margin: 0 20px;
  font-size: 13px;
  font-family: 'Roboto', system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  text-transform: uppercase;
  color: #333333;
  outline: none;
  text-align: left;

  /* ensure tap-friendly + pointer */
  min-height: 44px;      /* better touch target on mobile */
  line-height: 24px;
  cursor: pointer;
  text-decoration: none;
}

/* Optional: remove the top border on the very first mobile item to avoid a double line */
#mobile-header .dl-menu > li:first-child > .smt-span,
#mobile-header .dl-submenu > li:first-child > .smt-span {
  border-top: none;
}

/* Optional hover/focus states */
#mobile-header .smt-span:hover,
#mobile-header .smt-span:focus,
#mobile-header .smt-span:focus-visible {
  text-decoration: none;
  outline: 2px solid transparent; /* keep keyboard focus smooth */
  outline-offset: 2px;
}