/* ==========================================================
   APTSOFT SITE POLISH — accessibility, navigation and CTA
   Loaded last so legacy page styles cannot undo these fixes.
   ========================================================== */

/* ---------- DESKTOP NAVIGATION: stable flex layout ---------- */
@media (min-width: 1201px) {
  .glass-navbar .nav-container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: clamp(1rem, 1.7vw, 2rem) !important;
  }

  .glass-navbar .navbar-brand {
    position: relative !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  .glass-navbar .nav-menu {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: clamp(.8rem, 1.35vw, 1.65rem) !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
    backdrop-filter: none !important;
  }

  .glass-navbar .nav-links {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    display: flex !important;
    flex: 0 1 auto !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: clamp(.85rem, 1.6vw, 2rem) !important;
    width: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  .glass-navbar .nav-links a {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: .65rem 0 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    transition: color .22s ease, transform .22s ease, opacity .22s ease !important;
  }

  .glass-navbar .nav-links a::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: .22rem !important;
    height: 2px !important;
    border-radius: 2px !important;
    background: linear-gradient(90deg,#e52cb7,#7546ef,#079de8) !important;
    transform: scaleX(0) !important;
    transform-origin: left center !important;
    transition: transform .24s ease !important;
  }

  .glass-navbar .nav-links a:hover {
    opacity: 1 !important;
    color: #b52ac1 !important;
    transform: translateY(-2px) !important;
  }

  .glass-navbar .nav-links a:hover::after,
  .glass-navbar .nav-links a:focus-visible::after {
    transform: scaleX(1) !important;
  }

  .glass-navbar .nav-actions {
    position: static !important;
    display: flex !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: clamp(.45rem, .75vw, .8rem) !important;
    width: auto !important;
    margin: 0 !important;
  }

  .glass-navbar .theme-toggle-btn {
    position: relative !important;
    inset: auto !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
  }

  .glass-navbar .theme-toggle-btn i {
    position: static !important;
    inset: auto !important;
    display: inline-block;
    line-height: 1 !important;
    font-size: 1.1rem !important;
  }

  .glass-navbar .nav-start-project,
  .glass-navbar .nav-pay-online {
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
}

/* Tablet/mobile: keep theme switcher in the action row, not over links. */
@media (max-width: 1200px) {
  .glass-navbar .nav-menu {
    box-sizing: border-box !important;
    gap: 1rem !important;
  }
  .glass-navbar .nav-actions {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: .75rem !important;
    width: 100% !important;
  }
  .glass-navbar .theme-toggle-btn {
    position: relative !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    z-index: 2 !important;
  }
  .glass-navbar .theme-toggle-btn i {
    position: static !important;
    inset: auto !important;
    line-height: 1 !important;
  }
  .glass-navbar .nav-actions .nav-start-project,
  .glass-navbar .nav-actions .nav-pay-online {
    width: auto !important;
    min-width: 130px !important;
    text-align: center !important;
  }
}

/* Correct icon swapping and prevent Safari's inline icon baseline overlap. */
[data-theme="dark"] .theme-toggle-btn .icon-sun { display: inline-block !important; }
[data-theme="dark"] .theme-toggle-btn .icon-moon { display: none !important; }
[data-theme="light"] .theme-toggle-btn .icon-sun { display: none !important; }
[data-theme="light"] .theme-toggle-btn .icon-moon { display: inline-block !important; color: #5144d8 !important; }
.theme-toggle-btn { isolation: isolate !important; overflow: visible !important; }
.theme-toggle-btn i { pointer-events: none !important; }

/* ---------- Consistent legibility in LIGHT MODE ---------- */
html[data-theme="light"] main :is(
  h1,h2,h3,h4,h5,h6,p,li,dt,dd,label,small,strong,b,em,
  blockquote,cite,figcaption,legend,summary,td,th,caption
):not(.text-gradient) {
  text-shadow: none !important;
}

/* All gradient/solid brand buttons must use white text, including nested icons. */
html[data-theme="light"] main :is(
  a.btn-primary,button.btn-primary,.btn-primary,
  .apt-hero-primary,.nav-start-project,.nav-pay-online,
  .submit-btn,.pay-button,.cta-button,.btn-gradient,
  .emandi-product-link
),
html[data-theme="light"] main :is(
  a.btn-primary,button.btn-primary,.btn-primary,
  .apt-hero-primary,.nav-start-project,.nav-pay-online,
  .submit-btn,.pay-button,.cta-button,.btn-gradient,
  .emandi-product-link
) :is(span,i,strong,b) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
}

/* Keep button gradients saturated enough to support white labels. */
html[data-theme="light"] main :is(
  .btn-primary,.apt-hero-primary,.cta-button,.btn-gradient
) {
  background: linear-gradient(105deg,#d91e91 0%,#8438dc 55%,#087fce 100%) !important;
  border-color: transparent !important;
  box-shadow: 0 8px 22px rgba(117,55,205,.20) !important;
}
html[data-theme="light"] .glass-navbar .nav-start-project {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(105deg,#d91e91 0%,#8438dc 55%,#087fce 100%) !important;
  border: 0 !important;
}

/* Gradient section labels and badges: white on a real gradient, never white-on-white. */
html[data-theme="light"] main :is(
  .section-tag,.section-badge,.featured-badge,.automation-badge,
  .process-badge,.step-badge,.product-highlight-badge,.project-badge,
  .eyebrow-badge,.tag-badge
) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(110deg,#d91e91 0%,#8438dc 100%) !important;
  border: 0 !important;
  box-shadow: 0 4px 14px rgba(117,55,205,.16) !important;
}

/* Product/category chips use dark ink on a pale tinted surface. */
html[data-theme="light"] main :is(.product-tag,.project-stack span,.project-tech span,.tech-chip) {
  color: #4b318e !important;
  -webkit-text-fill-color: #4b318e !important;
  background: #f1ebff !important;
  border: 1px solid rgba(117,70,223,.22) !important;
}

/* Secondary/outline controls use readable dark ink. */
html[data-theme="light"] main :is(
  .btn-secondary,.btn-outline,.btn-outline-light,.btn-light,
  .apt-hero-secondary,.filter-pill,.category
) {
  color: #30294b !important;
  -webkit-text-fill-color: #30294b !important;
}
html[data-theme="light"] main :is(.btn-secondary,.btn-outline,.btn-outline-light,.apt-hero-secondary) :is(i,span,strong) {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
}

/* Home testimonials intentionally retain a dark panel: keep its copy light.
   This prevents global light-mode heading rules from making it disappear. */
html[data-theme="light"] .testimonial-section {
  background: radial-gradient(circle at right top,rgba(37,99,235,.12),transparent 35%),
              linear-gradient(180deg,#08111f,#050816) !important;
}
html[data-theme="light"] .testimonial-section .section-title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
html[data-theme="light"] .testimonial-section .section-description {
  color: #c1ccdc !important;
  -webkit-text-fill-color: #c1ccdc !important;
}
html[data-theme="light"] .testimonial-section .section-header span.text-gradient {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Logo 9 contains white lettering; give it a dark tile on pale trusted-by surfaces. */
html[data-theme="light"] .trusted-by .logo-track img:nth-child(9),
html[data-theme="light"] .trusted-by .logo-track img:nth-child(18) {
  box-sizing: content-box !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  background: #172033 !important;
}

/* About/section chips and process labels should not inherit transparent gradient text. */
html[data-theme="light"] main .about-hero .section-tag,
html[data-theme="light"] main .process-section .section-badge {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(110deg,#d91e91 0%,#8438dc 100%) !important;
}

/* Keep heading gradients visible while ordinary text stays high-contrast. */
html[data-theme="light"] main :is(h1,h2,h3,h4,h5,h6) .text-gradient {
  background: linear-gradient(100deg,#d927a9 0%,#7546df 53%,#078fcf 100%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

/* ---------- eMandi Market catalogue card ---------- */
.emandi-product-visual {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  overflow: hidden;
  color: #ffffff;
  background:
    radial-gradient(circle at 18% 20%,rgba(231,42,180,.42),transparent 42%),
    radial-gradient(circle at 82% 80%,rgba(0,160,255,.38),transparent 45%),
    linear-gradient(135deg,#10112d,#171c45 55%,#071a35) !important;
}
.emandi-visual-glow {
  position: absolute;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(124,58,237,.25);
  filter: blur(35px);
}
.emandi-visual-mark {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 88px;
  height: 88px;
  border-radius: 24px;
  color: #ffffff;
  font-size: 2.8rem;
  background: linear-gradient(135deg,#d927a9,#7546df,#078fcf);
  box-shadow: 0 14px 40px rgba(117,70,223,.32);
}
.emandi-visual-caption {
  position: relative;
  z-index: 1;
  color: #dce7ff !important;
  -webkit-text-fill-color: #dce7ff !important;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .16em;
}
.emandi-market-card .product-body h3 {
  color: #ffffff;
}
.emandi-market-card .product-body p {
  color: #b9c4d8;
}
.emandi-product-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  align-self: flex-start;
  margin-top: auto;
  padding: .72rem 1rem;
  border-radius: 999px;
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
  color: #ffffff;
  background: linear-gradient(105deg,#d91e91,#8438dc 55%,#087fce);
  transition: transform .22s ease,box-shadow .22s ease;
}
.emandi-product-link:hover {
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(117,55,205,.28);
}

/* The eMandi card uses a dark product-art panel, so preserve its light copy in both themes. */
html[data-theme="light"] main .emandi-market-card .product-image,
html[data-theme="light"] main .emandi-market-card .emandi-product-visual {
  background:
    radial-gradient(circle at 18% 20%,rgba(231,42,180,.42),transparent 42%),
    radial-gradient(circle at 82% 80%,rgba(0,160,255,.38),transparent 45%),
    linear-gradient(135deg,#10112d,#171c45 55%,#071a35) !important;
}
html[data-theme="light"] main .emandi-market-card .emandi-visual-caption {
  color: #dce7ff !important;
  -webkit-text-fill-color: #dce7ff !important;
}

html[data-theme="light"] main .emandi-market-card {
  background: #ffffff !important;
  border-color: rgba(30,35,60,.13) !important;
}
html[data-theme="light"] main .emandi-market-card .product-body {
  background: #ffffff !important;
}
html[data-theme="light"] main .emandi-market-card .product-body h3 {
  color: #19192e !important;
  -webkit-text-fill-color: #19192e !important;
}
html[data-theme="light"] main .emandi-market-card .product-body p {
  color: #505166 !important;
  -webkit-text-fill-color: #505166 !important;
}
html[data-theme="light"] main .emandi-market-card .product-tag {
  color: #4b318e !important;
  -webkit-text-fill-color: #4b318e !important;
  background: #f1ebff !important;
  border: 1px solid rgba(117,70,223,.22) !important;
}

/* Section badge is a gradient pill, not gradient text. */
html[data-theme="light"] main .section-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: .35rem 1.15rem !important;
  border-radius: 999px !important;
  background: linear-gradient(110deg,#d91e91 0%,#8438dc 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 4px 16px rgba(117,55,205,.2) !important;
}

/* The testimonial section stays dark by design in both modes. */
html[data-theme="light"] .testimonial-section .testimonial-card :is(p,h1,h2,h3,h4,h5,span) {
  color: #45465c !important;
  -webkit-text-fill-color: #45465c !important;
}
html[data-theme="light"] .testimonial-section .testimonial-card .client-info h5 {
  color: #19192e !important;
  -webkit-text-fill-color: #19192e !important;
}