/* Kamy Communications: one palette for the public storefront and order flow. */
:root {
  --brand-navy: #06194f;
  --brand-blue: #0755b8;
  --brand-blue-dark: #063a8a;
  --brand-green: #147a24;
  --brand-action: #147a24;
  --brand-action-hover: #0e631c;
  --brand-soft-blue: #edf4ff;
  --brand-shadow: 0 12px 24px -12px rgba(20, 122, 36, .4);

  /* Existing page components use these names. */
  --navy: var(--brand-navy);
  --topbar-bg: var(--brand-navy);
  --purple: var(--brand-blue);
  --purple-dark: var(--brand-blue-dark);
  --purple-light: #5a98df;
  --lilac-bg: var(--brand-soft-blue);
  --green: var(--brand-green);
  --orange: var(--brand-blue);
  --orange-dark: var(--brand-blue-dark);
  --orange-soft: var(--brand-soft-blue);
  --primary: var(--brand-action);
  --primary-hover: var(--brand-action-hover);
  --secondary: var(--brand-green);
  --secondary-hover: #0e631c;
  --success: var(--brand-green);
  --green-950: #06194f;
  --green-900: #073575;
  --green-800: #0755b8;
  --green-700: #147a24;
  --green-100: var(--brand-soft-blue);
}

:is(a, button, input, select, textarea):focus-visible {
  outline: 3px solid rgba(7, 85, 184, .28);
  outline-offset: 3px;
}

.topbar,
.checkout-topbar {
  background: var(--brand-navy);
}

.checkout-topbar i {
  color: #7bdb71;
}

.logo-mark,
.footer-logo-mark,
.checkout-logo-mark {
  background: var(--brand-navy);
  box-shadow: var(--brand-shadow);
}

.search-bar,
.search-bar:focus-within {
  border-color: var(--brand-blue);
}

.search-bar:focus-within,
.search-box:focus-within,
.affiliate-application-card textarea:focus {
  box-shadow: 0 0 0 4px rgba(7, 85, 184, .12);
}

.head-action:hover .ic-circle,
.flash-card-title:hover,
.flash-nav:not(:disabled):hover,
.flash-view-all:hover {
  color: var(--brand-blue);
}

.navmenu a.active,
.navmenu a:hover {
  color: #fff;
}

.navmenu a.active::after {
  background: #57c443;
}

.hot-tag,
.navmenu .hot-tag,
body .navmenu .hot-tag,
.head-action .badge,
.mobile-cart-badge,
.flash-save {
  background: var(--brand-green);
  color: #fff;
}

/* Circular Red Discount Badge (e.g. 9% ছাড়) - Positioned Top Right */
.discount-badge,
.catalog-discount,
.gallery-badge.discount,
.flash-save {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  max-width: 44px !important;
  border-radius: 50% !important;
  background: #e60028 !important;
  color: #ffffff !important;
  display: flex;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 0 !important;
  box-shadow: 0 2px 6px rgba(230, 0, 40, 0.4) !important;
  z-index: 4 !important;
  line-height: 1 !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
}

.discount-badge[hidden],
.catalog-discount[hidden],
.gallery-badge.discount[hidden],
.flash-save[hidden],
.discount-badge[style*="display:none"],
.discount-badge[style*="display: none"],
.catalog-discount[style*="display:none"],
.catalog-discount[style*="display: none"],
.gallery-badge.discount[style*="display:none"],
.gallery-badge.discount[style*="display: none"],
.flash-save[style*="display:none"],
.flash-save[style*="display: none"],
.discount-badge.d-none,
.catalog-discount.d-none,
.gallery-badge.discount.d-none,
.flash-save.d-none {
  display: none !important;
}

.discount-badge .discount-percent,
.catalog-discount .discount-percent,
.gallery-badge.discount .discount-percent,
.flash-save .discount-percent {
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.4px !important;
  color: #ffffff !important;
  display: block !important;
  font-family: inherit !important;
}

.discount-badge .discount-text,
.catalog-discount .discount-text,
.gallery-badge.discount .discount-text,
.flash-save .discount-text {
  font-size: 9.5px !important;
  font-weight: 700 !important;
  line-height: 1.05 !important;
  margin-top: 1.5px !important;
  color: #ffffff !important;
  display: block !important;
  font-family: inherit !important;
}

