/* TrendPret Critical CSS - above-the-fold styles */
/* Extracted from head.php inline <style> for cacheability */

:root {
  --tp-radius: 10px;
  --tp-radius2: 12px;
}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
@media(max-width:767px){ html{font-size:90%;} }
.container{max-width:1320px;margin:0 auto;padding:0 1rem}

/* ===== TP-NAV ===== */
.tp-nav{padding:4px 0;height:56px;min-height:56px;box-sizing:border-box;border-bottom:1px solid rgba(255,255,255,.06);position:sticky;top:0;z-index:1050;background:rgba(7,17,38,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
[data-theme="day"] .tp-nav{background:rgba(255,255,255,.92);border-bottom-color:rgba(15,23,42,.08)}
.tp-nav-inner{display:flex;align-items:center;gap:6px}
.tp-nav-brand{display:flex;align-items:center;gap:8px;text-decoration:none;flex-shrink:0;margin-right:auto}
.tp-nav-logo{font-weight:900;font-size:1.2rem;color:var(--tp-fg,#e2e8f0);letter-spacing:.3px}
.tp-nav-menu{display:flex;align-items:center;gap:4px}

.tp-nav-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:8px;border:none;background:transparent;color:var(--tp-fg2,#94a3b8);font-size:.85rem;font-weight:600;cursor:pointer;text-decoration:none;transition:all .2s ease;white-space:nowrap;font-family:inherit;line-height:1.4}
.tp-nav-btn:hover{background:rgba(20,184,166,.1);color:var(--tp-accent2,#14b8a6)}
.tp-nav-btn.active,.tp-nav-btn[aria-current="page"]{color:var(--tp-accent2,#14b8a6);background:rgba(20,184,166,.08)}
[data-theme="day"] .tp-nav-btn{color:var(--tp-fg2,#64748b)}
[data-theme="day"] .tp-nav-btn:hover{background:rgba(13,148,136,.08);color:var(--tp-accent2,#0d9488)}
[data-theme="day"] .tp-nav-btn.active,[data-theme="day"] .tp-nav-btn[aria-current="page"]{color:var(--tp-accent2,#0d9488);background:rgba(13,148,136,.06)}

.tp-nav-btn--icon{padding:7px 9px;font-size:1rem}
.tp-nav-btn--icon .tp-nav-label{display:none}
@media(max-width:767.98px){.tp-nav-btn--icon .tp-nav-label{display:inline}}

.tp-nav-btn--cta{border:1px solid rgba(54,209,255,.3);color:var(--tp-accent,#36d1ff);background:rgba(54,209,255,.06)}
.tp-nav-btn--cta:hover{background:rgba(54,209,255,.15);border-color:rgba(54,209,255,.45);color:#fff}
[data-theme="day"] .tp-nav-btn--cta{border-color:rgba(8,145,178,.25);color:var(--tp-accent,#0891b2);background:rgba(8,145,178,.05)}
[data-theme="day"] .tp-nav-btn--cta:hover{background:rgba(8,145,178,.12);border-color:rgba(8,145,178,.4);color:#0e7490}

.tp-nav-btn--login{color:var(--tp-accent,#36d1ff)}
.tp-nav-btn--login:hover{background:rgba(54,209,255,.1);color:#fff}
[data-theme="day"] .tp-nav-btn--login{color:var(--tp-accent,#0891b2)}
[data-theme="day"] .tp-nav-btn--login:hover{background:rgba(8,145,178,.08);color:#0e7490}

.tp-nav-sep{width:1px;height:20px;background:rgba(255,255,255,.1);margin:0 2px;flex-shrink:0}
[data-theme="day"] .tp-nav-sep{background:rgba(15,23,42,.1)}
@media(max-width:767.98px){.tp-nav-sep{display:none}}

.tp-nav-avatar{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;color:#fff;font-size:.65rem}
.tp-mobile-search-btn{display:none;background:none;border:none;padding:8px;cursor:pointer;color:var(--tp-fg,#e2e8f0);font-size:1.1rem;line-height:1;transition:color .2s ease}
.tp-mobile-search-btn:hover{color:var(--tp-accent,#36d1ff)}
[data-theme="day"] .tp-mobile-search-btn{color:var(--tp-fg2,#64748b)}
[data-theme="day"] .tp-mobile-search-btn:hover{color:var(--tp-accent,#0891b2)}
.tp-nav-toggle{display:none;background:none;border:none;padding:8px 4px;cursor:pointer;flex-direction:column;gap:5px;margin-left:4px}
.tp-nav-toggle span{display:block;width:22px;height:2px;background:var(--tp-fg,#e2e8f0);border-radius:2px;transition:all .3s ease}
.tp-nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.tp-nav-toggle.open span:nth-child(2){opacity:0}
.tp-nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.tp-logo-day, .tp-logo-night { display: none; vertical-align: middle; }
@media(min-width:768px) {
  html[data-theme="day"] img.tp-logo-day.d-none.d-md-inline { display: inline !important; }
  html[data-theme="night"] img.tp-logo-night.d-none.d-md-inline { display: inline !important; }
}
@media(max-width:767.98px) {
  html[data-theme="day"] img.tp-logo-day.d-md-none { display: inline !important; }
  html[data-theme="night"] img.tp-logo-night.d-md-none { display: inline !important; }
}

.tp-logo-main { vertical-align: middle; }
@media(max-width:767.98px){ .tp-logo-main { max-width:60px !important; max-height:48px !important; } }
@media(min-width:768px){ .tp-logo-main { max-width:180px !important; max-height:48px !important; } }

@media(max-width:767.98px){
  .tp-nav-menu .dropdown { width:100%; box-sizing: border-box; }
  /* User dropdown: closed by default, opens on tap */
  .tp-nav-menu.open .dropdown .dropdown-menu.show {
    position:static !important; transform:none !important; inset:auto !important; float:none !important;
    background:rgba(255,255,255,.05) !important;
    border:none !important; border-top:1px solid rgba(255,255,255,.08) !important; border-radius:0 !important;
    box-shadow:none !important; width:100% !important; min-width:0 !important;
    padding:4px 0 0 !important; margin:4px 0 0 !important; box-sizing:border-box;
  }
  [data-theme="day"] .tp-nav-menu.open .dropdown .dropdown-menu.show {
    background:rgba(0,0,0,.03) !important;
    border-top-color:rgba(0,0,0,.08) !important;
  }
  .tp-nav-menu.open .dropdown .dropdown-item {
    display:flex; align-items:center; justify-content:center; gap:8px;
    width:100%; padding:11px 14px; border-radius:8px; color:var(--tp-fg2,#94a3b8); box-sizing:border-box;
    border:none; background:transparent; font-weight:600; font-size:.92rem;
    transition:background .15s,color .15s;
  }
  .tp-nav-menu.open .dropdown .dropdown-item + .dropdown-item { margin-top:2px; }
  .tp-nav-menu.open .dropdown .dropdown-item:hover,
  .tp-nav-menu.open .dropdown .dropdown-item:active {
    background:rgba(54,209,255,.1); color:var(--tp-accent,#36d1ff);
  }
  [data-theme="day"] .tp-nav-menu.open .dropdown .dropdown-item { color:var(--tp-fg2,#64748b); }
  [data-theme="day"] .tp-nav-menu.open .dropdown .dropdown-item:hover,
  [data-theme="day"] .tp-nav-menu.open .dropdown .dropdown-item:active { background:rgba(8,145,178,.08); color:var(--tp-accent,#0891b2); }
  .tp-nav-menu.open .dropdown .dropdown-divider { border-color:rgba(255,255,255,.08); margin:4px 0; }
  [data-theme="day"] .tp-nav-menu.open .dropdown .dropdown-divider { border-color:rgba(0,0,0,.08); }
  .tp-nav-btn[href*="/extension"], .tp-nav-btn.tp-ext-btn { width:100% !important; justify-content:center; }
  .is-logged-in .tp-nav-btn[href*="/extension"],
  .is-logged-in .tp-nav-btn.tp-ext-btn { display: none !important; }
  /* Hide theme toggle on mobile */
  .tp-nav-btn[data-tp-theme] { display:none !important; }
  /* Backdrop overlay */
  .mobile-menu-open::before {
    content: '';
    position: fixed;
    inset: 56px 0 0 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 1045;
    pointer-events: none;
  }
}

.tp-footer-bar { text-align:center; color:var(--tp-muted,#6b7280); font-size:.82rem; }
.tp-footer-bar-logo { height:18px; display:inline-block; vertical-align:middle; opacity:.5; }

.tp-card.hoverable:hover,
.tp-merchant-card:hover,
.tp-offercard:hover { transform: none !important; box-shadow: var(--tp-shadow2) !important; border-color: var(--tp-border2) !important; }

/* Mobile theme toggle — between search & hamburger */
.tp-mobile-theme-btn{display:none;background:none;border:none;padding:8px;cursor:pointer;color:var(--tp-fg,#e2e8f0);font-size:1.1rem;line-height:1;transition:color .2s ease}
.tp-mobile-theme-btn:hover{color:var(--tp-accent,#36d1ff)}
[data-theme="day"] .tp-mobile-theme-btn{color:var(--tp-fg,#334155)}
[data-theme="day"] .tp-mobile-theme-btn:hover{color:var(--tp-accent,#0891b2)}
/* Mobile-only nav links — hidden on desktop */
.tp-nav-mob-only{display:none}
@media(max-width:767px){
  .tp-nav-mob-only{display:flex}
  .tp-mobile-search-btn{display:inline-flex;align-items:center;justify-content:center}
  .tp-mobile-theme-btn{display:inline-flex;align-items:center;justify-content:center}
  .tp-nav-toggle{display:flex}
  .tp-nav-menu #tpGlobalSearchBtn{display:none}
  .tp-nav-menu{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;background:rgba(10,14,30,.96);backdrop-filter:blur(24px) saturate(1.8);-webkit-backdrop-filter:blur(24px) saturate(1.8);border-bottom:1px solid rgba(54,209,255,.08);padding:10px 14px;gap:2px;z-index:1060;box-shadow:0 12px 40px rgba(0,0,0,.5);max-height:calc(100vh - 56px);max-height:calc(100dvh - 56px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  [data-theme="day"] .tp-nav-menu{background:rgba(255,255,255,.96);backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);border-bottom-color:rgba(0,0,0,.06);box-shadow:0 12px 40px rgba(0,0,0,.1)}
  .tp-nav-menu.open{display:flex}
  .tp-nav-btn{width:100%;justify-content:center;padding:11px 14px;font-size:.94rem;border-radius:8px;transition:background .15s,color .15s}
  .tp-nav-btn:active{background:rgba(54,209,255,.12);color:var(--tp-accent,#36d1ff)}
  [data-theme="day"] .tp-nav-btn:active{background:rgba(8,145,178,.1);color:var(--tp-accent,#0891b2)}
  .tp-nav-btn--icon{padding:11px 14px;font-size:.94rem}
  .tp-nav-btn--cta{width:100%;justify-content:center}
  .tp-nav-btn .tp-nav-label{display:inline}
  /* User section separator + styling */
  .tp-nav-user-section{width:100%;margin-top:6px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08)}
  [data-theme="day"] .tp-nav-user-section{border-top-color:rgba(0,0,0,.08)}
  .tp-nav-user-section .dropdown{width:100%}
  .tp-nav-btn--user{border:1px solid rgba(255,255,255,.1) !important;background:rgba(255,255,255,.04) !important}
  .tp-nav-btn--user:active,.tp-nav-btn--user[aria-expanded="true"]{background:rgba(54,209,255,.08) !important;border-color:rgba(54,209,255,.2) !important}
  [data-theme="day"] .tp-nav-btn--user{border-color:rgba(0,0,0,.08) !important;background:rgba(0,0,0,.02) !important}
  [data-theme="day"] .tp-nav-btn--user:active,[data-theme="day"] .tp-nav-btn--user[aria-expanded="true"]{background:rgba(8,145,178,.06) !important;border-color:rgba(8,145,178,.15) !important}
  .tp-nav-inner{flex-wrap:wrap;position:relative}
}

/* ===== LOADING SCREEN ===== */
#tp-global-loader{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;opacity:0;animation:tplFadeIn .5s ease forwards}
#tp-global-loader.tpl-hide{animation:tplFadeOut .5s ease forwards}
#tp-global-loader.tpl-auto{animation:tplFadeIn .5s ease forwards,tplAutoDismiss 5s ease forwards}
@keyframes tplFadeIn{from{opacity:0}to{opacity:1}}
@keyframes tplFadeOut{from{opacity:1}to{opacity:0;visibility:hidden;pointer-events:none}}
@keyframes tplAutoDismiss{0%,75%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden;pointer-events:none}}

.tpl-bg{position:absolute;inset:0;background:#050914}
[data-theme="day"] .tpl-bg{background:#f0f2f8}
.tpl-center{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:18px}
.tpl-bars{display:flex;align-items:flex-end;gap:5px;height:64px}
.tpl-bar{width:6px;border-radius:3px;animation:tplOsc 1.6s ease-in-out infinite}

.tpl-bar:nth-child(1){height:28px;background:linear-gradient(180deg,#36d1ff,#2ea8cc);animation-delay:0s}
.tpl-bar:nth-child(2){height:44px;background:linear-gradient(180deg,#14b8a6,#0d9488);animation-delay:-.8s}
.tpl-bar:nth-child(3){height:20px;background:linear-gradient(180deg,#36d1ff,#2ea8cc);animation-delay:-.3s}
.tpl-bar:nth-child(4){height:56px;background:linear-gradient(180deg,#7c5cff,#6345d9);animation-delay:-1.1s}
.tpl-bar:nth-child(5){height:36px;background:linear-gradient(180deg,#14b8a6,#0d9488);animation-delay:-.5s}
.tpl-bar:nth-child(6){height:48px;background:linear-gradient(180deg,#36d1ff,#2ea8cc);animation-delay:-1.3s}
.tpl-bar:nth-child(7){height:24px;background:linear-gradient(180deg,#7c5cff,#6345d9);animation-delay:-.2s}
.tpl-bar:nth-child(8){height:40px;background:linear-gradient(180deg,#14b8a6,#0d9488);animation-delay:-.9s}
.tpl-bar:nth-child(9){height:32px;background:linear-gradient(180deg,#36d1ff,#2ea8cc);animation-delay:-.6s}

@keyframes tplOsc{
  0%{transform:scaleY(1);opacity:.85}
  25%{transform:scaleY(.35);opacity:.55}
  50%{transform:scaleY(1.15);opacity:1}
  75%{transform:scaleY(.5);opacity:.65}
  100%{transform:scaleY(1);opacity:.85}
}

.tpl-text{font-family:system-ui,-apple-system,sans-serif;font-size:.85rem;font-weight:500;letter-spacing:.04em;color:rgba(255,255,255,.5)}
[data-theme="day"] .tpl-text{color:rgba(30,41,59,.45)}
[data-theme="day"] .tpl-bar:nth-child(1),[data-theme="day"] .tpl-bar:nth-child(3),[data-theme="day"] .tpl-bar:nth-child(6),[data-theme="day"] .tpl-bar:nth-child(9){background:linear-gradient(180deg,#0891b2,#06748f)}
[data-theme="day"] .tpl-bar:nth-child(2),[data-theme="day"] .tpl-bar:nth-child(5),[data-theme="day"] .tpl-bar:nth-child(8){background:linear-gradient(180deg,#0d9488,#0a7c73)}
[data-theme="day"] .tpl-bar:nth-child(4),[data-theme="day"] .tpl-bar:nth-child(7){background:linear-gradient(180deg,#6366f1,#4f46e5)}

/* ===== SKIP TO MAIN ===== */
.skip-to-main{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;z-index:99999;opacity:0;pointer-events:none;padding:10px 22px;background:var(--tp-bg-card,#1e1e2e);color:var(--tp-accent,#36d1ff);text-decoration:none;font-weight:600;font-size:.85rem;letter-spacing:.3px;border:1px solid var(--tp-accent,#36d1ff);border-top:none;border-left:none;border-radius:0 0 10px 0;box-shadow:0 4px 16px rgba(0,0,0,.3);transition:opacity .15s}
.skip-to-main:focus-visible{position:fixed;left:0;top:0;width:auto;height:auto;overflow:visible;opacity:1;pointer-events:auto}

/* ===== IMAGE SKELETON LOADING ===== */
.tp-img-skeleton{position:relative;overflow:hidden;background:linear-gradient(90deg,rgba(128,128,128,.08) 25%,rgba(128,128,128,.15) 50%,rgba(128,128,128,.08) 75%);background-size:200% 100%;animation:tpSkeleton 1.5s ease-in-out infinite}
@keyframes tpSkeleton{0%{background-position:200% 0}100%{background-position:-200% 0}}
[data-theme="day"] .tp-img-skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%}
img.tp-lazy{opacity:0;transition:opacity .3s ease}
img.tp-lazy.tp-loaded{opacity:1}