@media (min-width: 768px) {
:root{--tn-navy:#12324a;--tn-blue:#147bd1;--tn-cyan:#1eb6c9;--tn-soft:#f4f8fb;--tn-border:#e4edf3;--tn-text:#203447;--tn-shadow:0 18px 45px rgba(18,50,74,.13)}
.tn-original-nav-hidden{display:none!important}
.tn-premium-nav{position:relative;z-index:9998;width:100%;font-family:inherit;color:var(--tn-text)}
.tn-nav-shell{max-width:1400px;margin:0 auto;padding:0 22px;position:relative}
.tn-nav-main{min-height:62px;display:flex;align-items:center;gap:5px;border-top:1px solid var(--tn-border);border-bottom:1px solid var(--tn-border);background:#fff}
.tn-nav-link,.tn-cat-toggle,.tn-pre-toggle{appearance:none;border:0;background:transparent;text-decoration:none;color:var(--tn-text);display:flex;align-items:center;gap:8px;min-height:46px;padding:0 14px;border-radius:12px;font:inherit;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap}
.tn-nav-link:hover,.tn-cat-toggle:hover,.tn-pre-toggle:hover,.tn-nav-link.active,.tn-cat-toggle.active{background:#eef7fd;color:var(--tn-blue)}
.tn-nav-link.is-home{color:var(--tn-blue);background:#eef7fd}.tn-nav-link.is-offer{color:#e33b43}.tn-nav-link.is-offer:hover{background:#fff2f3}
.tn-icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}.tn-nav-link .tn-icon{display:none}.tn-cat-toggle>.tn-icon,.tn-pre-toggle>.tn-icon{display:block}.tn-cat-toggle>.tn-icon:last-child,.tn-pre-toggle>.tn-icon:last-child{width:15px;height:15px;margin-left:2px}.tn-nav-spacer{flex:1}.tn-utility{font-size:13px;color:#526779}.tn-utility .tn-icon{display:block}
.tn-mega{display:none;position:absolute;left:22px;right:22px;top:68px;background:#fff;border:1px solid var(--tn-border);border-radius:0 0 20px 20px;box-shadow:var(--tn-shadow);padding:24px}.tn-mega.open{display:block}.tn-mega-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:18px}.tn-mega-head small{font-size:10px;letter-spacing:.16em;color:var(--tn-cyan);font-weight:800}.tn-mega-head h3{margin:5px 0 0;font-size:23px;color:var(--tn-navy)}.tn-mega-head>a{display:flex;align-items:center;gap:5px;color:var(--tn-blue);font-weight:700;text-decoration:none;font-size:13px}.tn-mega-head>a .tn-icon{width:15px;height:15px}
.tn-category-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.tn-cat-card{position:relative;display:flex;align-items:center;gap:11px;min-height:67px;padding:10px 12px;border:1px solid var(--tn-border);border-radius:14px;background:#fff;color:var(--tn-text);text-decoration:none;font-size:13px;font-weight:650;transition:.18s ease}.tn-cat-card:hover{transform:translateY(-2px);border-color:#c9e3f3;box-shadow:0 8px 22px rgba(18,50,74,.08);color:var(--tn-blue)}.tn-cat-icon{width:42px;height:42px;border-radius:12px;background:#eef8fc;display:grid;place-items:center;color:var(--tn-blue);flex:0 0 auto}.tn-cat-icon .tn-icon{width:22px;height:22px}.tn-cat-card>b{margin-left:auto;color:#91a5b5}.tn-cat-card>b .tn-icon{width:16px;height:16px}
.tn-promo-row{display:grid;grid-template-columns:1.4fr 1fr;gap:12px;margin-top:14px}.tn-promo-row>div{border-radius:15px;padding:16px 18px;background:linear-gradient(135deg,#eef8ff,#f7fbfd);display:flex;align-items:center;gap:13px}.tn-promo-row>div+div{background:linear-gradient(135deg,#f5fbf5,#f5f9ff)}.tn-promo-row strong{font-size:15px;color:var(--tn-navy)}.tn-promo-row span{font-size:12px;color:#667c8d}.tn-promo-row a{margin-left:auto;display:flex;align-items:center;gap:4px;text-decoration:none;color:var(--tn-blue);font-size:12px;font-weight:800}.tn-promo-row a .tn-icon{width:14px;height:14px}
@media(max-width:1100px) and (min-width:768px){.tn-nav-link,.tn-cat-toggle,.tn-pre-toggle{padding:0 9px;font-size:12px}.tn-utility{display:none}.tn-category-grid{grid-template-columns:repeat(4,1fr)}}

/* TradeNow Premium Colour Layer v2.2.0 */
.tn-premium-nav{
  --tn-navy:#102f46;
  --tn-blue:#1689c9;
  --tn-cyan:#18b8b0;
  --tn-gold:#f5a623;
  --tn-pink:#ee6f9b;
  --tn-purple:#7657d9;
  --tn-green:#35a86b;
}
.tn-nav-shell{border:1px solid rgba(16,47,70,.08);box-shadow:0 10px 35px rgba(16,47,70,.10)}
.tn-nav-main{
  background:linear-gradient(180deg,#ffffff 0%,#f8fbfd 100%);
}
.tn-nav-main>.tn-nav-link,
.tn-cat-toggle,.tn-pre-toggle{
  position:relative;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;
}
.tn-nav-main>.tn-nav-link:hover,
.tn-cat-toggle:hover,.tn-pre-toggle:hover{
  transform:translateY(-1px);
  background:#eef8fc;
  color:#0d7db5;
  box-shadow:0 6px 16px rgba(22,137,201,.10);
}
.tn-nav-main>.tn-nav-link:first-child{
  background:linear-gradient(135deg,#eaf8ff,#f1fbfa);
  color:#0b78b2;
  font-weight:800;
}
.tn-nav-main>.tn-nav-link:first-child .tn-icon{color:#1689c9}
.tn-nav-main .is-offer{
  background:linear-gradient(135deg,#fff0f4,#fff7e8);
  color:#df4d78!important;
  font-weight:800;
}
.tn-nav-main .is-offer:after{
  content:'HOT';position:absolute;top:-7px;right:7px;font-size:8px;line-height:16px;padding:0 5px;border-radius:99px;background:#ef5b7e;color:#fff;font-weight:900;
}
.tn-mega{
  border:1px solid rgba(16,47,70,.08)!important;
  box-shadow:0 22px 55px rgba(16,47,70,.16)!important;
  background:linear-gradient(135deg,#fff 0%,#f8fcff 65%,#f7fffd 100%)!important;
}
.tn-mega:before{
  content:'';position:absolute;left:0;top:0;right:0;height:5px;border-radius:20px 20px 0 0;
  background:linear-gradient(90deg,#1689c9,#18b8b0,#7657d9,#ee6f9b,#f5a623);
}
.tn-mega h3{color:#102f46}
.tn-category-grid{gap:10px!important}
.tn-cat-card{
  border:1px solid rgba(16,47,70,.08)!important;
  background:#fff!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
  overflow:hidden;
}
.tn-cat-card:hover{
  transform:translateY(-3px);
  border-color:rgba(22,137,201,.28)!important;
  box-shadow:0 12px 25px rgba(16,47,70,.12)!important;
}
.tn-cat-card:nth-child(4n+1) .tn-cat-icon{background:#e9f7ff;color:#1689c9}
.tn-cat-card:nth-child(4n+2) .tn-cat-icon{background:#fff1f5;color:#df5b83}
.tn-cat-card:nth-child(4n+3) .tn-cat-icon{background:#f0edff;color:#7657d9}
.tn-cat-card:nth-child(4n+4) .tn-cat-icon{background:#eafaf4;color:#2e9b67}
.tn-cat-icon{
  width:42px!important;height:42px!important;border-radius:13px!important;
  display:grid;place-items:center;flex:0 0 auto;
}
.tn-mega-promo{
  background:linear-gradient(135deg,#eaf8ff,#eafaf7)!important;
  border:1px solid rgba(22,137,201,.12);
}
.tn-mega-promo .tn-btn{
  background:linear-gradient(135deg,#1689c9,#18a99f)!important;
  box-shadow:0 8px 18px rgba(22,137,201,.22);
}
.tn-promo-card:nth-child(1){background:linear-gradient(135deg,#fff4e8,#fffaf4)!important}
.tn-promo-card:nth-child(2){background:linear-gradient(135deg,#fff0f5,#fff7fb)!important}
.tn-promo-card:nth-child(3){background:linear-gradient(135deg,#eeeaff,#f8f6ff)!important}
.tn-utility{color:#587184}
.tn-utility a:hover{color:#1689c9}

/* Colourful mobile menu */




/* v2.3.0 — vibrant header + desktop Pre-owned dropdown */
@media(min-width:768px){
 .tn-nav-main{padding:7px 8px;gap:7px;background:linear-gradient(90deg,#fff 0%,#f8fbff 50%,#fff 100%);border:0;border-radius:16px}
 .tn-nav-main>.tn-nav-link,.tn-cat-toggle,.tn-pre-toggle{min-height:48px;border-radius:13px;font-weight:800;border:1px solid transparent}
 .tn-nav-main>.tn-nav-link:nth-child(1){background:linear-gradient(135deg,#00a8ff,#00c6a7);color:#fff!important;box-shadow:0 7px 18px rgba(0,168,255,.20)}
 .tn-nav-main>.tn-nav-link:nth-child(2){background:linear-gradient(135deg,#7657d9,#a05be8);color:#fff!important;box-shadow:0 7px 18px rgba(118,87,217,.18)}
 .tn-nav-main>.tn-nav-link:nth-child(3),.tn-pre-toggle{background:linear-gradient(135deg,#00a878,#43c96b);color:#fff!important;box-shadow:0 7px 18px rgba(0,168,120,.18)}
 .tn-nav-main>.tn-nav-link:nth-child(4){background:linear-gradient(135deg,#ff9f1c,#ffbf3f);color:#fff!important;box-shadow:0 7px 18px rgba(255,159,28,.18)}
 .tn-nav-main>.tn-nav-link:nth-child(5){background:linear-gradient(135deg,#e84d8a,#f06a6a);color:#fff!important;box-shadow:0 7px 18px rgba(232,77,138,.18)}
 .tn-nav-main>.tn-nav-link:nth-child(6){background:linear-gradient(135deg,#1689c9,#3867d6);color:#fff!important;box-shadow:0 7px 18px rgba(56,103,214,.18)}
 .tn-nav-main>.tn-nav-link:hover,.tn-cat-toggle:hover,.tn-pre-toggle:hover{transform:translateY(-2px);filter:saturate(1.08) brightness(1.03);color:#fff!important}
 .tn-nav-main>.tn-nav-link .tn-icon,.tn-cat-toggle>.tn-icon,.tn-pre-toggle>.tn-icon{color:currentColor}
 .tn-pre-menu{display:none;position:absolute;left:270px;top:69px;width:390px;padding:12px;border-radius:18px;background:#fff;border:1px solid rgba(16,47,70,.10);box-shadow:0 24px 55px rgba(16,47,70,.18);z-index:20}
 .tn-pre-menu.open{display:grid;grid-template-columns:1fr 1fr;gap:10px}
 .tn-pre-menu>a{display:flex;flex-direction:column;gap:7px;min-height:145px;padding:16px;border-radius:15px;text-decoration:none;color:#102f46;border:1px solid rgba(16,47,70,.07);transition:.18s ease}
 .tn-pre-menu>a:first-child{background:linear-gradient(145deg,#e7fff4,#f8fffb)}
 .tn-pre-menu>a:last-child{background:linear-gradient(145deg,#fff0f6,#fff9fc)}
 .tn-pre-menu>a:hover{transform:translateY(-3px);box-shadow:0 12px 25px rgba(16,47,70,.12)}
 .tn-pre-menu>a>span{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:#fff;font-weight:800}
 .tn-pre-menu>a:first-child>span{color:#009c70}.tn-pre-menu>a:last-child>span{color:#df4d78}
 .tn-pre-menu strong{font-size:14px}.tn-pre-menu small{font-size:11px;color:#718494;line-height:1.4}
}




/* v2.3.2 — DESKTOP ONLY
   The v2.3 desktop implementation above remains unchanged.
   On mobile this plugin is completely neutralized. */


/* v2.4.1 — premium desktop utility actions; desktop only */
@media (min-width: 1101px) {
  .tn-nav-main > .tn-utility {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 48px !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 13px !important;
    color: #fff !important;
    font-weight: 800 !important;
    font-size: 12px !important;
    letter-spacing: .1px !important;
    box-shadow: 0 7px 18px rgba(16,47,70,.14) !important;
    transition: transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
  }
  .tn-nav-main > .tn-utility .tn-icon { display: block !important; color: #fff !important; }
  .tn-nav-main > .tn-utility span { color: #fff !important; }
  .tn-nav-main > .tn-utility:nth-last-child(2) {
    background: linear-gradient(135deg, #ff7a18 0%, #ffb347 100%) !important;
    box-shadow: 0 8px 20px rgba(255,122,24,.22) !important;
  }
  .tn-nav-main > .tn-utility:nth-last-child(1) {
    background: linear-gradient(135deg, #7657d9 0%, #d14d9b 100%) !important;
    box-shadow: 0 8px 20px rgba(118,87,217,.22) !important;
  }
  .tn-nav-main > .tn-utility:hover {
    transform: translateY(-2px);
    filter: saturate(1.08) brightness(1.04);
  }
}
}


/* v2.4.3 — requested teal menu items */
@media (min-width: 768px) {
  /* Shop */
  .tn-nav-main > .tn-nav-link:nth-child(4) {
    background: linear-gradient(135deg, #00a99a 0%, #18b8b0 100%) !important;
    color: #fff !important;
    box-shadow: 0 7px 18px rgba(0, 169, 154, .20);
  }

  /* About Us */
  .tn-nav-main > .tn-nav-link:nth-child(5) {
    background: linear-gradient(135deg, #00a99a 0%, #18b8b0 100%) !important;
    color: #fff !important;
    box-shadow: 0 7px 18px rgba(0, 169, 154, .20);
  }

  /* Track My Order */
  .tn-nav-main > .tn-utility:nth-last-child(2) {
    background: linear-gradient(135deg, #00a99a 0%, #18b8b0 100%) !important;
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(0, 169, 154, .22) !important;
  }

  .tn-nav-main > .tn-nav-link:nth-child(4):hover,
  .tn-nav-main > .tn-nav-link:nth-child(5):hover,
  .tn-nav-main > .tn-utility:nth-last-child(2):hover {
    background: linear-gradient(135deg, #009b8d 0%, #12aaa2 100%) !important;
    color: #fff !important;
  }
}


/* v2.4.4 — refined compact desktop navigation
   Requested: professional neutral palette, compact spacing, restrained hover,
   and a WordPress custom-logo slot. Mobile remains untouched. */
@media (min-width: 768px) {
  .tn-nav-shell {
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-shadow: 0 6px 22px rgba(16,47,70,.07) !important;
    border-color: rgba(16,47,70,.07) !important;
  }

  .tn-nav-main {
    min-height: 54px !important;
    padding: 5px 6px !important;
    gap: 2px !important;
    background: #fff !important;
    border-radius: 12px !important;
  }

  .tn-brand-slot {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 92px !important;
    height: 42px !important;
    margin: 0 6px 0 2px !important;
    padding: 0 6px !important;
    text-decoration: none !important;
  }

  .tn-brand-slot img {
    display: block !important;
    max-width: 86px !important;
    max-height: 34px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .tn-nav-main > .tn-nav-link,
  .tn-nav-main > .tn-cat-toggle,
  .tn-nav-main > .tn-pre-toggle,
  .tn-nav-main > .tn-utility {
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 9px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #334a5c !important;
    box-shadow: none !important;
    filter: none !important;
    font-size: 12.5px !important;
    font-weight: 650 !important;
    letter-spacing: 0 !important;
    transition: color .18s ease, background .18s ease, transform .18s ease !important;
  }

  .tn-nav-main > .tn-nav-link .tn-icon,
  .tn-nav-main > .tn-cat-toggle .tn-icon,
  .tn-nav-main > .tn-pre-toggle .tn-icon {
    color: #64798a !important;
  }

  .tn-nav-main > .tn-nav-link:hover,
  .tn-nav-main > .tn-cat-toggle:hover,
  .tn-nav-main > .tn-pre-toggle:hover,
  .tn-nav-main > .tn-utility:hover {
    background: #f3f7f9 !important;
    color: #0f7f82 !important;
    box-shadow: none !important;
    filter: none !important;
    transform: translateY(-1px) !important;
  }

  .tn-nav-main > .tn-nav-link:hover .tn-icon,
  .tn-nav-main > .tn-cat-toggle:hover .tn-icon,
  .tn-nav-main > .tn-pre-toggle:hover .tn-icon,
  .tn-nav-main > .tn-utility:hover .tn-icon {
    color: #0f7f82 !important;
  }

  .tn-nav-main > .tn-nav-link.is-home,
  .tn-nav-main > .tn-nav-link.is-home:hover {
    background: #f3f7f9 !important;
    color: #0f6f72 !important;
    box-shadow: none !important;
  }

  .tn-nav-main > .tn-nav-link.is-home .tn-icon {
    color: #0f7f82 !important;
  }

  .tn-nav-main > .tn-utility {
    font-size: 11.5px !important;
    padding: 0 8px !important;
    font-weight: 650 !important;
  }

  .tn-nav-main > .tn-utility .tn-icon,
  .tn-nav-main > .tn-utility span {
    color: inherit !important;
  }

  .tn-nav-main > .tn-nav-link:nth-child(1),
  .tn-nav-main > .tn-nav-link:nth-child(2),
  .tn-nav-main > .tn-nav-link:nth-child(3),
  .tn-nav-main > .tn-nav-link:nth-child(4),
  .tn-nav-main > .tn-nav-link:nth-child(5),
  .tn-nav-main > .tn-nav-link:nth-child(6),
  .tn-nav-main > .tn-utility:nth-last-child(2),
  .tn-nav-main > .tn-utility:nth-last-child(1) {
    background: transparent !important;
    color: #334a5c !important;
    box-shadow: none !important;
  }

  .tn-nav-main > .tn-nav-link:nth-child(1):hover,
  .tn-nav-main > .tn-nav-link:nth-child(2):hover,
  .tn-nav-main > .tn-nav-link:nth-child(3):hover,
  .tn-nav-main > .tn-nav-link:nth-child(4):hover,
  .tn-nav-main > .tn-nav-link:nth-child(5):hover,
  .tn-nav-main > .tn-nav-link:nth-child(6):hover,
  .tn-nav-main > .tn-utility:nth-last-child(2):hover,
  .tn-nav-main > .tn-utility:nth-last-child(1):hover {
    background: #f3f7f9 !important;
    color: #0f7f82 !important;
  }

  .tn-nav-main .is-offer:after { display: none !important; }

  .tn-pre-menu {
    top: 60px !important;
  }

  .tn-mega {
    top: 60px !important;
  }
}

@media (min-width: 768px) and (max-width: 1100px) {
  .tn-brand-slot {
    width: 72px !important;
    margin-right: 3px !important;
  }
  .tn-brand-slot img {
    max-width: 68px !important;
    max-height: 30px !important;
  }
  .tn-nav-main > .tn-nav-link,
  .tn-nav-main > .tn-cat-toggle,
  .tn-nav-main > .tn-pre-toggle {
    padding-left: 6px !important;
    padding-right: 6px !important;
    font-size: 11.5px !important;
  }
}


/* v2.4.5 — logo removed by request */
@media (min-width: 768px) {
  .tn-brand-slot { display: none !important; }
}
