/* Shared navigation cards. Loaded after the page styles to keep menus uniform. */
:root {
  --menu-surface: linear-gradient(135deg, #2b3d34, #1f2e26 65%, #1b2722);
  --menu-surface-hover: linear-gradient(135deg, #364b3b, #293a2f 65%, #213028);
  --menu-edge: #907a50;
  --menu-ink: #f0e5cd;
  --menu-shadow: inset 0 1px 0 #e7cf9130, inset 0 0 0 3px #16261f,
    inset 0 0 0 4px #b79a5824, 0 3px 10px #0003;
}

body.tida-app-page .body ul.nav:not(.quest-actions),
body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions),
.world-legacy-menu ul.nav:not(.quest-actions) {
  display: grid;
  gap: 9px;
  padding: 0;
  list-style: none;
}

body.tida-app-page .body ul.nav:not(.quest-actions) > li,
body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions) > li,
.world-legacy-menu ul.nav:not(.quest-actions) > li {
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

body.tida-app-page .body ul.nav:not(.quest-actions) > li > a,
body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions) > li > a,
.world-legacy-menu ul.nav:not(.quest-actions) > li > a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  box-sizing: border-box;
  min-width: 0;
  min-height: 54px;
  padding: 12px 34px 12px 14px;
  color: var(--menu-ink);
  background: var(--menu-surface);
  border: 1px solid var(--menu-edge);
  border-radius: 8px;
  box-shadow: var(--menu-shadow);
  font-family: var(--tida-serif, Georgia, "Times New Roman", serif);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  text-shadow: 0 1px 2px #0008;
  overflow-wrap: anywhere;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

body.tida-app-page .body ul.nav:not(.quest-actions) > li > a::after,
body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions) > li > a::after,
.world-legacy-menu ul.nav:not(.quest-actions) > li > a::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 1px solid #c9ae76;
  border-right: 1px solid #c9ae76;
  transform: translateY(-50%) rotate(45deg);
  opacity: .7;
  pointer-events: none;
}

/* Category rows contain a separate icon and link; retain that markup. */
body.tida-app-page .body .sections > p,
.world-menu-grid > a,
.world-destinations > a {
  color: var(--menu-ink);
  background: var(--menu-surface);
  border: 1px solid var(--menu-edge);
  border-radius: 8px;
  box-shadow: var(--menu-shadow);
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

body.tida-app-page .body ul.nav:not(.quest-actions) > li > a img.menu,
body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions) > li > a img.menu,
body.tida-app-page .body .sections > p > img,
.world-legacy-menu ul.nav:not(.quest-actions) > li > a img.menu {
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 5px;
  object-fit: contain;
  vertical-align: middle;
  background: radial-gradient(circle at 35% 25%, #6a5c3a, #2e3e31 68%, #1d2b23);
  border: 1px solid #b99a5b;
  border-radius: 50%;
  box-shadow: inset 0 0 0 2px #1b2822, 0 1px 4px #0005;
}

.world-menu-grid > a > .tida-icon,
.world-destinations > a > .tida-icon:first-child {
  box-sizing: border-box;
  width: 34px;
  height: 34px;
  padding: 6px;
  color: #ddc58b;
  background: radial-gradient(circle at 35% 25%, #6a5c3a, #2e3e31 68%, #1d2b23);
  border: 1px solid #b99a5b;
  border-radius: 50%;
  box-shadow: inset 0 0 0 2px #1b2822;
}

@media (hover: hover) {
  body.tida-app-page .body ul.nav:not(.quest-actions) > li > a:hover,
  body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions) > li > a:hover,
  .world-legacy-menu ul.nav:not(.quest-actions) > li > a:hover,
  body.tida-app-page .body .sections > p:hover,
  .world-menu-grid > a:hover,
  .world-destinations > a:hover {
    color: #fff2d2;
    background: var(--menu-surface-hover);
    border-color: #d0b477;
    box-shadow: var(--menu-shadow), 0 0 12px #bfa26618;
  }
}

body.tida-app-page .body ul.nav:not(.quest-actions) > li > a:active,
body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions) > li > a:active,
.world-legacy-menu ul.nav:not(.quest-actions) > li > a:active,
.world-menu-grid > a:active,
.world-destinations > a:active {
  background: #1a2b21;
  box-shadow: inset 0 2px 5px #0005, inset 0 0 0 3px #16261f;
}

body.tida-app-page .body ul.nav > li > a:focus-visible,
body.tida-app-page .body ul.navb:not(.battle-actions) > li > a:focus-visible,
.world-menu-grid > a:focus-visible,
.world-destinations > a:focus-visible {
  outline: 2px solid #ead39f;
  outline-offset: 3px;
}

body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions) > li > a.active_s {
  border-color: #d5b879;
  color: #ffe7ad;
  background: var(--menu-surface-hover);
}

body.tida-app-page .body ul.navb:not(.battle-actions):not(.quest-actions) > li > a.disable_s,
body.tida-app-page .body ul.nav > li > a[aria-disabled="true"] {
  color: #a5aa9f;
  background: #212d27;
  border-color: #556355;
  box-shadow: inset 0 0 0 3px #1b261f;
}

@media (prefers-reduced-motion: reduce) {
  body.tida-app-page .body ul.nav > li > a,
  body.tida-app-page .body ul.navb > li > a,
  body.tida-app-page .body .sections > p,
  .world-menu-grid > a,
  .world-destinations > a { transition: none; }
}
