/* ==========================================================================
   Noakhali Tech — opencart.css
   Styles for dynamic (admin-managed) content that the static UI did not need.
   ========================================================================== */

.section--tint { background: linear-gradient(180deg, var(--primary-50), #F8FBFE); }
.section--warm { background: linear-gradient(180deg, #FFF4EA, #FFFAF6); }
.section--mint { background: linear-gradient(180deg, #EBF8F0, #F7FCF9); }
.section--lavender { background: linear-gradient(180deg, #F1EFFC, #FAF9FE); }
.section--dark .section-title span, .biz .section-title span { color: var(--accent); }
.section-title span { color: var(--primary); }
.section--dark .section-title span { color: var(--accent); }
.final-cta h2 span { color: var(--accent); }

/* Header alerts from OpenCart (success / error messages) */
.nt-alert { display: flex; align-items: center; gap: 10px; margin-top: 16px; padding: 12px 16px; border-radius: var(--radius); font-size: var(--fs-sm); font-weight: 600; }
.nt-alert--success { background: var(--success-50); color: #137A3A; }
.nt-alert--error { background: var(--danger-50); color: var(--danger); }
.nt-checkout-notice { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 24px; padding: 16px 20px; background: var(--surface, #fff); border: 1px solid var(--border); border-left: 4px solid var(--accent, #F47B20); border-radius: var(--radius); box-shadow: 0 6px 18px rgba(10, 27, 51, .06); }
.nt-checkout-notice i { flex: none; margin-top: 4px; color: var(--accent, #F47B20); }
.nt-checkout-notice p { margin: 0; font-family: "Noto Sans Bengali", "Hind Siliguri", var(--font); font-size: 16px; font-weight: 500; line-height: 1.7; color: var(--text); }

/* Logo fallback text */
.logo strong { font-size: 1.4rem; color: var(--primary); }

/* Footer offices */
.footer__office { display: block; color: #fff; font-size: 13px; margin-bottom: 2px; }

/* Mega menu: category title as link */
.mega__title a { color: inherit; }
.mega__title a:hover { color: var(--primary); }
.mega__grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.mega__promo { grid-column: span 2; max-width: 360px; }

/* Blog with a single post */
.blog-layout--single { grid-template-columns: 1fr; max-width: 720px; }
.blog-card__media > i { color: var(--tone); opacity: .5; }

/* Brand strip links */
.brand-strip__list a { color: inherit; }

/* Text + image section */
.nt-text-image { display: grid; place-items: center; padding: 32px; border-radius: var(--radius-xl); background: var(--surface-muted); }
.nt-text-image img { max-height: 360px; width: auto; }

/* Information page content (from the admin editor) */
.nt-info-content { max-width: 880px; }
.nt-info-content h2, .nt-info-content h3 { margin: 28px 0 12px; }
.nt-info-content ul { list-style: disc; padding-left: 22px; margin: 12px 0; }
.nt-info-content ol { list-style: decimal; padding-left: 22px; margin: 12px 0; }
.nt-info-content li + li { margin-top: 6px; }
.nt-info-content table { margin: 16px 0; border: 1px solid var(--border); }
.nt-info-content td, .nt-info-content th { padding: 10px 14px; border: 1px solid var(--border); }
.nt-info-content img { border-radius: var(--radius); margin: 12px 0; }
.nt-info-content a { color: var(--primary); font-weight: 600; }

/* Service card image icons */
.service-card__icon img { width: 30px; height: 30px; object-fit: contain; }

/* Testimonial photo avatar */
img.avatar { object-fit: cover; padding: 0; }

/* Mobile mini "added" state for card buttons */
.btn.is-loading { opacity: .7; pointer-events: none; }

/* =========================== PHASE 2: listing, product, cart, checkout =========================== */

/* Listing without filters: full-width grid */
.shop-layout--full { grid-template-columns: 1fr; }
.shop-layout--full .product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.nt-seo-text { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--border); }
.nt-empty { padding: 56px 24px; text-align: center; background: var(--surface); border: 1px dashed var(--border-strong); border-radius: var(--radius-lg); }
.nt-empty > i { font-size: 2.6rem; color: var(--border-strong); }
.nt-empty h3 { margin: 14px 0 6px; }
.nt-empty p { color: var(--muted); }

/* OpenCart pagination (<ul class="pagination">) */
.nt-pagination { margin-top: 32px; }
.nt-pagination .pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.nt-pagination .pagination li a, .nt-pagination .pagination li span { display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 10px; font-size: var(--fs-sm); font-weight: 700; border-radius: 10px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); transition: .2s; }
.nt-pagination .pagination li a:hover { border-color: var(--primary); color: var(--primary); }
.nt-pagination .pagination li.active span { background: var(--primary); border-color: var(--primary); color: #fff; }
.nt-pagination .pagination li span.disabled { opacity: .45; }

/* Filter module (AgainCart filter + noUiSlider) */
.nt-filter .filter-block, .nt-filter .filter-group { border-bottom: 1px solid var(--border); }
.nt-filter .filter-group:last-child { border-bottom: 0; }
.nt-filter .label { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px; font-weight: 700; font-size: 14px; color: var(--navy); cursor: pointer; }
.nt-filter .price-filter .label { cursor: default; }
.nt-filter .toggler { font-size: 10px; color: var(--muted); transition: transform .25s; }
.nt-filter .filter-group.show .toggler { transform: rotate(180deg); }
.nt-filter .items { display: none; flex-direction: column; gap: 10px; padding: 0 18px 18px; max-height: 260px; overflow-y: auto; }
.nt-filter .filter-group.show .items { display: flex; }
.nt-filter label.filter { display: flex; align-items: center; gap: 10px; font-size: var(--fs-sm); color: var(--text-2); cursor: pointer; }
.nt-filter label.filter input { width: 18px; height: 18px; accent-color: var(--primary); flex: none; }
.nt-filter .price-filter { padding-bottom: 18px; }
.nt-filter #rang-slider { margin: 10px 26px 18px; height: 6px; border: 0; box-shadow: none; background: var(--border); }
.nt-filter #rang-slider .noUi-connect { background: var(--primary); }
.nt-filter #rang-slider .noUi-handle { width: 20px; height: 20px; right: -10px; top: -8px; border-radius: 50%; border: 3px solid var(--primary); background: #fff; box-shadow: var(--shadow-sm); cursor: grab; }
.nt-filter #rang-slider .noUi-handle::before, .nt-filter #rang-slider .noUi-handle::after { display: none; }
.nt-filter .price-inputs { display: flex; align-items: center; gap: 8px; padding: 0 18px; color: var(--muted); }
.nt-filter .range-label { flex: 1; }
.nt-filter .range-label input { width: 100%; height: 38px; padding: 6px 10px; font-size: 13px; border: 1.5px solid var(--border); border-radius: var(--radius-sm); }
.nt-filter .range-label input:focus { outline: none; border-color: var(--primary); }
.filters__body .ads { display: none; }
.popup.f-in .loader { display: none; }

/* Search refine form */
.nt-search-refine { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 18px; }
.nt-search-refine .input { flex: 1 1 260px; background: #fff; }
.nt-search-refine .select { flex: 0 1 240px; background-color: #fff; }

/* Product page */
.gallery__thumb img { width: 100%; height: 100%; object-fit: contain; }
.gallery__main img { max-height: 100%; object-fit: contain; }
.pd__features { padding: 18px 20px; border-radius: var(--radius-lg); border: 1px solid var(--border); }
.pd__features .label { display: block; margin-bottom: 12px; font-size: var(--fs-sm); }
.pd__features .check-list li + li { margin-top: 6px; }
.pd__features .link-arrow { margin-top: 12px; }
.pd__form { display: flex; flex-direction: column; gap: 16px; }
.pd__price .countdown { width: 100%; }
.pd__status .nt-stock-low { background: var(--warning-50); color: var(--warning); }
.pd__status .nt-stock-out, .pd__status .nt-stock-pre { background: var(--danger-50); color: var(--danger); }
.nt-option { position: relative; cursor: pointer; }
.nt-option input { position: absolute; opacity: 0; }
.nt-option span { display: inline-flex; padding: 7px 14px; font-size: 13px; font-weight: 600; border: 1.5px solid var(--border); border-radius: var(--radius-pill); background: #fff; transition: .2s; }
.nt-option input:checked + span { border-color: var(--primary); background: var(--primary-50); color: var(--primary); }
.nt-option input:focus-visible + span { box-shadow: var(--ring); }
.nt-option-error, .nt-field-error { margin-top: 6px; font-size: 12.5px; font-weight: 600; color: var(--danger); }
.pd-review-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 28px; align-items: start; }
.nt-review-list { display: grid; gap: 14px; }
.nt-empty-note { padding: 20px; border-radius: var(--radius); background: var(--bg); }
.nt-rating-input { display: inline-flex; flex-direction: row-reverse; gap: 4px; }
.nt-rating-input input { position: absolute; opacity: 0; }
.nt-rating-input label { font-size: 1.8rem; line-height: 1; color: var(--border-strong); cursor: pointer; transition: color .15s; }
.nt-rating-input input:checked ~ label, .nt-rating-input label:hover, .nt-rating-input label:hover ~ label { color: #F5A524; }
.tabs__panel .alert { margin-bottom: 14px; padding: 12px 16px; border-radius: var(--radius); font-size: var(--fs-sm); font-weight: 600; }
.tabs__panel .alert-success { background: var(--success-50); color: #137A3A; }
.tabs__panel .alert-danger { background: var(--danger-50); color: var(--danger); }

/* Cart & checkout */
.nt-cart-extras { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--border); display: grid; gap: 10px; }
.nt-coupon .input { flex: 1; }
.nt-checkout-codes { margin-top: 16px; padding-top: 16px; border-top: 1px dashed var(--border-strong); }
.nt-checkout-codes .coupon .input { flex: 1; width: auto; }
.checkout-data .mini-items li { align-items: flex-start; }
.option-card__body small { display: block; }
#button-confirm.is-loading { opacity: .7; }

/* Result pages (order success, not found, empty cart) */
.nt-result { max-width: 640px; margin: 0 auto 32px; text-align: center; }
.nt-result__icon { display: inline-grid; place-items: center; width: 84px; height: 84px; margin-bottom: 18px; border-radius: 50%; background: var(--success-50); color: var(--success); font-size: 2.4rem; }
.nt-result__icon--muted { background: var(--primary-50); color: var(--primary); }
.nt-result .prose, .nt-result .lead { margin: 14px auto 0; text-align: center; }
.nt-result .hero__actions { justify-content: center; }

@media (max-width: 1024px) {
  .shop-layout--full .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pd-review-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .shop-layout--full .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.nt-order-summary { max-width: 620px; margin: 0 auto 28px; }

/* =========================== PHASE 3: account, contact, compare, blog, brands =========================== */

/* Login */
.nt-auth { display: grid; grid-template-columns: 1.1fr .9fr; gap: 24px; max-width: 980px; margin: 0 auto; align-items: start; }
.nt-auth__form .field label { display: block; }
.nt-auth__aside { background: var(--bg); }

/* Account layout + sidebar */
.nt-account { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 28px; align-items: start; }
.nt-account--full { grid-template-columns: 1fr; }
.nt-account__side { position: sticky; top: calc(var(--header-h) + 60px); }
.nt-account-nav { display: flex; flex-direction: column; padding: 8px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.nt-account-nav .list-group-item { display: flex; align-items: center; gap: 12px; padding: 11px 14px; font-size: var(--fs-sm); font-weight: 600; color: var(--text-2); border-radius: 10px; transition: background .2s, color .2s; }
.nt-account-nav .list-group-item i { width: 18px; text-align: center; color: var(--muted); }
.nt-account-nav .list-group-item:hover, .nt-account-nav .list-group-item.active { background: var(--primary-50); color: var(--primary); }
.nt-account-nav .list-group-item:hover i, .nt-account-nav .list-group-item.active i { color: var(--primary); }
.nt-account__heading { font-size: 1.15rem; margin: 0 0 14px; }
.nt-account__heading:not(:first-child) { margin-top: 32px; }
.nt-account__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.nt-account__tile { display: flex; align-items: center; gap: 14px; padding: 16px; font-weight: 700; font-size: var(--fs-sm); color: var(--navy); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); transition: border-color .2s, box-shadow .25s, transform .25s var(--ease); }
.nt-account__tile .icon-tile { width: 42px; height: 42px; font-size: 1rem; }
.nt-account__tile > i { margin-left: auto; font-size: 11px; color: var(--subtle); }
.nt-account__tile:hover { border-color: var(--primary-100); box-shadow: var(--shadow); transform: translateY(-2px); }

/* Order history */
.nt-orders { display: grid; gap: 12px; }
.nt-order { display: grid; grid-template-columns: 1fr 1.2fr .8fr 1fr auto 20px; gap: 16px; align-items: center; padding: 16px 20px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); font-size: var(--fs-sm); color: var(--text-2); transition: border-color .2s, box-shadow .25s; }
.nt-order:hover { border-color: var(--primary-100); box-shadow: var(--shadow); }
.nt-order small { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--subtle); }
.nt-order__id { font-weight: 800; color: var(--navy); }
.nt-order__status { padding: 5px 12px; font-size: 12px; font-weight: 700; border-radius: var(--radius-pill); background: var(--primary-50); color: var(--primary); white-space: nowrap; }
.nt-order > i { color: var(--subtle); font-size: 12px; }

/* Contact */
.contact-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.contact-card a { display: block; }
.nt-map { overflow: hidden; border-radius: var(--radius-lg); border: 1px solid var(--border); aspect-ratio: 4 / 3; }
.nt-map iframe { width: 100%; height: 100%; border: 0; display: block; }

/* Compare page (StarTech-style: up to 4 slots, a product search in each) */
.page-hero .cmp__actions { display: flex; gap: 10px; margin-top: 18px; }
.cmp { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.cmp__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--radius-lg); }
.cmp__table { width: 100%; min-width: 980px; border-collapse: collapse; table-layout: fixed; }
.cmp__table th, .cmp__table td { padding: 14px 18px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; font-size: var(--fs-sm); }
.cmp__table td { border-left: 1px solid var(--border); }
.cmp__table tbody th { width: 20%; color: var(--muted); font-weight: 600; background: #FAFBFD; }
.cmp__table thead > tr > * { padding: 18px; background: var(--surface); }
.cmp__intro { width: 20%; }
.cmp__intro strong { display: block; font-size: var(--fs-base); color: var(--navy); }
.cmp__intro > span { display: block; margin-top: 6px; color: var(--muted); font-weight: 400; line-height: 1.5; }
.cmp__diff { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; padding: 8px 12px; border: 1px solid var(--border); border-radius: 999px; font-weight: 600; color: var(--navy); cursor: pointer; }
.cmp__diff input { accent-color: var(--primary); width: 16px; height: 16px; }
.cmp__table .cmp__slot { text-align: center; }
.cmp-search { position: relative; margin-bottom: 14px; }
.cmp-search input { width: 100%; height: 44px; padding: 0 42px 0 14px; border: 1px solid #CBD5E1; border-radius: 10px; background: var(--surface); font: inherit; font-size: var(--fs-sm); }
.cmp-search input::-webkit-search-cancel-button { display: none; }
.cmp-search input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-50); }
.cmp-search__btn { position: absolute; top: 0; right: 0; display: grid; place-items: center; width: 42px; height: 44px; color: var(--subtle); background: none; border: 0; }
button.cmp-search__btn { cursor: pointer; color: var(--muted); font-size: 16px; }
button.cmp-search__btn:hover { color: #DC2626; }
.cmp-search__suggest { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 30; max-height: 340px; overflow-y: auto; padding: 6px; text-align: left; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-lg); }
.cmp-search__item { display: grid; grid-template-columns: 44px 1fr; gap: 2px 10px; align-items: center; width: 100%; padding: 8px; text-align: left; background: none; border: 0; border-radius: 8px; cursor: pointer; font: inherit; font-size: 13px; line-height: 1.35; color: var(--navy); }
.cmp-search__item img { grid-row: span 2; width: 44px; height: 44px; object-fit: contain; }
.cmp-search__item b { color: var(--primary); font-size: 12.5px; }
.cmp-search__item:hover, .cmp-search__item:focus { background: var(--primary-50); outline: none; }
.cmp-search__item.is-taken { opacity: .5; cursor: default; }
.cmp-search__item em { font-style: normal; color: var(--subtle); }
.cmp-search__none { padding: 12px; color: var(--muted); font-size: 13px; }
.cmp__img { display: block; aspect-ratio: 1; max-width: 260px; margin: 0 auto; border-radius: 12px; overflow: hidden; background: #fff; }
.cmp__img img { width: 100%; height: 100%; object-fit: contain; transition: transform .3s ease; }
.cmp__img:hover img { transform: scale(1.04); }
.cmp__name { display: block; margin-top: 14px; font-weight: 700; font-size: var(--fs-base); line-height: 1.35; color: var(--navy); }
.cmp__name:hover { color: var(--primary); }
.cmp__price { justify-content: center; margin-top: 10px; }
.cmp__price .price__new { color: var(--accent); font-size: 1.35rem; }
.cmp__btns { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.cmp__empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 300px; padding: 20px; border: 2px dashed var(--border); border-radius: 12px; color: var(--muted); }
.cmp__empty i { font-size: 34px; color: #C7D2E0; }
.cmp__table .cmp__group th { padding: 12px 18px; background: var(--primary-50); color: var(--primary); font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.cmp__row:hover td, .cmp__row:hover th { background: #F7FAFE; }
.cmp__stock { font-weight: 700; color: var(--accent); }
.cmp__stock.is-in { color: var(--success); }
.cmp.is-diff .cmp__row.is-same { display: none; }
.cmp__hint { padding: 16px 20px; color: var(--muted); font-size: var(--fs-sm); }
.cmp__hint a { color: var(--primary); font-weight: 600; }
@media (max-width: 768px) {
  .cmp__table { min-width: 820px; }
  .cmp__table th, .cmp__table td { padding: 12px; }
  .cmp__table thead > tr > * { padding: 12px; }
  .cmp__table tbody th, .cmp__intro { position: sticky; left: 0; z-index: 2; width: 96px; font-size: 12.5px; }
  .cmp__intro > span { display: none; }
  .cmp__intro strong { font-size: 13px; }
  .cmp__diff { padding: 6px 8px; font-size: 12px; border-radius: 10px; align-items: flex-start; }
  .cmp__empty { min-height: 200px; }
}

/* Compare dock: right side, just above the chat button (60px at bottom 22px) */
.cmp-dock { position: fixed; right: 22px; bottom: 98px; z-index: 185; display: none; }
body:has(.cmp-dock.has-items) .back-to-top { bottom: 160px; }
.cmp-dock.has-items { display: block; }
.cmp-dock__tab { display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 0 16px; border: 0; border-radius: 999px; background: var(--navy); color: #fff; font: inherit; font-weight: 700; font-size: 14px; box-shadow: var(--shadow-lg); cursor: pointer; }
.cmp-dock__tab:hover { background: var(--primary); }
.cmp-dock__count { display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--accent); font-size: 12px; }
.cmp-dock__panel { position: absolute; right: 0; bottom: 60px; width: 350px; max-width: calc(100vw - 28px); background: var(--surface); border-radius: 14px; box-shadow: var(--shadow-lg); overflow: hidden; animation: cmp-dock-in .2s ease; }
@keyframes cmp-dock-in { from { opacity: 0; transform: translateY(8px); } }
.cmp-dock__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; background: var(--navy); color: #fff; }
.cmp-dock__head button { background: none; border: 0; color: #fff; font-size: 18px; cursor: pointer; }
.cmp-dock__list { max-height: 300px; overflow-y: auto; margin: 0; padding: 0; list-style: none; }
.cmp-dock__list li { display: grid; grid-template-columns: 52px 1fr 32px; align-items: center; gap: 12px; padding: 12px 18px; border-bottom: 1px solid var(--border); }
.cmp-dock__img img { width: 52px; height: 52px; object-fit: contain; }
.cmp-dock__name { font-size: 13px; line-height: 1.4; color: var(--navy); }
.cmp-dock__name:hover { color: var(--primary); }
.cmp-dock__list button { width: 32px; height: 32px; border: 0; border-radius: 8px; background: none; color: var(--muted); cursor: pointer; }
.cmp-dock__list button:hover { background: #FEE2E2; color: #DC2626; }
.cmp-dock__foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 18px; }
@media (max-width: 560px) {
  .cmp-dock { right: 14px; bottom: 146px; }
  .cmp-dock__tab { height: 44px; padding: 0 14px; }
}
@media (prefers-reduced-motion: reduce) { .cmp-dock__panel { animation: none; } .cmp__img img { transition: none; } }

@media print {
  .site-header, .topbar, .footer, .bottom-nav, .nt-chat, .cmp-dock, .back-to-top, .toast-stack, .cmp__actions, .cmp-search, .cmp__btns, .cmp__diff, .cmp__hint, .breadcrumb { display: none !important; }
  .page-hero { padding: 0 0 12px; background: none; border: 0; }
  .page-hero::after { display: none; }
  .cmp { box-shadow: none; border: 0; }
  .cmp__table { min-width: 0; }
  .cmp__table th, .cmp__table td { padding: 6px 8px; font-size: 11px; }
  .cmp__img { max-width: 140px; }
  .cmp__table .cmp__slot.is-empty, .cmp__table .is-blank { display: none; }
}

/* Blog */
.blog-grid .blog-card__media > i { color: var(--tone); opacity: .45; }
.blog-page .blog-side > * + * { margin-top: 20px; }
.nt-article { max-width: 860px; }
.blog-page .nt-article { max-width: none; }
.nt-article__media { margin-bottom: 28px; overflow: hidden; border-radius: var(--radius-xl); background: var(--surface-muted); }
.nt-article__media img { width: 100%; max-height: 460px; object-fit: contain; }
.nt-article__video { aspect-ratio: 16 / 9; }
.nt-article__video iframe { width: 100%; height: 100%; border: 0; }
.nt-article__share { display: flex; align-items: center; gap: 10px; margin: 32px 0; padding: 18px 0; border-block: 1px solid var(--border); font-weight: 700; font-size: var(--fs-sm); }
.nt-article__share a { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--surface-muted); color: var(--text-2); transition: .2s; }
.nt-article__share a:hover { background: var(--primary); color: #fff; }

/* Brands */
.nt-brand-index { position: sticky; top: calc(var(--header-h) + 50px); z-index: 5; padding: 12px 0; background: var(--surface); margin-bottom: 20px; }
.nt-brand-index .chip { padding: 6px 12px; min-width: 38px; justify-content: center; }
.nt-brand-group { padding-top: 12px; scroll-margin-top: 180px; }
.nt-brand-group__letter { font-size: 1.4rem; font-weight: 800; color: var(--primary); margin-bottom: 14px; }
.nt-brand-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; margin-bottom: 24px; }
.nt-brand { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 110px; padding: 16px; text-align: center; font-weight: 700; color: var(--navy); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); transition: border-color .2s, box-shadow .25s, transform .25s var(--ease); }
.nt-brand img { max-height: 48px; max-width: 120px; object-fit: contain; }
.nt-brand:hover { border-color: var(--primary-100); box-shadow: var(--shadow); transform: translateY(-2px); }

@media (max-width: 1024px) {
  .nt-account { grid-template-columns: 1fr; }
  .nt-account__side { position: static; }
  .nt-account-nav { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .nt-account-nav .list-group-item { white-space: nowrap; }
  .contact-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .nt-auth { grid-template-columns: 1fr; }
  .nt-order { grid-template-columns: 1fr 1fr; }
  .nt-order > i { display: none; }
}
@media (max-width: 560px) {
  .contact-cards { grid-template-columns: 1fr; }
}

/* Header search: icon button + live suggestions */
.search { position: relative; }
.search__input { padding-left: 18px; }
.search__btn { width: 46px; padding: 0; justify-content: center; font-size: 1rem; }
.search__suggest { position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 260; max-height: 440px; overflow-y: auto; padding: 6px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.search__suggest[hidden] { display: none; }
.search__suggest-item { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 10px; color: var(--text); transition: background .15s; }
.search__suggest-item:hover, .search__suggest-item.is-active { background: var(--primary-50); }
.search__suggest-img { display: grid; place-items: center; width: 52px; height: 44px; flex: none; padding: 4px; border-radius: 8px; background: var(--surface-muted); }
.search__suggest-img img { max-height: 100%; object-fit: contain; }
.search__suggest-name { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 600; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.search__suggest-price { flex: none; font-size: 13.5px; font-weight: 800; color: var(--primary); }
.search__suggest-more { justify-content: center; margin-top: 4px; padding: 10px; font-size: 13px; font-weight: 700; color: var(--primary); border-top: 1px solid var(--border); border-radius: 0 0 10px 10px; }
.search__suggest-empty { padding: 16px; font-size: 13px; color: var(--muted); text-align: center; }

/* ---------- Chat widget ---------- */
.float-whatsapp { display: none; }
.nt-chat { position: fixed; right: 22px; bottom: 22px; z-index: 190; display: flex; flex-direction: column; align-items: flex-end; gap: 14px; }
.nt-chat__launcher { display: flex; align-items: center; gap: 12px; }
.nt-chat__label { padding: 12px 18px; font-size: 15px; font-weight: 700; color: var(--navy); background: #fff; border-radius: var(--radius-pill); box-shadow: 0 10px 28px -8px rgba(10, 27, 51, .28); cursor: pointer; transition: transform .2s var(--ease); animation: ntChatNudge 4s ease-in-out 2s infinite; }
.nt-chat__label:hover { transform: translateY(-2px); }
.nt-chat__toggle { position: relative; display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 1.45rem; box-shadow: 0 12px 28px -8px rgba(244, 123, 32, .65); cursor: pointer; transition: transform .2s var(--ease), background .2s; }
.nt-chat__toggle::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--accent); animation: pulse 2.4s infinite; }
.nt-chat__toggle:hover { transform: scale(1.06); background: var(--accent-600); }
.nt-chat__icon-close { display: none; }
.nt-chat.is-open .nt-chat__icon-open { display: none; }
.nt-chat.is-open .nt-chat__icon-close { display: inline-block; }
.nt-chat.is-open .nt-chat__toggle::before, .nt-chat.is-open .nt-chat__label { display: none; }

.nt-chat__panel { width: min(330px, calc(100vw - 32px)); overflow: hidden; background: #fff; border-radius: 18px; box-shadow: 0 24px 60px -18px rgba(10, 27, 51, .35); transform-origin: bottom right; animation: ntChatIn .28s var(--ease); }
.nt-chat__panel[hidden] { display: none; }
.nt-chat__head { display: flex; align-items: center; gap: 12px; padding: 16px 16px 16px 18px; background: var(--accent); color: #fff; }
.nt-chat__avatar { display: grid; place-items: center; width: 50px; height: 50px; flex: none; overflow: hidden; border-radius: 50%; background: #fff; border: 2px solid rgba(255, 255, 255, .6); color: var(--accent); font-size: 1.2rem; }
.nt-chat__avatar img { width: 100%; height: 100%; object-fit: contain; padding: 5px; }
.nt-chat__who { flex: 1; min-width: 0; line-height: 1.25; }
.nt-chat__who strong { display: block; font-size: 1.05rem; font-weight: 800; color: #fff; }
.nt-chat__who small { font-size: 12.5px; font-weight: 600; opacity: .9; }
.nt-chat__close { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: #fff; font-size: 1.1rem; cursor: pointer; transition: background .2s; }
.nt-chat__close:hover { background: rgba(255, 255, 255, .18); }
.nt-chat__body { padding: 20px 18px 18px; background: #fff; }
.nt-chat__bubble { position: relative; padding: 14px 16px; font-family: 'Hind Siliguri', var(--font); font-size: 15px; line-height: 1.6; color: var(--text); background: var(--primary-50); border-radius: 4px 16px 16px 16px; }
.nt-chat__wave { display: inline-block; animation: ntWave 2.2s ease-in-out infinite; transform-origin: 70% 70%; }
.nt-chat__foot { padding: 18px 18px 22px; text-align: center; background: var(--bg); border-top: 1px solid var(--border); }
.nt-chat__foot p { margin-bottom: 14px; font-size: 15px; color: var(--muted); }
.nt-chat__actions { display: flex; justify-content: center; gap: 18px; }
.nt-chat__btn { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; color: #fff; font-size: 1.35rem; box-shadow: 0 8px 18px -8px rgba(10, 27, 51, .45); transition: transform .2s var(--ease); }
.nt-chat__btn:hover { transform: translateY(-3px) scale(1.05); }
.nt-chat__btn--wa { background: #25D366; }
.nt-chat__btn--call { background: #0EA5E9; }
.nt-chat__btn--msg { background: #0084FF; }

@keyframes ntChatIn { from { opacity: 0; transform: translateY(12px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes ntWave { 0%, 60%, 100% { transform: rotate(0); } 10%, 30% { transform: rotate(16deg); } 20%, 40% { transform: rotate(-8deg); } }
@keyframes ntChatNudge { 0%, 90%, 100% { transform: none; } 94% { transform: translateY(-4px); } }

@media (max-width: 560px) {
  .nt-chat { right: 14px; bottom: 80px; }
  .nt-chat__toggle { width: 54px; height: 54px; font-size: 1.3rem; }
  .nt-chat__label { padding: 10px 14px; font-size: 13.5px; }
}
@media (prefers-reduced-motion: reduce) { .nt-chat__label, .nt-chat__wave, .nt-chat__toggle::before { animation: none; } }

/* ---------- Product gallery: hover zoom + lightbox ---------- */
.gallery__main:hover img { transform: none; }
.gallery__main { cursor: zoom-in; }
.gallery__main img { transition: transform .25s var(--ease), opacity .2s; will-change: transform; }
.gallery__main.is-zooming img { transform: scale(2.5); transition: transform .1s linear, opacity .2s; }
.gallery__main.is-zooming .product-card__badges, .gallery__main.is-zooming .gallery__count { opacity: 0; }
.gallery__zoom { z-index: 2; }
.gallery__count { position: absolute; left: 16px; bottom: 16px; z-index: 2; padding: 4px 10px; font-size: 12px; font-weight: 700; color: var(--text-2); background: rgba(255, 255, 255, .9); border-radius: var(--radius-pill); box-shadow: var(--shadow-xs); transition: opacity .2s; }
.gallery__thumbs { max-height: 540px; overflow-y: auto; scrollbar-width: none; }

.nt-lightbox { position: fixed; inset: 0; z-index: 600; display: flex; flex-direction: column; background: rgba(10, 27, 51, .94); backdrop-filter: blur(4px); animation: ntFade .2s ease; }
.nt-lightbox[hidden] { display: none; }
.nt-lightbox__stage { flex: 1; display: grid; place-items: center; min-height: 0; padding: 60px 80px 20px; overflow: hidden; }
.nt-lightbox__stage img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 12px; background: #fff; cursor: zoom-in; transition: transform .25s var(--ease); }
.nt-lightbox__stage img.is-zoomed { transform: scale(2); cursor: zoom-out; }
.nt-lightbox__close, .nt-lightbox__nav { position: absolute; z-index: 2; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: #fff; background: rgba(255, 255, 255, .12); font-size: 1.2rem; transition: background .2s; }
.nt-lightbox__close:hover, .nt-lightbox__nav:hover { background: rgba(255, 255, 255, .25); }
.nt-lightbox__close { top: 16px; right: 16px; }
.nt-lightbox__nav { top: 50%; transform: translateY(-50%); }
.nt-lightbox__nav--prev { left: 16px; }
.nt-lightbox__nav--next { right: 16px; }
.nt-lightbox__bar { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 12px 16px 20px; }
.nt-lightbox__counter { font-size: 13px; font-weight: 700; color: #C9D6E8; }
.nt-lightbox__thumbs { display: flex; gap: 8px; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.nt-lightbox__thumbs button { width: 64px; height: 52px; flex: none; padding: 4px; border-radius: 8px; background: #fff; border: 2px solid transparent; opacity: .6; transition: .2s; }
.nt-lightbox__thumbs button.is-active { border-color: var(--accent); opacity: 1; }
.nt-lightbox__thumbs img { width: 100%; height: 100%; object-fit: contain; }
@keyframes ntFade { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 768px) {
  .nt-lightbox__stage { padding: 64px 12px 12px; }
  .nt-lightbox__nav { width: 40px; height: 40px; }
}

/* Lightbox: always fit the whole image inside the screen */
.nt-lightbox__stage { display: flex; align-items: center; justify-content: center; flex: 1 1 0; }
.nt-lightbox__stage img { width: auto; height: auto; max-width: calc(100vw - 180px); max-height: calc(100vh - 190px); max-height: calc(100dvh - 190px); }
@media (max-width: 768px) {
  .nt-lightbox__stage img { max-width: calc(100vw - 24px); max-height: calc(100vh - 210px); max-height: calc(100dvh - 210px); }
}

/* Order success: send the order on WhatsApp */
.nt-wa-order { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 18px 0 6px; }
.nt-wa-order small { color: var(--muted); font-size: var(--fs-sm); }

/* Chat widget form (name / phone / reason before WhatsApp, Call, Messenger) */
.nt-chat__form { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.nt-chat__form .input, .nt-chat__form .select, .nt-chat__form .textarea { width: 100%; font-size: 14px; padding: 9px 12px; }
.nt-chat__form .textarea { resize: vertical; min-height: 56px; }
.nt-chat__lead { margin: 0 0 2px; font-family: 'Hind Siliguri', var(--font); font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.nt-chat__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.nt-chat__err { min-height: 0; font-size: 13px; color: var(--danger, #dc2626); font-family: 'Hind Siliguri', var(--font); }
.nt-chat__err:empty { display: none; }
.nt-chat__ok { margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: #ecfdf5; color: #065f46; font-family: 'Hind Siliguri', var(--font); font-size: 14px; line-height: 1.55; }
.nt-chat__ok i { color: #16a34a; margin-right: 4px; }