@media (max-width: 580px) {
  .discount-badge,
  .catalog-discount,
  .gallery-badge.discount,
  .flash-save {
    top: 7px !important;
    right: 7px !important;
    left: auto !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
  }
  .discount-badge .discount-percent,
  .catalog-discount .discount-percent,
  .gallery-badge.discount .discount-percent,
  .flash-save .discount-percent {
    font-size: 11px !important;
  }
  .discount-badge .discount-text,
  .catalog-discount .discount-text,
  .gallery-badge.discount .discount-text,
  .flash-save .discount-text {
    font-size: 8.5px !important;
    margin-top: 1px !important;
  }
}

.hero-banner:not(.has-custom-banner),
.catalog-hero,
.track-hero,
.information-hero,
.affiliate-hero {
  background: var(--brand-soft-blue);
}

.hero-banner::before,
.catalog-hero::before,
.track-hero::before {
  background: rgba(7, 85, 184, .07);
  border-color: rgba(7, 85, 184, .07);
}

.track-field>div:focus-within {
  border-color: var(--brand-blue);
  box-shadow: 0 0 0 3px rgba(7, 85, 184, .12);
}

.hero-art-bag,
.hero-discount {
  background: var(--brand-action);
  box-shadow: var(--brand-shadow);
}

.affiliate-eyebrow {
  background: var(--brand-soft-blue);
  color: var(--brand-blue-dark);
}

.affiliate-earnings-card::before {
  background: rgba(7, 85, 184, .12);
}

.affiliate-card-top>span,
.affiliate-card-metrics span {
  color: #7bdb71;
}

.affiliate-card-chart i {
  background: var(--brand-action);
  box-shadow: 0 -8px 18px rgba(7, 85, 184, .18);
}

/* Main purchase and navigation actions use the solid green from the logo. */
.search-bar button,
.cat-toggle.desktop-category-label,
.hero-cta:not(.secondary),
.flash-deal-link,
.cart-btn,
.checkout-btn,
.catalog-add-cart:not(:disabled),
.catalog-empty button,
.buy-btn-primary,
.buy-btn-secondary,
.review-submit,
.cart-checkout-button,
.place-order-button,
.btn-brand,
.btn-primary,
.affiliate-primary-button,
.affiliate-application-card form button,
.compare-empty a,
.compare-add-btn,
.compare-cta .btn-shop,
.search-button,
.checkout-button,
.btn-order-trigger,
.btn-submit-order:not(:disabled),
.btn-verify-otp,
.call-btn {
  background: var(--brand-action);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--brand-shadow);
}

.track-form>button {
  background: var(--brand-action);
  color: #fff;
  box-shadow: var(--brand-shadow);
}

.search-bar button:hover,
.cat-toggle.desktop-category-label:hover,
.cat-toggle.desktop-category-label.open,
.hero-cta:not(.secondary):hover,
.flash-deal-link:hover,
.cart-btn:hover,
.checkout-btn:hover,
.catalog-add-cart:not(:disabled):hover,
.catalog-empty button:hover,
.buy-btn-primary:hover,
.buy-btn-secondary:hover,
.review-submit:hover,
.cart-checkout-button:hover,
.place-order-button:hover,
.btn-brand:hover,
.btn-primary:hover,
.affiliate-primary-button:hover,
.affiliate-application-card form button:hover,
.compare-empty a:hover,
.compare-add-btn:hover,
.compare-cta .btn-shop:hover,
.search-button:hover,
.checkout-button:hover,
.btn-order-trigger:hover,
.btn-submit-order:not(:disabled):hover,
.btn-verify-otp:hover,
.call-btn:hover {
  background: var(--brand-action-hover);
  color: #fff;
}

.track-form>button:hover {
  background: var(--brand-action-hover);
}

/* Give the two product-detail purchase choices distinct logo colors. */
.buy-box .buy-btn-secondary {
  background: var(--brand-blue);
  color: #fff;
  box-shadow: 0 12px 24px -12px rgba(7, 85, 184, .55);
}

