/* PolTraders — navbar estilo "Apple": barra de cristal flotante, brillo que recorre el borde de arriba,
   enlaces que se iluminan con una línea dorada (los demás se atenúan) y buscador que se despliega desde la lupa
   (assets/js/pt-nav.js). Se carga después de pt-site.css y solo cambia el aspecto: mismos enlaces y orden. */

/* ---------- Barra ---------- */
.nav-glass {
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(24, 21, 16, .62), rgba(12, 11, 8, .58));
    border-color: rgba(245, 230, 200, .09);
    box-shadow: 0 22px 44px -26px rgba(0, 0, 0, .9), inset 0 1px 0 rgba(255, 244, 214, .06), inset 0 -1px 0 rgba(0, 0, 0, .35);
    backdrop-filter: blur(20px) saturate(1.5); -webkit-backdrop-filter: blur(20px) saturate(1.5);
}
.nav-glass.scrolled, .nav-glass.menu-open {
    background: linear-gradient(180deg, rgba(24, 21, 16, .82), rgba(12, 11, 8, .8));
    border-color: rgba(245, 230, 200, .11);
}
/* Brillo que recorre el borde de arriba */
.nav-glass::before {
    content: ""; position: absolute; top: -1px; left: 6%; width: 26%; height: 1px; pointer-events: none; border-radius: 1px;
    background: linear-gradient(90deg, transparent, rgba(246, 207, 98, .95), rgba(255, 244, 214, .9), rgba(246, 207, 98, .95), transparent);
    filter: drop-shadow(0 0 6px rgba(232, 177, 42, .8));
    animation: nav-shine 7s cubic-bezier(.45, 0, .25, 1) infinite;
}
@keyframes nav-shine {
    0% { left: 4%; opacity: 0; }
    10% { opacity: 1; }
    50% { left: 70%; opacity: 1; }
    60% { opacity: 0; }
    100% { left: 70%; opacity: 0; }
}

