/*
 * GekiStore V181 — Desktop navigation rail
 * UI-only patch: fixes clipped desktop navigation, adds a draggable/scrollable
 * service rail, and normalizes the Roblox service folder to the V178 theme.
 * No wallet/order/payment/Partner API business logic is changed here.
 */

@media (min-width:901px){
  .gk-v178 .geki-header{
    width:min(calc(100% - 24px),1540px)!important;
    min-height:66px!important;
    padding:8px 9px!important;
    gap:8px!important;
    overflow:visible!important;
  }

  .gk-v178 .geki-brand{
    flex:0 0 auto!important;
    gap:8px!important;
    padding:2px 4px!important;
  }
  .gk-v178 .geki-brand .logo-mark{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    border-radius:11px!important;
    font-size:13px!important;
  }
  .gk-v178 .geki-brand .logo-word{
    font-size:15px!important;
    letter-spacing:.025em!important;
  }

  .gk-v178 .desktop-nav-shell{
    position:relative;
    display:flex;
    align-items:center;
    flex:1 1 auto;
    min-width:0;
    height:46px;
    margin:0 2px;
    border:1px solid rgba(192,132,252,.08);
    border-radius:14px;
    background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.006));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
    overflow:hidden;
    isolation:isolate;
  }
  .gk-v178 .desktop-nav-shell::before,
  .gk-v178 .desktop-nav-shell::after{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    z-index:3;
    width:38px;
    pointer-events:none;
    opacity:0;
    transition:opacity .18s ease;
  }
  .gk-v178 .desktop-nav-shell::before{
    left:0;
    background:linear-gradient(90deg,rgba(8,4,13,.97),rgba(8,4,13,.62),transparent);
  }
  .gk-v178 .desktop-nav-shell::after{
    right:0;
    background:linear-gradient(270deg,rgba(8,4,13,.97),rgba(8,4,13,.62),transparent);
  }
  .gk-v178 .desktop-nav-shell.can-scroll-left::before,
  .gk-v178 .desktop-nav-shell.can-scroll-right::after{opacity:1}

  .gk-v178 .desktop-nav{
    display:flex!important;
    align-items:center!important;
    flex:1 1 auto!important;
    min-width:0!important;
    width:100%;
    height:100%;
    gap:3px!important;
    padding:3px 34px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
    overscroll-behavior-x:contain;
    scroll-behavior:smooth;
    scroll-padding-inline:38px;
    touch-action:pan-x;
    cursor:grab;
  }
  .gk-v178 .desktop-nav::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}
  .gk-v178 .desktop-nav.is-dragging{
    cursor:grabbing;
    scroll-behavior:auto;
    user-select:none;
  }
  .gk-v178 .desktop-nav.is-dragging *{pointer-events:none!important}

  /* V178 hid selected links below 1220px; V181 keeps every destination available
     and lets the rail handle overflow instead of deleting navigation items. */
  body.gk-v177.gk-v178 .desktop-nav>a{display:inline-flex!important}
  .gk-v178 .desktop-nav>a,
  .gk-v178 .desktop-service-folder.gk-services{
    flex:0 0 auto!important;
  }
  .gk-v178 .desktop-nav>a{
    cursor:pointer!important;
    min-height:36px!important;
    height:36px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center;
    gap:6px!important;
    padding:0 10px!important;
    border:1px solid transparent!important;
    border-radius:10px!important;
    color:#b7adc4!important;
    background:transparent!important;
    font-size:10.5px!important;
    font-weight:720!important;
    line-height:1!important;
    letter-spacing:.012em!important;
    white-space:nowrap!important;
  }
  .gk-v178 .desktop-nav>a:hover,
  .gk-v178 .desktop-nav>a.active,
  .gk-v178 .desktop-nav>a[aria-current="page"]{
    border-color:rgba(192,132,252,.15)!important;
    background:rgba(139,92,246,.085)!important;
    color:#f7f1ff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
  }
  .gk-v178 .desktop-nav>a .nav-svg-icon{width:15px!important;height:15px!important}
  .gk-v178 .desktop-nav>a.nav-120h{
    border-color:rgba(192,132,252,.17)!important;
    background:linear-gradient(135deg,rgba(124,58,237,.16),rgba(168,85,247,.075))!important;
    color:#eadcff!important;
  }
  .gk-v178 .desktop-nav>a.nav-120h:hover,
  .gk-v178 .desktop-nav>a.nav-120h[aria-current="page"]{
    border-color:rgba(216,180,254,.30)!important;
    background:linear-gradient(135deg,rgba(124,58,237,.28),rgba(168,85,247,.13))!important;
  }

  /* Flatten the oversized V147 service-folder treatment inside the compact rail. */
  .gk-v178 .desktop-service-folder.gk-services{
    min-width:auto!important;
    margin:0!important;
    border:1px solid rgba(192,132,252,.13)!important;
    border-radius:10px!important;
    background:linear-gradient(135deg,rgba(139,92,246,.10),rgba(168,85,247,.035))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.03)!important;
  }
  .gk-v178 .desktop-service-folder.gk-services:hover,
  .gk-v178 .desktop-service-folder.gk-services[open],
  .gk-v178 .desktop-service-folder.gk-services.active{
    border-color:rgba(216,180,254,.28)!important;
    background:linear-gradient(135deg,rgba(124,58,237,.20),rgba(168,85,247,.075))!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
  }
  .gk-v178 .desktop-service-folder.gk-services>.gk-services-toggle{
    min-height:34px!important;
    height:34px!important;
    padding:0 8px!important;
    gap:6px!important;
    border-radius:9px!important;
    background:transparent!important;
    overflow:visible!important;
  }
  .gk-v178 .desktop-service-folder.gk-services>.gk-services-toggle::before{display:none!important}
  .gk-v178 .desktop-service-folder.gk-services .gk-services-emblem{
    display:grid!important;
    place-items:center!important;
    flex:0 0 23px!important;
    width:23px!important;
    height:23px!important;
    border:1px solid rgba(216,180,254,.22)!important;
    border-radius:7px!important;
    color:#eadcff!important;
    background:rgba(139,92,246,.14)!important;
    box-shadow:none!important;
    transform:none!important;
  }
  .gk-v178 .desktop-service-folder.gk-services .gk-services-emblem .nav-svg-icon{width:14px!important;height:14px!important}
  .gk-v178 .desktop-service-folder.gk-services .gk-services-copy{flex:0 1 auto!important}
  .gk-v178 .desktop-service-folder.gk-services .gk-services-title{
    font-size:10.5px!important;
    font-weight:760!important;
    color:#efe8f8!important;
    white-space:nowrap!important;
  }
  .gk-v178 .desktop-service-folder.gk-services .gk-services-caption{display:none!important}
  .gk-v178 .desktop-service-folder.gk-services .gk-services-chevron{
    display:grid!important;
    place-items:center!important;
    flex:0 0 17px!important;
    width:17px!important;
    height:17px!important;
    border:0!important;
    border-radius:5px!important;
    color:#bd9fe0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .gk-v178 .desktop-service-folder.gk-services .gk-services-chevron .nav-svg-icon{width:14px!important;height:14px!important}

  .gk-v178 .desktop-nav-scroll{
    position:absolute;
    top:50%;
    z-index:5;
    width:28px;
    height:32px;
    display:grid;
    place-items:center;
    padding:0;
    transform:translateY(-50%);
    border:1px solid rgba(216,180,254,.18);
    border-radius:9px;
    background:rgba(11,6,18,.90);
    color:#dfcdf5;
    box-shadow:0 5px 18px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.04);
    cursor:pointer;
    opacity:1;
    transition:opacity .16s ease,transform .16s ease,border-color .16s ease,background .16s ease;
  }
  .gk-v178 .desktop-nav-scroll:hover{
    border-color:rgba(216,180,254,.38);
    background:rgba(65,32,98,.92);
  }
  .gk-v178 .desktop-nav-scroll:active{transform:translateY(-50%) scale(.95)}
  .gk-v178 .desktop-nav-scroll-left{left:4px}
  .gk-v178 .desktop-nav-scroll-right{right:4px}
  .gk-v178 .desktop-nav-scroll svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .gk-v178 .desktop-nav-scroll[disabled],
  .gk-v178 .desktop-nav-scroll.is-hidden{
    opacity:0;
    pointer-events:none;
  }

  .gk-v178 .nav-actions{
    margin-left:0!important;
    gap:5px!important;
    flex:0 0 auto!important;
  }
  .gk-v178 .header-icon-btn,
  .gk-v178 .header-avatar{
    width:38px!important;
    height:38px!important;
    border-radius:11px!important;
  }
  .gk-v178 .header-icon-btn .nav-svg-icon,
  .gk-v178 .header-avatar .nav-svg-icon{width:17px!important;height:17px!important}
  .gk-v178 .desktop-account{
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
  }
  .gk-v178 .desktop-account>.purple120{display:none!important}
  .gk-v178 .desktop-account .btn.small,
  .gk-v178 .desktop-account .wallet{
    min-height:38px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 11px!important;
    border-radius:10px!important;
    font-size:10.5px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .gk-v178 .desktop-account .btn.yellow.small:last-child{display:inline-flex!important}

  /* Dropdown stays readable even though its trigger lives inside an overflow rail. */
  .gk-v178 .gk-services-popover{
    width:min(320px,calc(100vw - 24px))!important;
    padding:9px!important;
    border:1px solid rgba(216,180,254,.24)!important;
    border-radius:16px!important;
    background:radial-gradient(circle at 15% 0%,rgba(139,92,246,.14),transparent 48%),rgba(10,6,16,.97)!important;
    box-shadow:0 24px 70px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.045)!important;
    backdrop-filter:blur(18px) saturate(125%);
    -webkit-backdrop-filter:blur(18px) saturate(125%);
  }
  .gk-v178 .gk-services-popover .gk-service-link{
    min-height:58px!important;
    border-color:rgba(192,132,252,.12)!important;
    background:rgba(255,255,255,.018)!important;
    box-shadow:none!important;
  }
  .gk-v178 .gk-services-popover .gk-service-link:hover,
  .gk-v178 .gk-services-popover .gk-service-link[aria-current="page"]{
    border-color:rgba(216,180,254,.27)!important;
    background:linear-gradient(90deg,rgba(124,58,237,.16),rgba(168,85,247,.055))!important;
    box-shadow:inset 2px 0 0 rgba(216,180,254,.65)!important;
  }

}

@media (min-width:901px) and (max-width:1180px){
  .gk-v178 .geki-brand .logo-word{display:none!important}
  .gk-v178 .desktop-account .btn.small,
  .gk-v178 .desktop-account .wallet{padding-inline:9px!important}
}
@media (min-width:901px) and (max-width:1030px){
  .gk-v178 .desktop-account .btn.small{font-size:10px!important;padding-inline:8px!important}
  .gk-v178 .header-icon-btn,.gk-v178 .header-avatar{width:36px!important;height:36px!important}
}

@media (max-width:900px){
  .desktop-nav-shell{display:none!important}
}

@media (prefers-reduced-motion:reduce){
  .desktop-nav,.desktop-nav-scroll{scroll-behavior:auto!important;transition:none!important}
}