/* TECHNON Stage 2 companion: isolated refinements only. */
.tn2-product-extra{padding:18px 0 42px;background:#f5f8fc}.tn2-premium-panel{background:linear-gradient(135deg,#041b35,#08345f);border-radius:18px;padding:28px;color:#fff;display:grid;grid-template-columns:1fr 1fr;gap:28px;box-shadow:0 18px 46px rgba(4,27,53,.16)}.tn2-kicker{display:inline-block;color:#ffc83d;font-size:12px;font-weight:800;letter-spacing:2px;margin-bottom:8px}.tn2-premium-panel h2{font-weight:800;margin:0 0 10px}.tn2-premium-panel p{color:#dbe7f3;max-width:680px}.tn2-premium-panel ul{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:9px}.tn2-premium-panel li{display:flex;gap:9px;align-items:flex-start}.tn2-premium-panel li i{color:#ffc83d;margin-top:4px}.tn2-video-title{font-weight:800;margin-bottom:10px;color:#ffc83d}.tn2-video-frame{position:relative;padding-top:56.25%;border-radius:14px;overflow:hidden;background:#001126;box-shadow:0 12px 30px rgba(0,0,0,.25)}.tn2-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.tn2-info-page{padding-top:22px;padding-bottom:42px}.tn2-info-hero{background:linear-gradient(135deg,#041d3a,#0a5590);border-radius:18px;color:#fff;padding:38px 34px;margin-bottom:18px;box-shadow:0 16px 38px rgba(4,29,58,.15)}.tn2-info-hero span{color:#ffc83d;font-size:12px;letter-spacing:2px;font-weight:800}.tn2-info-hero h1{font-weight:800;margin:8px 0}.tn2-info-hero p{font-size:17px;color:#dbe9f6;margin:0}.tn2-info-body{background:#fff;border-radius:18px;padding:30px;box-shadow:0 10px 28px rgba(15,39,69,.08)}.tn2-info-body h2,.tn2-info-body h3{color:#082d53;font-weight:800}.tn2-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.tn2-info-grid>div{border:1px solid #e5edf5;border-radius:14px;padding:22px;background:#f9fbfd}.tn2-info-grid strong{color:#b57b00}.tn-theme .tn-product-card .tn-product-img{background:radial-gradient(circle at 50% 40%,#fff 0,#f3f7fb 55%,#e8eff6 100%)}.tn-theme .tn-product-card .tn-product-img img{filter:drop-shadow(0 14px 14px rgba(6,30,56,.18));transition:transform .25s ease}.tn-theme .tn-product-card:hover .tn-product-img img{transform:translateY(-3px) scale(1.02)}
@media(max-width:767px){.tn2-premium-panel,.tn2-info-grid{grid-template-columns:1fr}.tn2-premium-panel{padding:20px}.tn2-info-hero{padding:27px 22px}.tn2-info-body{padding:22px}.tn-theme .tn-assurance{font-size:8px}.tn-theme #top{font-size:9px}.tn-theme .tn-store-header #logo img{max-width:150px}.tn-theme .tn-nav a{font-size:10px;padding-left:10px;padding-right:10px}.tn-theme .tn-product-card .tn-product-img img{max-height:180px;object-fit:contain}}

/* Stage 3 conflict fix: override the main TECHNON inner-page H2 rule only inside this blue product panel. */
body.tn-theme main .tn2-product-extra .tn2-premium-panel h2{
  color:#ffffff!important;
  opacity:1!important;
  text-shadow:none!important;
}


/* TECHNON Stage 4 integrated patch v1.1.0 — loaded through proven TECHNON Content event */
body.tn-theme main.tn-about-page .tn-about-hero h1,
body.tn-theme main #information-technon .tn2-info-hero h1,
body.tn-theme main #information-technon .tn2-info-hero h2,
main.tn-about-page .tn-about-hero h1,
#information-technon .tn2-info-hero h1{
  color:#ffffff!important;
  opacity:1!important;
  text-shadow:0 1px 2px rgba(0,0,0,.18)!important;
}
body.tn-theme main.tn-about-page .tn-about-hero p,
body.tn-theme main #information-technon .tn2-info-hero p,
main.tn-about-page .tn-about-hero p,
#information-technon .tn2-info-hero p{color:#edf5ff!important}
.tn4-business-id{margin-top:20px;display:inline-flex;flex-direction:column;gap:3px;padding:12px 15px;border:1px solid rgba(255,255,255,.22);border-radius:10px;background:rgba(255,255,255,.08);color:#fff}
.tn4-business-id span,.tn4-business-id small{color:#dbe9f6!important;font-size:11px}.tn4-business-id strong{color:#fff!important;font-size:13px;letter-spacing:.4px}
.tn4-policy-id{margin-top:34px;padding-top:18px;border-top:1px solid #e5edf5;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;color:#5d7088}.tn4-policy-id strong{color:#082d53}.tn4-policy-id span{font-size:12px}
.tn-footer-grid{grid-template-columns:1.2fr .9fr 1fr .9fr!important;gap:34px!important}.tn-footer-grid>div:not(.tn-footer-brand){display:flex;flex-direction:column;align-items:flex-start}.tn-footer-grid a{display:block;margin:1px 0}
body.tn-theme #information-contact #content>h1{background:linear-gradient(135deg,#041d3a,#0a5590)!important;color:#fff!important;border-radius:18px;padding:30px!important;margin-bottom:18px!important;box-shadow:0 16px 38px rgba(4,29,58,.15)!important}
body.tn-theme #information-contact form{background:#fff;border-radius:18px;padding:28px;box-shadow:0 10px 28px rgba(15,39,69,.08)}
@media(max-width:991px){.tn-footer-grid{grid-template-columns:1fr 1fr!important}}
@media(max-width:767px){.tn-footer-grid{grid-template-columns:1fr!important}.tn4-business-id{width:100%}}

/* TECHNON Stage 4 final polish v1.1.1 */
/* Keep the clickable top-bar controls visually consistent on the navy header. */
body.tn-theme #top .list-inline > li > a,
body.tn-theme #top .list-inline > li > button,
body.tn-theme #top #form-currency > .dropdown > .dropdown-toggle,
body.tn-theme #top #form-currency > .dropdown > .dropdown-toggle *,
body.tn-theme #top .tn-native-selector,
body.tn-theme #top .tn-fixed-currency,
body.tn-theme #top .tn-fixed-currency * {
  color:#ffffff!important;
  opacity:1!important;
}
/* The legal identity is already presented in the global footer; do not duplicate a page-end ID strip. */
body.tn-theme .tn4-policy-id{display:none!important}


/* TECHNON Stage 4 final live-audit polish v1.1.2 */
/* OpenCart renders My Account as a span.dropdown-toggle, not an anchor/button. */
body.tn-theme #top .dropdown > span.dropdown-toggle,
body.tn-theme #top .dropdown > span.dropdown-toggle *,
body.tn-theme #top li.list-inline-item > .dropdown > span.dropdown-toggle,
body.tn-theme #top li.list-inline-item > .dropdown > span.dropdown-toggle *{
  color:#ffffff!important;
  opacity:1!important;
}

/* Contact details: cleaner business presentation while keeping native form behavior. */
body.tn-theme #information-contact .tn4-contact-card{
  border:1px solid #dfe8f1!important;
  border-radius:14px!important;
  box-shadow:0 8px 24px rgba(8,44,87,.06)!important;
}
body.tn-theme #information-contact .tn4-contact-card strong{color:#082d53!important}
body.tn-theme #information-contact #form-contact legend{font-weight:800;color:#082d53!important}

/* Premium success-state styling (also improves other native OpenCart success pages safely). */
body.tn-theme #common-success #content>h1{
  background:linear-gradient(135deg,#041d3a,#0a5590)!important;
  color:#ffffff!important;
  border-radius:18px!important;
  padding:30px!important;
  margin:0 0 22px!important;
  box-shadow:0 16px 38px rgba(4,29,58,.15)!important;
}
body.tn-theme #common-success #content{
  font-size:16px!important;
  line-height:1.65!important;
}
body.tn-theme #common-success .btn-primary{
  border-radius:9px!important;
  padding:11px 22px!important;
  font-weight:800!important;
}


