/*
 * INVESTAX INDIA - SITE THEME (loaded last on every public page)
 * 1. Base surfaces and text from tokens
 * 2. Bootstrap and legacy template parts that are not tokenised
 * 3. Database content (CKEditor HTML) in dark mode
 * 4. The light/dark switch
 */

/* 1. Base ------------------------------------------------------------- */
html { background: var(--ix-bg); }
body, .wrapper, #wrapper { background-color: var(--ix-bg) !important; color: var(--ix-text); }
html.ix-theme-anim body, html.ix-theme-anim body * { transition: background-color .25s ease, color .25s ease, border-color .25s ease !important; }
::selection { background: var(--ix-gold); color: var(--ix-on-gold); }
a { color: var(--ix-gold-strong); }
hr { border-color: var(--ix-border); }

/* 2. Bootstrap + legacy template (style.css) in dark mode --------------- */
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .bg-light { background-color: var(--ix-surface) !important; }
html[data-theme="dark"] .text-dark,
html[data-theme="dark"] .text-body { color: var(--ix-text) !important; }
html[data-theme="dark"] .text-muted { color: var(--ix-muted) !important; }
html[data-theme="dark"] .border, html[data-theme="dark"] .border-top, html[data-theme="dark"] .border-bottom,
html[data-theme="dark"] .border-left, html[data-theme="dark"] .border-right { border-color: var(--ix-border) !important; }
html[data-theme="dark"] .card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .list-group-item,
html[data-theme="dark"] .popover,
html[data-theme="dark"] .toast { background-color: var(--ix-surface); color: var(--ix-text); border-color: var(--ix-border); }
html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer { background-color: var(--ix-surface-2); border-color: var(--ix-border); }
html[data-theme="dark"] .dropdown-item { color: var(--ix-text); }
html[data-theme="dark"] .dropdown-item:hover, html[data-theme="dark"] .dropdown-item:focus { background: var(--ix-surface-2); color: var(--ix-gold-strong); }
html[data-theme="dark"] .close { color: var(--ix-text); text-shadow: none; }
html[data-theme="dark"] .breadcrumb { background-color: var(--ix-surface-2); }
html[data-theme="dark"] .page-link { background: var(--ix-surface); border-color: var(--ix-border); color: var(--ix-gold-strong); }
html[data-theme="dark"] .alert-success { background: var(--ix-success-soft); color: var(--ix-success); border-color: transparent; }
html[data-theme="dark"] .alert-danger { background: var(--ix-danger-soft); color: var(--ix-danger); border-color: transparent; }
html[data-theme="dark"] .alert-warning, html[data-theme="dark"] .alert-info { background: var(--ix-warning-soft); color: var(--ix-warning); border-color: transparent; }

/* Forms */
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]),
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .custom-select {
  background-color: var(--ix-input-bg) !important;
  color: var(--ix-text) !important;
  border-color: var(--ix-border) !important;
}
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: var(--ix-muted) !important; opacity: .8; }
html[data-theme="dark"] .input-group-text { background: var(--ix-surface-2); color: var(--ix-muted); border-color: var(--ix-border); }
html[data-theme="dark"] input:-webkit-autofill { -webkit-box-shadow: 0 0 0 40px var(--ix-input-bg) inset !important; -webkit-text-fill-color: var(--ix-text) !important; }

/* Tables */
html[data-theme="dark"] table, html[data-theme="dark"] .table { color: var(--ix-text); }
html[data-theme="dark"] .table th, html[data-theme="dark"] .table td,
html[data-theme="dark"] table th, html[data-theme="dark"] table td { border-color: var(--ix-border) !important; }
html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) { background-color: var(--ix-surface-2); }
html[data-theme="dark"] .table-hover tbody tr:hover { background-color: var(--ix-surface-2); color: var(--ix-text); }

/* Legacy template blocks that still paint white in dark mode */
html[data-theme="dark"] .widget, html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .blog__item, html[data-theme="dark"] .blog-item,
html[data-theme="dark"] .single-blog, html[data-theme="dark"] .service,
html[data-theme="dark"] .bg--white, html[data-theme="dark"] .bg-grey, html[data-theme="dark"] .bg--grey,
html[data-theme="dark"] .bg-gray { background-color: var(--ix-surface) !important; color: var(--ix-text); }
html[data-theme="dark"] .section-padding-xs, html[data-theme="dark"] .section-padding-lg,
html[data-theme="dark"] .section-padding-md { background-color: transparent; }
html[data-theme="dark"] .section-title h2, html[data-theme="dark"] .section-title h3,
html[data-theme="dark"] .service__content h5 a { color: var(--ix-text); }
html[data-theme="dark"] .section-title p, html[data-theme="dark"] .service__content p { color: var(--ix-muted); }