.buy-box .buy-btn-secondary:hover {
  background: var(--brand-blue-dark);
  color: #fff;
}

.checkout-empty a,
.checkout-empty a:hover {
  background: var(--brand-action);
  color: #fff;
}

.cart-btn.added,
.cart-btn.added:hover {
  background: var(--brand-green);
}

.cart-btn:disabled,
.catalog-add-cart:disabled,
.checkout-btn[aria-disabled="true"],
.place-order-button:disabled,
.btn-submit-order:disabled {
  box-shadow: none;
}

/* Secondary actions and deal details remain quiet beside the main CTAs. */
.flash-nav:not(:disabled):hover,
.flash-view-all:hover,
.load-more-wrap>button,
.cart-title>a,
.track-help-card a:first-of-type,
.information-nav-card a:hover,
.information-nav-card a.active {
  border-color: #a9c8ef;
  background: var(--brand-soft-blue);
  color: var(--brand-blue-dark);
}

.load-more-wrap>button:hover {
  background: var(--brand-action);
  color: #fff;
}

.affiliate-form-heading>span,
.affiliate-guest-card>span {
  background: var(--brand-soft-blue);
  color: var(--brand-blue);
}

.flash-price,
.price-now,
.p-price-now,
.catalog-price,
.catalog-card-price strong,
.compare-price,
.live-search-price {
  color: var(--brand-green) !important;
}

.flash-timer {
  border-color: var(--brand-green);
}

.flash-timer-unit + .flash-timer-unit {
  border-color: #cfe7d0;
}

.flash-timer-unit strong {
  color: var(--brand-blue-dark);
}

.flash-timer-unit small,
.flash-empty i {
  color: var(--brand-green);
}

.flash-nav:not(:disabled):hover,
.flash-view-all:hover {
  border-color: var(--brand-blue);
}

.storefront-footer,
.checkout-footer,
.store-nav {
  background: var(--brand-navy);
}

.checkout-footer-logo {
  box-sizing: content-box;
  padding: 5px 10px;
  border-radius: 8px;
  background: #fff;
}

.brand span {
  color: var(--brand-green);
}

.track-route-line {
  background: repeating-linear-gradient(90deg, var(--brand-blue) 0, var(--brand-blue) 9px, transparent 9px, transparent 16px);
}

.track-current-status strong {
  background: var(--brand-soft-blue);
  color: var(--brand-blue-dark);
}

/* Standalone product landing templates share the brand actions and accents. */
body.brand-landing {
  --primary: var(--brand-action);
  --primary-hover: var(--brand-action-hover);
  --secondary: var(--brand-green);
  --secondary-hover: #0e631c;
  --success: var(--brand-green);
}

body.brand-landing .hero-section {
  background: var(--brand-soft-blue);
}

body.brand-landing-tech .hero-section {
  background: var(--brand-navy);
}

body.brand-landing .logo-fallback,
body.brand-landing .price-new,
body.brand-landing .trust-item i {
  color: var(--brand-blue);
}

body.brand-landing .badge-promo {
  background: var(--brand-soft-blue);
  border-color: #bed5f3;
  color: var(--brand-blue-dark);
}

body.brand-landing .discount-tag {
  background: var(--brand-green);
  color: #fff;
}

body.brand-landing .btn-order-trigger,
body.brand-landing .btn-submit-order:not(:disabled),
body.brand-landing .btn-verify-otp,
body.brand-landing .call-btn,
body.brand-landing #checkout-verify-otp-btn {
  background: var(--brand-action);
  color: #fff;
  box-shadow: var(--brand-shadow);
}

body.brand-landing .btn-order-trigger:hover,
body.brand-landing .btn-submit-order:not(:disabled):hover,
body.brand-landing .btn-verify-otp:hover,
body.brand-landing .call-btn:hover,
body.brand-landing #checkout-verify-otp-btn:hover {
  background: var(--brand-action-hover);
  color: #fff;
}

/* =========================================================
   Add to Cart & Action Buttons - Premium Elevated Shadows
   ========================================================= */