/* TECHNON Stage 4 final micro-polish v1.1.3 */
/* Match Currency and My Account typography to the other bold top-bar actions. */
body.tn-theme #top #form-currency > .dropdown > .dropdown-toggle,
body.tn-theme #top #form-currency > .dropdown > .dropdown-toggle *,
body.tn-theme #top .dropdown > span.dropdown-toggle,
body.tn-theme #top .dropdown > span.dropdown-toggle *{
  font-weight:700!important;
}

/* TECHNON Stage 4 mobile header root correction v1.1.6 — 2026-08-26
   This rule is intentionally placed in the proven TECHNON Content stylesheet,
   which is loaded after the core theme refinements. It removes the mobile
   utility-row scroller that clips Bootstrap's My Account dropdown and gives
   the five action icons a stable responsive grid. */
@media (max-width:767px){
  body.tn-theme #top,
  body.tn-theme #top > .container,
  body.tn-theme #top > .container > .row,
  body.tn-theme #top > .container > .row > .col,
  body.tn-theme #top .text-end,
  body.tn-theme #top .text-end > ul.list-inline,
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item,
  body.tn-theme #top .text-end .dropdown{
    overflow:visible!important;
  }

  body.tn-theme #top .text-end{
    position:relative!important;
    z-index:12000!important;
  }

  body.tn-theme #top .text-end > ul.list-inline{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:center!important;
    justify-content:stretch!important;
    gap:0!important;
    width:100%!important;
    max-width:100%!important;
    margin:7px 0 0!important;
    padding:0!important;
    overflow-x:visible!important;
    overflow-y:visible!important;
    white-space:normal!important;
  }

  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:relative!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    white-space:normal!important;
  }

  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item > a,
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item > .dropdown > span.dropdown-toggle{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:44px!important;
    min-height:42px!important;
    padding:0 5px!important;
    cursor:pointer!important;
  }

  body.tn-theme #top .text-end .dropdown{
    position:relative!important;
    z-index:12010!important;
  }

  body.tn-theme #top .text-end .dropdown-menu,
  body.tn-theme #top .text-end .dropdown-menu[data-bs-popper]{
    position:absolute!important;
    inset:auto!important;
    top:calc(100% + 6px)!important;
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    min-width:190px!important;
    max-width:calc(100vw - 24px)!important;
    margin:0!important;
    z-index:12050!important;
  }

  body.tn-theme #top .text-end .dropdown-menu.show{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
}