/* 3. Content entered in the admin editor (inline hex/rgb colours from CKEditor) */
html[data-theme="dark"] :is([class*="content"], [class*="__body"], [class*="-body"], article) :is([style*="color:#"], [style*="color: #"], [style*="color:rgb"], [style*="color: rgb"], [style*="color:black"], [style*="color: black"]) { color: inherit !important; }
html[data-theme="dark"] :is([class*="content"], [class*="__body"], [class*="-body"], article) :is([style*="background-color:#"], [style*="background-color: #"], [style*="background:#"], [style*="background: #"], [style*="background-color:rgb"], [style*="background-color: rgb"], [style*="background-color:white"], [style*="background-color: white"]) { background-color: transparent !important; }
html[data-theme="dark"] :is([class*="content"], [class*="__body"], article) font[color] { color: inherit !important; }

/* 4. Theme switch ------------------------------------------------------- */
.ix-theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; flex: none;
  width: 40px; height: 40px; padding: 0; margin: 0 0 0 10px;
  border-radius: 50%; border: 1px solid rgba(201, 162, 39, .55);
  background: transparent; color: var(--ix-gold); cursor: pointer;
  transition: background-color .2s ease, transform .2s ease;
}
.ix-theme-toggle:hover { background: rgba(201, 162, 39, .14); transform: rotate(-12deg); }
.ix-theme-toggle:focus-visible { outline: 2px solid var(--ix-gold); outline-offset: 2px; }
.ix-theme-toggle svg { width: 19px; height: 19px; }
.ix-theme-toggle .ix-icon-sun { display: none; }
html[data-theme="dark"] .ix-theme-toggle .ix-icon-sun { display: block; }
html[data-theme="dark"] .ix-theme-toggle .ix-icon-moon { display: none; }
@media (prefers-color-scheme: dark) {
  html:not([data-theme]) .ix-theme-toggle .ix-icon-sun { display: block; }
  html:not([data-theme]) .ix-theme-toggle .ix-icon-moon { display: none; }
}
/* Desktop: small switch in the top bar. Phones: next to the menu button. */
@media (min-width: 992px) { .ix-v2 .ix2-topbar-right { display: flex; align-items: center; gap: 12px; } }
.ix-theme-toggle--top { width: 28px; height: 28px; margin: 0; }
.ix-theme-toggle--top svg { width: 15px; height: 15px; }
.ix-theme-toggle--nav { display: none; }
@media (max-width: 991px) {
  .ix-v2 .ix2-nav .ix-theme-toggle--nav { display: inline-flex; width: 38px; height: 38px; margin: 0 10px 0 auto; }
  .ix-v2 .ix2-nav { gap: 8px; }
  .ix-v2 .ix2-nav .ix2-brand { min-width: 0; flex: 0 1 auto; max-width: 165px; }
  .ix-v2 .ix2-nav .ix2-brand img { max-width: 100%; }
  .ix-v2 .ix2-nav .ix2-menu-toggle { flex: none; }
}
@media (prefers-reduced-motion: reduce) {
  html.ix-theme-anim body, html.ix-theme-anim body * { transition: none !important; }
  .ix-theme-toggle:hover { transform: none; }
}

/* Small gold labels on white read better in the deeper gold (light theme only) */
html:not([data-theme="dark"]) :is(.ihc-eyebrow, .ihc-kicker, .investax-contact-kicker, .ix-service-v3__related-link, .ix-home-services .color--theme, #ix-services-title span, .ix-about-v2 .color--theme) { color: var(--ix-gold-strong) !important; }
@media (max-width: 400px) {
  .ix-v2 .ix2-nav .ix2-brand { max-width: 132px; }
  .ix-v2 .ix2-nav .ix-theme-toggle--nav { width: 34px; height: 34px; margin-right: 6px; }
  .ix-v2 .ix2-nav .ix2-menu-toggle { width: 40px; height: 40px; }
}
@media (max-width: 350px) {
  .ix-v2 .ix2-nav .ix2-brand { max-width: 108px; }
  .ix-v2 .ix2-nav { gap: 4px; }
}