.buy-btn-primary,
.cart-btn:not(:disabled),
.catalog-add-cart:not(:disabled),
.compare-add-btn {
  box-shadow: 0 6px 18px rgba(20, 122, 36, 0.32), 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.2s ease, filter 0.2s ease !important;
}

.buy-btn-primary:hover:not(:disabled),
.cart-btn:hover:not(:disabled),
.catalog-add-cart:hover:not(:disabled),
.compare-add-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(20, 122, 36, 0.45), 0 4px 10px rgba(0, 0, 0, 0.12) !important;
}

.buy-btn-primary:active:not(:disabled),
.cart-btn:active:not(:disabled),
.catalog-add-cart:active:not(:disabled),
.compare-add-btn:active {
  transform: translateY(0) !important;
  box-shadow: 0 3px 10px rgba(20, 122, 36, 0.3) !important;
}

/* Buy Now Button on Product Page */
.buy-box .buy-btn-secondary:not(:disabled) {
  background: var(--brand-blue) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(7, 85, 184, 0.32), 0 2px 6px rgba(0, 0, 0, 0.08) !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.2s ease, filter 0.2s ease !important;
}

.buy-box .buy-btn-secondary:hover:not(:disabled) {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(7, 85, 184, 0.45), 0 4px 10px rgba(0, 0, 0, 0.12) !important;
}

.buy-box .buy-btn-secondary:active:not(:disabled) {
  transform: translateY(0) !important;
  box-shadow: 0 3px 10px rgba(7, 85, 184, 0.3) !important;
}

/* =========================================================
   Header & Footer Pure White Text Styling
   ========================================================= */

/* Topbar & Header Navigation - Pure White Text & Icons */
.topbar,
.topbar a,
.topbar span,
.topbar i,
.topbar-left a,
.topbar-left span,
.topbar-left i,
.topbar-right a,
.topbar-right a i,
.lang-select,
.lang-select span,
.lang-select i,
.checkout-topbar,
.checkout-topbar a,
.checkout-topbar span,
.checkout-topbar i {
  color: #ffffff !important;
}

.topbar-right a {
  border-color: rgba(255, 255, 255, 0.25) !important;
  background: rgba(255, 255, 255, 0.1) !important;
}

.topbar-right a:hover {
  background: var(--brand-action) !important;
  color: #ffffff !important;
}

.navmenu a,
.navmenu a:hover,
.navmenu a.active,
.navmenu a:visited {
  color: #ffffff !important;
}

.navmenu a.active::after {
  background: #ffffff !important;
}

.desktop-category-label,
.desktop-category-label:hover {
  color: #ffffff !important;
}

/* Footer - 100% Pure White Text, Links, Paragraphs & Copyright */
.storefront-footer,
.storefront-footer a,
.storefront-footer p,
.storefront-footer span,
.storefront-footer small,
.storefront-footer b,
.storefront-footer strong,
.storefront-footer h3,
.footer-brand,
.footer-brand b,
.footer-brand small,
.footer-brand-column,
.footer-brand-column > p,
.footer-column,
.footer-column > a,
.footer-contact-column,
.footer-contact-column > p,
.footer-contact-column > a,
.footer-contact-column span,
.footer-contact-column small,
.footer-contact-column i,
.footer-bottom,
.footer-bottom > .wrap,
.footer-bottom span,
.footer-bottom a,
.checkout-footer,
.checkout-footer a,
.checkout-footer p,
.checkout-footer span,
.checkout-footer small,
.checkout-footer b,
.checkout-footer h4,
.checkout-footer h5 {
  color: #ffffff !important;
}

.storefront-footer a:hover,
.checkout-footer a:hover,
.footer-bottom a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

.footer-socials a {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

.footer-socials a:hover {
  background: var(--brand-action) !important;
  border-color: var(--brand-action) !important;
  color: #ffffff !important;
}

.footer-column h3::after {
  background: #ffffff !important;
}

/* Category Images in Home Blocks & Menus */
.home-category-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 10px !important;
  padding: 3px !important;
  display: block !important;
}

.desktop-cat-link .cat-img,
.drawer-cats .cat-img {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  object-fit: contain !important;
  border-radius: 4px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  flex-shrink: 0 !important;
}