/* EO menu — menu con 2 cấp (xem eo-menu.js). Desktop: xổ xuống có chuyển động. Mobile: nút mở/gập ≥ 44px trong ngăn menu. */

/* ── Desktop: menu con xổ xuống ── */
.eo-dd { position: relative; }
.eo-dd > .eo-dd__menu { display: block !important; visibility: hidden; opacity: 0; transform: translateY(8px); pointer-events: none;
  transition: opacity .2s ease, transform .24s cubic-bezier(.2, .7, .2, 1), visibility 0s linear .24s; }
.eo-dd.is-open > .eo-dd__menu, .eo-dd:focus-within > .eo-dd__menu { visibility: visible; opacity: 1; transform: none; pointer-events: auto; transition-delay: 0s; }
.eo-dd > .eo-dd__menu > li { opacity: 0; transform: translateY(4px); transition: opacity .2s ease, transform .2s ease; }
.eo-dd.is-open > .eo-dd__menu > li, .eo-dd:focus-within > .eo-dd__menu > li { opacity: 1; transform: none; }
.eo-dd.is-open > .eo-dd__menu > li:nth-child(2) { transition-delay: 30ms; } .eo-dd.is-open > .eo-dd__menu > li:nth-child(3) { transition-delay: 60ms; }
.eo-dd.is-open > .eo-dd__menu > li:nth-child(4) { transition-delay: 90ms; } .eo-dd.is-open > .eo-dd__menu > li:nth-child(n+5) { transition-delay: 120ms; }
.eo-dd > a .nav-caret, .eo-dd > a::after { transition: transform .2s ease; }
.eo-dd.is-open > a .nav-caret { transform: rotate(180deg); display: inline-block; }
/* markup mặc định của WordPress (chưa có style của theme): khung menu con tối thiểu */
.eo-dd > ul.sub-menu.eo-dd__menu { position: absolute; top: 100%; left: 0; z-index: 120; min-width: 210px; margin: 0; padding: 8px; list-style: none; background: var(--c-bg, #fff); border: 1px solid var(--c-border, #e5e7eb); border-radius: 12px; box-shadow: 0 12px 32px rgba(0, 0, 0, .12); }
.eo-dd > ul.sub-menu.eo-dd__menu a { display: block; padding: 9px 12px; border-radius: 8px; white-space: nowrap; }

/* ── Mobile: ngăn menu ── */
.eo-sub-row { display: flex; align-items: stretch; gap: 4px; }
.eo-sub-row > a { flex: 1 1 auto; min-width: 0; }
.eo-sub-toggle { flex: 0 0 48px; min-width: 48px; min-height: 44px; border: 0; border-radius: 10px; background: var(--c-surface, rgba(127, 127, 127, .1)); color: inherit; font-size: 16px; cursor: pointer; display: grid; place-items: center; }
.eo-sub-toggle span { display: block; transition: transform .22s ease; }
.eo-has-sub.is-open > .eo-sub-row .eo-sub-toggle span { transform: rotate(180deg); }
.eo-has-sub > .eo-sub { display: grid !important; grid-template-rows: 0fr; overflow: hidden; margin: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; visibility: hidden; opacity: 0; gap: 0 !important;
  transition: grid-template-rows .26s ease, opacity .2s ease, visibility 0s linear .26s; }
.eo-has-sub > .eo-sub > li { min-height: 0; overflow: hidden; }
.eo-has-sub.is-open > .eo-sub { grid-template-rows: 1fr; visibility: visible; opacity: 1; transition-delay: 0s; }
.eo-has-sub > .eo-sub { grid-auto-rows: 0fr; }
.eo-has-sub.is-open > .eo-sub { grid-auto-rows: 1fr; }
.eo-has-sub > .eo-sub a { min-height: 44px; display: flex; align-items: center; overflow-wrap: anywhere; }

@media (prefers-reduced-motion: reduce) {
  .eo-dd > .eo-dd__menu, .eo-dd > .eo-dd__menu > li, .eo-has-sub > .eo-sub, .eo-sub-toggle span, .eo-dd > a .nav-caret { transition: none !important; }
}
