/* Reset & Base */
#goldika-off-canvas ul, #goldika-off-canvas li { margin: 0; list-style: none; }
#goldika-off-canvas a { text-decoration: none; display: block; }

/* Hamburger */
#goldika-menu-toggle { width: 30px; height: 25px; position: relative; cursor: pointer; display: flex; flex-direction: column; justify-content: space-around; z-index: 15; }
#goldika-menu-toggle .bar { display: block; width: 100%; height: 3px; background: #FAAF00; border-radius: 3px; transition: all 0.3s ease-in-out; }
#goldika-menu-toggle.is-active .bar:nth-child(2) { opacity: 0; }
#goldika-menu-toggle.is-active .bar:nth-child(1) { transform: translateY(11px) rotate(45deg); }
#goldika-menu-toggle.is-active .bar:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Off-Canvas Menu */
#goldika-off-canvas { position: fixed; top: -120vh; right: 0; width: 100%; height: 100vh; z-index: 12; overflow: hidden; box-shadow: 0 4px 10px rgba(0,0,0,0.5); transition: top 0.3s ease-in-out; background: transparent; pointer-events: none;}
#goldika-off-canvas.off-canvas-visible { top: 0; }

/* Menu Levels Sliding */
.menu-level { position: absolute; top: 0; left: 0; width: 100%; transform: translateX(100%); overflow-y: auto; padding-bottom: 32px; z-index: 15; background: #373943; transition: transform 0.3s ease-in-out; border-radius:0 0 16px 16px; }
.menu-level.active-level { transform: translateX(0); pointer-events: all;}
.menu-level._anim-enter-right { transform: translateX(100%); animation: slideInFromRight 0.3s forwards; }
.menu-level._anim-enter-left  { transform: translateX(-100%); animation: slideInFromLeft 0.3s forwards; }
.menu-level._anim-exit-left   { transform: translateX(0); animation: slideOutToLeft 0.3s forwards; }
.menu-level._anim-exit-right  { transform: translateX(0); animation: slideOutToRight 0.3s forwards; }

@keyframes slideInFromRight { 0% { transform: translateX(100%); } 100% { transform: translateX(0); } }
@keyframes slideInFromLeft  { 0% { transform: translateX(-100%); } 100% { transform: translateX(0); } }
@keyframes slideOutToLeft   { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } }
@keyframes slideOutToRight  { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } }

/* List Items & Links */
.menu-item { background: #373943; display:flex; align-items:center; border-bottom:1px solid #333; }
.menu-item.has-submenu .menu-link-page { max-width: 50%; flex: unset !important; }
.menu-item .menu-link-page { flex:1; }
.menu-item a { display:flex; justify-content:space-between; align-items:center; color:#fff; font-size:16px; padding:15px; }
.submenu-trigger { height:100%; flex:1; text-align:end; }

/* Header & Back */
.menu-header { height: 88px; display:flex; justify-content:flex-start; align-items:center; padding:15px; background:#373943; color:#FAAF00; font-size:18px; font-weight:bold; border-bottom:1px solid #FAAF00; position: sticky; top:0; z-index:10; }
.menu-header.back-button span, .menu-header img { margin:auto; padding-left:20px; }
.back-button { cursor:pointer; color:#fff; }
.back-button .arrow-back { color:#fff; margin-left:10px; font-size:18px; }
.logged-in-user-name{display: flex;color: white !important;width: 100%;justify-content: center;flex-wrap: nowrap;}
/* Login */
.menu-login { position: sticky; bottom:0; width:100%; background:#373943; border-top:1px solid #333; padding:15px; z-index:15; box-sizing:border-box; }
.login-button { text-align:center; padding:10px; background:none; border:2px solid #FAAF00; color:#FAAF00; border-radius:4px; transition: background 0.2s; }
.login-button:hover { background: rgba(255,215,0,0.1); color:#FAAF00; }
.menu-link{
    flex:1;
}
/* Overlay */
#goldika-overlay { position: fixed; top:0; left:0; width:100%; height:100vh; background: rgba(0,0,0,0.6); z-index:11; display:none; }