/* ---------- Enlaces: se iluminan y crecen un poco, con línea dorada debajo; los demás se atenúan ---------- */
.nav-links > a, .nav-dropdown > a {
    transition: color .25s, opacity .3s, transform .35s cubic-bezier(.34, 1.56, .64, 1), background .2s;
}
.nav-links > a:not(.btn-login):not(.nav-user):hover, .nav-dropdown > a:hover, .nav-dropdown:focus-within > a {
    background: none; color: #fff; transform: translateY(-1px) scale(1.045);
}
.nav-links > a:not(.btn-login):not(.nav-user)::before, .nav-dropdown > a::before {
    content: ""; position: absolute; left: 50%; bottom: 2px; width: 0; height: 2px; border-radius: 2px; translate: -50% 0;
    background: linear-gradient(90deg, #f6cf62, #e8b12a); box-shadow: 0 0 10px rgba(232, 177, 42, .7);
    transition: width .4s cubic-bezier(.22, 1, .36, 1);
}
.nav-links > a:not(.btn-login):not(.nav-user):hover::before, .nav-dropdown:hover > a::before, .nav-dropdown:focus-within > a::before { width: calc(100% - 22px); }
.nav-links:has(> a:not(.btn-login):not(.nav-user):hover, > .nav-dropdown:hover) > a:not(:hover):not(.btn-login):not(.nav-user),
.nav-links:has(> a:not(.btn-login):not(.nav-user):hover, > .nav-dropdown:hover) > .nav-dropdown:not(:hover) > a { opacity: .5; }
.nav-links a.active { color: #fff; }

/* ---------- Iniciar sesión: píldora de cristal ---------- */
.nav-links .btn-login {
    border-radius: 999px !important; height: 38px; padding: 0 18px !important;
    background: rgba(255, 244, 214, .07) !important; color: var(--text) !important;
    border: 1px solid rgba(245, 230, 200, .16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 8px 20px -14px rgba(0, 0, 0, .9);
    transition: transform .3s cubic-bezier(.34, 1.56, .64, 1), border-color .25s, color .25s, box-shadow .3s, background .25s !important;
}
.nav-links .btn-login:hover {
    transform: translateY(-1px) scale(1.03); color: var(--gold-hi) !important; border-color: var(--gold-line);
    background: rgba(232, 177, 42, .1) !important;
    box-shadow: 0 0 0 4px rgba(232, 177, 42, .08), 0 12px 28px -14px rgba(232, 177, 42, .7), inset 0 1px 0 rgba(255, 255, 255, .1);
}
.nav-user { transition: border-color .25s, box-shadow .3s; }
.nav-user:hover { border-color: var(--gold-line); box-shadow: 0 0 0 4px rgba(232, 177, 42, .1); }

/* ---------- Buscador que se despliega desde la lupa ---------- */
.nav-search { position: relative; display: flex; align-items: center; margin-left: 6px; }
.nav-search__btn {
    width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: var(--text-2); font-size: 14px;
    transition: color .2s, background .2s, transform .3s cubic-bezier(.34, 1.56, .64, 1), opacity .2s;
}
.nav-search__btn:hover { color: #fff; background: rgba(255, 255, 255, .06); transform: scale(1.08); }
.nav-search__box {
    position: relative; display: flex; align-items: center; gap: 8px; width: 0; height: 38px; padding: 0; overflow: hidden; opacity: 0;
    border-radius: 999px; border: 1px solid transparent; background: rgba(8, 7, 5, .55);
    transition: width .5s cubic-bezier(.22, 1, .36, 1), opacity .25s, padding .5s cubic-bezier(.22, 1, .36, 1), border-color .3s, box-shadow .3s;
}
.nav-search__box > i { flex: none; color: var(--gold); font-size: 13px; }
.nav-search__box input {
    flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: none; color: var(--text); font: inherit; font-size: 13.5px;
}
.nav-search__box input::placeholder { color: var(--text-3); }
.nav-search__box input::-webkit-search-cancel-button { display: none; }
.nav-search__box kbd {
    flex: none; padding: 2px 6px; border-radius: 6px; border: 1px solid var(--line-2); color: var(--text-3);
    font: 600 10px var(--f-mono); letter-spacing: .06em;
}
.nav-search__close { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--text-3); font-size: 12px; transition: color .2s, background .2s; }
.nav-search__close:hover { color: #fff; background: rgba(255, 255, 255, .08); }
/* Abierto: se despliega hacia la izquierda por encima de los enlaces, sin mover el resto de la barra */
.nav-search__box { position: absolute; right: 0; top: 50%; translate: 0 -50%; z-index: 3; background: #0d0c09; }
.nav-search.is-open .nav-search__btn { opacity: 0; pointer-events: none; }
.nav-search.is-open .nav-search__box {
    width: min(320px, 34vw); padding: 0 8px 0 14px; opacity: 1; border-color: rgba(232, 177, 42, .55);
    box-shadow: 0 0 0 4px rgba(232, 177, 42, .1), 0 0 24px -8px rgba(232, 177, 42, .6);
}
.nav-search__results {
    position: absolute; top: calc(100% + 12px); right: 0; width: 340px; padding: 6px; border-radius: 16px;
    background: rgba(20, 18, 14, .97); border: 1px solid var(--line-2); box-shadow: var(--shadow);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
    opacity: 0; visibility: hidden; translate: 0 6px; transition: opacity .2s, translate .3s cubic-bezier(.22, 1, .36, 1), visibility 0s .3s;
}
.nav-search.has-results .nav-search__results { opacity: 1; visibility: visible; translate: 0 0; transition: opacity .2s, translate .3s cubic-bezier(.22, 1, .36, 1), visibility 0s; }
.nav-search__item { display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 11px; color: var(--text); transition: background .15s; }
.nav-search__item .nav-dropdown-item-icon { width: 32px; height: 32px; font-size: 13px; }
.nav-search__item b { display: block; font-size: 13.5px; font-weight: 550; }
.nav-search__item small { display: block; font-size: 12px; color: var(--text-3); }
.nav-search__item mark { background: none; color: var(--gold-hi); }
.nav-search__item.is-sel, .nav-search__item:hover { background: rgba(232, 177, 42, .09); }
.nav-search__empty { padding: 14px 12px; font-size: 13px; color: var(--text-3); }

@media (prefers-reduced-motion: reduce) {
    .nav-glass::before { animation: none; opacity: 0; }
    .nav-links > a, .nav-dropdown > a, .nav-search__box { transition: none; }
}
/* Con el buscador abierto, los enlaces que quedan debajo se apagan del todo */
.nav-links:has(.nav-search.is-open) > a:not(.btn-login):not(.nav-user),
.nav-links:has(.nav-search.is-open) > .nav-dropdown { transition: opacity .3s; }
.nav-links:has(.nav-search.is-open) > a[href="terminos"], .nav-links:has(.nav-search.is-open) > a[href="descuentos"] { opacity: 0; }

/* Barra más ancha y con aire a la derecha: el selector de idioma ya no queda pegado al borde */
.nav-glass { max-width: 1720px; padding-right: 16px; }
.nav-glass .pt-lang--nav { margin-left: 4px; }
/* 1280-1379 px: un poco más compacta para que todo quepa dentro (antes se salía el idioma) */
@media (min-width: 1280px) and (max-width: 1379px) {
    .nav-glass { gap: 10px; }
    .nav-links > a, .nav-dropdown > a { padding: 9px 6px; }
    .nav-search { margin-left: 0; }
}
@media (min-width: 1380px) and (max-width: 1599px) {
    .nav-links > a, .nav-dropdown > a { padding: 9px 10px; }
}