/* TECHNON Stage 4 mobile My Account stacking correction v1.1.7 — 2026-08-26
   Root cause confirmed from live mobile behaviour: Bootstrap opens the account
   menu, but the following TECHNON store-header/logo layer paints above it.
   Keep the entire #top utility bar in the higher stacking context, while the
   store header remains below it. Scope is mobile only. */
@media (max-width:767px){
  body.tn-theme #top{
    position:relative!important;
    z-index:32000!important;
    overflow:visible!important;
    isolation:isolate!important;
  }
  body.tn-theme #top > .container,
  body.tn-theme #top > .container > .row,
  body.tn-theme #top > .container > .row > .col-4,
  body.tn-theme #top > .container > .row > .col,
  body.tn-theme #top .text-end,
  body.tn-theme #top .text-end > ul.list-inline,
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item,
  body.tn-theme #top .text-end .dropdown{
    overflow:visible!important;
  }
  body.tn-theme .tn-store-header,
  body.tn-theme header.tn-store-header{
    position:relative!important;
    z-index:1!important;
  }
  body.tn-theme #top .text-end > ul.list-inline{
    overflow:visible!important;
    scrollbar-width:none!important;
  }
  body.tn-theme #top .text-end > ul.list-inline::-webkit-scrollbar{
    display:none!important;
    width:0!important;
    height:0!important;
  }
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2),
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) > .dropdown{
    position:relative!important;
    z-index:32100!important;
  }
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) .dropdown-menu,
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) .dropdown-menu.show,
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) .dropdown-menu[data-bs-popper]{
    position:absolute!important;
    top:calc(100% + 8px)!important;
    left:50%!important;
    right:auto!important;
    bottom:auto!important;
    transform:translateX(-50%)!important;
    z-index:32200!important;
    min-width:190px!important;
    display:block;
  }
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) .dropdown-menu:not(.show){
    display:none!important;
  }
}

/* TECHNON Stage 4 mobile dropdown layer harmonisation v1.1.8 — 2026-08-26
   Root cause: v1.1.6 gave the right-side utility group its own high z-index.
   After v1.1.7 lifted #top above the store header, that inner z-index became
   unnecessary and could paint the phone/account utility icons over Currency's
   first dropdown row. Keep #top as the single high stacking context, then give
   the left Currency/Language column precedence over the utility icons while a
   dropdown is open. My Account remains above the TECHNON store header because
   it is still inside the elevated #top context. Mobile only. */
@media (max-width:767px){
  body.tn-theme #top .text-end{
    position:relative!important;
    z-index:10!important;
    overflow:visible!important;
  }

  body.tn-theme #top > .container > .row > .col-4{
    position:relative!important;
    z-index:30!important;
    overflow:visible!important;
  }

  body.tn-theme #top #form-currency,
  body.tn-theme #top #form-language,
  body.tn-theme #top #tn-language-fallback,
  body.tn-theme #top > .container > .row > .col-4 .dropdown{
    position:relative!important;
    z-index:31!important;
    overflow:visible!important;
  }

  body.tn-theme #top #form-currency .dropdown-menu,
  body.tn-theme #top #form-language .dropdown-menu,
  body.tn-theme #top #tn-language-fallback .dropdown-menu,
  body.tn-theme #top > .container > .row > .col-4 .dropdown-menu{
    z-index:60!important;
    background:#fff!important;
    opacity:1!important;
  }

  body.tn-theme #top .text-end > ul.list-inline,
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item,
  body.tn-theme #top .text-end .dropdown{
    z-index:auto!important;
  }

  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2),
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) > .dropdown{
    z-index:20!important;
  }

  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) .dropdown-menu,
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) .dropdown-menu.show,
  body.tn-theme #top .text-end > ul.list-inline > li.list-inline-item:nth-child(2) .dropdown-menu[data-bs-popper]{
    z-index:50!important;
    background:#fff!important;
    opacity:1!important;
  }
}