/* Divido premium UI layer — divido-website design system */
:root {
  --dv-orange: #FE6E00;
  --dv-orange-primary: #F77000;
  --dv-orange-soft: #F89939;
  --dv-orange-pale: #FFCFAA;
  --dv-orange-glow: rgba(254, 110, 0, 0.35);
  --dv-cream: #ffffff;
  --dv-cream-warm: #ffffff;
  --dv-surface: #FFF5EE;
  --dv-plum: #230F2B;
  --dv-plum-deep: #1F1722;
  --dv-ink: #2B1A2F;
  --dv-muted: rgba(35, 15, 43, 0.65);
  --dv-gold: #C79645;
  --dv-hairline: rgba(254, 110, 0, 0.15);
  --dv-shadow: none !important;
  --dv-shadow-soft: none !important;
  --dv-ease: cubic-bezier(.16, 1, .3, 1);
  --dv-radius-card: 28px;
  --dv-radius-pill: 30px;
  --dv-font: "PPNeueMontreal", "Tajawal", -apple-system, sans-serif;
}

*,
*::before,
*::after {
  box-shadow: none !important;
  text-shadow: none !important;
}

html,
body,
body.divido-premium,
.screen,
.view,
.auth-body,
#screen-auth,
#screen-app,
#view-home,
#view-wallet,
#view-investments,
#view-rewards,
#view-profile,
#view-subpage {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

body.divido-premium::before {
  display: none !important;
}

/* ---------- Dedicated Solid Loading Screen (No Bleed-Through) ---------- */
.divido-app-loader,
body.divido-premium .divido-app-loader,
body.divido-premium.modern-orange .divido-app-loader {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 20px !important;
  background: linear-gradient(135deg, #1F1722 0%, #230F2B 100%) !important;
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
  transition: opacity 0.5s cubic-bezier(0.16, 1, 0.3, 1), transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.5s ease !important;
}

.divido-app-loader.is-done,
body.divido-premium .divido-app-loader.is-done {
  opacity: 0 !important;
  transform: scale(1.04) !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.divido-loader-lockup {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.divido-loader-logo {
  width: 130px !important;
  height: auto !important;
  object-fit: contain !important;
  filter: brightness(0) invert(1) !important;
}

.divido-loader-copy {
  margin: 0 !important;
  color: #2C1E18 !important;
  font-size: 15px !important;
  letter-spacing: .02em !important;
  font-weight: 600 !important;
}

.divido-loader-line {
  width: 150px !important;
  height: 4px !important;
  overflow: hidden !important;
  border-radius: 99px !important;
  background: rgba(255, 106, 0, 0.18) !important;
}

.divido-loader-line span {
  display: block !important;
  width: 45% !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, var(--dv-gold), var(--dv-orange)) !important;
  animation: dvLoaderLine 1.2s ease-in-out infinite !important;
}

@keyframes dvLoaderLine {
  0% {
    transform: translateX(-140%);
  }

  100% {
    transform: translateX(340%);
  }
}

.divido-transition-veil {
  position: fixed;
  inset: 0;
  z-index: 80;
  pointer-events: none;
  opacity: 0;
  transition: opacity .24s ease;
  background: radial-gradient(circle at 50% 40%, rgba(254, 110, 0, .08), transparent 42%), rgba(251, 246, 239, .2);
}

body.divido-premium.ui-transitioning .divido-transition-veil {
  opacity: 1;
}

.divido-network-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  z-index: 120;
  pointer-events: none;
  transform: scaleX(0);
  transform-origin: left;
  background: linear-gradient(90deg, var(--dv-orange), var(--dv-gold), var(--dv-orange-primary));
  opacity: 0;
  transition: transform .4s var(--dv-ease), opacity .2s ease;
}

body.divido-premium.is-fetching .divido-network-progress {
  opacity: 1;
  transform: scaleX(.78);
  animation: dvNetworkProgress 1.8s ease-in-out infinite;
}

@keyframes dvNetworkProgress {

  0%,
  100% {
    transform: scaleX(.16);
  }

  50% {
    transform: scaleX(.92);
  }
}

/* ---------- premium app shell ---------- */
body.divido-premium .app-header {
  background: rgba(251, 246, 239, .90);
  border-bottom: 1px solid rgba(35, 15, 43, .06);
  box-shadow: 0 4px 20px rgba(35, 15, 43, .03);
  padding: 12px 24px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.divido-premium .app-header .logo-img {
  height: 42px !important;
  width: auto !important;
}

body.divido-premium .hdr-icons {
  gap: 12px;
}

body.divido-premium .hdr-icons>* {
  border: none !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
  width: 38px !important;
  height: 38px !important;
}

body.divido-premium .hdr-icons>*:hover {
  background: rgba(35, 15, 43, 0.05) !important;
}

body.divido-premium .hdr-icons .icon-img {
  width: 22px !important;
  height: 22px !important;
}

body.divido-premium .view,
body.divido-premium .auth-body,
body.divido-premium .auth-splash,
.view,
.auth-body {
  padding-left: 120px !important;
  padding-right: 120px !important;
  padding-bottom: 110px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

@media (max-width: 768px) {

  body.divido-premium .view,
  body.divido-premium .auth-body,
  body.divido-premium .auth-splash,
  .view,
  .auth-body {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

body.divido-premium .view:not(.hidden) {
  animation: dvViewIn .45s var(--dv-ease) both;
}

@keyframes dvViewIn {
  from {
    opacity: 0;
    transform: translateY(10px) scale(.995);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

body.divido-premium .sec-title {
  color: var(--dv-plum);
  letter-spacing: -.01em;
}

body.divido-premium .home-greet {
  padding-top: 8px;
}

body.divido-premium .hg-hi {
  color: var(--dv-orange);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
}

body.divido-premium .hg-name {
  color: var(--dv-plum);
  font-size: 23px;
  letter-spacing: -.02em;
}

/* ---------- bento cards & net worth hero ---------- */
body.divido-premium .prop-card,
body.divido-premium .fund-card,
body.divido-premium .inv-card,
body.divido-premium .card-plain,
body.divido-premium .menu-list,
body.divido-premium .media-card,
body.divido-premium .modal-card,
body.divido-premium .modal-sheet,
body.divido-premium .d-card {
  background: #FFF5EE !important;
  border: 1px solid rgba(254, 110, 0, 0.15) !important;
  box-shadow: 0 8px 24px rgba(35, 15, 43, 0.04);
}

body.divido-premium .prop-card,
body.divido-premium .fund-card {
  border-radius: 28px;
}

body.divido-premium .prop-card:hover,
body.divido-premium .fund-card:hover,
body.divido-premium .inv-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(35, 15, 43, 0.09);
}

body.divido-premium .prop-card,
body.divido-premium .fund-card,
body.divido-premium .inv-card {
  transition: transform .3s var(--dv-ease), box-shadow .3s ease, border-color .3s ease;
}

body.divido-premium .prop-card:active,
body.divido-premium .fund-card:active {
  transform: scale(.99);
}

body.divido-premium .prop-img {
  height: 185px;
}

body.divido-premium .prop-body {
  padding: 18px 18px 18px;
}

body.divido-premium .prop-body h3 {
  color: var(--dv-plum);
  letter-spacing: -.01em;
  font-weight: 800;
}

body.divido-premium .prop-price {
  color: var(--dv-orange);
  font-weight: 800;
}

body.divido-premium .bar-fill {
  background: linear-gradient(90deg, var(--dv-orange-soft), var(--dv-orange));
}

body.divido-premium .banner-card {
  border: 1px solid rgba(254, 110, 0, .16);
  background: linear-gradient(135deg, #FFF7ED, #F4ECE1);
  box-shadow: 0 8px 24px rgba(254, 110, 0, .06);
  border-radius: 28px;
}

body.divido-premium .nw-card,
body.divido-premium .wallet-hero,
body.divido-premium .rewards-hero,
body.divido-premium .inv-hero {
  background: linear-gradient(135deg, var(--dv-plum) 0%, var(--dv-plum-deep) 100%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 28px;
  box-shadow: 0 14px 32px rgba(35, 15, 43, .22);
}

body.divido-premium .nw-card::after,
body.divido-premium .wallet-hero::after,
body.divido-premium .rewards-hero::after,
body.divido-premium .inv-hero::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -58px;
  top: -72px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 0 0 18px rgba(255, 255, 255, .03), 0 0 0 36px rgba(255, 255, 255, .018);
}

body.divido-premium .nw-label,
body.divido-premium .w-label {
  color: rgba(255, 255, 255, .72);
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 700;
}

body.divido-premium .nw-val,
body.divido-premium .w-balance {
  letter-spacing: -.03em;
  font-weight: 800;
}

/* ---------- controls ---------- */
body.divido-premium .btn.primary {
  background: linear-gradient(135deg, var(--dv-orange), var(--dv-orange-soft));
  box-shadow: 0 10px 22px rgba(254, 110, 0, .21);
}

body.divido-premium .btn.primary:hover {
  box-shadow: 0 13px 28px rgba(254, 110, 0, .30);
  transform: translateY(-1px);
}

body.divido-premium .btn.gray,
body.divido-premium .btn.ghost {
  background: #FFF5EE !important;
  color: var(--dv-plum);
  border: 1px solid rgba(254, 110, 0, 0.18) !important;
}

body.divido-premium .chip.on {
  color: var(--dv-crimson);
  border-color: var(--dv-orange);
}

body.divido-premium .seg {
  padding: 4px;
  border: 1px solid rgba(254, 110, 0, 0.15);
  background: #FFF5EE !important;
  border-radius: 16px;
}

body.divido-premium .seg-btn {
  border-radius: 12px;
}

body.divido-premium .seg-btn.on {
  background: var(--dv-crimson-deep);
  color: #fffaf2;
  box-shadow: 0 5px 15px rgba(35, 15, 43, .16);
}

body.divido-premium .input {
  background: #FFF5EE !important;
  border: 1.5px solid rgba(254, 110, 0, .18);
}

body.divido-premium .input:focus {
  border-color: var(--dv-orange);
  box-shadow: 0 0 0 4px rgba(254, 110, 0, .10);
}

/* ---------- navigation: compact, calm, unmistakably branded ---------- */
body.divido-premium .tabbar {
  left: 12px;
  right: 12px;
  bottom: max(10px, env(safe-area-inset-bottom));
  border-radius: 22px;
  padding: 5px 5px 5px;
  backdrop-filter: blur(22px) saturate(1.12);
  -webkit-backdrop-filter: blur(22px) saturate(1.12);
}

body.divido-premium .tabbar-btn {
  position: relative;
  min-height: 53px;
  border-radius: 16px;
  color: var(--dv-muted);
  font-size: 10px;
  font-weight: 700;
}

body.divido-premium .tabbar-btn::before {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 14px;
  background: transparent;
  z-index: -1;
  transition: background .25s ease, transform .25s var(--dv-ease);
}

body.divido-premium .tabbar-btn.on {
  color: var(--dv-crimson);
}

body.divido-premium .tabbar-btn.on::before {
  background: linear-gradient(135deg, rgba(254, 110, 0, .14), rgba(123, 31, 44, .07));
  transform: scale(1);
}

body.divido-premium .tabbar-btn img {
  width: 21px;
  height: 21px;
  margin-bottom: 4px;
  transition: transform .3s var(--dv-ease), filter .3s ease;
}

body.divido-premium .tabbar-btn.on img {
  transform: translateY(-2px) scale(1.05);
  filter: drop-shadow(0 4px 5px rgba(254, 110, 0, .20));
}

body.divido-premium .tabbar-btn span {
  position: relative;
  z-index: 1;
  letter-spacing: .01em;
}

/* Profile menu becomes grouped without removing any feature. Labels are injected by premium.js. */
body.divido-premium .menu-list {
  overflow: hidden;
  border-radius: 22px;
}

body.divido-premium .premium-menu-label {
  padding: 14px 16px 7px;
  color: var(--dv-orange);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .14em;
  background: rgba(254, 110, 0, .035);
}

body.divido-premium .menu-list button {
  min-height: 55px;
  border-bottom-color: rgba(35, 15, 43, .07);
}

body.divido-premium .menu-list button:hover {
  background: rgba(254, 110, 0, .055);
  padding-inline-start: 19px;
}

/* ---------- modal and support transitions ---------- */
body.divido-premium #modal {
  background: rgba(35, 15, 43, .42);
  backdrop-filter: blur(15px) saturate(1.2);
  -webkit-backdrop-filter: blur(15px) saturate(1.2);
}

body.divido-premium #modal:not(.hidden) .modal-card {
  animation: dvSheetIn .52s var(--dv-ease) both;
}

body.divido-premium .modal-card {
  border: 1px solid rgba(255, 255, 255, .38);
  box-shadow: 0 -18px 60px rgba(35, 15, 43, .28);
}

@keyframes dvSheetIn {
  from {
    opacity: 0;
    transform: translateY(70px) scale(.98);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

body.divido-premium .toast {
  background: var(--dv-crimson-deep) !important;
  border: 1px solid rgba(255, 255, 255, .16);
  box-shadow: 0 14px 30px rgba(35, 15, 43, .23);
}

/* ---------- loading skeletons and dynamic content entrance ---------- */
body.divido-premium .skel-card,
body.divido-premium .skel-tx,
body.divido-premium .sk-stat {
  background: linear-gradient(105deg, rgba(123, 31, 44, .07) 25%, rgba(254, 110, 0, .15) 37%, rgba(123, 31, 44, .07) 63%);
  background-size: 300% 100%;
  animation: dvShimmer 1.45s ease-in-out infinite;
  border: 1px solid rgba(123, 31, 44, .08);
}

@keyframes dvShimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

body.divido-premium .premium-enter {
  animation: dvCardIn .55s var(--dv-ease) both;
}

@keyframes dvCardIn {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

body.divido-premium .premium-enter:nth-child(2) {
  animation-delay: .035s;
}

body.divido-premium .premium-enter:nth-child(3) {
  animation-delay: .07s;
}

body.divido-premium .premium-enter:nth-child(4) {
  animation-delay: .105s;
}

body.divido-premium .premium-enter:nth-child(5) {
  animation-delay: .14s;
}

/* ---------- responsive refinement ---------- */
@media (min-width: 720px) {
  body.divido-premium .screen-app {
    background: radial-gradient(circle at 50% 0, rgba(254, 110, 0, .07), transparent 32rem), var(--dv-cream);
  }

  body.divido-premium .view {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 120px !important;
    padding-right: 120px !important;
    margin: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {

  body.divido-premium *,
  body.divido-premium *::before,
  body.divido-premium *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Dark mode keeps the same premium hierarchy. */
body.divido-premium.dark {
  --dv-cream: #181116;
  --dv-surface: #21171b;
  --dv-ink: #fff8ef;
  --dv-muted: #c5b6ae;
  --dv-hairline: rgba(255, 248, 239, .12);
}

body.divido-premium.dark .app-header,
body.divido-premium.dark .tabbar {
  background: rgba(24, 17, 22, .88);
  border-color: rgba(255, 248, 239, .13);
}

body.divido-premium.dark .prop-card,
body.divido-premium.dark .fund-card,
body.divido-premium.dark .inv-card,
body.divido-premium.dark .card-plain,
body.divido-premium.dark .menu-list,
body.divido-premium.dark .media-card {
  background: rgba(33, 23, 27, .96);
  border-color: rgba(255, 248, 239, .11);
}

body.divido-premium.dark .sec-title,
body.divido-premium.dark .hg-name,
body.divido-premium.dark .prop-body h3 {
  color: #fff8ef;
}

body.divido-premium.dark .premium-menu-label {
  background: rgba(254, 110, 0, .08);
}

/* Apple-cleanup pass: light heroes, focused detail screens, calmer actions. */
body.divido-premium .hero-white .w-label,
body.divido-premium .hero-white .w-sub,
body.divido-premium .hero-white .tier-progress>span,
body.divido-premium .inv-hero .w-label,
body.divido-premium .inv-hero .w-sub,
body.divido-premium .rewards-hero .w-label,
body.divido-premium .rewards-hero .w-sub {
  color: var(--dv-muted) !important;
}

body.divido-premium .hero-white .w-balance,
body.divido-premium .inv-hero .w-balance,
body.divido-premium .rewards-hero .w-balance {
  color: var(--dv-crimson) !important;
  -webkit-text-fill-color: var(--dv-crimson) !important;
  background: none !important;
}

body.divido-premium .hero-white .w-act {
  color: var(--dv-ink) !important;
  background: rgba(255, 253, 249, .92) !important;
  border-color: rgba(123, 31, 44, .16) !important;
}

body.divido-premium .hero-white .w-act span {
  color: var(--dv-orange) !important;
}

body.divido-premium .btn.primary,
body.divido-premium .btn.whatsapp {
  background: linear-gradient(135deg, var(--dv-orange), var(--dv-orange-soft)) !important;
  box-shadow: 0 10px 22px rgba(254, 110, 0, .22) !important;
}

body.divido-premium .m-icon,
body.divido-premium .p-badge.b-fund,
body.divido-premium .p-badge.b-new {
  background: linear-gradient(135deg, var(--dv-crimson), var(--dv-orange)) !important;
}

body.divido-premium[data-active-view="detail"] .tabbar,
body.divido-premium[data-active-view="subpage"] .tabbar {
  opacity: 0;
  transform: translateY(130%);
  pointer-events: none;
}

body.divido-premium .d-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 11px 0 4px;
}

body.divido-premium .d-specs .spec {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 9px;
  border-radius: 10px;
  background: rgba(123, 31, 44, .055);
  color: var(--dv-muted);
  font-size: 11px;
}

body.divido-premium .d-specs .ic-sm {
  width: 14px;
  height: 14px;
}

body.divido-premium .inv-num {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

@media (max-width: 500px) {
  body.divido-premium .d-head {
    padding: 16px 15px 14px;
  }

  body.divido-premium .d-price-row {
    margin-top: 12px;
  }
}

/* Minimal visibility control icon, replacing platform-dependent emoji glyphs. */
body.divido-premium .nw-eye,
body.divido-premium .eye-btn {
  position: relative;
  font-size: 0 !important;
}

body.divido-premium .nw-eye::before,
body.divido-premium .eye-btn::before {
  content: "";
  width: 15px;
  height: 9px;
  border: 1.5px solid currentColor;
  border-radius: 85% 15%;
  transform: rotate(-8deg);
  opacity: .82;
}

body.divido-premium .nw-eye::after,
body.divido-premium .eye-btn::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: currentColor;
  opacity: .82;
}

body.divido-premium .w-act .action-ic {
  width: 16px;
  height: 16px;
  object-fit: contain;
  margin-bottom: 3px;
}

body.divido-premium .hero-white .w-act .action-ic {
  filter: saturate(1.1);
}


/* ============================================================
   PIXEL FUTURISTIC × APPLE 2026 — brand-locked (Atlantis)
   Additive layer. Orange logo stays. Crimson + cream system.
   ============================================================ */

:root {
  --px: 4px;
  --dv-spring: cubic-bezier(.34, 1.56, .64, 1);
  --dv-ease-out: cubic-bezier(.16, 1, .3, 1);
  --dv-glow-orange: 0 0 0 1px rgba(254, 110, 0, .35), 0 8px 28px rgba(254, 110, 0, .28);
  --dv-glow-crimson: 0 0 24px rgba(255, 106, 0, .35);
}

/* denser pixel atmosphere (subtle) */
body.divido-premium.px-futuristic::before {
  opacity: .28;
  background-image:
    linear-gradient(rgba(35, 15, 43, .03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(35, 15, 43, .03) 1px, transparent 1px),
    radial-gradient(rgba(35, 15, 43, .07) .6px, transparent .6px);
  background-size: 24px 24px, 24px 24px, 10px 10px;
}

/* ----- Apple large-title money ----- */
body.divido-premium.px-futuristic .nw-val,
body.divido-premium.px-futuristic .w-balance {
  font-feature-settings: "tnum" 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.04em;
  line-height: 1.05;
}

body.divido-premium.px-futuristic .hg-name {
  font-size: clamp(22px, 5.2vw, 28px);
  font-weight: 800;
}

/* ----- Sales strip (home) ----- */
body.divido-premium .dv-sales-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 2px 12px;
  margin: 2px 0 6px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

body.divido-premium .dv-sales-strip::-webkit-scrollbar {
  display: none;
}

body.divido-premium .dv-sales-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--dv-crimson-deep);
  background: rgba(255, 253, 249, .9);
  border: 1px solid var(--dv-hairline);
  box-shadow: 0 4px 14px rgba(35, 15, 43, .05);
  white-space: nowrap;
}

body.divido-premium .dv-sales-chip b {
  color: var(--dv-orange);
  font-weight: 800;
}

body.divido-premium .dv-sales-chip.hot {
  color: #fff;
  background: linear-gradient(135deg, var(--dv-crimson), #FF8F3D);
  border-color: transparent;
  box-shadow: var(--dv-glow-crimson);
}

body.divido-premium .dv-sales-chip .px-dot {
  width: 6px;
  height: 6px;
  image-rendering: pixelated;
  background: currentColor;
  box-shadow: 2px 0 0 currentColor, 0 2px 0 currentColor, 2px 2px 0 currentColor;
  opacity: .85;
}

/* ----- Pixel corner brackets on cards ----- */
body.divido-premium.px-futuristic .prop-card,
body.divido-premium.px-futuristic .fund-card,
body.divido-premium.px-futuristic .inv-card {
  position: relative;
  isolation: isolate;
}

body.divido-premium.px-futuristic .prop-card::before,
body.divido-premium.px-futuristic .fund-card::before {
  content: "";
  position: absolute;
  inset: 8px;
  pointer-events: none;
  z-index: 3;
  border-radius: 2px;
  opacity: .55;
  background:
    linear-gradient(var(--dv-orange), var(--dv-orange)) top left / 10px 2px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) top left / 2px 10px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) top right / 10px 2px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) top right / 2px 10px no-repeat,
    linear-gradient(var(--dv-crimson), var(--dv-crimson)) bottom left / 10px 2px no-repeat,
    linear-gradient(var(--dv-crimson), var(--dv-crimson)) bottom left / 2px 10px no-repeat,
    linear-gradient(var(--dv-crimson), var(--dv-crimson)) bottom right / 10px 2px no-repeat,
    linear-gradient(var(--dv-crimson), var(--dv-crimson)) bottom right / 2px 10px no-repeat;
  transition: opacity .35s ease;
}

body.divido-premium.px-futuristic .prop-card:hover::before,
body.divido-premium.px-futuristic .fund-card:hover::before {
  opacity: .95;
}

/* funding bar pixel ticks */
body.divido-premium.px-futuristic .bar {
  position: relative;
  height: 7px;
  border-radius: 2px;
  overflow: hidden;
  background: rgba(35, 15, 43, .08);
  image-rendering: pixelated;
}

body.divido-premium.px-futuristic .bar::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(90deg,
      transparent 0,
      transparent 7px,
      rgba(255, 253, 249, .55) 7px,
      rgba(255, 253, 249, .55) 8px);
  pointer-events: none;
  mix-blend-mode: soft-light;
}

body.divido-premium.px-futuristic .bar-fill {
  height: 100%;
  border-radius: 2px;
  transition: width 1.1s var(--dv-ease-out);
  background: linear-gradient(90deg, var(--dv-crimson) 0%, var(--dv-orange) 70%, #ffc27a 100%);
  box-shadow: 0 0 12px rgba(254, 110, 0, .45);
}

/* urgency pulse */
body.divido-premium.px-futuristic .tag.urg,
body.divido-premium.px-futuristic .p-badge.b-urg {
  animation: dvUrgPulse 1.8s ease-in-out infinite;
  color: #fff !important;
  background: linear-gradient(135deg, #FF6A00, #fe6e00) !important;
  border: 0 !important;
  font-weight: 800;
}

@keyframes dvUrgPulse {

  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(255, 106, 0, .45);
    transform: scale(1);
  }

  50% {
    box-shadow: 0 0 0 6px rgba(255, 106, 0, 0);
    transform: scale(1.03);
  }
}

/* NEW badge pixel blink */
body.divido-premium.px-futuristic .p-badge.b-new {
  animation: dvPixelBlink 2.4s steps(2, end) infinite;
}

@keyframes dvPixelBlink {

  0%,
  100% {
    filter: brightness(1);
  }

  50% {
    filter: brightness(1.15) saturate(1.2);
  }
}

/* ----- Primary CTA shimmer (sales) ----- */
body.divido-premium.px-futuristic .btn.primary,
body.divido-premium.px-futuristic .inv-now,
body.divido-premium.px-futuristic #start-invest {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: transform .25s var(--dv-spring), box-shadow .3s ease, filter .2s ease;
}

body.divido-premium.px-futuristic .btn.primary::after,
body.divido-premium.px-futuristic .inv-now::after,
body.divido-premium.px-futuristic #start-invest::after {
  content: "";
  position: absolute;
  inset: -20% -40%;
  background: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, .38) 50%, transparent 60%);
  transform: translateX(-60%) rotate(8deg);
  animation: dvShimmerSweep 2.8s ease-in-out infinite;
  pointer-events: none;
}

@keyframes dvShimmerSweep {

  0%,
  55% {
    transform: translateX(-70%) rotate(8deg);
    opacity: 0;
  }

  60% {
    opacity: 1;
  }

  85% {
    transform: translateX(70%) rotate(8deg);
    opacity: .9;
  }

  100% {
    opacity: 0;
  }
}

body.divido-premium.px-futuristic .btn.primary:active,
body.divido-premium.px-futuristic .inv-now:active,
body.divido-premium.px-futuristic .tabbar-btn:active,
body.divido-premium.px-futuristic .pchip:active,
body.divido-premium.px-futuristic .w-act:active {
  transform: scale(.96);
  transition-timing-function: var(--dv-spring);
}

body.divido-premium.px-futuristic .btn.primary.is-press,
body.divido-premium.px-futuristic .inv-now.is-press {
  transform: scale(.95);
  filter: brightness(1.05);
  box-shadow: var(--dv-glow-orange) !important;
}

/* min-invest caption under card CTA */
body.divido-premium .inv-meta {
  display: block;
  margin-top: 6px;
  text-align: center;
  font-size: 10.5px;
  font-weight: 600;
  color: var(--dv-muted);
  letter-spacing: .04em;
}

body.divido-premium .inv-meta b {
  color: var(--dv-crimson);
  font-weight: 800;
}

/* ----- Tabbar pixel underglow ----- */
body.divido-premium.px-futuristic .tabbar-btn.on::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 5px;
  width: 18px;
  height: 3px;
  transform: translateX(-50%);
  background:
    linear-gradient(90deg, var(--dv-orange), var(--dv-crimson));
  box-shadow: 0 0 10px rgba(254, 110, 0, .7);
  image-rendering: pixelated;
  border-radius: 1px;
}

/* ----- Sticky detail CTA glass ----- */
body.divido-premium.px-futuristic .d-bottom {
  backdrop-filter: blur(18px) saturate(1.15);
  -webkit-backdrop-filter: blur(18px) saturate(1.15);
  background: rgba(251, 246, 239, .88) !important;
  border-top: 1px solid rgba(35, 15, 43, .1);
  box-shadow: 0 -12px 40px rgba(35, 15, 43, .1);
  padding-bottom: max(12px, env(safe-area-inset-bottom));
}

body.divido-premium.px-futuristic .d-bottom .d-cta-sub {
  font-size: 11px;
  color: var(--dv-muted);
  margin: 0 0 8px;
  text-align: center;
  font-weight: 600;
}

body.divido-premium.px-futuristic .d-bottom .d-cta-sub b {
  color: var(--dv-crimson);
}

/* ----- Modal spring + pixel handle ----- */
body.divido-premium.px-futuristic #modal:not(.hidden) .modal-card {
  animation: dvSheetSpring .58s var(--dv-spring) both;
}

@keyframes dvSheetSpring {
  0% {
    opacity: 0;
    transform: translateY(88px) scale(.96);
  }

  70% {
    opacity: 1;
    transform: translateY(-6px) scale(1.01);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

body.divido-premium.px-futuristic .modal-card::before {
  content: "";
  display: block;
  width: 42px;
  height: 4px;
  margin: 0 auto 12px;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--dv-orange), var(--dv-crimson));
  box-shadow: 0 0 8px rgba(254, 110, 0, .4);
}

/* pay chips */
body.divido-premium.px-futuristic .pchip {
  transition: transform .2s var(--dv-spring), background .2s ease, box-shadow .2s ease;
  border: 1px solid var(--dv-hairline);
}

body.divido-premium.px-futuristic .pchip.on {
  background: linear-gradient(135deg, rgba(254, 110, 0, .16), rgba(255, 106, 0, .1));
  border-color: rgba(254, 110, 0, .45);
  box-shadow: 0 0 0 1px rgba(254, 110, 0, .2), 0 6px 16px rgba(254, 110, 0, .12);
  color: var(--dv-crimson-deep);
  font-weight: 800;
}

/* ----- Toast spring ----- */
body.divido-premium.px-futuristic #toast:not(.hidden) {
  animation: dvToastIn .45s var(--dv-spring) both;
}

@keyframes dvToastIn {
  from {
    opacity: 0;
    transform: translate(-50%, 16px) scale(.92);
  }

  to {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
  }
}

/* ----- Receipt / success ----- */
body.divido-premium.px-futuristic .receipt {
  text-align: center;
  animation: dvCardIn .5s var(--dv-ease-out) both;
}

body.divido-premium.px-futuristic .receipt .rc-check {
  width: 56px;
  height: 56px;
  margin: 0 auto 10px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  font-size: 28px;
  color: #fff;
  background: linear-gradient(135deg, var(--dv-orange), var(--dv-crimson));
  box-shadow: var(--dv-glow-orange);
  animation: dvSuccessPop .55s var(--dv-spring) both;
}

@keyframes dvSuccessPop {
  0% {
    transform: scale(.4) rotate(-12deg);
    opacity: 0;
  }

  70% {
    transform: scale(1.12) rotate(4deg);
  }

  100% {
    transform: scale(1) rotate(0);
    opacity: 1;
  }
}

/* confetti canvas */
#dv-confetti {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2000;
}

/* ripple */
.dv-ripple {
  position: absolute;
  border-radius: 50%;
  transform: scale(0);
  animation: dvRipple .55s ease-out forwards;
  background: rgba(255, 255, 255, .45);
  pointer-events: none;
}

@keyframes dvRipple {
  to {
    transform: scale(2.6);
    opacity: 0;
  }
}

/* list stagger refinement */
body.divido-premium.px-futuristic .premium-enter {
  animation: dvPixelEnter .6s var(--dv-ease-out) both;
}

@keyframes dvPixelEnter {
  from {
    opacity: 0;
    transform: translateY(16px) scale(.98);
    filter: blur(3px);
  }

  to {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

/* empty state CTA */
body.divido-premium .empty-note {
  text-align: center;
  padding: 28px 16px;
  border: 1px dashed rgba(35, 15, 43, .14);
  border-radius: 18px;
  background: rgba(255, 253, 249, .7);
}

body.divido-premium .empty-note .btn {
  margin-top: 12px;
}

/* auth polish */
body.divido-premium.px-futuristic #screen-auth .onb-title {
  letter-spacing: -.03em;
  line-height: 1.15;
}

body.divido-premium.px-futuristic #screen-auth .btn.primary {
  box-shadow: var(--dv-glow-orange);
}

/* dark heroes scanline */
body.divido-premium.px-futuristic .nw-card::before,
body.divido-premium.px-futuristic .wallet-hero:not(.hero-white)::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .12;
  background: repeating-linear-gradient(0deg,
      transparent,
      transparent 2px,
      rgba(0, 0, 0, .25) 2px,
      rgba(0, 0, 0, .25) 3px);
  mix-blend-mode: soft-light;
  border-radius: inherit;
}

/* reduced motion hard cut for new animations */
@media (prefers-reduced-motion: reduce) {

  body.divido-premium.px-futuristic .btn.primary::after,
  body.divido-premium.px-futuristic .inv-now::after,
  body.divido-premium.px-futuristic .tag.urg,
  body.divido-premium.px-futuristic .p-badge.b-new {
    animation: none !important;
  }

  body.divido-premium.px-futuristic .prop-card::before {
    opacity: .35;
  }
}


/* ============================================================
   ENHANCEMENT PASS 2 — sales detail CTA, yield teasers, wallet
   ============================================================ */

body.divido-premium .yield-teaser {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 8px 0 10px;
  padding: 9px 11px;
  border-radius: 12px;
  font-size: 11.5px;
  font-weight: 600;
  color: var(--dv-crimson-deep);
  background: linear-gradient(135deg, rgba(254, 110, 0, .10), rgba(255, 106, 0, .06));
  border: 1px solid rgba(254, 110, 0, .18);
}

body.divido-premium .yield-teaser b {
  color: var(--dv-orange);
  font-weight: 800;
}

body.divido-premium .yt-pill {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 6px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff;
  background: linear-gradient(135deg, var(--dv-crimson), var(--dv-orange));
  box-shadow: 0 2px 8px rgba(254, 110, 0, .25);
}

body.divido-premium .social-proof {
  margin: 2px 0 10px;
  font-size: 11px;
  font-weight: 650;
  color: var(--dv-muted);
  letter-spacing: .01em;
}

/* Detail sticky stack */
body.divido-premium .d-bottom {
  padding: 10px 14px 12px !important;
}

body.divido-premium .d-cta-stack {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
}

body.divido-premium .d-cta-chips {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 2px;
  scrollbar-width: none;
}

body.divido-premium .d-cta-chips::-webkit-scrollbar {
  display: none;
}

body.divido-premium .d-amt-chip {
  flex: 1 0 auto;
  min-width: 96px;
  border: 1px solid rgba(254, 110, 0, .28);
  background: rgba(255, 253, 249, .95);
  border-radius: 14px;
  padding: 8px 10px;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  transition: transform .2s var(--dv-spring, cubic-bezier(.34, 1.56, .64, 1)), box-shadow .2s ease, border-color .2s ease;
}

body.divido-premium .d-amt-chip b {
  display: block;
  font-size: 12px;
  font-weight: 800;
  color: var(--dv-crimson-deep);
  letter-spacing: -.02em;
}

body.divido-premium .d-amt-chip span {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  font-weight: 700;
  color: var(--dv-orange);
}

body.divido-premium .d-amt-chip:active {
  transform: scale(.96);
}

body.divido-premium .d-amt-chip:hover {
  border-color: var(--dv-orange);
  box-shadow: 0 6px 16px rgba(254, 110, 0, .16);
}

body.divido-premium .d-cta-earn {
  margin: 0;
  text-align: center;
  font-size: 12px;
  font-weight: 650;
  color: var(--dv-crimson-deep);
  letter-spacing: -.01em;
}

body.divido-premium .d-cta-earn b {
  color: var(--dv-orange);
  font-weight: 800;
}

body.divido-premium .d-cta-sub {
  margin: 0 0 2px !important;
  text-align: center;
  font-size: 11px !important;
  font-weight: 600;
  color: var(--dv-muted) !important;
}

body.divido-premium .d-cta-sub .hot {
  color: #fff;
  background: linear-gradient(135deg, #FF6A00, #fe6e00);
  padding: 1px 7px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 10px;
  animation: dvUrgPulse 1.8s ease-in-out infinite;
}

body.divido-premium .d-cta-sub b {
  color: var(--dv-crimson);
}

/* Wallet / rewards tips + deposit glow */
body.divido-premium .w-sales-tip {
  margin: 12px 0 0;
  padding: 9px 12px;
  border-radius: 12px;
  font-size: 11.5px;
  font-weight: 650;
  color: rgba(255, 248, 239, .92);
  background: rgba(0, 0, 0, .18);
  border: 1px solid rgba(255, 255, 255, .12);
  text-align: center;
}

body.divido-premium .hero-white .w-sales-tip {
  color: var(--dv-crimson-deep);
  background: linear-gradient(135deg, rgba(254, 110, 0, .10), rgba(255, 106, 0, .06));
  border-color: rgba(254, 110, 0, .18);
}

body.divido-premium .w-sales-tip b {
  color: var(--dv-orange);
  font-weight: 800;
}

body.divido-premium .hero-white .w-sales-tip b {
  color: var(--dv-crimson);
}

body.divido-premium .w-act.pay-ready {
  box-shadow: 0 0 0 1px rgba(254, 110, 0, .55), 0 0 18px rgba(254, 110, 0, .35);
  animation: dvPayGlow 2s ease-in-out infinite;
}

body.divido-premium .w-act.cta-hot {
  box-shadow: 0 0 0 1px rgba(255, 106, 0, .4), 0 0 16px rgba(255, 106, 0, .28);
}

@keyframes dvPayGlow {

  0%,
  100% {
    filter: brightness(1);
  }

  50% {
    filter: brightness(1.08);
  }
}

/* Tier bar smooth */
body.divido-premium #r-tier-bar {
  transition: width 1.15s cubic-bezier(.16, 1, .3, 1);
  background: linear-gradient(90deg, var(--dv-crimson), var(--dv-orange), #ffc27a);
  box-shadow: 0 0 10px rgba(254, 110, 0, .4);
}

/* Trust strip under home sales (optional second row injected by JS) */
body.divido-premium .dv-trust-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin: 0 0 12px;
}

body.divido-premium .dv-trust-cell {
  text-align: center;
  padding: 10px 6px;
  border-radius: 14px;
  background: rgba(255, 253, 249, .88);
  border: 1px solid var(--dv-hairline);
  font-size: 10px;
  font-weight: 700;
  color: var(--dv-muted);
  letter-spacing: .02em;
}

body.divido-premium .dv-trust-cell b {
  display: block;
  margin-bottom: 2px;
  font-size: 13px;
  font-weight: 800;
  color: var(--dv-crimson-deep);
  letter-spacing: -.02em;
}

/* Invest holdings polish */
body.divido-premium .inv-card {
  border-radius: 20px;
  overflow: hidden;
}

body.divido-premium .inv-rows div b {
  font-feature-settings: "tnum" 1;
}

body.divido-premium.dark .yield-teaser,
body.divido-premium.dark .d-amt-chip,
body.divido-premium.dark .dv-trust-cell {
  background: rgba(33, 23, 27, .96);
  color: #fff8ef;
  border-color: rgba(255, 248, 239, .12);
}

body.divido-premium.dark .d-amt-chip b,
body.divido-premium.dark .dv-trust-cell b,
body.divido-premium.dark .d-cta-earn {
  color: #fff8ef;
}

@media (prefers-reduced-motion: reduce) {

  body.divido-premium .w-act.pay-ready,
  body.divido-premium .d-cta-sub .hot {
    animation: none !important;
  }
}


/* ============================================================
   i18n RTL — Arabic fully separated (dir=rtl on html)
   ============================================================ */
html[dir="rtl"] body.divido-premium,
body.lang-ar.divido-premium {
  font-family: 'Tajawal', 'Poppins', system-ui, sans-serif;
}

html[dir="rtl"] body.divido-premium .hg-name,
html[dir="rtl"] body.divido-premium .sec-title,
html[dir="rtl"] body.divido-premium .onb-title,
html[dir="rtl"] body.divido-premium .prop-body h3 {
  letter-spacing: 0;
  font-weight: 800;
}

html[dir="rtl"] .app-header,
html[dir="rtl"] .hdr-icons,
html[dir="rtl"] .home-greet,
html[dir="rtl"] .nw-top,
html[dir="rtl"] .nw-row,
html[dir="rtl"] .fund-row,
html[dir="rtl"] .line-price,
html[dir="rtl"] .tx,
html[dir="rtl"] .menu-list button,
html[dir="rtl"] .w-actions,
html[dir="rtl"] .ref-actions,
html[dir="rtl"] .d-cta-chips,
html[dir="rtl"] .dv-sales-strip,
html[dir="rtl"] .pay-chips,
html[dir="rtl"] .chips {
  direction: rtl;
}

html[dir="rtl"] .tabbar-btn span {
  letter-spacing: 0;
}

html[dir="rtl"] .lang-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--dv-hairline, rgba(35, 15, 43, .1));
  background: rgba(255, 253, 249, .8);
  border-radius: 12px;
  padding: 4px 8px;
  cursor: pointer;
  font-family: inherit;
}

html[dir="ltr"] .lang-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--dv-hairline, rgba(35, 15, 43, .1));
  background: rgba(255, 253, 249, .8);
  border-radius: 12px;
  padding: 4px 8px;
  cursor: pointer;
  font-family: inherit;
}

.lang-toggle .lang-code {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  color: var(--dv-crimson, #FF6A00);
}

html[dir="rtl"] .lang-toggle .lang-code {
  letter-spacing: 0;
}

html[dir="rtl"] .save-btn {
  left: 12px;
  right: auto;
}

html[dir="rtl"] .p-badge.b-fund {
  left: 10px;
  right: auto;
}

html[dir="rtl"] .prop-card::before,
html[dir="rtl"] .fund-card::before {
  transform: scaleX(-1);
}

html[dir="rtl"] .btn.primary::after,
html[dir="rtl"] .inv-now::after {
  animation-direction: reverse;
}

html[dir="rtl"] .modal-card {
  text-align: right;
}

html[dir="rtl"] .slide-thumb {
  /* mirror handled by flex if needed */
}

html[dir="rtl"] .tx-right {
  text-align: left;
}

html[dir="rtl"] .menu-list button:hover {
  padding-inline-start: 16px;
  padding-inline-end: 19px;
}

html[dir="rtl"] .premium-menu-label {
  letter-spacing: 0.06em;
}

html[dir="rtl"] .d-amt-chip {
  text-align: right;
}

html[dir="rtl"] .yield-teaser {
  flex-direction: row;
}

html[dir="rtl"] .hdr-lang {
  margin-inline: 0;
}

/* Keep EN and AR content isolated: when AR, hide pure-EN helper crumbs if any */
body.lang-ar .en-only {
  display: none !important;
}

body.lang-en .ar-only {
  display: none !important;
}


/* ============================================================
   MODERN ORANGE 2026 — inspired by premium mobile editorial UI
   Reference cues: atmospheric warmth, bold orange kinetic accent,
   pill CTAs, elevated white cards, soft filters, large type.
   Orange logo stays. Crimson reserved for money/trust.
   ============================================================ */

body.divido-premium.modern-orange {
  --dv-orange: #FF6A00;
  --dv-orange-soft: #FF8F3D;
  --dv-crimson: #FF6A00;
  background:
    radial-gradient(120% 80% at 10% -10%, rgba(255, 140, 60, .22), transparent 52%),
    radial-gradient(90% 60% at 100% 8%, rgba(255, 90, 20, .12), transparent 48%),
    radial-gradient(70% 50% at 50% 100%, rgba(255, 106, 0, .05), transparent 55%),
    linear-gradient(180deg, #FFF6EC 0%, #F7F1E8 42%, #F3EEE6 100%);
  color: var(--dv-ink);
}

/* Soft fog orbs (reference sunset atmosphere) */
body.divido-premium.modern-orange::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  opacity: .55;
  background:
    radial-gradient(circle at 18% 22%, rgba(255, 120, 40, .16), transparent 22rem),
    radial-gradient(circle at 82% 70%, rgba(255, 180, 100, .12), transparent 26rem);
  filter: blur(2px);
}

/* Tone down dense pixel grid so editorial look wins */
body.divido-premium.modern-orange.px-futuristic::before {
  opacity: .10;
  mask-image: linear-gradient(to bottom, black, transparent 70%);
}

/* ----- App chrome ----- */
body.divido-premium.modern-orange .app-header {
  backdrop-filter: blur(22px) saturate(1.2);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
  box-shadow: none !important;
}

body.divido-premium.modern-orange .hdr-icons>*,
body.divido-premium.modern-orange .lang-toggle {
  background: rgba(255, 255, 255, .78) !important;
  border: 1px solid rgba(20, 17, 15, .07) !important;
  border-radius: 14px !important;
  box-shadow: var(--dv-shadow-soft);
}

body.divido-premium.modern-orange .lang-code {
  color: var(--dv-orange) !important;
}

/* ----- Typography ----- */
body.divido-premium.modern-orange .hg-hi {
  color: var(--dv-orange) !important;
  font-size: 11px !important;
  letter-spacing: .16em !important;
}

body.divido-premium.modern-orange .hg-name {
  font-size: clamp(26px, 6vw, 34px) !important;
  font-weight: 800 !important;
  letter-spacing: -.045em !important;
  color: var(--dv-ink) !important;
  line-height: 1.05 !important;
}

body.divido-premium.modern-orange .sec-title {
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: -.03em !important;
  color: var(--dv-ink) !important;
}

body.divido-premium.modern-orange .nw-val,
body.divido-premium.modern-orange .w-balance {
  font-size: clamp(34px, 8vw, 44px) !important;
  font-weight: 800 !important;
  letter-spacing: -.05em !important;
}

/* ----- Net worth / wallet heroes: warm editorial glass ----- */
body.divido-premium.modern-orange .nw-card {
  position: relative;
  overflow: hidden;
  border-radius: 28px !important;
  border: 1px solid rgba(255, 255, 255, .35) !important;
  background:
    linear-gradient(145deg, #1C1210 0%, #2A1814 40%, #4A2010 78%, #FF6A00 140%) !important;
  box-shadow: 0 24px 50px rgba(40, 16, 8, .28) !important;
}

body.divido-premium.modern-orange .nw-card::before {
  content: "";
  position: absolute;
  inset: auto -20% -40% 30%;
  height: 70%;
  background: radial-gradient(ellipse at center, rgba(255, 106, 0, .55), transparent 70%);
  filter: blur(18px);
  pointer-events: none;
}

/* kinetic orange streak like reference blur bar */
body.divido-premium.modern-orange .nw-card::after {
  content: "";
  position: absolute;
  top: 28%;
  left: -10%;
  right: -10%;
  height: 42px;
  background: linear-gradient(90deg, transparent, rgba(255, 106, 0, .85), rgba(255, 180, 80, .55), transparent);
  filter: blur(10px);
  opacity: .55;
  transform: skewY(-6deg);
  pointer-events: none;
  animation: dvOrangeStreak 5.5s ease-in-out infinite;
}

@keyframes dvOrangeStreak {

  0%,
  100% {
    opacity: .35;
    transform: skewY(-6deg) translateX(-6%);
  }

  50% {
    opacity: .7;
    transform: skewY(-6deg) translateX(6%);
  }
}

body.divido-premium.modern-orange .wallet-hero.hero-white,
body.divido-premium.modern-orange .rewards-hero.hero-white,
body.divido-premium.modern-orange .inv-hero {
  border-radius: 28px !important;
  background:
    linear-gradient(165deg, #FFFFFF 0%, #FFF8F1 55%, #FFE8D4 100%) !important;
  border: 1px solid rgba(255, 140, 60, .14) !important;
  box-shadow: 0 18px 40px rgba(255, 106, 0, .08) !important;
}

body.divido-premium.modern-orange .hero-white .w-balance {
  background: linear-gradient(120deg, #FF6A00, #FF6A00) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

/* ----- Cards: elevated white bento ----- */
body.divido-premium.modern-orange .prop-card,
body.divido-premium.modern-orange .fund-card,
body.divido-premium.modern-orange .inv-card,
body.divido-premium.modern-orange .card-plain,
body.divido-premium.modern-orange .menu-list,
body.divido-premium.modern-orange .media-card {
  background: rgba(255, 255, 255, .92) !important;
  border: 1px solid rgba(20, 17, 15, .06) !important;
  border-radius: var(--dv-radius-card) !important;
  box-shadow: var(--dv-shadow-soft) !important;
}

body.divido-premium.modern-orange .prop-card:hover,
body.divido-premium.modern-orange .fund-card:hover {
  transform: translateY(-4px) scale(1.005);
  box-shadow: 0 22px 48px rgba(255, 106, 0, .12), 0 10px 24px rgba(20, 17, 15, .06) !important;
  border-color: rgba(255, 106, 0, .18) !important;
}

body.divido-premium.modern-orange .prop-img,
body.divido-premium.modern-orange .pimg {
  border-radius: 22px 22px 0 0;
}

body.divido-premium.modern-orange .prop-body h3 {
  font-size: 17px !important;
  font-weight: 800 !important;
  letter-spacing: -.03em !important;
  color: var(--dv-ink) !important;
}

body.divido-premium.modern-orange .prop-price {
  font-size: 18px !important;
  font-weight: 800 !important;
  background: linear-gradient(100deg, #FF6A00, #FF6A00);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* Soften pixel brackets into subtle orange edge glow */
body.divido-premium.modern-orange.px-futuristic .prop-card::before,
body.divido-premium.modern-orange.px-futuristic .fund-card::before {
  opacity: .25;
  inset: 6px;
  filter: drop-shadow(0 0 6px rgba(255, 106, 0, .35));
}

/* ----- Primary CTAs: big modern pills ----- */
body.divido-premium.modern-orange .btn.primary,
body.divido-premium.modern-orange .inv-now,
body.divido-premium.modern-orange #start-invest,
body.divido-premium.modern-orange .btn.whatsapp {
  border-radius: var(--dv-radius-pill) !important;
  background: linear-gradient(135deg, #FF6A00 0%, #FF8A2B 48%, #FFB067 120%) !important;
  color: #fff !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  border: 0 !important;
  box-shadow:
    0 14px 28px rgba(255, 106, 0, .30),
    inset 0 1px 0 rgba(255, 255, 255, .35) !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, .08);
}

body.divido-premium.modern-orange .btn.primary:hover,
body.divido-premium.modern-orange .inv-now:hover {
  filter: brightness(1.04) saturate(1.05);
  box-shadow:
    0 18px 36px rgba(255, 106, 0, .38),
    inset 0 1px 0 rgba(255, 255, 255, .4) !important;
}

body.divido-premium.modern-orange .btn.gray {
  border-radius: var(--dv-radius-pill) !important;
  background: #fff !important;
  color: var(--dv-ink) !important;
  border: 1px solid rgba(20, 17, 15, .08) !important;
  box-shadow: var(--dv-shadow-soft) !important;
}

body.divido-premium.modern-orange .btn.ghost {
  border-radius: var(--dv-radius-pill) !important;
}

/* Auth hero CTA style like reference "Explore Wallpaper" */
body.divido-premium.modern-orange #screen-auth .btn.primary.big {
  padding: 16px 22px !important;
  font-size: 16px !important;
  box-shadow: 0 18px 40px rgba(255, 106, 0, .35) !important;
}

body.divido-premium.modern-orange #screen-auth {
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 140, 60, .2), transparent 50%),
    linear-gradient(180deg, #FFF8F0, #F7F1E8);
}

body.divido-premium.modern-orange .onb-title {
  font-size: clamp(28px, 7vw, 36px) !important;
  font-weight: 800 !important;
  letter-spacing: -.04em !important;
  line-height: 1.08 !important;
  color: var(--dv-ink) !important;
}

/* ----- Filter chips: reference-style pills ----- */
body.divido-premium.modern-orange .chip {
  border-radius: var(--dv-radius-pill) !important;
  padding: 8px 14px !important;
  background: transparent;
  border: 0;
  color: var(--dv-muted) !important;
  font-weight: 700 !important;
}

body.divido-premium.modern-orange .chip.on {
  background: #14110F !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 8px 18px rgba(20, 17, 15, .18);
}

body.divido-premium.modern-orange .chips,
body.divido-premium.modern-orange .seg {
  background: rgba(255, 255, 255, .7) !important;
  border: 1px solid rgba(20, 17, 15, .06) !important;
  border-radius: 18px !important;
  padding: 4px !important;
  box-shadow: var(--dv-shadow-soft);
  backdrop-filter: blur(12px);
}

body.divido-premium.modern-orange .seg-btn.on {
  background: #14110F !important;
  color: #fff !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 16px rgba(20, 17, 15, .16) !important;
}

/* Sales chips — warmer orange glass */
body.divido-premium.modern-orange .dv-sales-chip {
  background: rgba(255, 255, 255, .82) !important;
  border: 1px solid rgba(255, 106, 0, .14) !important;
  box-shadow: 0 8px 20px rgba(255, 106, 0, .08) !important;
  color: var(--dv-ink) !important;
}

body.divido-premium.modern-orange .dv-sales-chip b {
  color: var(--dv-orange) !important;
}

body.divido-premium.modern-orange .dv-sales-chip.hot {
  background: linear-gradient(135deg, #FF6A00, #FF8F3D) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 12px 28px rgba(255, 106, 0, .32) !important;
}

body.divido-premium.modern-orange .dv-sales-chip.hot b {
  color: #fff !important;
}

body.divido-premium.modern-orange .dv-trust-cell {
  background: rgba(255, 255, 255, .78) !important;
  border: 1px solid rgba(20, 17, 15, .06) !important;
  border-radius: 18px !important;
  box-shadow: var(--dv-shadow-soft);
}

body.divido-premium.modern-orange .dv-trust-cell b {
  background: linear-gradient(100deg, #FF6A00, #FF6A00);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Yield teaser = soft orange glass panel */
body.divido-premium.modern-orange .yield-teaser {
  background: linear-gradient(135deg, rgba(255, 106, 0, .12), rgba(255, 180, 100, .08)) !important;
  border: 1px solid rgba(255, 106, 0, .18) !important;
  border-radius: 16px !important;
}

body.divido-premium.modern-orange .yt-pill {
  background: linear-gradient(135deg, #FF6A00, #FF8F3D) !important;
  box-shadow: 0 4px 12px rgba(255, 106, 0, .35) !important;
}

/* Progress bars — brighter orange kinetic */
body.divido-premium.modern-orange .bar {
  height: 8px !important;
  border-radius: 99px !important;
  background: rgba(20, 17, 15, .06) !important;
}

body.divido-premium.modern-orange .bar-fill {
  border-radius: 99px !important;
  background: linear-gradient(90deg, #FF4D00, #FF6A00 40%, #FFB067 100%) !important;
  box-shadow: 0 0 16px rgba(255, 106, 0, .5) !important;
}

body.divido-premium.modern-orange.px-futuristic .bar::after {
  opacity: .25;
}

/* Badges */
body.divido-premium.modern-orange .p-badge.b-fund {
  background: linear-gradient(135deg, #FF6A00, #FF8F3D) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  box-shadow: 0 8px 18px rgba(255, 106, 0, .3);
}

body.divido-premium.modern-orange .p-badge.b-urg,
body.divido-premium.modern-orange .tag.urg {
  background: linear-gradient(135deg, #FF6A00, #FF6A00) !important;
}

/* Banner card = editorial orange panel */
body.divido-premium.modern-orange .banner-card {
  position: relative;
  overflow: hidden;
  border-radius: 28px !important;
  border: 0 !important;
  background:
    linear-gradient(125deg, #1A100C 0%, #3D1C10 45%, #FF6A00 130%) !important;
  color: #fff !important;
  box-shadow: 0 22px 44px rgba(255, 106, 0, .22) !important;
}

body.divido-premium.modern-orange .banner-card h3,
body.divido-premium.modern-orange .banner-card p {
  color: #fff !important;
}

body.divido-premium.modern-orange .banner-card .btn.primary {
  background: #fff !important;
  color: #FF6A00 !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .18) !important;
}

body.divido-premium.modern-orange .banner-card::after {
  content: "";
  position: absolute;
  top: 40%;
  left: -20%;
  width: 140%;
  height: 48px;
  background: linear-gradient(90deg, transparent, rgba(255, 140, 40, .75), transparent);
  filter: blur(12px);
  transform: skewY(-8deg);
  pointer-events: none;
  opacity: .65;
}

/* Tabbar: floating black/white modern dock */
body.divido-premium.modern-orange .tabbar {
  background: rgba(255, 252, 248, .88) !important;
  border: 1px solid rgba(20, 17, 15, .07) !important;
  box-shadow: 0 18px 40px rgba(20, 17, 15, .14) !important;
  border-radius: 26px !important;
}

body.divido-premium.modern-orange .tabbar-btn.on {
  color: var(--dv-orange) !important;
}

body.divido-premium.modern-orange .tabbar-btn.on::before {
  background: linear-gradient(135deg, rgba(255, 106, 0, .16), rgba(255, 160, 80, .08)) !important;
}

body.divido-premium.modern-orange .tabbar-btn.on::after {
  background: linear-gradient(90deg, #FF6A00, #FFB067) !important;
  box-shadow: 0 0 12px rgba(255, 106, 0, .75) !important;
  height: 3px !important;
  width: 20px !important;
  border-radius: 99px !important;
}

/* Detail sticky CTA */
body.divido-premium.modern-orange .d-bottom {
  background: rgba(255, 252, 248, .88) !important;
  border-top: 1px solid rgba(255, 106, 0, .1) !important;
  box-shadow: 0 -16px 40px rgba(20, 17, 15, .08) !important;
}

body.divido-premium.modern-orange .d-amt-chip {
  background: #fff !important;
  border: 1px solid rgba(255, 106, 0, .2) !important;
  border-radius: 18px !important;
  box-shadow: var(--dv-shadow-soft);
}

body.divido-premium.modern-orange .d-amt-chip span {
  color: var(--dv-orange) !important;
}

body.divido-premium.modern-orange .d-cta-earn b {
  color: var(--dv-orange) !important;
}

/* Modal sheet */
body.divido-premium.modern-orange .modal-card {
  background: #FFFCFA !important;
  border-radius: 28px 28px 0 0 !important;
  border: 1px solid rgba(255, 255, 255, .6) !important;
}

body.divido-premium.modern-orange .modal-card::before {
  width: 48px !important;
  height: 5px !important;
  border-radius: 99px !important;
  background: linear-gradient(90deg, #FF6A00, #FFB067) !important;
}

body.divido-premium.modern-orange .pchip.on {
  background: linear-gradient(135deg, rgba(255, 106, 0, .16), rgba(255, 160, 80, .1)) !important;
  border-color: rgba(255, 106, 0, .4) !important;
  color: var(--dv-ink) !important;
}

/* Inputs */
body.divido-premium.modern-orange .input {
  border-radius: 16px !important;
  border: 1px solid rgba(20, 17, 15, .08) !important;
  background: #fff !important;
}

body.divido-premium.modern-orange .input:focus {
  border-color: var(--dv-orange) !important;
  box-shadow: 0 0 0 4px rgba(255, 106, 0, .14) !important;
}

/* Toast */
body.divido-premium.modern-orange .toast {
  background: linear-gradient(135deg, #1A100C, #3D1C10) !important;
  border: 1px solid rgba(255, 106, 0, .35) !important;
  border-radius: 18px !important;
}

/* Loader mark */
body.divido-premium.modern-orange .divido-loader-mark {
  background: linear-gradient(135deg, #FF6A00, #FFB067) !important;
  box-shadow: 0 12px 28px rgba(255, 106, 0, .35) !important;
}

body.divido-premium.modern-orange .divido-app-loader {
  background: linear-gradient(180deg, #FFF8F0, #F7F1E8) !important;
  color: #1A100C !important;
}

body.divido-premium.modern-orange .divido-loader-copy {
  color: #2C1E18 !important;
  font-weight: 600 !important;
}

body.divido-premium.modern-orange .divido-loader-line {
  background: rgba(255, 106, 0, 0.18) !important;
}

/* Wallet actions */
body.divido-premium.modern-orange .w-act {
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .9) !important;
  border: 1px solid rgba(255, 106, 0, .12) !important;
}

body.divido-premium.modern-orange .w-act.pay-ready {
  box-shadow: 0 0 0 1px rgba(255, 106, 0, .55), 0 0 22px rgba(255, 106, 0, .35) !important;
}

body.divido-premium.modern-orange .w-sales-tip {
  border-radius: 16px !important;
}

/* Dark mode keeps orange kinetic energy */
body.divido-premium.modern-orange.dark {
  background:
    radial-gradient(100% 70% at 20% 0%, rgba(255, 106, 0, .18), transparent 50%),
    linear-gradient(180deg, #120E0C, #1A1412 60%, #14110F) !important;
}

body.divido-premium.modern-orange.dark .prop-card,
body.divido-premium.modern-orange.dark .fund-card,
body.divido-premium.modern-orange.dark .card-plain,
body.divido-premium.modern-orange.dark .menu-list {
  background: rgba(30, 24, 22, .94) !important;
  border-color: rgba(255, 180, 120, .1) !important;
}

body.divido-premium.modern-orange.dark .chip.on,
body.divido-premium.modern-orange.dark .seg-btn.on {
  background: #FF6A00 !important;
  color: #fff !important;
}

body.divido-premium.modern-orange.dark .hg-name,
body.divido-premium.modern-orange.dark .sec-title,
body.divido-premium.modern-orange.dark .prop-body h3 {
  color: #FFF8F0 !important;
}

body.divido-premium.modern-orange.dark .divido-app-loader,
body.divido-premium.dark .divido-app-loader,
body.dark .divido-app-loader {
  background: linear-gradient(180deg, #120E0C, #1A1412) !important;
  color: #FFFFFF !important;
}

body.divido-premium.modern-orange.dark .divido-loader-copy,
body.divido-premium.dark .divido-loader-copy,
body.dark .divido-loader-copy {
  color: rgba(255, 255, 255, 0.9) !important;
}

body.divido-premium.modern-orange.dark .divido-loader-line,
body.divido-premium.dark .divido-loader-line,
body.dark .divido-loader-line {
  background: rgba(255, 255, 255, 0.15) !important;
}

@media (prefers-reduced-motion: reduce) {

  body.divido-premium.modern-orange .nw-card::after,
  body.divido-premium.modern-orange .banner-card::after {
    animation: none !important;
  }
}


/* ============================================================
   LOGO GUARANTEE + SPLASH + BENTO HOME
   Official orange logo always visible in correct placements.
   ============================================================ */

/* Never hide or invert brand logo */
body.divido-premium .logo-img,
body.divido-premium .splash-logo,
body.divido-premium .divido-loader-logo,
body.divido-premium.dark .logo-img,
body.divido-premium.dark .splash-logo,
body.divido-premium.dark .divido-loader-logo,
body.dark .logo-img,
body.dark .splash-logo,
body.dark .divido-loader-logo {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
  -webkit-filter: none !important;
}

/* Loader: real orange logo */
body.divido-premium .divido-loader-lockup {
  flex-direction: column;
  gap: 14px;
  letter-spacing: 0 !important;
}

body.divido-premium .divido-loader-logo {
  width: min(200px, 58vw) !important;
  height: auto !important;
  max-height: 72px;
  object-fit: contain;
  filter: drop-shadow(0 10px 28px rgba(255, 106, 0, .28)) !important;
}

body.divido-premium .divido-loader-mark {
  display: none !important;
}

/* letter mark retired */

/* App + auth header logo sizes */
body.divido-premium .app-header .logo-img {
  height: 32px !important;
  width: auto !important;
  max-width: 140px;
  object-fit: contain;
}

body.divido-premium .auth-top {
  position: relative;
  z-index: 5;
  padding: 16px 120px !important;
}

body.divido-premium .auth-top .logo-img {
  height: 36px !important;
  width: auto !important;
  max-width: 150px;
  object-fit: contain;
  filter: drop-shadow(0 4px 12px rgba(255, 106, 0, .2)) !important;
}

/* ---------- Full-screen editorial splash (auth) ---------- */
body.divido-premium #screen-auth {
  min-height: 100vh;
  background: #ffffff !important;
}

body.divido-premium #screen-auth .auth-top {
  background: transparent !important;
}


/* Hide old dots on splash */
body.divido-premium .auth-splash .dots {
  display: none !important;
}

body.divido-premium .auth-splash .illus-img {
  display: none !important;
}

/* ---------- Bento home ---------- */
body.divido-premium .prop-featured {
  margin: 0 0 14px;
}

body.divido-premium .prop-featured[hidden] {
  display: none !important;
}

body.divido-premium .prop-card--featured {
  display: grid;
  grid-template-columns: 1fr;
  overflow: hidden;
  border-radius: 28px !important;
  box-shadow: 0 22px 48px rgba(255, 106, 0, .14), 0 10px 24px rgba(20, 17, 15, .06) !important;
  border: 1px solid rgba(255, 106, 0, .14) !important;
}

body.divido-premium .prop-card--featured .pimg {
  height: 220px;
  position: relative;
}

body.divido-premium .prop-card--featured .pimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.divido-premium .prop-card--featured .pimg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(20, 12, 8, .55) 100%);
  pointer-events: none;
}

body.divido-premium .prop-card--featured .prop-body {
  padding: 16px 16px 18px;
}

body.divido-premium .prop-card--featured .card-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

body.divido-premium .prop-card--featured .inv-now {
  margin-top: 8px;
  width: 100%;
}

body.divido-premium .feat-ribbon {
  display: inline-flex;
  margin-bottom: 8px;
}

body.divido-premium .feat-ribbon span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #fff;
  background: linear-gradient(135deg, #FF6A00, #FF8F3D);
  box-shadow: 0 8px 18px rgba(255, 106, 0, .28);
}

/* Bento grid for remaining cards */
body.divido-premium .prop-bento {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

@media (min-width: 520px) {
  body.divido-premium .prop-bento {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  /* nth-child bento override removed — 3-column grid handles layout */

  body.divido-premium .prop-bento .prop-card .card-metrics {
    grid-template-columns: 1fr 1fr;
  }

  body.divido-premium .prop-card--featured {
    grid-template-columns: 1.15fr 1fr;
    align-items: stretch;
  }

  body.divido-premium .prop-card--featured .pimg {
    height: 100%;
    min-height: 280px;
    border-radius: 28px 0 0 28px;
  }
}

/* Compact secondary bento cards */
body.divido-premium .prop-bento .prop-card .social-proof {
  font-size: 10.5px;
}

body.divido-premium .home-stats {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 12px 0 14px;
}

body.divido-premium .home-stats .hs-item {
  background: rgba(255, 255, 255, .86);
  border: 1px solid rgba(20, 17, 15, .06);
  border-radius: 18px;
  padding: 12px 8px;
  text-align: center;
  box-shadow: 0 8px 20px rgba(20, 17, 15, .04);
}

body.divido-premium .home-stats .hs-item b {
  display: block;
  font-size: 16px;
  font-weight: 800;
  background: linear-gradient(100deg, #FF6A00, #FF6A00);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

body.divido-premium.dark .home-stats .hs-item {
  background: rgba(30, 24, 22, .94);
  border-color: rgba(255, 180, 120, .1);
}

/* RTL splash */
html[dir="rtl"] body.divido-premium .splash-kicker {
  letter-spacing: .06em;
}

html[dir="rtl"] body.divido-premium .feat-ribbon span {
  letter-spacing: .04em;
}

@media (prefers-reduced-motion: reduce) {
  body.divido-premium .splash-streak {
    animation: none !important;
  }
}


/* ============================================================
   ORANGE-ONLY + SIMPLIFIED PREMIUM UX
   No red. Pixel shading. Smooth swipe feel. Clear hierarchy.
   ============================================================ */

body.divido-premium.orange-only {
  --dv-crimson: #FF6A00 !important;
  --dv-crimson-deep: #1A120C !important;
  --dv-orange: #FF6A00 !important;
  --dv-orange-soft: #FF8F3D !important;
  background:
    radial-gradient(110% 70% at 12% -8%, rgba(255, 140, 50, .20), transparent 50%),
    radial-gradient(90% 55% at 100% 0%, rgba(255, 106, 0, .10), transparent 46%),
    linear-gradient(180deg, #FFF8F0 0%, #FBF6EF 45%, #F5EFE6 100%) !important;
  color: var(--dv-ink);
}

/* Kill any leftover pure red hexes in this layer */
body.divido-premium.orange-only .prop-price,
body.divido-premium.orange-only .inv-meta b,
body.divido-premium.orange-only .d-cta-earn b,
body.divido-premium.orange-only .d-cta-sub b,
body.divido-premium.orange-only .tabbar-btn.on,
body.divido-premium.orange-only .chip.on:not(.on) {
  color: var(--dv-orange) !important;
}

/* Gradient money — orange spectrum only */
body.divido-premium.orange-only .nw-val,
body.divido-premium.orange-only .hero-white .w-balance,
body.divido-premium.orange-only .prop-price,
body.divido-premium.orange-only .card-price b,
body.divido-premium.orange-only .home-stats .hs-item b {
  background: linear-gradient(100deg, #FF4D00, #FF6A00 40%, #FFB067) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

/* NW card — deep orange charcoal, no crimson wine */
body.divido-premium.orange-only .nw-card {
  background:
    linear-gradient(150deg, #1A120C 0%, #2A1A10 42%, #4A280F 78%, #FF6A00 150%) !important;
  box-shadow: 0 22px 48px rgba(255, 106, 0, .18) !important;
}

body.divido-premium.orange-only .banner-card {
  background:
    linear-gradient(125deg, #1A120C 0%, #3D220F 48%, #FF6A00 130%) !important;
}

/* Progress + badges all orange */
body.divido-premium.orange-only .bar-fill {
  background: linear-gradient(90deg, #FF4D00, #FF6A00 45%, #FFB067) !important;
  box-shadow: 0 0 14px rgba(255, 106, 0, .45) !important;
}

body.divido-premium.orange-only .p-badge.b-fund,
body.divido-premium.orange-only .p-badge.b-new,
body.divido-premium.orange-only .p-badge.b-urg,
body.divido-premium.orange-only .tag.urg,
body.divido-premium.orange-only .feat-ribbon span {
  background: linear-gradient(135deg, #FF6A00, #FF8F3D) !important;
  color: #fff !important;
  border: 0 !important;
}

body.divido-premium.orange-only .p-badge.b-full {
  background: linear-gradient(135deg, #1A120C, #3D220F) !important;
}

/* Pixel brackets → soft orange only */
body.divido-premium.orange-only.px-futuristic .prop-card::before,
body.divido-premium.orange-only.px-futuristic .fund-card::before {
  background:
    linear-gradient(var(--dv-orange), var(--dv-orange)) top left / 10px 2px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) top left / 2px 10px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) top right / 10px 2px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) top right / 2px 10px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) bottom left / 10px 2px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) bottom left / 2px 10px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) bottom right / 10px 2px no-repeat,
    linear-gradient(var(--dv-orange), var(--dv-orange)) bottom right / 2px 10px no-repeat !important;
  opacity: .35;
}

/* Toast / tab / chips — orange ink */
body.divido-premium.orange-only .toast {
  background: linear-gradient(135deg, #1A120C, #3D220F) !important;
  border-color: rgba(255, 106, 0, .35) !important;
}

body.divido-premium.orange-only .tabbar-btn.on {
  color: #FF6A00 !important;
}

body.divido-premium.orange-only .chip.on,
body.divido-premium.orange-only .seg-btn.on {
  background: #1A120C !important;
  color: #fff !important;
  border-color: transparent !important;
}

body.divido-premium.orange-only .lang-code {
  color: #FF6A00 !important;
}

body.divido-premium.orange-only .premium-menu-label {
  color: #FF6A00 !important;
  background: rgba(255, 106, 0, .05) !important;
}

/* ---------- SIMPLIFIED CARDS ---------- */
body.divido-premium.orange-only .prop-card--simple .card-metrics,
body.divido-premium.orange-only .prop-card--simple .fund-row,
body.divido-premium.orange-only .prop-card--simple .line-price,
body.divido-premium.orange-only .prop-card--simple .social-proof,
body.divido-premium.orange-only .prop-card--simple .inv-meta,
body.divido-premium.orange-only .prop-card--simple .yield-teaser,
body.divido-premium.orange-only .prop-card--simple .p-badge.b-strat,
body.divido-premium.orange-only .prop-card--simple .p-badge.b-type,
body.divido-premium.orange-only .prop-card--simple .p-badge.b-src {
  display: none !important;
}

body.divido-premium.orange-only .prop-card--simple {
  border-radius: 26px !important;
  overflow: hidden;
  background: #fff !important;
  border: 1px solid rgba(26, 18, 12, .06) !important;
  box-shadow: 0 10px 32px rgba(26, 18, 12, .06), 0 1px 0 rgba(255, 255, 255, .8) inset !important;
  transition: transform .35s var(--dv-ease-out), box-shadow .35s var(--dv-ease-out);
}

body.divido-premium.orange-only .prop-card--simple:active {
  transform: scale(.985);
}

body.divido-premium.orange-only .prop-card--simple .pimg {
  height: 168px;
  position: relative;
}

body.divido-premium.orange-only .prop-card--simple .pimg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.divido-premium.orange-only .prop-card--simple .pimg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(26, 18, 12, .35));
  pointer-events: none;
}

body.divido-premium.orange-only .pimg-badges {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

body.divido-premium.orange-only .pimg-badges .p-badge {
  font-size: 10px;
  font-weight: 800;
  padding: 5px 9px;
  border-radius: 999px;
  backdrop-filter: blur(8px);
}

body.divido-premium.orange-only .prop-card--simple .prop-body {
  padding: 14px 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

body.divido-premium.orange-only .prop-card--simple h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.2;
  color: var(--dv-ink) !important;
}

body.divido-premium.orange-only .prop-loc-line {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--dv-muted);
  line-height: 1.3;
}

/* Clear scannable info pills */
body.divido-premium.orange-only .info-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

body.divido-premium.orange-only .info-pill {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 6px 10px;
  border-radius: 12px;
  background: rgba(255, 106, 0, .08);
  border: 1px solid rgba(255, 106, 0, .12);
  font-size: 10px;
  font-weight: 700;
  color: var(--dv-muted);
  letter-spacing: .01em;
}

body.divido-premium.orange-only .info-pill b {
  font-size: 12px;
  font-weight: 800;
  color: #FF6A00;
}

body.divido-premium.orange-only .yield-one {
  font-size: 12px;
  font-weight: 700;
  color: var(--dv-ink);
  padding: 8px 10px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(255, 106, 0, .10), rgba(255, 180, 100, .06));
  border: 1px solid rgba(255, 106, 0, .14);
}

body.divido-premium.orange-only .yield-one b {
  color: #FF6A00;
}

body.divido-premium.orange-only .bar-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

body.divido-premium.orange-only .bar-row .bar {
  flex: 1;
  height: 7px !important;
  border-radius: 99px;
  background: rgba(26, 18, 12, .06) !important;
  overflow: hidden;
}

body.divido-premium.orange-only .bar-pct {
  font-size: 11px;
  font-weight: 800;
  color: #FF6A00;
  min-width: 34px;
  text-align: end;
}

body.divido-premium.orange-only .card-cta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 2px;
}

body.divido-premium.orange-only .card-price {
  font-size: 13px;
  font-weight: 700;
  color: var(--dv-ink);
  line-height: 1.15;
}

body.divido-premium.orange-only .card-price b {
  font-size: 17px;
  display: inline;
}

body.divido-premium.orange-only .card-price small {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  font-weight: 700;
  color: var(--dv-muted);
  -webkit-text-fill-color: var(--dv-muted);
  background: none !important;
}

body.divido-premium.orange-only .prop-card--simple .inv-now {
  flex-shrink: 0;
  padding: 12px 16px !important;
  min-width: 108px;
  border-radius: 999px !important;
  font-size: 13px !important;
}

/* Featured stays big but same clean structure */
body.divido-premium.orange-only .prop-card--featured .pimg {
  height: 200px;
}

body.divido-premium.orange-only .prop-card--featured h3 {
  font-size: 20px !important;
}

/* ---------- Declutter home ---------- */
/* Hide old dense banner + stats if too noisy — keep one path */
body.divido-premium.orange-only .banner-card {
  display: none !important;
}

body.divido-premium.orange-only .home-stats {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 10px 0 8px;
}

body.divido-premium.orange-only .dv-sales-strip {
  gap: 8px;
  padding: 2px 0 6px;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
}

body.divido-premium.orange-only .dv-sales-chip {
  scroll-snap-align: start;
  white-space: nowrap;
}

/* Trust row more compact */
body.divido-premium.orange-only .dv-trust-row {
  gap: 8px;
  margin-bottom: 8px;
}

body.divido-premium.orange-only .dv-trust-cell {
  padding: 10px 8px;
  border-radius: 16px;
}

/* Hide second filter bar row density on small screens */
@media (max-width: 430px) {
  body.divido-premium.orange-only #props-filters .filter-bar:nth-of-type(2) {
    display: none;
  }
}

/* ---------- Smooth swipe-like view transitions ---------- */
body.divido-premium.orange-only .view:not(.hidden) {
  animation: dvSwipeIn .42s var(--dv-ease-out) both;
}

@keyframes dvSwipeIn {
  from {
    opacity: 0;
    transform: translate3d(18px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

html[dir="rtl"] body.divido-premium.orange-only .view:not(.hidden) {
  animation-name: dvSwipeInRtl;
}

@keyframes dvSwipeInRtl {
  from {
    opacity: 0;
    transform: translate3d(-18px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

body.divido-premium.orange-only .prop-card--simple {
  animation: dvCardRise .5s var(--dv-ease-out) both;
}

@keyframes dvCardRise {
  from {
    opacity: 0;
    transform: translateY(12px) scale(.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

body.divido-premium.orange-only .prop-bento .prop-card--simple:nth-child(1) {
  animation-delay: .04s;
}

body.divido-premium.orange-only .prop-bento .prop-card--simple:nth-child(2) {
  animation-delay: .08s;
}

body.divido-premium.orange-only .prop-bento .prop-card--simple:nth-child(3) {
  animation-delay: .12s;
}

body.divido-premium.orange-only .prop-bento .prop-card--simple:nth-child(4) {
  animation-delay: .16s;
}

body.divido-premium.orange-only .prop-bento .prop-card--simple:nth-child(5) {
  animation-delay: .20s;
}

/* Modal sheet smoother */
body.divido-premium.orange-only .modal-card {
  transition: transform .45s var(--dv-ease-out) !important;
}

body.divido-premium.orange-only .modal:not(.hidden) .modal-card {
  transform: translateY(0);
}

/* Detail CTA cleaner */
body.divido-premium.orange-only .d-bottom {
  backdrop-filter: blur(20px) saturate(1.15);
  border-top: 1px solid rgba(255, 106, 0, .12) !important;
}

body.divido-premium.orange-only .d-cta-chips {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  padding-bottom: 2px;
}

body.divido-premium.orange-only .d-amt-chip {
  scroll-snap-align: start;
  min-width: 104px;
  flex-shrink: 0;
}

/* Pixel shading texture (subtle) */
body.divido-premium.orange-only.px-futuristic::before {
  opacity: .09 !important;
  background-size: 12px 12px !important;
}

/* Auth splash already orange-forward — ensure no red leftovers */
body.divido-premium.orange-only #screen-auth {
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(255, 120, 40, .38), transparent 50%),
    linear-gradient(165deg, #1A120C 0%, #2C1A10 38%, #4A280F 70%, #FF6A00 145%) !important;
}

/* Dark mode orange only */
body.divido-premium.orange-only.dark {
  background:
    radial-gradient(100% 70% at 20% 0%, rgba(255, 106, 0, .16), transparent 50%),
    linear-gradient(180deg, #120E0C, #1A1412 60%, #14110F) !important;
}

body.divido-premium.orange-only.dark .prop-card--simple {
  background: rgba(30, 24, 22, .96) !important;
  border-color: rgba(255, 180, 120, .10) !important;
}

body.divido-premium.orange-only.dark .prop-card--simple h3,
body.divido-premium.orange-only.dark .hg-name,
body.divido-premium.orange-only.dark .sec-title {
  color: #FFF8F0 !important;
}

body.divido-premium.orange-only.dark .chip.on,
body.divido-premium.orange-only.dark .seg-btn.on {
  background: #FF6A00 !important;
  color: #fff !important;
}

/* Hide duplicate premium.inv-meta inject if any remains */
body.divido-premium.orange-only .inv-meta {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {

  body.divido-premium.orange-only .view:not(.hidden),
  body.divido-premium.orange-only .prop-card--simple {
    animation: none !important;
  }
}


/* ============================================================
   SMOOTH USAGE LAYER — sticky tools, sheets, tabbar, motion
   ============================================================ */
html {
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body.divido-premium.orange-only {
  overscroll-behavior-y: contain;
  -webkit-tap-highlight-color: transparent;
}

/* Sticky home controls */
body.divido-premium.orange-only .home-sticky {
  position: sticky;
  top: 56px;
  z-index: 20;
  margin: 0 -2px 10px;
  padding: 8px 2px 10px;
  background: linear-gradient(180deg, rgba(251, 246, 239, .96), rgba(251, 246, 239, .90));
  backdrop-filter: blur(16px) saturate(1.1);
  -webkit-backdrop-filter: blur(16px) saturate(1.1);
  border-bottom: 1px solid transparent;
  transition: box-shadow .25s ease, border-color .25s ease;
}

body.divido-premium.orange-only .home-sticky.is-stuck {
  border-bottom-color: rgba(255, 106, 0, .12);
  box-shadow: 0 10px 28px rgba(26, 18, 12, .06);
}

body.divido-premium.orange-only .quick-tools {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  padding: 8px 2px 2px;
  scrollbar-width: none;
}

body.divido-premium.orange-only .quick-tools::-webkit-scrollbar {
  display: none;
}

body.divido-premium.orange-only .q-chip,
body.divido-premium.orange-only .filters-open-btn {
  scroll-snap-align: start;
  flex-shrink: 0;
  border: 1px solid rgba(26, 18, 12, .08);
  background: #fff;
  color: var(--dv-ink);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  padding: 8px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: transform .15s var(--dv-ease), background .2s ease, color .2s ease, border-color .2s ease;
}

body.divido-premium.orange-only .q-chip.on {
  background: #1A120C;
  color: #fff;
  border-color: transparent;
}

body.divido-premium.orange-only .filters-open-btn {
  background: linear-gradient(135deg, #FF6A00, #FF8F3D);
  color: #fff;
  border: 0;
  box-shadow: 0 8px 18px rgba(255, 106, 0, .28);
  margin-inline-start: auto;
}

body.divido-premium.orange-only .q-chip:active,
body.divido-premium.orange-only .filters-open-btn:active {
  transform: scale(.96);
}

/* Filters bottom sheet */
body.divido-premium.orange-only .filters-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(20, 12, 8, .42);
  backdrop-filter: blur(4px);
  z-index: 80;
  opacity: 0;
  transition: opacity .22s ease;
  pointer-events: none;
}

body.divido-premium.orange-only .filters-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

body.divido-premium.orange-only .filters-drawer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 85;
  max-height: min(78vh, 640px);
  background: #FFFCFA;
  border-radius: 28px 28px 0 0;
  box-shadow: 0 -18px 50px rgba(26, 18, 12, .18);
  padding: 10px 18px calc(18px + env(safe-area-inset-bottom));
  transform: translateY(110%);
  transition: transform .34s cubic-bezier(.22, 1, .36, 1);
  overflow: auto;
  pointer-events: none;
  visibility: hidden;
}

body.divido-premium.orange-only .filters-drawer.open {
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible;
}

body.divido-premium.orange-only .filters-handle {
  width: 44px;
  height: 5px;
  border-radius: 99px;
  background: linear-gradient(90deg, #FF6A00, #FFB067);
  margin: 4px auto 12px;
}

body.divido-premium.orange-only .filters-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

body.divido-premium.orange-only .filters-head b {
  font-size: 18px;
  letter-spacing: -.03em;
}

body.divido-premium.orange-only .filters-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
}

body.divido-premium.orange-only .filters-body .lbl {
  margin-top: 6px;
  text-align: start;
}

/* View enter */
body.divido-premium.orange-only .view.view-enter {
  animation: dvSwipeIn .38s cubic-bezier(.16, 1, .3, 1) both;
}

html[dir="rtl"] body.divido-premium.orange-only .view.view-enter {
  animation-name: dvSwipeInRtl;
}

/* Tabbar hide on scroll-down */
body.divido-premium.orange-only .tabbar {
  transition: transform .28s cubic-bezier(.22, 1, .36, 1), opacity .28s ease !important;
  will-change: transform;
}

body.divido-premium.orange-only .tabbar.tabbar-hide {
  transform: translateY(120%) !important;
  opacity: 0;
  pointer-events: none;
}

body.divido-premium.orange-only.on-detail .tabbar {
  transform: translateY(120%) !important;
  opacity: 0;
  pointer-events: none;
}

/* Modal soft open */
body.divido-premium.orange-only #modal {
  transition: background .25s ease;
}

body.divido-premium.orange-only #modal:not(.hidden) {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: rgba(20, 12, 8, .0);
}

body.divido-premium.orange-only #modal.modal-open {
  background: rgba(20, 12, 8, .45);
}

body.divido-premium.orange-only #modal .modal-card {
  transform: translateY(24px);
  opacity: .98;
  transition: transform .34s cubic-bezier(.22, 1, .36, 1), opacity .28s ease;
}

body.divido-premium.orange-only #modal.modal-open .modal-card {
  transform: translateY(0);
  opacity: 1;
}

body.divido-premium.orange-only.modal-active,
body.divido-premium.modal-active {
  overflow: hidden !important;
  touch-action: none;
  overscroll-behavior: none;
}

body.divido-premium.orange-only.modal-active #screen-app,
body.divido-premium.modal-active #screen-app {
  /* keep page from rubber-banding under the sheet */
  overscroll-behavior: none;
}

/* Closed overlays must never steal scroll/touch */
body.divido-premium #modal.hidden,
body.divido-premium #viewer.hidden,
body.divido-premium .filters-backdrop:not(.open),
body.divido-premium .filters-drawer:not(.open) {
  pointer-events: none !important;
}

/* App header slightly tighter on scroll feel */
body.divido-premium.orange-only .app-header {
  position: sticky;
  top: 0;
  z-index: 30;
}

/* Detail back area breathing room */
body.divido-premium.orange-only #view-detail {
  padding-bottom: 120px;
}

/* Momentum lists */
body.divido-premium.orange-only .prop-bento,
body.divido-premium.orange-only #tx-list,
body.divido-premium.orange-only #inv-list {
  -webkit-overflow-scrolling: touch;
}

/* Skeleton softer */
body.divido-premium.orange-only .sk-stat {
  background: linear-gradient(105deg, rgba(255, 106, 0, .06) 25%, rgba(255, 160, 80, .16) 37%, rgba(255, 106, 0, .06) 63%) !important;
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {

  body.divido-premium.orange-only .view.view-enter,
  body.divido-premium.orange-only .filters-drawer,
  body.divido-premium.orange-only #modal .modal-card {
    transition: none !important;
    animation: none !important;
  }
}


/* ============================================================
   ICON LAYOUT HARD FIX — no overlaps, equal hit targets
   ============================================================ */
body.divido-premium .app-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 10px 14px !important;
  min-height: 56px;
}

body.divido-premium .app-header .logo-img {
  flex: 0 0 auto !important;
  height: 42px !important;
  max-height: 44px !important;
  width: auto !important;
  max-width: 180px !important;
  object-fit: contain !important;
}

body.divido-premium .hdr-icons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  flex: 0 0 auto;
  min-width: 0;
}

/* Every header control = same 36×36 button, never bare img */
body.divido-premium .hdr-icons .hdr-btn,
body.divido-premium .hdr-icons>.icon-btn,
body.divido-premium .hdr-icons>.hdr-bell {
  box-sizing: border-box !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  max-width: 38px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 9999px !important;
  border: 1px solid rgba(227, 218, 200, 0.7) !important;
  background: #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  overflow: visible !important;
  cursor: pointer;
  flex: 0 0 38px !important;
  box-shadow: 0 4px 14px rgba(35, 15, 43, 0.04) !important;
}

/* Header buttons: single icon buttons vs language pill button */
body.divido-premium .hdr-icons {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}

body.divido-premium .hdr-icons .hdr-btn {
  background: #ffffff !important;
  border: 1px solid rgba(227, 218, 200, 0.7) !important;
  border-radius: 9999px !important;
  box-shadow: 0 4px 14px rgba(35, 15, 43, 0.04) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease !important;
}

body.divido-premium .hdr-icons .lang-toggle,
body.divido-premium .auth-top .lang-toggle {
  background: #ffffff !important;
  border: 1px solid rgba(227, 218, 200, 0.7) !important;
  border-radius: 9999px !important;
  box-shadow: 0 4px 14px rgba(35, 15, 43, 0.04) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 68px !important;
  height: 38px !important;
  padding: 0 14px !important;
  gap: 6px !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease !important;
}

body.divido-premium .hdr-icons .hdr-btn:hover,
body.divido-premium .hdr-icons .lang-toggle:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(35, 15, 43, 0.08) !important;
  background: #ffffff !important;
}

body.divido-premium .hdr-icons .icon-img,
body.divido-premium .hdr-icons img,
body.divido-premium .lang-toggle img {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  display: block !important;
  object-fit: contain !important;
  margin: 0 !important;
  filter: none !important;
  opacity: 1 !important;
}

body.divido-premium .hdr-icons .lang-code,
body.divido-premium .auth-top .lang-code,
body.divido-premium.modern-orange .lang-code,
body.divido-premium.orange-only .lang-code,
.lang-code {
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  color: var(--dv-ink) !important;
  letter-spacing: .04em !important;
  pointer-events: none;
  margin-left: 2px !important;
  display: inline-block !important;
}

body.divido-premium .hdr-bell .bell-dot,
body.divido-premium #bell-dot {
  position: absolute !important;
  top: 2px !important;
  right: 2px !important;
  width: 14px !important;
  height: 14px !important;
  min-width: 14px;
  border-radius: 99px !important;
  background: linear-gradient(135deg, #FF6A00, #FF8F3D) !important;
  color: #fff !important;
  font-size: 8px !important;
  font-weight: 800 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 2px solid #fff;
  z-index: 2;
  box-sizing: border-box;
}

body.divido-premium #bell-dot.hidden {
  display: none !important;
}

/* Auth header lang same system */
body.divido-premium .auth-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px;
}

body.divido-premium .auth-top .logo-img {
  height: 34px !important;
  max-width: 140px;
}

body.divido-premium .auth-top .lang-toggle {
  width: auto !important;
  min-width: 40px;
  height: 36px !important;
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  padding: 0 10px !important;
  border-radius: 12px !important;
}

/* Card image: exclusive zones — save top-right, badges bottom strip only */
body.divido-premium .pimg,
body.divido-premium .prop-card--simple .pimg {
  position: relative !important;
  overflow: hidden !important;
}

body.divido-premium .save-btn {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  width: 34px !important;
  height: 34px !important;
  z-index: 5 !important;
  margin: 0 !important;
}

html[dir="rtl"] body.divido-premium .save-btn {
  right: auto !important;
  left: 10px !important;
}

body.divido-premium .save-btn img,
body.divido-premium .save-ic {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
}

/* Kill legacy absolute badges that float freely on simple cards */
body.divido-premium .prop-card--simple .pimg>.p-badge {
  display: none !important;
}

body.divido-premium .pimg-badges {
  position: absolute !important;
  left: 10px !important;
  right: 10px !important;
  bottom: 10px !important;
  top: auto !important;
  z-index: 4 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: center !important;
  pointer-events: none;
  max-width: calc(100% - 20px);
}

body.divido-premium .pimg-badges .p-badge {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  max-width: 100%;
  pointer-events: none;
  white-space: nowrap;
}

/* Non-simple cards (legacy): pin badges away from save */
body.divido-premium .prop-card:not(.prop-card--simple) .p-badge.b-fund {
  left: 10px !important;
  right: auto !important;
  bottom: 10px !important;
  top: auto !important;
}

body.divido-premium .prop-card:not(.prop-card--simple) .p-badge.b-urg,
body.divido-premium .prop-card:not(.prop-card--simple) .p-badge.b-new {
  left: 10px !important;
  top: 10px !important;
  right: auto !important;
  bottom: auto !important;
  max-width: calc(100% - 56px);
  /* leave room for save */
}

/* Tabbar: prevent label/icon collision & overflow */
body.divido-premium .tabbar {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 4px 6px calc(4px + env(safe-area-inset-bottom)) !important;
}

body.divido-premium .tabbar-btn {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  max-width: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  padding: 6px 2px !important;
  overflow: hidden !important;
}

body.divido-premium .tabbar-btn img {
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  flex: 0 0 auto;
}

body.divido-premium .tabbar-btn span {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-align: center !important;
  font-size: 9px !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
  padding: 0 1px;
}

/* Active underglow shouldn't cover label */
body.divido-premium .tabbar-btn.on::before {
  inset: 2px !important;
  z-index: 0 !important;
}

body.divido-premium .tabbar-btn img,
body.divido-premium .tabbar-btn span {
  position: relative;
  z-index: 1;
}

/* Wallet / action row icons */
body.divido-premium .w-act {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  min-width: 0;
}

body.divido-premium .w-act .action-ic {
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  display: block !important;
}

body.divido-premium .w-act span {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  line-height: 1.1;
}

/* Menu list icons */
body.divido-premium .menu-list button {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

body.divido-premium .menu-list button img {
  width: 20px !important;
  height: 20px !important;
  flex: 0 0 20px !important;
  margin: 0 !important;
  object-fit: contain;
}

body.divido-premium .menu-list button span {
  flex: 1 1 auto;
  min-width: 0;
  text-align: start;
}

/* Detail top icons row if any */
body.divido-premium #view-detail .d-top,
body.divido-premium #view-detail .detail-top {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.divido-premium .round-btn {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 36px;
  overflow: hidden;
}

/* Seg icons */
body.divido-premium .seg-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0;
}

body.divido-premium .seg-ic {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px;
  margin: 0 !important;
}

/* Fix leftover red in styles gradient overrides */
body.divido-premium .btn.primary,
body.divido-premium .bar-fill,
body.divido-premium .fab,
body.divido-premium .p-badge.b-fund,
body.divido-premium .p-badge.b-new {
  background: linear-gradient(135deg, #FF6A00 0%, #FF8F3D 100%) !important;
}

body.divido-premium.dark .tabbar-btn.on span {
  color: #FF8F3D !important;
}

/* Sticky home tools shouldn't collide with header */
body.divido-premium .home-sticky {
  top: 56px !important;
}

/* Small phones: shrink header logo so 4 buttons never crush */
@media (max-width: 360px) {
  body.divido-premium .app-header .logo-img {
    max-width: 96px;
    height: 26px !important;
  }

  body.divido-premium .hdr-icons {
    gap: 4px !important;
  }

  body.divido-premium .hdr-icons .hdr-btn {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
  }
}



/* ============================================================
   MODAL SHEET HARD FIX — close always reachable, no off-screen head
   ============================================================ */
body.divido-premium #modal,
body.divido-premium.orange-only #modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 120 !important;
  display: none;
  align-items: flex-end !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

body.divido-premium #modal:not(.hidden),
body.divido-premium.orange-only #modal:not(.hidden) {
  display: flex !important;
}

body.divido-premium #modal.modal-open,
body.divido-premium.orange-only #modal.modal-open {
  background: rgba(20, 12, 8, .48) !important;
}

body.divido-premium .modal-card,
body.divido-premium.orange-only #modal .modal-card,
body.divido-premium.orange-only .modal-card {
  position: relative !important;
  width: 100% !important;
  max-width: 520px !important;
  max-height: min(88dvh, 88vh, 720px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  margin: 0 auto !important;
  padding: 12px 16px calc(18px + env(safe-area-inset-bottom)) !important;
  border-radius: 28px 28px 0 0 !important;
  transform: translateY(0) !important;
  opacity: 1 !important;
  box-sizing: border-box !important;
}

/* soft open still animates from slight offset only when opening */
body.divido-premium.orange-only #modal:not(.modal-open) .modal-card {
  transform: translateY(18px) !important;
  opacity: .98 !important;
}

body.divido-premium.orange-only #modal.modal-open .modal-card {
  transform: translateY(0) !important;
  opacity: 1 !important;
}

body.divido-premium .modal-card .head-row,
body.divido-premium #modal .head-row {
  position: sticky !important;
  top: 0 !important;
  z-index: 6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin: 0 0 10px !important;
  padding: 4px 0 10px !important;
  background: linear-gradient(180deg, #FFFCFA 70%, rgba(255, 252, 250, 0)) !important;
}

body.divido-premium.dark .modal-card .head-row {
  background: linear-gradient(180deg, #1A1313 70%, rgba(26, 19, 19, 0)) !important;
}

body.divido-premium #modal-title,
body.divido-premium .modal-card .head-row h3 {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.divido-premium #modal-close,
body.divido-premium .modal-card .head-row .round-btn {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  flex: 0 0 36px !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  z-index: 7 !important;
}

body.divido-premium #modal-body {
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* Filters drawer same safe max-height */
body.divido-premium .filters-drawer {
  max-height: min(78dvh, 78vh, 640px) !important;
  overflow: auto !important;
  z-index: 125 !important;
}

body.divido-premium .filters-backdrop {
  z-index: 122 !important;
}

/* Detail sticky CTA never covers content badly */
body.divido-premium .d-bottom {
  z-index: 25 !important;
  max-width: 100vw !important;
  box-sizing: border-box !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
}

body.divido-premium #start-invest {
  width: 100% !important;
  max-width: 100% !important;
}

/* Ensure tabbar above content but below modals */
body.divido-premium .tabbar {
  z-index: 40 !important;
}

body.divido-premium .app-header {
  z-index: 50 !important;
}

body.divido-premium .home-sticky {
  z-index: 45 !important;
}



/* ============================================================
   THRILL VISUAL LAYER — cinematic premium energy (still clean)
   Orange kinetic light, depth, motion. No red. Reduced-motion safe.
   ============================================================ */

body.divido-premium.thrill {
  --thrill-orange: #FF6A00;
  --thrill-amber: #FFB067;
  --thrill-hot: #FF4D00;
  --thrill-ink: #140E0B;
  --thrill-glow: 0 0 40px rgba(255, 106, 0, .28);
  --thrill-ease: cubic-bezier(.16, 1, .3, 1);
}

/* Atmosphere: living orange haze */
body.divido-premium.thrill {
  background:
    radial-gradient(90% 55% at 8% -5%, rgba(255, 120, 40, .28), transparent 55%),
    radial-gradient(70% 45% at 100% 5%, rgba(255, 170, 80, .16), transparent 50%),
    radial-gradient(60% 40% at 50% 100%, rgba(255, 90, 20, .08), transparent 55%),
    linear-gradient(180deg, #FFF7EE 0%, #FBF4EB 40%, #F4EDE4 100%) !important;
}

body.divido-premium.thrill::after {
  content: "";
  position: fixed;
  inset: -10%;
  pointer-events: none;
  z-index: -1;
  opacity: .55;
  background:
    radial-gradient(circle at 20% 15%, rgba(255, 106, 0, .18), transparent 28%),
    radial-gradient(circle at 80% 70%, rgba(255, 160, 70, .12), transparent 32%);
  animation: thrillDrift 14s ease-in-out infinite alternate;
  filter: blur(2px);
}

@keyframes thrillDrift {
  from {
    transform: translate3d(-1.5%, -1%, 0) scale(1);
  }

  to {
    transform: translate3d(1.5%, 1.5%, 0) scale(1.04);
  }
}

/* Cinematic splash energy */
body.divido-premium.thrill #screen-auth {
  background:
    radial-gradient(100% 70% at 50% 0%, rgba(255, 130, 40, .45), transparent 55%),
    linear-gradient(165deg, #120C0A 0%, #2A160E 40%, #5A2A10 72%, #FF6A00 140%) !important;
  overflow: hidden;
}

body.divido-premium.thrill #screen-auth::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 80% 40% at 50% 35%, rgba(255, 106, 0, .35), transparent 60%);
  animation: thrillPulse 4.5s ease-in-out infinite;
}

@keyframes thrillPulse {

  0%,
  100% {
    opacity: .55;
    transform: scale(1);
  }

  50% {
    opacity: .95;
    transform: scale(1.06);
  }
}

body.divido-premium.thrill .splash-hero {
  border: 1px solid rgba(255, 180, 100, .22) !important;
  box-shadow:
    0 30px 80px rgba(0, 0, 0, .35),
    inset 0 1px 0 rgba(255, 255, 255, .14),
    0 0 60px rgba(255, 106, 0, .18) !important;
  backdrop-filter: blur(10px);
}

body.divido-premium.thrill .splash-logo {
  filter: drop-shadow(0 16px 40px rgba(255, 106, 0, .55)) !important;
  animation: thrillLogoFloat 5s ease-in-out infinite;
}

@keyframes thrillLogoFloat {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-6px);
  }
}

body.divido-premium.thrill .splash-kicker {
  color: #FFC27A !important;
  text-shadow: 0 0 24px rgba(255, 106, 0, .45);
  letter-spacing: .22em !important;
}

body.divido-premium.thrill #screen-auth .onb-title {
  text-shadow: 0 12px 40px rgba(0, 0, 0, .45), 0 0 40px rgba(255, 106, 0, .2) !important;
}

body.divido-premium.thrill #screen-auth .btn.primary.big {
  box-shadow:
    0 18px 40px rgba(0, 0, 0, .35),
    0 0 0 1px rgba(255, 255, 255, .2) inset,
    0 0 30px rgba(255, 180, 100, .25) !important;
  animation: thrillCtaBreath 3.2s ease-in-out infinite;
}

@keyframes thrillCtaBreath {

  0%,
  100% {
    box-shadow: 0 18px 40px rgba(0, 0, 0, .35), 0 0 0 1px rgba(255, 255, 255, .2) inset, 0 0 20px rgba(255, 180, 100, .2);
  }

  50% {
    box-shadow: 0 20px 48px rgba(0, 0, 0, .4), 0 0 0 1px rgba(255, 255, 255, .28) inset, 0 0 36px rgba(255, 160, 80, .4);
  }
}

/* Net worth — deep cinematic panel + moving light beam */
body.divido-premium.thrill .nw-card {
  isolation: isolate;
  overflow: hidden !important;
  border: 1px solid rgba(255, 160, 80, .2) !important;
  background:
    linear-gradient(145deg, #120C0A 0%, #24150F 38%, #4A2410 78%, #FF6A00 155%) !important;
  box-shadow:
    0 28px 60px rgba(255, 90, 20, .22),
    0 10px 24px rgba(20, 12, 8, .18),
    inset 0 1px 0 rgba(255, 255, 255, .1) !important;
}

body.divido-premium.thrill .nw-card::before {
  content: "";
  position: absolute;
  inset: -40% -20%;
  background: conic-gradient(from 120deg, transparent, rgba(255, 140, 40, .22), transparent 40%);
  animation: thrillSpin 12s linear infinite;
  z-index: 0;
  pointer-events: none;
}

@keyframes thrillSpin {
  to {
    transform: rotate(360deg);
  }
}

body.divido-premium.thrill .nw-card::after {
  content: "";
  position: absolute;
  top: 22%;
  left: -30%;
  width: 60%;
  height: 55px;
  background: linear-gradient(90deg, transparent, rgba(255, 180, 90, .75), rgba(255, 255, 255, .35), transparent);
  filter: blur(10px);
  transform: skewY(-8deg);
  animation: thrillBeam 4.8s ease-in-out infinite;
  pointer-events: none;
  z-index: 1;
  opacity: .7;
}

@keyframes thrillBeam {
  0% {
    left: -40%;
    opacity: .25;
  }

  40% {
    opacity: .85;
  }

  100% {
    left: 90%;
    opacity: .2;
  }
}

body.divido-premium.thrill .nw-card>* {
  position: relative;
  z-index: 2;
}

body.divido-premium.thrill .nw-val {
  filter: drop-shadow(0 0 18px rgba(255, 140, 60, .35));
  letter-spacing: -.05em !important;
}

/* Primary CTAs — liquid orange energy */
body.divido-premium.thrill .btn.primary,
body.divido-premium.thrill .inv-now,
body.divido-premium.thrill #start-invest {
  position: relative;
  overflow: hidden !important;
  background: linear-gradient(120deg, #FF4D00 0%, #FF6A00 35%, #FFB067 70%, #FF6A00 100%) !important;
  background-size: 200% 100% !important;
  animation: thrillGradShift 4s ease infinite !important;
  box-shadow:
    0 14px 32px rgba(255, 106, 0, .34),
    inset 0 1px 0 rgba(255, 255, 255, .4) !important;
  border: 0 !important;
}

@keyframes thrillGradShift {

  0%,
  100% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }
}

body.divido-premium.thrill .btn.primary::after,
body.divido-premium.thrill .inv-now::after,
body.divido-premium.thrill #start-invest::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, transparent 30%, rgba(255, 255, 255, .45) 48%, transparent 62%);
  transform: translateX(-120%);
  animation: thrillSheen 2.8s ease-in-out infinite;
  pointer-events: none;
}

@keyframes thrillSheen {

  0%,
  55% {
    transform: translateX(-120%);
  }

  100% {
    transform: translateX(120%);
  }
}

body.divido-premium.thrill .btn.primary:hover,
body.divido-premium.thrill .inv-now:hover {
  filter: brightness(1.06) saturate(1.08);
  transform: translateY(-1px);
}

/* Cards — depth + hover lift + light edge */
body.divido-premium.thrill .prop-card--simple,
body.divido-premium.thrill .fund-card,
body.divido-premium.thrill .inv-card {
  border: 1px solid rgba(255, 140, 60, .12) !important;
  box-shadow:
    0 12px 36px rgba(26, 18, 12, .07),
    0 1px 0 rgba(255, 255, 255, .9) inset !important;
  transition:
    transform .45s var(--thrill-ease),
    box-shadow .45s var(--thrill-ease),
    border-color .35s ease !important;
}

body.divido-premium.thrill .prop-card--simple:hover,
body.divido-premium.thrill .fund-card:hover {
  transform: translateY(-6px) scale(1.012) !important;
  border-color: rgba(255, 106, 0, .32) !important;
  box-shadow:
    0 28px 56px rgba(255, 106, 0, .16),
    0 12px 28px rgba(26, 18, 12, .08),
    0 0 0 1px rgba(255, 160, 80, .15) !important;
}

body.divido-premium.thrill .prop-card--featured {
  box-shadow:
    0 24px 56px rgba(255, 106, 0, .18),
    0 0 0 1px rgba(255, 140, 60, .2) !important;
}

body.divido-premium.thrill .prop-card--featured .pimg::after {
  background:
    linear-gradient(180deg, transparent 30%, rgba(20, 10, 6, .55) 100%),
    linear-gradient(90deg, rgba(255, 106, 0, .15), transparent 40%) !important;
}

body.divido-premium.thrill .feat-ribbon span {
  box-shadow: 0 10px 24px rgba(255, 106, 0, .4), 0 0 20px rgba(255, 106, 0, .25) !important;
  animation: thrillBadgePulse 2.4s ease-in-out infinite;
}

@keyframes thrillBadgePulse {

  0%,
  100% {
    filter: brightness(1);
  }

  50% {
    filter: brightness(1.12);
  }
}

/* Funding bar — electric fill */
body.divido-premium.thrill .bar {
  background: rgba(26, 18, 12, .07) !important;
  overflow: hidden;
  position: relative;
}

body.divido-premium.thrill .bar-fill {
  position: relative;
  background: linear-gradient(90deg, #FF3B00, #FF6A00 40%, #FFC27A 85%, #FFE0B0) !important;
  box-shadow: 0 0 18px rgba(255, 106, 0, .55) !important;
}

body.divido-premium.thrill .bar-fill::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent);
  animation: thrillBarFlash 2.2s ease-in-out infinite;
}

@keyframes thrillBarFlash {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(100%);
  }
}

/* Info pills glow */
body.divido-premium.thrill .info-pill {
  background: linear-gradient(135deg, rgba(255, 106, 0, .12), rgba(255, 180, 100, .06)) !important;
  border-color: rgba(255, 106, 0, .2) !important;
  box-shadow: 0 4px 14px rgba(255, 106, 0, .06);
}

body.divido-premium.thrill .info-pill b {
  text-shadow: 0 0 12px rgba(255, 106, 0, .25);
}

body.divido-premium.thrill .yield-one {
  border-color: rgba(255, 106, 0, .22) !important;
  box-shadow: inset 0 0 24px rgba(255, 106, 0, .05);
}

/* Sales chips kinetic */
body.divido-premium.thrill .dv-sales-chip {
  backdrop-filter: blur(10px);
  border-color: rgba(255, 106, 0, .18) !important;
  box-shadow: 0 8px 22px rgba(255, 106, 0, .08) !important;
}

body.divido-premium.thrill .dv-sales-chip.hot {
  animation: thrillHot 1.8s ease-in-out infinite;
  box-shadow: 0 12px 28px rgba(255, 106, 0, .4) !important;
}

@keyframes thrillHot {

  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.04);
  }
}

/* Tabbar floating capsule energy */
body.divido-premium.thrill .tabbar {
  border: 1px solid rgba(255, 140, 60, .16) !important;
  box-shadow:
    0 18px 44px rgba(26, 18, 12, .16),
    0 0 0 1px rgba(255, 255, 255, .4) inset,
    0 0 30px rgba(255, 106, 0, .08) !important;
  background: rgba(255, 252, 248, .9) !important;
}

body.divido-premium.thrill .tabbar-btn.on {
  color: #FF6A00 !important;
}

body.divido-premium.thrill .tabbar-btn.on img {
  filter: drop-shadow(0 4px 10px rgba(255, 106, 0, .45)) !important;
}

body.divido-premium.thrill .tabbar-btn.on::after {
  background: linear-gradient(90deg, #FF4D00, #FFB067) !important;
  box-shadow: 0 0 14px rgba(255, 106, 0, .8) !important;
}

/* Sticky detail CTA glass + glow */
body.divido-premium.thrill .d-bottom {
  background: rgba(255, 252, 248, .82) !important;
  border-top: 1px solid rgba(255, 106, 0, .16) !important;
  box-shadow: 0 -20px 50px rgba(255, 106, 0, .1) !important;
  backdrop-filter: blur(22px) saturate(1.25) !important;
}

body.divido-premium.thrill .d-amt-chip {
  border-color: rgba(255, 106, 0, .25) !important;
  transition: transform .25s var(--thrill-ease), box-shadow .25s ease;
}

body.divido-premium.thrill .d-amt-chip:active {
  transform: scale(.96);
  box-shadow: 0 0 0 3px rgba(255, 106, 0, .18);
}

/* Wallet / rewards heroes */
body.divido-premium.thrill .wallet-hero.hero-white,
body.divido-premium.thrill .rewards-hero.hero-white,
body.divido-premium.thrill .inv-hero {
  border: 1px solid rgba(255, 140, 60, .18) !important;
  box-shadow:
    0 20px 48px rgba(255, 106, 0, .12),
    inset 0 1px 0 rgba(255, 255, 255, .9) !important;
  background:
    linear-gradient(160deg, #FFFFFF 0%, #FFF6EC 50%, #FFE4C8 120%) !important;
}

/* Header glass */
body.divido-premium.thrill .app-header {
  background: rgba(255, 252, 248, .7) !important;
  border-bottom: 1px solid rgba(255, 140, 60, .1) !important;
  box-shadow: 0 8px 28px rgba(255, 106, 0, .05) !important;
}

body.divido-premium.thrill .hdr-btn {
  border-color: rgba(255, 140, 60, .16) !important;
  box-shadow: 0 6px 16px rgba(255, 106, 0, .08) !important;
  transition: transform .2s var(--thrill-ease), box-shadow .2s ease;
}

body.divido-premium.thrill .hdr-btn:active {
  transform: scale(.92);
}

/* View transitions punchier */
body.divido-premium.thrill .view.view-enter {
  animation: thrillViewIn .48s var(--thrill-ease) both !important;
}

@keyframes thrillViewIn {
  from {
    opacity: 0;
    transform: translate3d(22px, 8px, 0) scale(.985);
    filter: blur(4px);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0);
  }
}

html[dir="rtl"] body.divido-premium.thrill .view.view-enter {
  animation-name: thrillViewInRtl !important;
}

@keyframes thrillViewInRtl {
  from {
    opacity: 0;
    transform: translate3d(-22px, 8px, 0) scale(.985);
    filter: blur(4px);
  }

  to {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

/* Card enter stagger more vivid */
body.divido-premium.thrill .prop-card--simple {
  animation: thrillCardIn .55s var(--thrill-ease) both;
}

@keyframes thrillCardIn {
  from {
    opacity: 0;
    transform: translateY(18px) scale(.96);
    filter: blur(6px);
  }

  to {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

/* Loader more electric */
body.divido-premium.thrill .divido-loader-logo {
  filter: drop-shadow(0 16px 36px rgba(255, 106, 0, .4)) !important;
  animation: thrillLogoFloat 2.4s ease-in-out infinite;
}

body.divido-premium.thrill .divido-loader-line span {
  background: linear-gradient(90deg, #FF4D00, #FFB067, #FF4D00) !important;
  background-size: 200% 100%;
  animation: thrillGradShift 1s linear infinite, dvLoaderLine 1.1s ease-in-out infinite !important;
}

/* Toast thrill */
body.divido-premium.thrill .toast {
  background: linear-gradient(135deg, #140E0B, #3A1E10) !important;
  border: 1px solid rgba(255, 140, 60, .4) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .28), 0 0 30px rgba(255, 106, 0, .15) !important;
}

/* Pixel accent brighter but still secondary */
body.divido-premium.thrill.px-futuristic::before {
  opacity: .12 !important;
}

body.divido-premium.thrill.px-futuristic .prop-card::before {
  opacity: .4 !important;
  filter: drop-shadow(0 0 8px rgba(255, 106, 0, .4));
}

/* Dark thrill */
body.divido-premium.thrill.dark {
  background:
    radial-gradient(90% 60% at 15% 0%, rgba(255, 106, 0, .22), transparent 50%),
    linear-gradient(180deg, #0E0A08, #16100C 55%, #120E0B) !important;
}

body.divido-premium.thrill.dark .prop-card--simple {
  background: rgba(28, 22, 18, .96) !important;
  border-color: rgba(255, 160, 80, .14) !important;
}

body.divido-premium.thrill.dark .tabbar {
  background: rgba(24, 18, 14, .92) !important;
}

/* Ambient floating orbs (pure CSS, no JS cost) */
body.divido-premium.thrill .thrill-orb {
  position: fixed;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
  filter: blur(30px);
  opacity: .35;
  mix-blend-mode: screen;
}

body.divido-premium.thrill .thrill-orb.o1 {
  width: 180px;
  height: 180px;
  top: 12%;
  left: -40px;
  background: rgba(255, 106, 0, .45);
  animation: thrillOrb1 11s ease-in-out infinite alternate;
}

body.divido-premium.thrill .thrill-orb.o2 {
  width: 140px;
  height: 140px;
  top: 55%;
  right: -30px;
  background: rgba(255, 170, 80, .35);
  animation: thrillOrb2 13s ease-in-out infinite alternate;
}

@keyframes thrillOrb1 {
  from {
    transform: translate(0, 0);
  }

  to {
    transform: translate(30px, 40px);
  }
}

@keyframes thrillOrb2 {
  from {
    transform: translate(0, 0);
  }

  to {
    transform: translate(-25px, -35px);
  }
}

@media (prefers-reduced-motion: reduce) {

  body.divido-premium.thrill::after,
  body.divido-premium.thrill #screen-auth::before,
  body.divido-premium.thrill .splash-logo,
  body.divido-premium.thrill .nw-card::before,
  body.divido-premium.thrill .nw-card::after,
  body.divido-premium.thrill .btn.primary,
  body.divido-premium.thrill .btn.primary::after,
  body.divido-premium.thrill .inv-now::after,
  body.divido-premium.thrill #start-invest::after,
  body.divido-premium.thrill .bar-fill::after,
  body.divido-premium.thrill .dv-sales-chip.hot,
  body.divido-premium.thrill .feat-ribbon span,
  body.divido-premium.thrill .thrill-orb,
  body.divido-premium.thrill #screen-auth .btn.primary.big {
    animation: none !important;
  }

  body.divido-premium.thrill .prop-card--simple:hover {
    transform: none !important;
  }
}



/* ============================================================
   UNIT CARD FULL METRICS + OVERFLOW FIX
   All decision numbers visible; nothing clipped out of box.
   ============================================================ */
body.divido-premium .prop-card,
body.divido-premium .prop-card--full,
body.divido-premium .prop-card--simple,
body.divido-premium .prop-card--featured {
  overflow: hidden !important;
  /* clip image radius only */
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
}

body.divido-premium .prop-bento,
body.divido-premium #prop-featured,
body.divido-premium #prop-list {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

body.divido-premium .prop-body {
  overflow: visible !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  padding: 14px 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

body.divido-premium .prop-title,
body.divido-premium .prop-card h3 {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: -.03em !important;
  line-height: 1.25 !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  max-width: 100% !important;
}

body.divido-premium .prop-loc-line {
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--dv-muted, #8A7B72) !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere;
  max-width: 100%;
}

/* 2×2 metrics grid — no overflow */
body.divido-premium .unit-metrics.card-metrics,
body.divido-premium .prop-card--full .card-metrics {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.divido-premium .unit-metrics .metric {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 8px 10px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, rgba(255, 106, 0, .08), rgba(255, 180, 100, .04)) !important;
  border: 1px solid rgba(255, 106, 0, .12) !important;
  box-sizing: border-box !important;
}

body.divido-premium .unit-metrics .m-icon {
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 9px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(135deg, #FF6A00, #FF8F3D) !important;
  box-shadow: 0 4px 10px rgba(255, 106, 0, .25) !important;
}

body.divido-premium .unit-metrics .m-icon img {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  filter: none !important;
  opacity: 1 !important;
}

body.divido-premium .unit-metrics .m-text {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

body.divido-premium .unit-metrics .m-label {
  display: block !important;
  font-size: 9.5px !important;
  font-weight: 700 !important;
  color: var(--dv-muted, #8A7B72) !important;
  letter-spacing: .02em !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.divido-premium .unit-metrics .m-val,
body.divido-premium .unit-metrics b {
  display: block !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #FF6A00 !important;
  line-height: 1.15 !important;
  letter-spacing: -.02em !important;
  overflow-wrap: anywhere !important;
  -webkit-text-fill-color: #FF6A00 !important;
  background: none !important;
}

/* Decision strip: appreciation / yield / total / monthly */
body.divido-premium .decision-row {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.divido-premium .decision-cell {
  min-width: 0 !important;
  padding: 8px 6px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .9) !important;
  border: 1px solid rgba(26, 18, 12, .06) !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

body.divido-premium.dark .decision-cell {
  background: rgba(40, 30, 24, .9) !important;
  border-color: rgba(255, 160, 80, .12) !important;
}

body.divido-premium .dc-label {
  display: block !important;
  font-size: 8.5px !important;
  font-weight: 700 !important;
  color: var(--dv-muted, #8A7B72) !important;
  line-height: 1.15 !important;
  margin-bottom: 3px !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.divido-premium .dc-val {
  display: block !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #FF6A00 !important;
  line-height: 1.1 !important;
  letter-spacing: -.02em !important;
  overflow-wrap: anywhere !important;
  -webkit-text-fill-color: #FF6A00 !important;
  background: none !important;
}

body.divido-premium .yield-one {
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: anywhere !important;
  font-size: 11.5px !important;
  line-height: 1.35 !important;
}

body.divido-premium .bar-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

body.divido-premium .bar-row .bar {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.divido-premium .bar-pct {
  flex: 0 0 auto !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  color: #FF6A00 !important;
}

body.divido-premium .fund-meta-line {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--dv-muted, #8A7B72) !important;
  max-width: 100% !important;
}

body.divido-premium .fund-meta-line .hot {
  color: #FF6A00 !important;
}

body.divido-premium .avail-line {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: var(--dv-ink, #1A120C) !important;
  max-width: 100%;
  overflow-wrap: anywhere;
}

body.divido-premium .avail-line b {
  color: #FF6A00;
}

body.divido-premium .card-cta-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

body.divido-premium .card-price {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  overflow-wrap: anywhere !important;
}

body.divido-premium .card-price b {
  font-size: 16px !important;
  overflow-wrap: anywhere;
}

body.divido-premium .card-cta-row .inv-now {
  flex: 0 0 auto !important;
  max-width: 46% !important;
  white-space: nowrap !important;
  padding: 11px 14px !important;
  font-size: 12.5px !important;
}

/* Featured: keep metrics readable */
body.divido-premium .prop-card--featured .unit-metrics {
  grid-template-columns: 1fr 1fr !important;
}

@media (min-width: 520px) {
  body.divido-premium .prop-card--featured {
    display: grid !important;
    grid-template-columns: 1.05fr 1fr !important;
    align-items: stretch !important;
  }

  body.divido-premium .prop-card--featured .pimg {
    height: 100% !important;
    min-height: 280px !important;
    max-height: none !important;
  }

  body.divido-premium .prop-bento {
    grid-template-columns: 1fr !important;
    /* full width cards so metrics never crush */
  }
}

/* On narrow phones, decision row 2×2 if needed */
@media (max-width: 360px) {
  body.divido-premium .decision-row {
    grid-template-columns: 1fr 1fr !important;
  }

  body.divido-premium .unit-metrics .m-label {
    font-size: 9px !important;
  }

  body.divido-premium .dc-label {
    font-size: 8px !important;
  }
}

/* Kill old "hide metrics on simple cards" rules */
body.divido-premium.orange-only .prop-card--simple .card-metrics,
body.divido-premium.orange-only .prop-card--full .card-metrics {
  display: grid !important;
}

body.divido-premium.orange-only .prop-card--simple .social-proof,
body.divido-premium.orange-only .prop-card--simple .inv-meta {
  display: none !important;
}

/* Image badges stay inside frame */
body.divido-premium .pimg {
  overflow: hidden !important;
  max-width: 100% !important;
}

body.divido-premium .pimg-badges {
  max-width: calc(100% - 20px) !important;
  box-sizing: border-box !important;
}

body.divido-premium .pimg-badges .p-badge {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Hide legacy free-floating absolute badges that escape the card */
body.divido-premium .prop-card--full .pimg>.p-badge.b-strat,
body.divido-premium .prop-card--full .pimg>.p-badge.b-type,
body.divido-premium .prop-card--full .pimg>.p-badge.b-src,
body.divido-premium .prop-card--full .pimg>.p-badge.b-new,
body.divido-premium .prop-card--full .pimg>.p-badge.b-urg,
body.divido-premium .prop-card--full .pimg>.p-badge.b-fund {
  /* badges only via .pimg-badges strip */
}



/* ============================================================
   APP SHEET + CALC + SWIPE + FULL BLEED
   ============================================================ */
html,
body {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: clip !important;
  overflow-y: scroll !important;
  overscroll-behavior-y: auto;
  background: #FBF6EF !important;
  touch-action: manipulation;
}

html.force-light body.dark {
  /* overridden on boot */
}

body.divido-premium,
body.divido-premium.thrill,
body.divido-premium.orange-only {
  height: auto !important;
  min-height: 100dvh !important;
  width: 100% !important;
  max-width: 100vw !important;
  overflow-x: clip !important;
  overflow-y: visible !important;
}

/* Full-bleed app surfaces — grow with content; window scrolls */
body.divido-premium #screen-app,
body.divido-premium #screen-auth {
  width: 100% !important;
  max-width: 100vw !important;
  height: auto !important;
  min-height: 100dvh !important;
  margin: 0 !important;
  padding-left: env(safe-area-inset-left) !important;
  padding-right: env(safe-area-inset-right) !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-y: auto;
  touch-action: pan-y pinch-zoom;
}

body.divido-premium .view {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  box-sizing: border-box !important;
}

body.divido-premium .app-header {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding-left: max(14px, env(safe-area-inset-left)) !important;
  padding-right: max(14px, env(safe-area-inset-right)) !important;
}

body.divido-premium .tabbar {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  padding-left: env(safe-area-inset-left) !important;
  padding-right: env(safe-area-inset-right) !important;
}

body.divido-premium .d-bottom {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* One logo on auth splash */
body.divido-premium .auth-top-minimal .logo-img {
  display: none !important;
}

body.divido-premium .auth-top-minimal {
  justify-content: flex-end !important;
}

body.divido-premium #screen-auth .splash-logo {
  margin-top: 8px;
}

/* Reduce layout shift: reserve loader space, stable type */
body.divido-premium .divido-app-loader {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
}

body.divido-premium .hg-name,
body.divido-premium .nw-val,
body.divido-premium .prop-title {
  min-height: 1.15em;
}

/* Days-left / hot pill — never broken wrap */
body.divido-premium .pill-hot,
body.divido-premium .d-cta-sub .hot,
body.divido-premium .tag.urg,
body.divido-premium .fund-meta-line .hot {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
  max-width: 100%;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #FF6A00, #FF8F3D) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  box-shadow: 0 6px 14px rgba(255, 106, 0, .25);
}

body.divido-premium .d-cta-sub {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  row-gap: 6px !important;
}

body.divido-premium .cta-shares {
  font-size: 12px;
  font-weight: 700;
  color: var(--dv-muted, #8A7B72);
}

body.divido-premium .pill-open {
  font-size: 11px;
  font-weight: 700;
  color: #16A34A;
}

/* Calculator box compact + stable */
body.divido-premium .calc-box {
  padding: 14px 14px 12px !important;
  border-radius: 20px !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.divido-premium .calc-amount {
  font-size: 26px !important;
  letter-spacing: -.04em;
  display: block;
  margin: 6px 0 10px;
}

body.divido-premium .calc-proj {
  margin-top: 10px;
  padding: 12px !important;
  border-radius: 16px !important;
  background: linear-gradient(145deg, #1A120C, #3D220F 70%, #FF6A00) !important;
  color: #fff !important;
}

body.divido-premium .calc-proj span {
  color: rgba(255, 248, 240, .8) !important;
  font-size: 11px;
}

body.divido-premium .calc-proj b {
  display: block;
  font-size: 24px !important;
  margin: 4px 0;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: none !important;
}

body.divido-premium .calc-return {
  display: inline-flex !important;
  background: rgba(34, 197, 94, .2) !important;
  color: #86EFAC !important;
  border-radius: 999px;
  padding: 3px 8px !important;
  font-size: 12px !important;
  font-weight: 800;
}

body.divido-premium .calc-mini-3 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 10px;
}

body.divido-premium .calc-mini-3 div {
  min-width: 0;
  padding: 8px 6px;
  border-radius: 12px;
  background: rgba(255, 106, 0, .06);
  border: 1px solid rgba(255, 106, 0, .1);
}

body.divido-premium .calc-mini-3 span {
  display: block;
  font-size: 9px;
  font-weight: 700;
  color: var(--dv-muted);
}

body.divido-premium .calc-mini-3 b {
  display: block;
  margin-top: 3px;
  font-size: 11px;
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  background: none !important;
  overflow-wrap: anywhere;
}

body.divido-premium .calc-note {
  margin: 8px 0 0;
  font-size: 10.5px;
  color: var(--dv-muted);
  line-height: 1.35;
}

body.divido-premium .calc-presets {
  gap: 6px !important;
}

body.divido-premium .cp {
  max-width: none !important;
  flex: 1 1 0 !important;
}

/* Invest amount quick chips */
body.divido-premium .amt-quick {
  display: flex;
  gap: 8px;
  margin: 8px 0 12px;
}

body.divido-premium .aq {
  flex: 1;
  border: 1.5px solid rgba(255, 106, 0, .18);
  background: #fff;
  border-radius: 12px;
  padding: 8px;
  font-weight: 800;
  font-size: 12.5px;
  color: var(--dv-ink);
  cursor: pointer;
  font-family: inherit;
}

body.divido-premium .aq.on {
  background: linear-gradient(135deg, #FF6A00, #FF8F3D);
  color: #fff;
  border-color: transparent;
}

/* Exit policy */
body.divido-premium .exit-grid-3 {
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}

@media (min-width: 420px) {
  body.divido-premium .exit-grid-3 {
    grid-template-columns: 1fr 1fr 1fr !important;
  }
}

body.divido-premium .policy-banner {
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255, 106, 0, .1), rgba(255, 180, 100, .06));
  border: 1px solid rgba(255, 106, 0, .18);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

body.divido-premium .policy-banner b {
  color: #FF6A00;
  font-size: 12.5px;
}

body.divido-premium .policy-banner span {
  font-size: 11.5px;
  color: var(--dv-muted);
  line-height: 1.4;
}

/* Order summary slightly tighter */
body.divido-premium .order-summary {
  padding: 12px !important;
  margin: 10px 0 12px !important;
}

body.divido-premium .calc-grid {
  gap: 8px !important;
}

body.divido-premium .calc-grid>div {
  padding: 8px !important;
}

/* Swipe reliability */
body.divido-premium .slide-track {
  touch-action: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

body.divido-premium .slide-thumb {
  pointer-events: auto !important;
  touch-action: none !important;
  cursor: grab;
}

body.divido-premium .slide-fill {
  background: linear-gradient(90deg, #FF4D00, #FF6A00 55%, #FFB067) !important;
}

/* Light mode preference */
body.divido-premium:not(.dark) {
  color-scheme: light;
}

/* Chat root above tabbar */
#divido-chat-root {
  z-index: 200 !important;
}

/* KYC */
body.divido-premium .kyc-status-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 8px 0 4px;
  padding: 0 2px;
}

body.divido-premium .kyc-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 800;
}

body.divido-premium .kyc-pill.ok {
  background: rgba(22, 163, 74, .12);
  color: #15803d;
}

body.divido-premium .kyc-pill.wait {
  background: rgba(255, 106, 0, .12);
  color: #c2410c;
}

body.divido-premium .kyc-hint {
  font-size: 11px;
  color: var(--dv-muted, #8A7B72);
}

body.divido-premium .kyc-invest-note {
  margin-top: 4px;
  font-size: 11.5px;
}

body.divido-premium .btn.sm {
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 10px;
}



/* ============================================================
   SMOOTH PERF PACK — fast tab switches, less paint lag
   ============================================================ */
html {
  scroll-behavior: auto !important;
  /* never smooth-scroll whole page */
}

body.divido-premium {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeSpeed;
}

/* Perf: do NOT use contain/content-visibility on .view — it collapses
   document scrollHeight so the page cannot scroll (mouse or touch). */
body.divido-premium .view {
  content-visibility: visible !important;
  contain: none !important;
}

body.divido-premium .prop-card,
body.divido-premium .prop-card--full,
body.divido-premium .fund-card,
body.divido-premium .inv-card,
body.divido-premium .w-stat,
body.divido-premium .metric {
  content-visibility: visible !important;
  contain: none !important;
  contain-intrinsic-size: none !important;
}

/* GPU-composited sticky chrome */
body.divido-premium .app-header,
body.divido-premium .tabbar,
body.divido-premium .d-bottom,
body.divido-premium .props-tools-sticky {
  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: transform;
}

/* Fast view enter — opacity + translate only (no blur = cheaper) */
@keyframes viewEnterSmooth {
  from {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

body.divido-premium .view.view-enter {
  animation: viewEnterSmooth .28s cubic-bezier(.22, 1, .36, 1) both !important;
  will-change: transform, opacity;
}

body.divido-premium.nav-switching .view.view-enter {
  animation-duration: .22s !important;
}

/* Kill expensive blur transitions during nav */
body.divido-premium.nav-switching .thrill-orb,
body.divido-premium.nav-switching .divido-network-progress {
  animation-play-state: paused !important;
}

body.divido-premium.nav-switching * {
  scroll-behavior: auto !important;
}

/* Soften ambient orbs on small screens */
@media (max-width: 480px) {
  body.divido-premium .thrill-orb {
    opacity: .35 !important;
    filter: blur(28px) !important;
  }

  body.divido-premium .thrill-orb.o2 {
    display: none !important;
  }

  /* pause infinite shine on many buttons while scrolling */
  body.divido-premium .btn.primary::after {
    animation-duration: 4.5s !important;
  }
}

/* Tab press feedback — snappy */
body.divido-premium .tabbar-btn {
  transition: color .15s ease, transform .12s ease !important;
  -webkit-tap-highlight-color: transparent;
}

body.divido-premium .tabbar-btn:active {
  transform: scale(.94);
}

body.divido-premium .tabbar-btn img {
  transition: opacity .15s ease, transform .15s ease;
}

body.divido-premium .tabbar-btn.on img {
  transform: translateY(-1px);
}

/* Cards: cheaper hover (no giant shadows on mobile) */
@media (hover: none) {

  body.divido-premium .prop-card:hover,
  body.divido-premium .prop-card--full:hover {
    transform: none !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .05) !important;
  }

  body.divido-premium .prop-card,
  body.divido-premium .prop-card--full {
    transition: transform .15s ease, opacity .15s ease !important;
  }
}

/* List stagger without JS */
body.divido-premium #prop-list .prop-card {
  animation: cardIn .34s cubic-bezier(.22, 1, .36, 1) both;
}

body.divido-premium #prop-list .prop-card:nth-child(1) {
  animation-delay: .02s;
}

body.divido-premium #prop-list .prop-card:nth-child(2) {
  animation-delay: .05s;
}

body.divido-premium #prop-list .prop-card:nth-child(3) {
  animation-delay: .08s;
}

body.divido-premium #prop-list .prop-card:nth-child(4) {
  animation-delay: .11s;
}

body.divido-premium #prop-list .prop-card:nth-child(5) {
  animation-delay: .14s;
}

body.divido-premium #prop-list .prop-card:nth-child(n+6) {
  animation-delay: .16s;
}

@keyframes cardIn {
  from {
    opacity: 0;
    transform: translate3d(0, 12px, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

/* Modal — already soft; ensure GPU */
body.divido-premium #modal.modal-open .modal-card,
body.divido-premium .modal-open .modal-card {
  will-change: transform, opacity;
  transform: translateZ(0);
}

/* Map lazy button */
body.divido-premium .map-lazy-btn {
  width: 100%;
  padding: 14px;
  border-radius: 14px;
  border: 1.5px dashed rgba(255, 106, 0, .35);
  background: rgba(255, 106, 0, .06);
  color: #FF6A00;
  font-weight: 800;
  font-size: 13px;
  font-family: inherit;
  cursor: pointer;
}

body.divido-premium .map-embed {
  width: 100%;
  min-height: 180px;
  border: 0;
  border-radius: 14px;
}

/* Skeleton shimmer cheaper */
body.divido-premium .skel {
  background: linear-gradient(90deg, #f0ebe3 25%, #f7f3ea 37%, #f0ebe3 63%);
  background-size: 400% 100%;
  animation: skel 1.1s ease infinite;
}

@keyframes skel {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: 0 0;
  }
}

/* Reduce motion — hard stop */
@media (prefers-reduced-motion: reduce) {

  body.divido-premium .view.view-enter,
  body.divido-premium #prop-list .prop-card,
  body.divido-premium .thrill-orb,
  body.divido-premium .btn.primary::after {
    animation: none !important;
    transition: none !important;
  }
}

/* Passive overscroll feel */
body.divido-premium #screen-app {
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
}

/* Detail open: hide tabbar without layout jump */
body.divido-premium.on-detail .tabbar {
  transform: translate3d(-50%, 150%, 0) !important;
  pointer-events: none !important;
  transition: transform .22s cubic-bezier(.22, 1, .36, 1), opacity .18s ease !important;
  opacity: 0 !important;
}

body.divido-premium:not(.on-detail) .tabbar {
  transition: transform .22s cubic-bezier(.22, 1, .36, 1), opacity .18s ease !important;
}

/* ---------- Centered Floating Bottom Tabbar — Shrunken Width, No Underline & No Shadows ---------- */
body.divido-premium .tabbar,
.tabbar {
  position: fixed !important;
  bottom: 16px !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 32px) !important;
  max-width: 480px !important;
  margin: 0 auto !important;
  background: rgba(255, 255, 255, 0.96) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-around !important;
  padding: 6px 10px !important;
  z-index: 9999 !important;
  border: 1px solid rgba(227, 218, 200, 0.7) !important;
  border-radius: 9999px !important;
  box-shadow: none !important;
}

body.divido-premium .tabbar-btn,
.tabbar-btn {
  flex: 1 !important;
  border: 0 !important;
  background: transparent !important;
  padding: 6px 10px !important;
  font-size: 11.5px !important;
  color: var(--dv-muted) !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  border-radius: 9999px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: none !important;
}

body.divido-premium .tabbar-btn img,
.tabbar-btn img {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  margin: 0 auto !important;
  transition: transform 0.2s ease !important;
  filter: none !important;
}

body.divido-premium .tabbar-btn.on,
.tabbar-btn.on {
  color: #FE6E00 !important;
  background: rgba(254, 110, 0, 0.1) !important;
  border-radius: 9999px !important;
  box-shadow: none !important;
}

body.divido-premium .tabbar-btn.on img,
.tabbar-btn.on img {
  transform: scale(1.06) !important;
  filter: none !important;
}

/* Strictly hide any line/indicator under active link */
body.divido-premium .tabbar-btn::after,
body.divido-premium .tabbar-btn.on::after,
body.divido-premium .tabbar-btn::before,
body.divido-premium .tabbar-btn.on::before,
.tabbar-btn::after,
.tabbar-btn.on::after,
.tabbar-btn::before,
.tabbar-btn.on::before {
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  height: 0 !important;
  width: 0 !important;
  box-shadow: none !important;
}

/* ---------- STRICT ZERO SHADOW & ORANGE GLOW REMOVAL ---------- */
body.divido-premium *,
body.divido-premium *::before,
body.divido-premium *::after,
body.divido-premium .btn,
body.divido-premium .btn.primary,
body.divido-premium .btn.primary:hover,
body.divido-premium .btn.primary:active,
body.divido-premium .fab,
body.divido-premium .logo-img,
body.divido-premium .splash-logo,
body.divido-premium .tabbar,
body.divido-premium .tabbar-btn,
body.divido-premium .tabbar-btn.on,
body.divido-premium .app-header,
body.divido-premium .prop-card,
body.divido-premium .banner-card,
body.divido-premium .wallet-hero,
body.divido-premium .inv-hero,
body.divido-premium .card-plain,
body.divido-premium .menu-list,
body.divido-premium .d-card,
body.divido-premium .modal-card,
body.divido-premium .toast,
body.divido-premium .chip,
body.divido-premium .tag,
body.divido-premium .save-btn,
body.divido-premium .round-btn,
body.divido-premium .chart circle {
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  -webkit-filter: none !important;
}

body.divido-premium .splash-glow,
body.divido-premium .splash-streak,
body.divido-premium .wallet-hero::after,
body.divido-premium .nw-card::after,
body.divido-premium .thrill-orb {
  display: none !important;
  background: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Theme override: White page background & light-orange shade for cards/buttons */
html,
body,
body.divido-premium,
.screen,
.view,
#screen-auth,
#screen-app,
#view-home,
#view-wallet,
#view-investments,
#view-rewards,
#view-profile,
#view-subpage {
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* Full Responsive Container Width (1400px Max Width, 32px Desktop Padding, 16px Mobile Padding) */
.container,
main,
.wrapper,
.view,
#screen-app .view,
#view-home,
#view-wallet,
#view-investments,
#view-rewards,
#view-profile,
#view-subpage,
body.divido-premium .view {
  width: 100% !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
  box-sizing: border-box !important;
}

@media (max-width: 768px) {

  .container,
  main,
  .wrapper,
  .view,
  #screen-app .view,
  #view-home,
  #view-wallet,
  #view-investments,
  #view-rewards,
  #view-profile,
  #view-subpage,
  body.divido-premium .view {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* Filter & Navigation Controls Overhaul: Modern Horizontal Toolbar */
#props-filters,
#home-sticky,
body.divido-premium #home-sticky {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 12px 0 !important;
  margin: 0 0 16px 0 !important;
  top: 56px !important;
  z-index: 25 !important;
}

/* Primary Segmented Toggle (Properties / Funds) Full Row */
#home-seg,
.seg#home-seg,
body.divido-premium #home-seg,
body.divido-premium .seg#home-seg {
  display: flex !important;
  align-items: center !important;
  background: #FFF !important;
  border-radius: 9999px !important;
  padding: 5px !important;
  margin: 0 0 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}

#home-seg .seg-btn,
body.divido-premium #home-seg .seg-btn {
  flex: 1 1 50% !important;
  width: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 40px !important;
  padding: 0 16px !important;
  border-radius: 9999px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border: 0 !important;
  background: transparent !important;
  color: #6E3B16 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

#home-seg .seg-btn.on,
body.divido-premium #home-seg .seg-btn.on {
  background: #FF6A00 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 14px rgba(255, 106, 0, 0.28) !important;
}

/* Center/Inline: Status Chips & Quick Sort Pills */
#status-tabs,
.quick-tools,
body.divido-premium #status-tabs,
body.divido-premium .quick-tools {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  flex: 1 1 auto !important;
}

/* Consistent Pills Styling for Status Chips & Quick Sort */
#status-tabs .chip,
.quick-tools .q-chip,
body.divido-premium #status-tabs .chip,
body.divido-premium .quick-tools .q-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 38px !important;
  padding: 0 16px !important;
  border-radius: 9999px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  background: #F4F4F5 !important;
  color: #27272A !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

#status-tabs .chip:hover,
.quick-tools .q-chip:hover {
  background: #E4E4E7 !important;
  color: #09090B !important;
}

#status-tabs .chip.on,
.quick-tools .q-chip.on,
body.divido-premium #status-tabs .chip.on,
body.divido-premium .quick-tools .q-chip.on {
  background: #18181B !important;
  color: #FFFFFF !important;
  border-color: #18181B !important;
  box-shadow: none !important;
}

/* Right Alignment: Filters Action Button */
.filters-open-btn,
#filters-open,
body.divido-premium .filters-open-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  height: 38px !important;
  padding: 0 20px !important;
  border-radius: 9999px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  border: none !important;
  background: #FE6E00 !important;
  color: #FFFFFF !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
}

.filters-open-btn:hover {
  background: #e06100 !important;
}

/* Soft Contrast Card Component Styling */
body.divido-premium .prop-card,
body.divido-premium .fund-card,
body.divido-premium .inv-card,
body.divido-premium .card-plain,
body.divido-premium .menu-list,
body.divido-premium .media-card,
body.divido-premium .modal-card,
body.divido-premium .modal-sheet,
body.divido-premium .d-card,
body.divido-premium .w-stat,
body.divido-premium .metric,
body.divido-premium .tx,
body.divido-premium .pnl-row,
body.divido-premium .sim-card,
body.divido-premium .how-card,
body.divido-premium .q-card,
body.divido-premium .strat-card,
body.divido-premium .lease-card,
body.divido-premium .guarantee-card,
body.divido-premium .dev-card,
body.divido-premium .exit-card,
body.divido-premium .calc-box,
body.divido-premium .why-card,
body.divido-premium .chart,
body.divido-premium .code-box,
body.divido-premium .skel-card,
body.divido-premium .hs-item,
body.divido-premium .order-summary,
.prop-card,
.card-plain,
.menu-list,
.d-card,
.sim-card,
.tx,
.metric,
.pill,
.calc-box,
.banner-card {
  background: #FFF5EE !important;
  background-color: #FFF5EE !important;
  border-color: rgba(254, 110, 0, 0.18) !important;
}

/* Strict Zero Shadow Removal */
body.divido-premium *,
body.divido-premium *::before,
body.divido-premium *::after,
body.divido-premium .btn,
body.divido-premium .btn.primary,
body.divido-premium .btn.primary:hover,
body.divido-premium .btn.primary:active,
body.divido-premium .fab,
body.divido-premium .tabbar,
body.divido-premium .tabbar-btn,
body.divido-premium .tabbar-btn.on,
body.divido-premium .prop-card,
body.divido-premium .chip.on,
.btn,
.btn.primary,
.fab,
.chip.on {
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
  -webkit-filter: none !important;
}

/* Properties Section - Featured Hero Card & Properties Grid Layout */
#prop-featured,
body.divido-premium #prop-featured {
  display: block !important;
  width: 100% !important;
  margin-bottom: 24px !important;
}

#prop-featured .prop-card--featured,
body.divido-premium #prop-featured .prop-card--featured {
  display: grid !important;
  grid-template-columns: 1.15fr 1fr !important;
  align-items: stretch !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

#prop-featured .prop-card--featured .pimg,
body.divido-premium #prop-featured .prop-card--featured .pimg {
  height: 100% !important;
  min-height: 280px !important;
  max-height: 380px !important;
}

#prop-list,
.prop-bento,
#fund-list,
#inv-list,
body.divido-premium #prop-list,
body.divido-premium .prop-bento,
body.divido-premium #fund-list,
body.divido-premium #inv-list {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

#prop-list .prop-card,
.prop-bento .prop-card,
#fund-list .prop-card,
#inv-list .prop-card,
body.divido-premium #prop-list .prop-card,
body.divido-premium .prop-bento .prop-card,
body.divido-premium #fund-list .prop-card,
body.divido-premium #inv-list .prop-card {
  grid-column: auto !important;
  width: 100% !important;
  margin-bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

@media (max-width: 991px) {

  #prop-list,
  .prop-bento,
  #fund-list,
  #inv-list,
  body.divido-premium #prop-list,
  body.divido-premium .prop-bento,
  body.divido-premium #fund-list,
  body.divido-premium #inv-list {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }
}

@media (max-width: 639px) {

  #prop-list,
  .prop-bento,
  #fund-list,
  #inv-list,
  body.divido-premium #prop-list,
  body.divido-premium .prop-bento,
  body.divido-premium #fund-list,
  body.divido-premium #inv-list {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
}

/* ============================================================
   USER CUSTOM ENHANCEMENTS OVERRIDES
   ============================================================ */

/* 1. Neutral-25 Page Background (#FAF9F6) */
html,
body,
.screen,
#screen-auth,
#screen-app {
  background: #FAF9F6 !important;
  color: #1C1A17 !important;
}

body.divido-premium.modern-orange,
body.divido-premium.modern-orange #screen-auth {
  background: #FAF9F6 !important;
}

body.dark,
body.divido-premium.dark,
body.divido-premium.modern-orange.dark,
body.divido-premium.modern-orange.dark #screen-auth {
  background: #14110F !important;
  color: #F4F2EE !important;
}

/* Remove wrapper container backgrounds so content sits directly on page background */
.view,
#view-home,
#view-wallet,
#view-investments,
#view-rewards,
#view-profile,
.auth-split-wrapper,
.auth-split-form,
.auth-form-card,
.home-greet,
#props-area,
#funds-area {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* 2. REMOVE ALL CORNER BRACKET MARKS (┌ ┐ └ ┘) FROM ALL CARDS */
.prop-card::before,
.prop-card::after,
.fund-card::before,
.fund-card::after,
.card-plain::before,
.card-plain::after,
.card-corner,
body.divido-premium.modern-orange.px-futuristic .prop-card::before,
body.divido-premium.modern-orange.px-futuristic .fund-card::before,
body.divido-premium.modern-orange.px-futuristic .prop-card::after,
body.divido-premium.modern-orange.px-futuristic .fund-card::after {
  display: none !important;
  opacity: 0 !important;
  content: none !important;
  border: none !important;
}

/* 3. REMOVE ALL PRIMARY / ORANGE BOX-SHADOWS & DROP-SHADOWS */
.btn.primary,
.btn.whatsapp,
.inv-now,
#start-invest,
.p-badge,
.tag,
.tag.urg,
.pill-hot,
.hot,
.dv-sales-chip.hot,
.filters-open-btn,
.card-icon,
.metric-icon,
.divido-loader-mark,
.w-act.pay-ready,
body.divido-premium.modern-orange .btn.primary,
body.divido-premium.modern-orange .inv-now,
body.divido-premium.modern-orange #start-invest,
body.divido-premium.modern-orange .dv-sales-chip.hot,
body.divido-premium .pill-hot,
body.divido-premium .tag.urg,
body.divido-premium.modern-orange #screen-auth .btn.primary.big {
  box-shadow: none !important;
  filter: none !important;
  -webkit-filter: none !important;
  text-shadow: none !important;
}

/* 4. Home Stats Cards (.hs-item) Clean White Style (No Peach / No Shadow) */
body.divido-premium .home-stats .hs-item,
body.divido-premium .hs-item,
.hs-item {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: none !important;
  border-radius: 16px !important;
  padding: 12px 8px !important;
}

body.divido-premium .home-stats .hs-item b,
body.divido-premium .hs-item b,
.hs-item b {
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  background: none !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}

body.divido-premium.modern-orange .nw-card,
.nw-card {
  box-shadow: none !important;
  margin-bottom: 16px !important;
}

/* 5. Glassy Navbar - No Bottom Border, No Shadow */
body.divido-premium .app-header,
.app-header {
  background: transparent !important;
  backdrop-filter: blur(20px) saturate(1.8) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.8) !important;
  border-bottom: none !important;
  box-shadow: none !important;
}

body.dark .app-header,
body.divido-premium.dark .app-header {
  background: transparent !important;
  border-bottom: none !important;
}

body.divido-premium .app-header .logo-img,
.app-header .logo-img {
  height: 38px !important;
  width: auto !important;
  max-width: 160px;
  object-fit: contain;
}

/* 6. Centered Floating Glassy Bottom Bar (No shadow) */
body.divido-premium .tabbar,
.tabbar {
  position: fixed !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  bottom: max(16px, env(safe-area-inset-bottom)) !important;
  width: min(480px, calc(100vw - 32px)) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.88) !important;
  backdrop-filter: blur(24px) saturate(1.8) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.8) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 6px 12px !important;
  z-index: 100 !important;
}

body.dark .tabbar,
body.divido-premium.dark .tabbar {
  background: rgba(26, 20, 18, 0.88) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
}

body.divido-premium .tabbar-btn.on img {
  filter: none !important;
}

/* 7. Align Chat Floating Icon Parallel to Bottom Bar */
iframe[src*="chat.divido"],
div[class*="chat-launcher"],
div[class*="chat-button"],
.chat-widget-fab {
  bottom: max(16px, env(safe-area-inset-bottom)) !important;
  right: 20px !important;
}

/* 8. Segmented Language Switch (Clean active pill, NO overlapping circle) */
.lang-segmented-switch {
  display: inline-flex !important;
  align-items: center !important;
  background: rgba(0, 0, 0, 0.06) !important;
  border-radius: 999px !important;
  padding: 2px !important;
  gap: 1px !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: none !important;
}

.lang-seg-btn {
  border: 0 !important;
  background: transparent !important;
  padding: 4px 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  color: #645C54 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  line-height: 1.1 !important;
  box-shadow: none !important;
}

.lang-segmented-switch.is-en .lang-seg-en,
.lang-segmented-switch.is-ar .lang-seg-ar {
  background: #FF6A00 !important;
  color: #FFFFFF !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}

body.dark .lang-segmented-switch {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

body.dark .lang-seg-btn {
  color: #A69E96 !important;
}

body.dark .lang-segmented-switch.is-en .lang-seg-en,
body.dark .lang-segmented-switch.is-ar .lang-seg-ar {
  background: #FF6A00 !important;
  color: #FFFFFF !important;
}

/* 9. Clean UX Filters & Sort Bar Alignment */
.filter-top-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-bottom: 10px !important;
}

.filter-controls-right {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.sort-select-btn {
  height: 36px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  color: #2C2621 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  outline: none !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.sort-select-btn:hover {
  border-color: rgba(255, 106, 0, 0.4) !important;
}

.filters-open-btn {
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  background: #FF6A00 !important;
  color: #ffffff !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  border: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

.status-tabs-container {
  width: 100% !important;
  display: flex !important;
}

.status-tabs-container .chips {
  width: 100% !important;
}

/* 10. Auth Tab Switcher (Login / Sign Up) & Subtle Form Card Primary Ambient Tint */
.auth-seg-pill {
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 999px !important;
  padding: 4px !important;
  box-shadow: none !important;
  display: flex !important;
  gap: 4px !important;
  margin-bottom: 20px !important;
}

.auth-seg-tab {
  flex: 1 !important;
  border: 0 !important;
  background: transparent !important;
  padding: 8px 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #706860 !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

.auth-seg-tab.active {
  background: rgba(255, 106, 0, 0.12) !important;
  color: #FF6A00 !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}

.auth-split-form,
.auth-form-card {
  background: linear-gradient(180deg, rgba(255, 106, 0, 0.035) 0%, rgba(255, 106, 0, 0.01) 100%), #FAF9F6 !important;
  box-shadow: none !important;
}

/* 11. Remove Borders and Shadows from Trust Chips (.dv-sales-chip) */
.dv-sales-chip,
.hcchip,
.d-chip,
.trust-chip,
body.divido-premium .dv-sales-chip,
body.divido-premium.modern-orange .dv-sales-chip {
  border: none !important;
  box-shadow: none !important;
  background: #FFFFFF !important;
}

/* 12. Section Titles: Larger Heading, No Orange Underline */
.sec-title,
h2.sec-title,
body.divido-premium .sec-title {
  border-bottom: none !important;
  background-image: none !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #1C1A17 !important;
  letter-spacing: -.02em !important;
}

.sec-title::after,
.sec-title::before,
body.divido-premium .sec-title::after,
body.divido-premium .sec-title::before {
  display: none !important;
  content: none !important;
  border: none !important;
  background: none !important;
}

/* 13. Single Line Greeting Header */
.home-greet .hg-left {
  display: flex !important;
  align-items: center !important;
}

.hg-single-line,
body.divido-premium .hg-single-line {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 0 !important;
  letter-spacing: 0 !important;
}

.hg-hi,
.hg-name,
.hg-wave,
body.divido-premium .hg-hi,
body.divido-premium .hg-name,
body.divido-premium .hg-wave,
body.divido-premium.modern-orange .hg-hi,
body.divido-premium.modern-orange .hg-name {
  color: #1C1A17 !important;
  -webkit-text-fill-color: #1C1A17 !important;
  background: none !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

.hg-wave,
body.divido-premium .hg-wave {
  display: inline-block !important;
  font-style: normal !important;
  font-size: 24px !important;
  margin-left: 2px !important;
}

/* 15. Unit Metrics Cards Formatting (No Empty Whitespace, Clean Solid Style) */
body.divido-premium .unit-metrics.card-metrics,
body.divido-premium .prop-card--full .card-metrics,
.unit-metrics {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin: 10px 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.divido-premium .unit-metrics .metric,
.unit-metrics .metric {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 10px 12px !important;
  border-radius: 14px !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.07) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

body.divido-premium .unit-metrics .m-icon,
.unit-metrics .m-icon {
  flex: 0 0 34px !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(255, 106, 0, 0.08) !important;
  box-shadow: none !important;
  border: none !important;
}

body.divido-premium .unit-metrics .m-icon img,
.unit-metrics .m-icon img {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  filter: none !important;
  opacity: 1 !important;
}

body.divido-premium .unit-metrics .m-text,
.unit-metrics .m-text {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 2px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

body.divido-premium .unit-metrics .m-label,
.unit-metrics .m-label {
  display: block !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  color: #706860 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.divido-premium .unit-metrics .m-val,
body.divido-premium .unit-metrics b,
.unit-metrics .m-val {
  display: block !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #1C1A17 !important;
  line-height: 1.2 !important;
  letter-spacing: -.01em !important;
  -webkit-text-fill-color: #1C1A17 !important;
  background: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.dark body.divido-premium .unit-metrics .metric,
body.dark .unit-metrics .metric {
  background: rgba(30, 24, 22, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

body.dark body.divido-premium .unit-metrics .m-val,
body.dark .unit-metrics .m-val {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* Net Worth Expressive Eye Button */
.nw-eye,
body.divido-premium .nw-eye {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.2) !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.nw-eye:hover {
  background: rgba(255, 255, 255, 0.35) !important;
}

/* 16. Segmented Switcher Refinement (Larger Height, No Border, Lighter Orange Tint) */
.auth-seg-pill,
.lang-segmented-switch,
body.divido-premium .auth-seg-pill {
  background: #FFFFFF !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 4px !important;
  box-shadow: none !important;
  min-height: 42px !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.auth-seg-tab,
.lang-seg-btn,
body.divido-premium .auth-seg-tab {
  flex: 1 !important;
  border: 0 !important;
  background: transparent !important;
  padding: 8px 16px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #706860 !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

.auth-seg-tab.active,
.lang-seg-btn.on,
body.divido-premium .auth-seg-tab.active {
  background: rgba(255, 106, 0, 0.08) !important;
  color: #FF6A00 !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  border: none !important;
}

/* 17. Bottom Navigation Bar Pill, Glassy, Zero Shadow, Library Icons */
.tabbar,
body.divido-premium .tabbar {
  border-radius: 9999px !important;
  box-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, 0.5) !important;
  background: rgba(255, 255, 255, 0.75) !important;
  backdrop-filter: blur(16px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
}

.tabbar-btn,
body.divido-premium .tabbar-btn {
  border-radius: 9999px !important;
}

.tabbar-btn .tab-ic,
body.divido-premium .tabbar-btn .tab-ic {
  font-size: 22px !important;
  color: #706860 !important;
  transition: color 0.2s ease, transform 0.2s ease !important;
  margin-bottom: 3px !important;
  display: block !important;
}

.tabbar-btn.on .tab-ic,
body.divido-premium .tabbar-btn.on .tab-ic {
  color: #FF6A00 !important;
  transform: scale(1.08) !important;
}

.tabbar-btn.on span,
body.divido-premium .tabbar-btn.on span {
  color: #FF6A00 !important;
  font-weight: 700 !important;
}

/* 18. Complete UI Overhaul & Clean Architecture Overrides */

/* Auth Segmented Toggle: Height equal to primary button (50px), soft orange tint, no border */
.auth-seg-pill,
body.divido-premium .auth-seg-pill {
  min-height: 50px !important;
  height: 50px !important;
  background: #FFFFFF !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 4px !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.auth-seg-tab,
body.divido-premium .auth-seg-tab {
  flex: 1 !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #706860 !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

.auth-seg-tab.active,
body.divido-premium .auth-seg-tab.active {
  background: rgba(255, 106, 0, 0.08) !important;
  color: #FF6A00 !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  border: none !important;
}

/* Top Navbar: Transparent at top, glassy ONLY when scrolled */
.app-header,
body.divido-premium .app-header,
body.divido-premium.modern-orange .app-header,
body.divido-premium.orange-only .app-header {
  background: transparent !important;
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition: background 0.25s ease, border-color 0.25s ease, backdrop-filter 0.25s ease !important;
}

.app-header.is-scrolled,
body.divido-premium .app-header.is-scrolled,
body.divido-premium.modern-orange .app-header.is-scrolled {
  background: rgba(250, 249, 246, 0.85) !important;
  backdrop-filter: blur(16px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

/* Header circle action buttons (#hdr-saved, #hdr-bell, #dark-toggle) in clean white circle */
#hdr-saved,
#hdr-bell,
#dark-toggle,
.app-header .hdr-btn,
body.divido-premium .hdr-btn {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#hdr-saved .icon-img,
#hdr-bell .icon-img,
#dark-toggle .icon-img {
  background: transparent !important;
  border: none !important;
}

/* Compact Language Toggle Matching Header Icons Height */
#lang-toggle,
.lang-segmented-switch,
body.divido-premium .lang-segmented-switch {
  min-height: 34px !important;
  height: 34px !important;
  padding: 2px !important;
  gap: 2px !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: 999px !important;
  display: flex !important;
  align-items: center !important;
}

#lang-toggle .lang-seg-btn,
.lang-segmented-switch .lang-seg-btn,
body.divido-premium .lang-segmented-switch .lang-seg-btn {
  padding: 4px 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  line-height: 1 !important;
  border: none !important;
}

#lang-toggle .lang-seg-btn.on,
.lang-segmented-switch .lang-seg-btn.on,
body.divido-premium .lang-segmented-switch .lang-seg-btn.on {
  background: rgba(255, 106, 0, 0.12) !important;
  color: #FF6A00 !important;
  font-weight: 700 !important;
}

/* Uniform Greeting Font Weight (Matches word INVESTOR) */
.hg-hi,
.hg-name,
body.divido-premium .hg-hi,
body.divido-premium .hg-name {
  font-weight: 700 !important;
}

/* Destroy nw-eye and nw-card streak/halo pseudoelements */
.nw-card::before,
.nw-card::after,
.nw-eye::before,
.nw-eye::after,
.eye-btn::before,
.eye-btn::after,
body.divido-premium .nw-card::before,
body.divido-premium .nw-card::after,
body.divido-premium .nw-eye::before,
body.divido-premium .nw-eye::after,
body.divido-premium.modern-orange .nw-card::before,
body.divido-premium.modern-orange .nw-card::after,
body.divido-premium.thrill .nw-card::before,
body.divido-premium.thrill .nw-card::after {
  display: none !important;
  content: none !important;
  background: none !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.nw-eye,
body.divido-premium .nw-eye {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.18) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  display: grid !important;
  place-items: center !important;
  box-shadow: none !important;
}

/* Clean Tabbar Pills — Destroy tall vertical rectangular columns across ALL theme classes */
.tabbar::before,
.tabbar::after,
.tabbar-btn::before,
.tabbar-btn::after,
body.divido-premium .tabbar::before,
body.divido-premium .tabbar::after,
body.divido-premium .tabbar-btn::before,
body.divido-premium .tabbar-btn::after,
body.divido-premium.modern-orange .tabbar-btn::before,
body.divido-premium.modern-orange .tabbar-btn::after,
body.divido-premium.px-futuristic .tabbar-btn::before,
body.divido-premium.px-futuristic .tabbar-btn::after,
body.divido-premium.thrill .tabbar-btn::before,
body.divido-premium.thrill .tabbar-btn::after {
  display: none !important;
  content: none !important;
  background: none !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

/* Clean Minimal Bottom Tabbar - No Tall Floating Box, No Pillars, Just Clean Filled Icons */
.tabbar,
body.divido-premium .tabbar {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  transform: none !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 58px !important;
  min-height: 58px !important;
  max-height: 58px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-around !important;
  z-index: 100 !important;
}

.tabbar-btn,
body.divido-premium .tabbar-btn {
  flex: 1 !important;
  height: 58px !important;
  max-height: 58px !important;
  min-height: 58px !important;
  border: none !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 4px 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  cursor: pointer !important;
}

.tabbar-btn::before,
.tabbar-btn::after,
.tabbar-btn.on::before,
.tabbar-btn.on::after,
body.divido-premium .tabbar-btn::before,
body.divido-premium .tabbar-btn::after,
body.divido-premium .tabbar-btn.on::before,
body.divido-premium .tabbar-btn.on::after {
  display: none !important;
  content: none !important;
  background: none !important;
  opacity: 0 !important;
}

.tabbar-btn.on,
body.divido-premium .tabbar-btn.on {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

.tabbar-btn .tab-ic,
body.divido-premium .tabbar-btn .tab-ic {
  font-size: 24px !important;
  color: #706860 !important;
  display: block !important;
  margin: 0 auto 2px !important;
  transition: color 0.15s ease, transform 0.15s ease !important;
}

.tabbar-btn.on .tab-ic,
body.divido-premium .tabbar-btn.on .tab-ic {
  color: #FF6A00 !important;
  transform: scale(1.08) !important;
}

.tabbar-btn span,
body.divido-premium .tabbar-btn span {
  font-size: 10.5px !important;
  font-weight: 500 !important;
  color: #71717A !important;
  line-height: 1.2 !important;
  letter-spacing: 0.01em !important;
}

.tabbar-btn.on span,
body.divido-premium .tabbar-btn.on span {
  color: #FF6A00 !important;
  font-weight: 600 !important;
}

/* 1. Properties Heading & Units Counter */
.sec-title,
h2.sec-title,
body.divido-premium .sec-title {
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #1C1A17 !important;
  letter-spacing: -0.02em !important;
  margin: 18px 0 14px !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
}

#prop-count,
.sec-count {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #8A7F76 !important;
  letter-spacing: 0.02em !important;
}

/* 2. Property Card Price Size */
.prop-price,
body.divido-premium .prop-price,
body.divido-premium.modern-orange .prop-price {
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: #FF6A00 !important;
}

.prop-price b,
body.divido-premium .prop-price b {
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #FF6A00 !important;
}

/* 3. Language Toggle Active Button: Perfect Circle */
#lang-toggle,
.lang-segmented-switch,
body.divido-premium .lang-segmented-switch {
  height: 36px !important;
  min-height: 36px !important;
  padding: 3px !important;
  gap: 4px !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}

#lang-toggle .lang-seg-btn,
.lang-segmented-switch .lang-seg-btn,
body.divido-premium .lang-segmented-switch .lang-seg-btn {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #706860 !important;
  background: transparent !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

#lang-toggle .lang-seg-btn.on,
.lang-segmented-switch .lang-seg-btn.on,
.lang-segmented-switch.is-en .lang-seg-en,
.lang-segmented-switch.is-ar .lang-seg-ar,
body.divido-premium .lang-segmented-switch .lang-seg-btn.on {
  background: #FF6A00 !important;
  color: #FFFFFF !important;
  border-radius: 50% !important;
  font-weight: 800 !important;
}

/* 4. Filter Toolbar: Balanced Across Full Width, Understandable Clean UX/UI */
#props-filters,
#home-sticky,
body.divido-premium #home-sticky {
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin-bottom: 12px !important;
  padding: 8px 0 !important;
}

.filter-top-bar {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
}

.filter-controls-right {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.sort-select-btn {
  height: 38px !important;
  padding: 0 14px !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1C1A17 !important;
  cursor: pointer !important;
  outline: none !important;
}

.filters-open-btn {
  height: 38px !important;
  padding: 0 16px !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1C1A17 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: background 0.2s ease !important;
}

.filters-open-btn:hover {
  background: #F9F8F6 !important;
}

/* Status Chips Row: No Giant Empty White Box */
.status-tabs-container {
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.status-tabs-container .chips,
#status-tabs {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  overflow-x: auto !important;
}

#status-tabs .chip {
  height: 34px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border: 1px solid rgba(0, 0, 0, 0.07) !important;
  background: #F5F4F0 !important;
  color: #5C554E !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  margin: 0 !important;
}

#status-tabs .chip.on {
  background: #1C1A17 !important;
  color: #FFFFFF !important;
  border-color: #1C1A17 !important;
  font-weight: 700 !important;
}

/* 5. Net Worth Card & Wallet Card Matches Exactly with Increased Luxury Padding */
.nw-card,
body.divido-premium .nw-card,
body.divido-premium.modern-orange .nw-card,
body.divido-premium.orange-only .nw-card,
body.divido-premium.thrill .nw-card {
  padding: 28px 32px 26px !important;
}

.wallet-hero,
.wallet-hero.hero-white,
#wallet-card,
body.divido-premium .wallet-hero,
body.divido-premium.modern-orange .wallet-hero,
body.divido-premium.orange-only .wallet-hero,
body.divido-premium.thrill .wallet-hero {
  isolation: isolate !important;
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 160, 80, 0.22) !important;
  border-radius: 28px !important;
  background: linear-gradient(145deg, #120C0A 0%, #24150F 38%, #4A2410 78%, #FF6A00 155%) !important;
  box-shadow:
    0 28px 60px rgba(255, 90, 20, 0.22),
    0 10px 24px rgba(20, 12, 8, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  padding: 28px 32px 26px !important;
  color: #ffffff !important;
  margin-bottom: 20px !important;
}

@media (max-width: 640px) {

  .nw-card,
  body.divido-premium .nw-card,
  .wallet-hero,
  #wallet-card,
  body.divido-premium .wallet-hero {
    padding: 22px 20px 20px !important;
  }
}

.wallet-hero .w-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 6px !important;
}

.wallet-hero .w-label,
body.divido-premium .wallet-hero .w-label {
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.65) !important;
  margin: 0 !important;
}

.wallet-hero #w-eye,
.wallet-hero .nw-eye,
.wallet-hero .eye-btn {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  padding: 0 !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

.wallet-hero #w-eye:hover,
.wallet-hero .nw-eye:hover,
.wallet-hero .eye-btn:hover {
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: rgba(255, 160, 80, 0.35) !important;
}

.wallet-hero #w-eye i,
.wallet-hero .nw-eye i,
.wallet-hero .eye-btn i {
  color: #ffffff !important;
  font-size: 16px !important;
}

.wallet-hero .w-balance,
body.divido-premium .wallet-hero .w-balance {
  font-size: 36px !important;
  font-weight: 800 !important;
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  letter-spacing: -0.03em !important;
  display: block !important;
  margin: 4px 0 8px !important;
  line-height: 1.15 !important;
  filter: drop-shadow(0 0 16px rgba(255, 140, 60, 0.25)) !important;
}

.wallet-hero .w-sub-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  font-size: 12.5px !important;
  color: rgba(255, 255, 255, 0.68) !important;
  font-weight: 500 !important;
  margin-bottom: 20px !important;
  line-height: 1.4 !important;
}

.wallet-hero .w-sub,
body.divido-premium .wallet-hero .w-sub {
  font-size: 12.5px !important;
  color: rgba(255, 255, 255, 0.68) !important;
  font-weight: 500 !important;
}

.wallet-hero .w-actions {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 10px !important;
  margin-bottom: 18px !important;
}

.wallet-hero .w-act,
body.divido-premium .wallet-hero .w-act {
  background: rgba(255, 255, 255, 0.07) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  border-radius: 16px !important;
  padding: 12px 6px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

.wallet-hero .w-act:hover {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 160, 80, 0.4) !important;
  transform: translateY(-2px) !important;
}

.wallet-hero .w-act i {
  color: #FF6A00 !important;
  font-size: 19px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.2s ease !important;
}

.wallet-hero .w-act:hover i {
  transform: scale(1.1) !important;
}

.wallet-hero .w-act span {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
}

.wallet-hero .w-sales-tip {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 999px !important;
  padding: 9px 18px !important;
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.82) !important;
  text-align: center !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}

.wallet-hero .w-sales-tip b {
  color: #FF6A00 !important;
  font-weight: 700 !important;
}

/* 6. Funds Cards Matching Properties Cards Design System */
.fund-card,
body.divido-premium .fund-card {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.fund-card:hover,
body.divido-premium .fund-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08) !important;
}

.fund-card .pimg,
body.divido-premium .fund-card .pimg {
  width: 100% !important;
  height: 200px !important;
  border-radius: 20px 20px 0 0 !important;
  background: #F4F2EE !important;
  overflow: hidden !important;
  position: relative !important;
}

.fund-card .pimg img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

#fund-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important;
  gap: 16px !important;
}

/* 7. Remove Huge Empty Space at Bottom of Home */
.view,
#view-home,
body.divido-premium .view {
  padding-bottom: 72px !important;
}

/* 8. Global Icon Protection (Never inherit 190px or sand backgrounds) */
i,
i.ph,
i[class*="ph-"],
.tab-ic,
.icon-img,
.save-ic {
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Sales Strip In Same Row As Heading (Pushed to far right on Mobile & Desktop) */
.home-greet,
body.divido-premium .home-greet {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
}

.home-greet .hg-left,
body.divido-premium .home-greet .hg-left {
  flex: 0 0 auto !important;
}

.dv-sales-strip,
body.divido-premium .dv-sales-strip {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  margin-left: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  gap: 8px !important;
  overflow-x: auto !important;
  white-space: nowrap !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  flex: 0 1 auto !important;
}

.dv-sales-strip::-webkit-scrollbar {
  display: none !important;
}

html[dir="rtl"] .dv-sales-strip,
html[dir="rtl"] body.divido-premium .dv-sales-strip {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* 9. Header Language Switcher Single Button */
.hdr-lang-btn,
#lang-toggle,
#lang-toggle-auth {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  border-radius: 50% !important;
  background: #FFFFFF !important;
  border: 1px solid #E4E4E7 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

.hdr-lang-btn:hover,
#lang-toggle:hover,
#lang-toggle-auth:hover {
  background: #F4F4F5 !important;
  border-color: #D4D4D8 !important;
  transform: translateY(-1px) !important;
}

.hdr-lang-btn .lang-code,
#lang-toggle .lang-code,
#lang-toggle-auth .lang-code {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #1C1A17 !important;
  line-height: 1 !important;
}

/* 10. Properties / Funds Full-Width Row & Light Primary Background (No Gray) */
.filter-top-bar {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
  margin-bottom: 14px !important;
}

#home-seg,
.seg#home-seg {
  width: 100% !important;
  display: flex !important;
  background: #FFF5EC !important;
  /* Very light primary peach */
  border: 1px solid rgba(255, 106, 0, 0.18) !important;
  border-radius: 9999px !important;
  padding: 5px !important;
  box-sizing: border-box !important;
}

#home-seg .seg-btn,
.seg#home-seg .seg-btn {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 10px 16px !important;
  border-radius: 9999px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #6E3B16 !important;
  /* Warm dark copper tint, NOT gray */
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

#home-seg .seg-btn:hover {
  background: rgba(255, 106, 0, 0.08) !important;
  color: #FF6A00 !important;
}

#home-seg .seg-btn.on,
.seg#home-seg .seg-btn.on {
  background: #FF6A00 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  filter: none !important;
}

#home-seg .seg-btn.on i {
  color: #FFFFFF !important;
}

#home-seg .seg-btn:not(.on) i {
  color: #6E3B16 !important;
}

/* 10. Filter Controls Row: Chips on the right, Sort/Filters in the same row */
.filter-controls-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
  margin-bottom: 14px !important;
  flex-wrap: wrap !important;
}

.filter-controls-left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  order: 1 !important;
}

.status-tabs-container {
  display: flex !important;
  align-items: center !important;
  margin-left: auto !important;
  order: 2 !important;
}

html[dir="rtl"] .filter-controls-left {
  order: 2 !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

html[dir="rtl"] .status-tabs-container {
  order: 1 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.status-chips-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
}

/* Funds Sub-Filters: Hidden from page body, now integrated into Filters Drawer */
.fund-filters-row,
#funds-area .fund-filters-row {
  display: none !important;
}

#funds-area .chips,
#fund-src-chips,
#fund-type-chips,
.fund-filters-row .chips,
body.divido-premium.modern-orange #funds-area .chips,
body.divido-premium.modern-orange #fund-src-chips,
body.divido-premium.modern-orange #fund-type-chips {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  width: auto !important;
}

#fund-type-chips,
body.divido-premium.modern-orange #fund-type-chips {
  margin-left: auto !important;
}

html[dir="rtl"] #fund-type-chips,
html[dir="rtl"] body.divido-premium.modern-orange #fund-type-chips {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Inactive chips with pure white background, active chip dark */
#status-tabs .chip:not(.on),
.status-chips-row .chip:not(.on),
#funds-area .chip:not(.on),
#fund-src-chips .chip:not(.on),
#fund-type-chips .chip:not(.on),
.chips .chip:not(.on),
.chip:not(.on) {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  color: #1C1A17 !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

#status-tabs .chip:not(.on):hover,
.status-chips-row .chip:not(.on):hover,
#funds-area .chip:not(.on):hover,
#fund-src-chips .chip:not(.on):hover,
#fund-type-chips .chip:not(.on):hover,
.chip:not(.on):hover {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border-color: rgba(255, 106, 0, 0.35) !important;
}

#status-tabs .chip.on,
.status-chips-row .chip.on,
#funds-area .chip.on,
#fund-src-chips .chip.on,
#fund-type-chips .chip.on,
.chips .chip.on,
.chip.on {
  background: #18181B !important;
  background-color: #18181B !important;
  color: #FFFFFF !important;
  border: 1px solid #18181B !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
}

/* Select Dropdown with comfortable right padding so arrow never touches border */
.sort-select-wrap {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
}

.sort-select-btn {
  height: 38px !important;
  padding-left: 16px !important;
  padding-right: 36px !important;
  border-radius: 9999px !important;
  border: 1px solid rgba(255, 106, 0, 0.25) !important;
  background: #FFFFFF !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1C1A17 !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

html[dir="rtl"] .sort-select-btn {
  padding-left: 36px !important;
  padding-right: 16px !important;
}

.filters-open-btn {
  height: 38px !important;
  padding: 0 18px !important;
  border-radius: 9999px !important;
  background: #FF6A00 !important;
  border: 1px solid #FF6A00 !important;
  color: #FFFFFF !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  box-shadow: 0 4px 12px rgba(255, 106, 0, 0.25) !important;
}

.filters-open-btn i {
  color: #FFFFFF !important;
}

/* 11. Home Stats Cards Matching Top Cards Exactly */
.home-stats,
body.divido-premium .home-stats {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
}

.home-stats .hs-item,
body.divido-premium .home-stats .hs-item,
.hs-item {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 16px !important;
  padding: 14px 10px !important;
  text-align: center !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

.home-stats .hs-item b,
body.divido-premium .home-stats .hs-item b,
.hs-item b {
  display: block !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  margin-bottom: 4px !important;
  line-height: 1.2 !important;
}

.home-stats .hs-item span,
body.divido-premium .home-stats .hs-item span,
.hs-item span {
  display: block !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #52525b !important;
  text-transform: none !important;
  line-height: 1.2 !important;
}

/* 12. Wallet Card Large Balance Font & Glowing Effect */
.wallet-hero .w-balance,
body.divido-premium .wallet-hero .w-balance {
  font-size: 44px !important;
  font-weight: 900 !important;
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  margin: 4px 0 8px !important;
  line-height: 1.15 !important;
}

.wallet-hero #w-eye i,
.wallet-hero .nw-eye i,
.wallet-hero .eye-btn i {
  color: #ffffff !important;
  font-size: 18px !important;
  display: block !important;
}

/* 13. Remove ANY letter-spacing across the entire app */
*,
*::before,
*::after,
h1,
h2,
h3,
h4,
h5,
h6,
.sec-title,
.auth-welcome-title,
.w-balance,
.nw-val,
.w-label,
.nw-label,
.btn,
.chip,
.tag,
.badge,
.seg-btn,
.hs-item span,
.hs-item b,
.dc-label,
.dc-val,
.m-label,
.m-val,
.p-badge,
.tabbar-btn span {
  letter-spacing: normal !important;
}

/* ============================================================
   USER SPECIFIC DESIGN SYSTEM REFINEMENTS & FIXES
   ============================================================ */

/* 1. Login Page (#screen-auth) White Background with Ambient Soft Primary Orange Glow */
#screen-auth,
body.divido-premium #screen-auth,
body.divido-premium.modern-orange #screen-auth {
  background:
    radial-gradient(circle at 10% 15%, rgba(255, 106, 0, 0.025) 0%, transparent 45%),
    radial-gradient(circle at 85% 85%, rgba(255, 106, 0, 0.015) 0%, transparent 40%),
    #FFFFFF !important;
  color: #1C1A17 !important;
}

body.divido-premium #screen-auth .auth-split-wrapper,
body.divido-premium #screen-auth .auth-split-form,
body.divido-premium #screen-auth .auth-form-card {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* 2. Trust Cards (.dv-trust-cell) Matching First 3 Home Cards (.hs-item) Font-Size & Weight */
body.divido-premium .dv-trust-row,
.dv-trust-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 12px !important;
  margin: 0 0 16px 0 !important;
}

body.divido-premium .dv-trust-cell,
.dv-trust-cell {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 16px !important;
  padding: 14px 10px !important;
  text-align: center !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #52525b !important;
  line-height: 1.2 !important;
}

body.divido-premium .dv-trust-cell b,
.dv-trust-cell b {
  display: block !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  margin-bottom: 4px !important;
  line-height: 1.2 !important;
}

/* 3. Filter Controls Row: Single Row, Status Tabs on Left, Sort/Filters on Right (LTR) */
.filter-controls-row {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
  margin-bottom: 14px !important;
}

.filter-controls-left {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  order: 2 !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  flex-shrink: 0 !important;
}

.status-tabs-container {
  display: flex !important;
  align-items: center !important;
  order: 1 !important;
  margin-right: auto !important;
  margin-left: 0 !important;
  flex-shrink: 0 !important;
}

html[dir="rtl"] .filter-controls-left {
  order: 2 !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

html[dir="rtl"] .status-tabs-container {
  order: 1 !important;
  margin-right: 0 !important;
  margin-left: auto !important;
}

/* 4. Unselected Status Chips Gray Background -> White */
#status-tabs .chip,
#status-tabs .chip:not(.on),
.status-chips-row .chip:not(.on),
body.divido-premium #status-tabs .chip:not(.on) {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  color: #1C1A17 !important;
  box-shadow: none !important;
}

#status-tabs .chip.on,
.status-chips-row .chip.on,
body.divido-premium #status-tabs .chip.on {
  background: #18181B !important;
  background-color: #18181B !important;
  color: #FFFFFF !important;
  border-color: #18181B !important;
}

/* 5. Header Language Switcher Button "AR" Smaller, Lighter Font, Centered in Circle */
.hdr-lang-btn,
#lang-toggle,
#lang-toggle-auth,
body.divido-premium .lang-toggle {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: 50% !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.hdr-lang-btn .lang-code,
#lang-toggle .lang-code,
#lang-toggle-auth .lang-code,
body.divido-premium .lang-toggle .lang-code {
  font-size: 10px !important;
  font-weight: 500 !important;
  color: #1C1A17 !important;
  line-height: 1 !important;
  letter-spacing: 0.02em !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 6. Unify Segmented Tabs Text Color (#1C1A17) - Remove Copper/Brownish Color */
#home-seg .seg-btn,
body.divido-premium #home-seg .seg-btn,
.seg-btn {
  color: #1C1A17 !important;
}

#home-seg .seg-btn:not(.on) i,
.seg-btn:not(.on) i {
  color: #1C1A17 !important;
}

#home-seg .seg-btn span,
.seg-btn span {
  color: inherit !important;
}

/* 7. Remove Shadow & Glow from Active Segmented Tab */
#home-seg .seg-btn.on,
body.divido-premium #home-seg .seg-btn.on,
.seg-btn.on {
  background: #FF6A00 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  filter: none !important;
  -webkit-filter: none !important;
  drop-shadow: none !important;
}

#home-seg .seg-btn.on i {
  color: #FFFFFF !important;
}

/* 8. Custom Dropdown & Native Arrow Padding Fix */
.sort-select-wrap {
  position: relative !important;
  display: inline-block !important;
}

.sort-select-btn {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-color: #FFFFFF !important;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%231C1A17" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>') !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  padding: 0 36px 0 16px !important;
  height: 36px !important;
  border-radius: 9999px !important;
  border: 1px solid rgba(255, 106, 0, 0.25) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1C1A17 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

html[dir="rtl"] .sort-select-btn {
  background-position: left 14px center !important;
  padding: 0 16px 0 36px !important;
}

.sort-select-btn:hover,
.sort-select-btn:focus {
  border-color: #FF6A00 !important;
  outline: none !important;
}

/* Custom UI Dropdown Floating Card */
.custom-dropdown-container {
  position: relative;
  display: inline-block;
}

.custom-dropdown-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 36px;
  padding: 0 16px;
  background: #FFFFFF;
  border: 1px solid rgba(255, 106, 0, 0.25);
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 600;
  color: #1C1A17;
  cursor: pointer;
  transition: all 0.2s ease;
  user-select: none;
}

.custom-dropdown-trigger:hover,
.custom-dropdown-container.open .custom-dropdown-trigger {
  border-color: #FF6A00;
  box-shadow: 0 2px 8px rgba(255, 106, 0, 0.12);
}

.custom-dropdown-trigger .dd-arrow {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  transition: transform 0.2s ease;
}

html[dir="rtl"] .custom-dropdown-trigger .dd-arrow {
  margin-left: 0;
  margin-right: 6px;
}

.custom-dropdown-container.open .custom-dropdown-trigger .dd-arrow {
  transform: rotate(180deg);
}

.custom-dropdown-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 200px;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 16px;
  padding: 6px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04);
  z-index: 9999;
  display: none;
  flex-direction: column;
  gap: 2px;
  animation: ddFadeIn 0.15s cubic-bezier(0.16, 1, 0.3, 1);
}

html[dir="rtl"] .custom-dropdown-menu {
  right: auto;
  left: 0;
}

.custom-dropdown-container.open .custom-dropdown-menu {
  display: flex;
}

.custom-dropdown-item {
  padding: 10px 14px;
  font-size: 13px;
  font-weight: 600;
  color: #3F3F46;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.15s ease;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.custom-dropdown-item:hover {
  background: rgba(255, 106, 0, 0.08);
  color: #FF6A00;
}

.custom-dropdown-item.selected {
  background: rgba(255, 106, 0, 0.12);
  color: #FF6A00;
  font-weight: 700;
}

@keyframes ddFadeIn {
  from {
    opacity: 0;
    transform: translateY(-6px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* ============================================================
   ADDITIONAL FIXES & REFINEMENTS
   ============================================================ */

/* 1. Filter Controls: Strictly Single Row, Status Tabs on Left, Sort & Filters on the Right */
/* 1. Filter Controls: Strictly Single Row, Status Tabs on Left, Sort & Filters on the Right */
.filter-controls-row {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  margin: 0 0 14px 0 !important;
  padding: 0 !important;
}

.status-tabs-container {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

.status-chips-row,
#status-tabs {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.filter-controls-left {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  flex-shrink: 0 !important;
}

html[dir="rtl"] .filter-controls-left {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Compact sizing to comfortably fit on one row and align strictly with page bounds */
#status-tabs .chip,
.status-chips-row .chip {
  height: 40px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  border-radius: 9999px !important;
  flex-shrink: 0 !important;
}

.sort-select-btn,
.custom-dropdown-trigger {
  height: 32px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  width: auto !important;
  max-width: none !important;
  border-radius: 9999px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

.filters-open-btn {
  height: 32px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  border-radius: 9999px !important;
  flex-shrink: 0 !important;
}

.filters-open-btn i {
  font-size: 13px !important;
}

/* 2. Desktop View: Bottom Sheets Centered Popup Cards */
@media (min-width: 768px) {

  .filters-drawer,
  #filters-drawer,
  .modal-sheet,
  .modal-card,
  .p-modal,
  .sheet,
  .drawer,
  .bottom-sheet {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    bottom: auto !important;
    right: auto !important;
    transform: translate(-50%, -50%) scale(0.96) !important;
    width: min(92vw, 540px) !important;
    max-width: 540px !important;
    border-radius: 28px !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28) !important;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.28s ease !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    margin: 0 !important;
  }

  .filters-drawer.open,
  #filters-drawer.open,
  .modal-sheet.open,
  .modal-sheet.active,
  .modal-card.open,
  .p-modal.open,
  .sheet.open,
  .drawer.open,
  .bottom-sheet.open {
    transform: translate(-50%, -50%) scale(1) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}

/* 3. Wallet Page (#view-wallet): Light Orange Cards -> Crisp Pure White (#FFFFFF) */
#view-wallet .w-stat,
#view-wallet .w-pnl,
#view-wallet .w-alloc,
#view-wallet .tx,
#view-wallet .metric,
#view-wallet .card-plain,
#view-wallet .w-pnl-card,
#view-wallet .wallet-card,
#view-wallet .how-card,
#view-wallet .q-card {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: none !important;
}

/* Remove white containers from Transactions header, daily dividers, and allocations */
#view-wallet .w-tx-head,
.w-tx-head,
.tx-day,
#view-wallet .tx-day,
#tx-list .tx-day,
.alloc-row,
#w-alloc-list,
#w-alloc-list .alloc-row,
#view-wallet .alloc-row {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* 4. Restore exact dark background for .w-act inside .wallet-hero */
.wallet-hero .w-act,
body.divido-premium .wallet-hero .w-act,
#view-wallet .wallet-hero .w-act {
  background: rgba(255, 255, 255, 0.07) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  border-radius: 16px !important;
  padding: 12px 6px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

.wallet-hero .w-act:hover,
#view-wallet .wallet-hero .w-act:hover {
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 160, 80, 0.4) !important;
  transform: translateY(-2px) !important;
}

.wallet-hero .w-act i,
#view-wallet .wallet-hero .w-act i {
  color: #FF6A00 !important;
  font-size: 19px !important;
}

.wallet-hero .w-act span,
#view-wallet .wallet-hero .w-act span {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
}

/* 5. Hide Empty State Placeholder ("No properties match your filters.") */
.empty-note,
p.empty-note,
body.divido-premium .empty-note {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
}

/* 6. Unified Design System: Light Container for ANY icon inside a container */
.m-icon,
.tx-ic,
.action-ic,
.icon-box,
.ic-box,
.w-stat .m-icon,
.metric .m-icon,
.unit-metrics .m-icon,
body.divido-premium .m-icon,
body.divido-premium .tx-ic {
  background: rgba(255, 106, 0, 0.08) !important;
  background-color: rgba(255, 106, 0, 0.08) !important;
  border-radius: 12px !important;
  display: inline-grid !important;
  place-items: center !important;
  border: 1px solid rgba(255, 106, 0, 0.12) !important;
  box-shadow: none !important;
  color: #FF6A00 !important;
}

.m-icon img,
.w-stat .m-icon img,
.metric .m-icon img,
.unit-metrics .m-icon img,
body.divido-premium .m-icon img {
  filter: none !important;
  opacity: 1 !important;
}

.m-icon i,
.tx-ic i,
.icon-box i,
.ic-box i {
  color: #FF6A00 !important;
}

/* 7. Unified Net P&L Card (.w-pnl) Design Polish */
#view-wallet .w-pnl,
.w-pnl {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 20px !important;
  padding: 18px 20px !important;
  margin: 14px 0 !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  box-sizing: border-box !important;
}

#view-wallet .w-pnl .pnl-row,
.w-pnl .pnl-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

#view-wallet .w-pnl .pnl-lbl,
.pnl-lbl {
  display: block !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #71717A !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  margin-bottom: 4px !important;
}

#view-wallet .w-pnl .pnl-row b,
.w-pnl .pnl-row b,
.pnl-row b {
  font-size: 28px !important;
  font-weight: 800 !important;
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  line-height: 1.2 !important;
}

#view-wallet .w-pnl .pnl-badge,
.pnl-badge {
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 6px 12px !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

#view-wallet .w-pnl .pnl-badge.pos,
.pnl-badge.pos {
  background: #ECFDF5 !important;
  color: #059669 !important;
  border: 1px solid rgba(5, 150, 105, 0.15) !important;
}

#view-wallet .w-pnl .pnl-sub,
.pnl-sub {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  padding-top: 14px !important;
  margin: 0 !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-bottom: none !important;
  border-left: none !important;
  border-right: none !important;
  font-size: 12.5px !important;
  color: #71717A !important;
}

#view-wallet .w-pnl .pnl-sub span,
.pnl-sub span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

#view-wallet .w-pnl .pnl-sub b,
.pnl-sub b {
  color: #18181B !important;
  font-weight: 700 !important;
}

/* 8. Remove ALL borders from Asset Allocation rows (.alloc-row) */
.alloc-row,
#w-alloc-list .alloc-row,
#view-wallet .alloc-row,
#view-wallet #w-alloc-list>div {
  border: none !important;
  border-bottom: none !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  padding: 8px 0 !important;
}

/* 9. Auth Tab Switcher Font Sizing, Weight & Subtle Gray Border */
.auth-seg-pill,
body.divido-premium .auth-seg-pill {
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  background: #FFFFFF !important;
  border-radius: 9999px !important;
  padding: 4px !important;
  box-shadow: none !important;
}

.auth-seg-tab {
  font-size: 12px !important;
  font-weight: 500 !important;
}

.auth-seg-tab.active {
  font-size: 12px !important;
  font-weight: 600 !important;
}

/* 10. Transaction Filter Chips Spacing & Container Removal */
#tx-filters,
.chips#tx-filters {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

#tx-filters .chip,
.chips#tx-filters .chip {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  color: #1C1A17 !important;
  border-radius: 9999px !important;
  padding: 0 14px !important;
  height: 32px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  margin: 0 !important;
  transition: all 0.2s ease !important;
}

#tx-filters .chip:hover,
.chips#tx-filters .chip:hover {
  border-color: rgba(255, 106, 0, 0.4) !important;
}

#tx-filters .chip.on,
.chips#tx-filters .chip.on {
  background: #18181B !important;
  background-color: #18181B !important;
  color: #FFFFFF !important;
  border-color: #18181B !important;
  font-weight: 700 !important;
}

/* 11. Distinct Visual Icon Containers for Transaction Types */
/* Investment: Warm Divido Orange */
.tx-investment .tx-ic,
.tx-type-investment,
.tx[data-tx-type="investment"] .tx-ic {
  background: rgba(255, 106, 0, 0.1) !important;
  background-color: rgba(255, 106, 0, 0.1) !important;
  color: #FF6A00 !important;
  border: 1px solid rgba(255, 106, 0, 0.22) !important;
}

/* Deposit: Fresh Mint Green */
.tx-deposit .tx-ic,
.tx-type-deposit,
.tx[data-tx-type="deposit"] .tx-ic {
  background: rgba(16, 185, 129, 0.12) !important;
  background-color: rgba(16, 185, 129, 0.12) !important;
  color: #059669 !important;
  border: 1px solid rgba(16, 185, 129, 0.22) !important;
}

/* Referral Bonus & Rewards: Primary Warm Orange */
.tx-referral_bonus .tx-ic,
.tx-reward .tx-ic,
.tx-type-referral_bonus,
.tx-type-reward,
.tx[data-tx-type="referral_bonus"] .tx-ic,
.tx[data-tx-type="reward"] .tx-ic {
  background: rgba(255, 106, 0, 0.08) !important;
  background-color: rgba(255, 106, 0, 0.08) !important;
  color: #FF6A00 !important;
  border: 1px solid rgba(255, 106, 0, 0.18) !important;
}

/* Withdrawal: Gentle Coral Rose / Red */
.tx-withdrawal .tx-ic,
.tx-type-withdrawal,
.tx[data-tx-type="withdrawal"] .tx-ic {
  background: rgba(239, 68, 68, 0.1) !important;
  background-color: rgba(239, 68, 68, 0.1) !important;
  color: #DC2626 !important;
  border: 1px solid rgba(239, 68, 68, 0.22) !important;
}

/* ============================================================
   UNIFIED DESIGN SYSTEM: INVESTMENTS & REWARDS PAGES
   Strictly aligned with Home (#view-home) & Wallet (#view-wallet)
   ============================================================ */

/* 1. Hero Cards (.rewards-hero) -> Dark Hero Card */
.rewards-hero,
#rewards-hero-card,
.rewards-hero.hero-white,
body.divido-premium .rewards-hero,
#view-rewards .rewards-hero {
  isolation: isolate !important;
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 160, 80, 0.22) !important;
  border-radius: 28px !important;
  background: linear-gradient(145deg, #120C0A 0%, #24150F 38%, #4A2410 78%, #FF6A00 155%) !important;
  box-shadow:
    0 28px 60px rgba(255, 90, 20, 0.22),
    0 10px 24px rgba(20, 12, 8, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  padding: 28px 32px 26px !important;
  color: #ffffff !important;
  margin-bottom: 20px !important;
}

/* LIGHT CARD style for Investments Hero Card (.inv-hero) */
.inv-hero,
#inv-hero-card,
.inv-hero.hero-white,
body.divido-premium .inv-hero,
body.divido-premium #inv-hero-card,
#view-investments .inv-hero,
#view-investments #inv-hero-card {
  isolation: isolate !important;
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 106, 0, 0.18) !important;
  border-radius: 28px !important;
  background: #FFFFFF !important;
  background-image: linear-gradient(135deg, #FFFFFF 0%, #FFFDF9 100%) !important;
  box-shadow: 0 14px 36px rgba(255, 106, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.03) !important;
  padding: 28px 32px 26px !important;
  color: #18181B !important;
  margin-bottom: 20px !important;
}

.inv-hero span,
#inv-hero-card span,
body.divido-premium .inv-hero span {
  color: #71717A !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}

.inv-hero b,
.inv-hero #inv-value,
#inv-hero-card b,
#inv-hero-card #inv-value,
body.divido-premium .inv-hero b {
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  letter-spacing: -0.5px !important;
}

.inv-hero #inv-sub,
#inv-hero-card #inv-sub,
body.divido-premium .inv-hero #inv-sub {
  color: #71717A !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

@media (max-width: 640px) {

  .inv-hero,
  .rewards-hero,
  #inv-hero-card,
  #rewards-hero-card,
  body.divido-premium .inv-hero,
  body.divido-premium .rewards-hero,
  #view-investments .inv-hero,
  #view-rewards .rewards-hero {
    padding: 22px 20px 20px !important;
  }
}

/* Decorative luxury ambient ring */
.inv-hero::after,
.rewards-hero::after,
body.divido-premium .inv-hero::after,
body.divido-premium .rewards-hero::after {
  content: "" !important;
  position: absolute !important;
  width: 180px !important;
  height: 180px !important;
  right: -58px !important;
  top: -72px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 0 0 18px rgba(255, 255, 255, 0.03), 0 0 0 36px rgba(255, 255, 255, 0.018) !important;
  pointer-events: none !important;
}

/* Hero Top row & Label */
.inv-hero .w-top,
.rewards-hero .w-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 6px !important;
}

.inv-hero .w-label,
.rewards-hero .w-label,
body.divido-premium .inv-hero .w-label,
body.divido-premium .rewards-hero .w-label {
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: normal !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.65) !important;
  margin: 0 !important;
}

/* Hero Huge Balance */
.inv-hero .w-balance,
.rewards-hero .w-balance,
body.divido-premium .inv-hero .w-balance,
body.divido-premium .rewards-hero .w-balance {
  font-size: 44px !important;
  font-weight: 900 !important;
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  margin: 4px 0 8px !important;
  line-height: 1.15 !important;
  letter-spacing: normal !important;
}

/* Hero Subtitle */
.inv-hero .w-sub,
.rewards-hero .w-sub,
body.divido-premium .inv-hero .w-sub,
body.divido-premium .rewards-hero .w-sub {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.75) !important;
  letter-spacing: normal !important;
}

/* Rewards Hero Tier Progress Bar */
.rewards-hero .tier-progress,
body.divido-premium .rewards-hero .tier-progress {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 12px 0 8px !important;
  width: 100% !important;
  position: relative !important;
  z-index: 2 !important;
}

.rewards-hero .tier-track,
body.divido-premium .rewards-hero .tier-track {
  flex: 1 !important;
  height: 8px !important;
  border-radius: 9999px !important;
  background: rgba(255, 255, 255, 0.18) !important;
  overflow: hidden !important;
}

.rewards-hero .tier-bar,
body.divido-premium .rewards-hero .tier-bar {
  height: 100% !important;
  border-radius: 9999px !important;
  background: linear-gradient(90deg, #FF6A00, #FFA15E) !important;
  transition: width 0.6s ease !important;
}

.rewards-hero #r-tier-txt,
body.divido-premium .rewards-hero #r-tier-txt {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.85) !important;
  white-space: nowrap !important;
}

/* Rewards Sales Tip Pill in Hero */
.rewards-hero .w-sales-tip,
body.divido-premium .rewards-hero .w-sales-tip {
  display: inline-flex !important;
  align-items: center !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  border-radius: 9999px !important;
  padding: 6px 14px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.85) !important;
  margin: 8px 0 0 0 !important;
  position: relative !important;
  z-index: 2 !important;
}

/* 2. Stat Cards Grid (#inv-stats & #r-stats) -> Identical to Wallet #w-stats */
#inv-stats,
#r-stats,
body.divido-premium #inv-stats,
body.divido-premium #r-stats {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 12px !important;
  margin: 0 0 20px 0 !important;
  width: 100% !important;
}

#inv-stats .w-stat,
#r-stats .w-stat,
body.divido-premium #inv-stats .w-stat,
body.divido-premium #r-stats .w-stat {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 16px !important;
  padding: 14px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  transition: transform 0.2s ease, border-color 0.2s ease !important;
}

#inv-stats .w-stat:hover,
#r-stats .w-stat:hover {
  border-color: rgba(255, 106, 0, 0.25) !important;
}

#inv-stats .w-stat .m-icon,
#r-stats .w-stat .m-icon,
body.divido-premium #inv-stats .m-icon,
body.divido-premium #r-stats .m-icon {
  background: rgba(255, 106, 0, 0.08) !important;
  background-color: rgba(255, 106, 0, 0.08) !important;
  border: 1px solid rgba(255, 106, 0, 0.12) !important;
  border-radius: 12px !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  color: #FF6A00 !important;
}

#inv-stats .w-stat .ws-txt,
#r-stats .w-stat .ws-txt {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
}

#inv-stats .w-stat .ws-txt b,
#r-stats .w-stat .ws-txt b {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #18181B !important;
  line-height: 1.2 !important;
  margin-bottom: 2px !important;
  display: block !important;
  letter-spacing: normal !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#inv-stats .w-stat .ws-txt span,
#r-stats .w-stat .ws-txt span {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #71717A !important;
  line-height: 1.2 !important;
  display: block !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* 3. Investments Segmented Switcher (#inv-seg) -> Identical to #home-seg */
#inv-seg,
.seg#inv-seg,
body.divido-premium #inv-seg {
  width: 100% !important;
  display: flex !important;
  background: #FFF5EC !important;
  border: 1px solid rgba(255, 106, 0, 0.18) !important;
  border-radius: 9999px !important;
  padding: 5px !important;
  box-sizing: border-box !important;
  margin: 0 0 16px 0 !important;
  gap: 4px !important;
}

#inv-seg .seg-btn,
body.divido-premium #inv-seg .seg-btn {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 10px 16px !important;
  border-radius: 9999px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #1C1A17 !important;
  border: none !important;
  background: transparent !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: none !important;
}

#inv-seg .seg-btn * {
  pointer-events: none !important;
}

#inv-seg .seg-btn.on,
body.divido-premium #inv-seg .seg-btn.on {
  background: #FF6A00 !important;
  background-color: #FF6A00 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

#inv-seg .seg-btn.on i {
  color: #FFFFFF !important;
}

#inv-seg .seg-btn:not(.on) i {
  color: #1C1A17 !important;
}

/* 4. Investment Cards (.inv-card) -> Pure Crisp White Card Design System */
.inv-card,
body.divido-premium .inv-card,
#view-investments .inv-card {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: none !important;
  margin: 0 0 16px 0 !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
}

.inv-card:hover,
body.divido-premium .inv-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06) !important;
  border-color: rgba(255, 106, 0, 0.25) !important;
}

.inv-imgw,
body.divido-premium .inv-imgw {
  height: 160px !important;
  position: relative !important;
  overflow: hidden !important;
  background: #F4F4F5 !important;
  border-radius: 20px 20px 0 0 !important;
}

.inv-imgw img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.inv-imgw .p-badge,
body.divido-premium .inv-imgw .p-badge {
  position: absolute !important;
  bottom: 12px !important;
  right: 12px !important;
  border-radius: 9999px !important;
  padding: 5px 12px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: normal !important;
}

html[dir="rtl"] .inv-imgw .p-badge {
  right: auto !important;
  left: 12px !important;
}

.inv-imgw .p-badge.b-full {
  background: #ECFDF5 !important;
  color: #059669 !important;
  border: 1px solid rgba(5, 150, 105, 0.2) !important;
}

.inv-imgw .p-badge.b-pend {
  background: #FFFBEB !important;
  color: #D97706 !important;
  border: 1px solid rgba(217, 119, 6, 0.2) !important;
}

.inv-body,
body.divido-premium .inv-body {
  padding: 16px 18px 18px !important;
}

.inv-title,
body.divido-premium .inv-title {
  font-size: 16px !important;
  font-weight: 800 !important;
  color: #18181B !important;
  margin-bottom: 4px !important;
  display: block !important;
  letter-spacing: normal !important;
}

.inv-loc,
body.divido-premium .inv-loc {
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: #71717A !important;
  margin-bottom: 14px !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

.inv-loc img {
  width: 14px !important;
  height: 14px !important;
  opacity: 0.7 !important;
}

.inv-rows,
body.divido-premium .inv-rows {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 10px !important;
}

.inv-rows div,
body.divido-premium .inv-rows div {
  background: #FAFAFA !important;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  border-radius: 12px !important;
  padding: 10px 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.inv-rows span,
body.divido-premium .inv-rows span {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #71717A !important;
  text-transform: uppercase !important;
  letter-spacing: normal !important;
  margin: 0 !important;
}

.inv-rows b,
body.divido-premium .inv-rows b {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #18181B !important;
  line-height: 1.2 !important;
  letter-spacing: normal !important;
}

/* 5. Rewards Refer Card (.card-plain) -> Pure Crisp White Card */
#view-rewards .card-plain,
body.divido-premium #view-rewards .card-plain {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 20px !important;
  padding: 24px 20px !important;
  box-shadow: none !important;
  margin-bottom: 24px !important;
}

#view-rewards .card-plain .hint,
body.divido-premium #view-rewards .card-plain .hint {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #52525B !important;
  text-align: center !important;
  margin: 0 0 16px 0 !important;
}

#view-rewards .card-plain .hint b {
  color: #FF6A00 !important;
  font-weight: 800 !important;
}

/* Referral Code Box */
#view-rewards .code-box,
body.divido-premium #view-rewards .code-box,
.code-box {
  background: #FFF5EC !important;
  background-color: #FFF5EC !important;
  border: 1.5px dashed rgba(255, 106, 0, 0.45) !important;
  border-radius: 16px !important;
  padding: 16px 20px !important;
  margin: 12px 0 18px 0 !important;
  text-align: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: none !important;
}

#view-rewards .code-box b,
.code-box b {
  font-size: 24px !important;
  font-weight: 900 !important;
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  letter-spacing: 2px !important;
  font-family: monospace, inherit !important;
  line-height: 1 !important;
}

/* Referral Actions */
#view-rewards .ref-actions,
.ref-actions {
  display: flex !important;
  gap: 10px !important;
  margin-bottom: 20px !important;
  width: 100% !important;
}

#copy-code-r,
body.divido-premium #copy-code-r {
  flex: 1 !important;
  height: 44px !important;
  background: #FF6A00 !important;
  color: #FFFFFF !important;
  border-radius: 9999px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: 0 4px 14px rgba(255, 106, 0, 0.25) !important;
  transition: all 0.2s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#copy-code-r:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(255, 106, 0, 0.35) !important;
}

#share-code-r,
body.divido-premium #share-code-r {
  flex: 1 !important;
  height: 44px !important;
  background: #25D366 !important;
  color: #FFFFFF !important;
  border-radius: 9999px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  border: none !important;
  cursor: pointer !important;
  box-shadow: 0 4px 14px rgba(37, 211, 102, 0.25) !important;
  transition: all 0.2s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#share-code-r:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(37, 211, 102, 0.35) !important;
}

/* Steps Row */
#view-rewards .r-steps,
.r-steps {
  display: flex !important;
  gap: 10px !important;
  margin-top: 14px !important;
  width: 100% !important;
}

#view-rewards .r-step,
.r-step {
  flex: 1 !important;
  background: #FAFAFA !important;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  border-radius: 14px !important;
  padding: 14px 8px !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
  box-shadow: none !important;
}

#view-rewards .r-step .step-n,
.r-step .step-n {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: rgba(255, 106, 0, 0.1) !important;
  color: #FF6A00 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(255, 106, 0, 0.2) !important;
}

#view-rewards .r-step b,
.r-step b {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #18181B !important;
  line-height: 1.25 !important;
  letter-spacing: normal !important;
}

/* 6. Rewards History List (#r-list) -> Aligned with Wallet #tx-list */
#r-list .tx,
body.divido-premium #r-list .tx {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 16px !important;
  padding: 14px 16px !important;
  margin: 0 0 8px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-shadow: none !important;
  transition: border-color 0.2s ease !important;
}

#r-list .tx:hover {
  border-color: rgba(255, 106, 0, 0.25) !important;
}

#r-list .tx .tx-ic {
  background: rgba(255, 106, 0, 0.08) !important;
  background-color: rgba(255, 106, 0, 0.08) !important;
  color: #FF6A00 !important;
  border: 1px solid rgba(255, 106, 0, 0.18) !important;
  border-radius: 12px !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
}

#r-list .tx .tx-mid {
  flex: 1 !important;
  min-width: 0 !important;
}

#r-list .tx .tx-mid b {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #18181B !important;
  margin-bottom: 2px !important;
  display: block !important;
  text-transform: capitalize !important;
  letter-spacing: normal !important;
}

#r-list .tx .tx-mid span {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #71717A !important;
  display: block !important;
  letter-spacing: normal !important;
}

#r-list .tx .tx-right {
  text-align: right !important;
  flex-shrink: 0 !important;
}

html[dir="rtl"] #r-list .tx .tx-right {
  text-align: left !important;
}

#r-list .tx .tx-right b {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #059669 !important;
  display: block !important;
  margin-bottom: 2px !important;
  letter-spacing: normal !important;
}

#r-list .tx .tx-right .st {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #059669 !important;
  background: #ECFDF5 !important;
  border-radius: 9999px !important;
  padding: 2px 8px !important;
  display: inline-block !important;
  letter-spacing: normal !important;
}

/* 7. Section Titles in Investments & Rewards */
#view-investments .sec-title,
#view-rewards .sec-title {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #1C1A17 !important;
  margin: 20px 0 14px !important;
  letter-spacing: normal !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* ============================================================
   EXACT USER CUSTOMIZATION FIXES:
   1. Filter Controls Row: Ensure Status Tabs & Sort/Filter Buttons are ALWAYS visible together
   2. Investments Page Top Hero Card (#inv-hero-card / .inv-hero): Light card theme
   3. Investments Page Stat Cards (#inv-stats .w-stat): Exact font size & weight matching Wallet (#w-stats)
   4. Property Cards Mini Stats (.inv-rows > div): Compact, Smaller Sizing
   5. WhatsApp Button Icon (.btn.whatsapp): Add WhatsApp logo icon
   ============================================================ */

/* --- 1. Filter Controls Row Visibility --- */
#props-filters,
#home-sticky,
body.divido-premium #home-sticky {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.filter-controls-row,
body.divido-premium .filter-controls-row {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  margin: 0 0 14px 0 !important;
}

.status-tabs-container,
body.divido-premium .status-tabs-container {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  order: 1 !important;
  margin: 0 !important;
}

.status-tabs-container::-webkit-scrollbar {
  display: none !important;
}

.status-chips-row,
#status-tabs {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  flex-wrap: nowrap !important;
}

.filter-controls-left,
body.divido-premium .filter-controls-left {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-shrink: 0 !important;
  order: 2 !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}

html[dir="rtl"] .filter-controls-left {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Hide native select when custom dropdown is initialized */
select.sort-select-btn[data-custom-dropdown-done="true"],
#quick-sort-select[data-custom-dropdown-done="true"] {
  display: none !important;
}

.sort-select-wrap,
.custom-dropdown-container {
  display: inline-flex !important;
  flex-shrink: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.sort-select-btn:not([data-custom-dropdown-done="true"]),
.custom-dropdown-trigger {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 32px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  width: auto !important;
  max-width: none !important;
  white-space: nowrap !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.filters-open-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 32px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  border-radius: 9999px !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* --- 2. Investments Page Top Hero Card (.inv-hero / #inv-hero-card) -> LIGHT CARD --- */
#view-investments #inv-hero-card,
#view-investments .inv-hero,
#view-investments .inv-hero.hero-white,
body.divido-premium #view-investments .inv-hero {
  background: #FFFFFF !important;
  background-image: linear-gradient(135deg, #FFFFFF 0%, #FFFDF9 100%) !important;
  border: 1px solid rgba(255, 106, 0, 0.18) !important;
  border-radius: 28px !important;
  box-shadow: 0 14px 36px rgba(255, 106, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.03) !important;
  padding: 26px 28px 24px !important;
  color: #18181B !important;
  margin-bottom: 20px !important;
  isolation: isolate !important;
  position: relative !important;
  overflow: hidden !important;
}

#view-investments #inv-hero-card::before,
#view-investments .inv-hero::before {
  display: none !important;
}

#view-investments #inv-hero-card::after,
#view-investments .inv-hero::after {
  content: "" !important;
  position: absolute !important;
  width: 180px !important;
  height: 180px !important;
  right: -50px !important;
  top: -50px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 106, 0, 0.08) !important;
  box-shadow: 0 0 0 20px rgba(255, 106, 0, 0.03) !important;
  pointer-events: none !important;
}

html[dir="rtl"] #view-investments #inv-hero-card::after,
html[dir="rtl"] #view-investments .inv-hero::after {
  right: auto !important;
  left: -50px !important;
}

#view-investments .inv-hero span,
#view-investments #inv-hero-card span {
  color: #71717A !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}

#view-investments #inv-value,
#view-investments .inv-hero b.inv-val,
#view-investments .inv-hero b#inv-value,
body.divido-premium #view-investments .inv-hero b {
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  letter-spacing: -0.5px !important;
  margin: 6px 0 16px 0 !important;
  display: block !important;
}

#view-investments #inv-sub,
#view-investments .inv-hero .w-sub,
#view-investments .inv-hero #inv-sub {
  color: #71717A !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

#view-investments .w-eye,
#view-investments #inv-eye,
#view-investments .inv-hero .w-eye {
  background: rgba(0, 0, 0, 0.05) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 50% !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#view-investments .w-eye i,
#view-investments .inv-hero .w-eye i {
  color: #18181B !important;
}


/* --- 3. Investments Page Stat Cards (#inv-stats .w-stat): Matching Wallet Page (#w-stats) --- */
#inv-stats,
#view-investments #inv-stats,
body.divido-premium #inv-stats {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 12px !important;
  margin: 0 0 20px 0 !important;
  width: 100% !important;
}

#inv-stats .w-stat,
#view-investments #inv-stats .w-stat,
body.divido-premium #inv-stats .w-stat {
  background: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 16px !important;
  padding: 14px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

#inv-stats .w-stat .m-icon,
#view-investments #inv-stats .w-stat .m-icon {
  background: rgba(255, 106, 0, 0.08) !important;
  border: 1px solid rgba(255, 106, 0, 0.12) !important;
  border-radius: 12px !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  color: #FF6A00 !important;
}

#inv-stats .w-stat .ws-txt,
#view-investments #inv-stats .w-stat .ws-txt {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  flex: 1 !important;
}

#inv-stats .w-stat .ws-txt b,
#view-investments #inv-stats .w-stat .ws-txt b,
#view-investments #inv-stats .w-stat b {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #18181B !important;
  line-height: 1.2 !important;
  margin-bottom: 2px !important;
  display: block !important;
}

#inv-stats .w-stat .ws-txt span,
#view-investments #inv-stats .w-stat .ws-txt span,
#view-investments #inv-stats .w-stat span {
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: #71717A !important;
  line-height: 1.2 !important;
  display: block !important;
  text-transform: none !important;
}


/* --- 4. Property & Investments Card Mini Stats (.inv-rows > div): Matches Property Card Metrics --- */
.inv-rows,
body.divido-premium .inv-rows {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 8px !important;
  margin-top: 12px !important;
  width: 100% !important;
}

.inv-rows>div,
.inv-rows .w-stat,
body.divido-premium .inv-rows>div,
body.divido-premium .inv-rows .w-stat {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.07) !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
}

.inv-rows>div .m-icon,
.inv-rows .w-stat .m-icon,
body.divido-premium .inv-rows .m-icon {
  background: rgba(255, 106, 0, 0.08) !important;
  border: none !important;
  border-radius: 10px !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  color: #FF6A00 !important;
}

.inv-rows>div .m-icon img,
.inv-rows .w-stat .m-icon img,
body.divido-premium .inv-rows .m-icon img {
  width: 18px !important;
  height: 18px !important;
  object-fit: contain !important;
  filter: none !important;
}

.inv-rows>div .ws-txt,
.inv-rows .w-stat .ws-txt,
body.divido-premium .inv-rows .ws-txt {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 2px !important;
  min-width: 0 !important;
  flex: 1 !important;
}

/* TOP LABEL (SPAN) */
.inv-rows>div span,
.inv-rows>div .ws-txt span,
.inv-rows .w-stat span,
.inv-rows .w-stat .ws-txt span,
body.divido-premium .inv-rows span,
body.divido-premium .inv-rows .ws-txt span {
  font-size: 10.5px !important;
  font-weight: 600 !important;
  color: #71717A !important;
  line-height: 1.2 !important;
  display: block !important;
  order: 1 !important;
  margin-bottom: 1px !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* BOTTOM VALUE (B) */
.inv-rows>div b,
.inv-rows>div .ws-txt b,
.inv-rows .w-stat b,
.inv-rows .w-stat .ws-txt b,
body.divido-premium .inv-rows b,
body.divido-premium .inv-rows .ws-txt b {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #18181B !important;
  -webkit-text-fill-color: #18181B !important;
  line-height: 1.2 !important;
  display: block !important;
  order: 2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}


/* ============================================================
   USER DESIGN REFINEMENTS & CUSTOMIZATIONS:
   ============================================================ */

/* 1. Saved Items Subpage: 3 Cards per row grid layout */
.saved-grid,
#view-subpage[data-page="saved"] .saved-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 14px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin-top: 12px !important;
}

.saved-grid .prop-card,
#view-subpage[data-page="saved"] .prop-card {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

@media (max-width: 640px) {

  .saved-grid,
  #view-subpage[data-page="saved"] .saved-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
  }
}

.saved-hint {
  grid-column: 1 / -1 !important;
  display: block !important;
  width: 100% !important;
  margin-bottom: 8px !important;
}

/* 2. Save / Bookmark Icon Active State: Primary Orange Color */
.save-btn[data-on="1"] i,
.save-btn[data-on="1"] .save-ic,
.save-ic.ph-fill,
i.ph-fill.ph-bookmark-simple,
i.ph-fill,
body.divido-premium .save-ic.ph-fill,
body.divido-premium .save-btn[data-on="1"] i {
  color: #FF6A00 !important;
  -webkit-text-fill-color: #FF6A00 !important;
}

/* 3. Investments Top Hero Card: Light Orange Gradient, No Shadow, No Uppercase Subtext */
#view-investments #inv-hero-card,
#view-investments .inv-hero,
#inv-hero-card,
.inv-hero,
body.divido-premium #view-investments #inv-hero-card,
body.divido-premium #view-investments .inv-hero {
  background: linear-gradient(135deg, #FFF9F5 0%, #FFF2EA 100%) !important;
  border: 1px solid rgba(255, 106, 0, 0.18) !important;
  border-radius: 28px !important;
  box-shadow: none !important;
  padding: 26px 28px 24px !important;
  color: #18181B !important;
  margin-bottom: 20px !important;
  isolation: isolate !important;
  position: relative !important;
  overflow: hidden !important;
}

#view-investments #inv-hero-card::before,
#view-investments .inv-hero::before,
#inv-hero-card::after,
.inv-hero::after {
  display: none !important;
}

#view-investments .inv-hero #inv-sub,
#view-investments #inv-sub,
.inv-hero .w-sub,
.inv-hero #inv-sub,
body.divido-premium .inv-hero #inv-sub {
  color: #71717A !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* 4. Segmented Toggle Container (#home-seg & #inv-seg): Pure White Background */
#home-seg,
#inv-seg,
.seg,
.seg#home-seg,
.seg#inv-seg,
body.divido-premium #home-seg,
body.divido-premium #inv-seg,
body.divido-premium .seg {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 9999px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03) !important;
}

/* 5. Rewards Balance Card: Trophy Icon Overlay on Right (No circles) */
.rewards-hero,
#rewards-hero-card,
body.divido-premium .rewards-hero {
  position: relative !important;
  overflow: hidden !important;
}

.rewards-hero::after,
#rewards-hero-card::after,
body.divido-premium .rewards-hero::after {
  content: "🏆" !important;
  position: absolute !important;
  right: 24px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 96px !important;
  opacity: 0.22 !important;
  width: auto !important;
  height: auto !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  pointer-events: none !important;
  line-height: 1 !important;
}

html[dir="rtl"] .rewards-hero::after,
html[dir="rtl"] #rewards-hero-card::after {
  right: auto !important;
  left: 24px !important;
}

/* 6. Referral Step Cards: White Background */
.r-steps .r-step,
.r-step,
body.divido-premium .r-step {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
}

/* 7. Profile Menu Section Titles / Group Labels: Lighter Gray Color (Not Orange) */
.menu-group-title,
.profile-sec-title,
.prof-sec-head,
.prof-lbl,
#view-profile h3,
#view-profile h4,
#profile-menu .menu-lbl,
body.divido-premium #view-profile .sec-title {
  color: #71717A !important;
  font-weight: 700 !important;
}

/* ==========================================================================
   DIVIDO PURE BLACK DARK MODE (درجات الأسود الفاخرة للوضع الداكن)
   ========================================================================== */

/* 1. Global View Canvas & Screens */
body.dark,
body.divido-premium.dark,
body.dark #screen-app,
body.dark .view,
body.dark #screen-auth {
  background: #09090B !important;
  background-color: #09090B !important;
  color: #F4F4F5 !important;
}

/* 2. App Header & Tab Bar (Deep Obsidian Blur) */
/* Navbar is transparent until scrolled — see is-scrolled rules below */

body.dark .tabbar,
body.divido-premium.dark .tabbar {
  background: rgba(16, 16, 20, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.6) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

body.dark .tabbar-btn {
  color: #A1A1AA !important;
}

body.dark .tabbar-btn.on {
  color: #FF6A00 !important;
}

body.dark .tabbar-btn span {
  color: #A1A1AA !important;
}

body.dark .tabbar-btn.on span {
  color: #FF6A00 !important;
}

/* Header Buttons */
body.dark :is(#hdr-saved, #hdr-bell, #dark-toggle, .hdr-btn) {
  background: #18181C !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #F4F4F5 !important;
}

body.dark #dark-toggle {
  --header-icon: url('/icons/sun.svg');
}

/* 3. Primary Card Surfaces (Deep Slate Black #121215) */
body.dark :is(.prop-card,
  .fund-card,
  .inv-card,
  .card-plain,
  .d-card,
  .auth-form-card,
  .modal-card,
  .filters-drawer,
  .notif,
  .media-card,
  .lease-card,
  .why-card,
  .guarantee-card,
  .q-card),
body.divido-premium.dark :is(.prop-card,
  .fund-card,
  .inv-card,
  .card-plain,
  .d-card,
  .auth-form-card,
  .modal-card,
  .filters-drawer,
  .notif,
  .media-card,
  .lease-card,
  .why-card,
  .guarantee-card,
  .q-card) {
  background: #121215 !important;
  background-color: #121215 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
  color: #F4F4F5 !important;
}

/* 4. Nested Card Cells, Metrics & Stat Tiles (Charcoal Black #1A1A1E) */
body.dark :is(.w-stat,
  .hs-item,
  .metric,
  .decision-cell,
  .r-step,
  .how-step,
  .stat,
  .calc-grid > div,
  .calc-box,
  .avg,
  .exit-card,
  .help-row,
  .code-box,
  .os-card,
  .order-summary,
  .dv-trust-cell,
  .ref-stats > div,
  .step,
  .skel-card,
  .w-sales-tip),
body.divido-premium.dark :is(.w-stat,
  .hs-item,
  .metric,
  .decision-cell,
  .r-step,
  .how-step,
  .stat,
  .calc-grid > div,
  .calc-box,
  .avg,
  .exit-card,
  .help-row,
  .code-box,
  .os-card,
  .order-summary,
  .dv-trust-cell,
  .ref-stats > div,
  .step,
  .skel-card,
  .w-sales-tip),
body.divido-premium.thrill.dark :is(.w-stat,
  .hs-item,
  .metric,
  .r-step,
  .how-step) {
  background: #1A1A1E !important;
  background-color: #1A1A1E !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: none !important;
  color: #F4F4F5 !important;
}

/* Trust chips & Home badges on dark */
body.dark :is(.dv-sales-chip, .hcchip, .d-chip, .trust-chip),
body.divido-premium.dark :is(.dv-sales-chip, .hcchip, .d-chip, .trust-chip),
body.divido-premium.modern-orange.dark :is(.dv-sales-chip, .hcchip, .d-chip, .trust-chip) {
  background: #18181C !important;
  background-color: #18181C !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: none !important;
  color: #E4E4E7 !important;
}

body.dark .dv-sales-chip .px-dot {
  background: #FF6A00 !important;
}

/* Custom dropdown triggers & panels */
body.dark :is(.custom-dropdown-trigger, .sort-select-btn, .filters-open-btn),
body.divido-premium.dark :is(.custom-dropdown-trigger, .sort-select-btn, .filters-open-btn) {
  background: #18181C !important;
  background-color: #18181C !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #F4F4F5 !important;
  box-shadow: none !important;
}

body.dark .custom-dropdown-menu,
body.divido-premium.dark .custom-dropdown-menu {
  background: #18181C !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6) !important;
}

body.dark .custom-dropdown-item {
  color: #E4E4E7 !important;
}

body.dark .custom-dropdown-item:hover,
body.dark .custom-dropdown-item.active {
  background: #24242B !important;
  color: #FFFFFF !important;
}

/* Detail view specific dark mode overrides (no white leaks!) */
body.dark .d-bottom,
body.divido-premium.dark .d-bottom,
body.divido-premium.thrill.dark .d-bottom,
body.divido-premium.px-futuristic.dark .d-bottom,
body.dark #view-detail .d-bottom {
  background: rgba(18, 18, 22, 0.95) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 -12px 36px rgba(0, 0, 0, 0.6) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

body.dark :is(.inv-banner, #d-inv-banner),
body.divido-premium.dark :is(.inv-banner, #d-inv-banner) {
  background: #18181C !important;
  border: 1px solid rgba(255, 106, 0, 0.25) !important;
  color: #F4F4F5 !important;
}

body.dark :is(#calc-range, input[type="range"]) {
  background: #26262D !important;
}

body.dark .cp,
body.divido-premium.dark .cp {
  background: #1E1E23 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #E4E4E7 !important;
}

body.dark .cp.active,
body.dark .cp:hover {
  background: #FF6A00 !important;
  color: #FFFFFF !important;
}

body.dark #d-contact,
body.divido-premium.dark #d-contact {
  background: #1C1C22 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #F4F4F5 !important;
}

body.dark .meta-chip.st-available {
  background: rgba(16, 185, 129, 0.15) !important;
  color: #34D399 !important;
  border: 1px solid rgba(16, 185, 129, 0.3) !important;
}

/* 5. Hero Cards: Deep Black Gradients with Subtle Divido Glow */
body.dark :is(.nw-card, .wallet-hero, #inv-hero-card, .inv-hero, #rewards-hero-card, .rewards-hero, .prof-head, .hero-white),
body.divido-premium.dark :is(.nw-card, .wallet-hero, #inv-hero-card, .inv-hero, #rewards-hero-card, .rewards-hero, .prof-head, .hero-white) {
  background: linear-gradient(145deg, #18181C 0%, #101013 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
  color: #F4F4F5 !important;
}

body.dark .banner-card,
body.divido-premium.dark .banner-card {
  background: linear-gradient(135deg, #18181C 0%, #101013 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #F4F4F5 !important;
}

/* 6. Profile Page Elements */
body.dark #view-profile .avatar,
body.divido-premium.dark #view-profile .avatar {
  background: #18181C !important;
  border: 2px solid rgba(255, 106, 0, 0.35) !important;
}

body.dark #view-profile .premium-menu-label,
body.divido-premium.dark #view-profile .premium-menu-label {
  background: #18181C !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  color: #A1A1AA !important;
}

body.dark #view-profile .menu-list button,
body.divido-premium.dark #view-profile .menu-list button {
  background: #141417 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #F4F4F5 !important;
}

body.dark #view-profile .menu-list button:hover {
  background: #1E1E23 !important;
  border-color: rgba(255, 106, 0, 0.3) !important;
}

body.dark #view-profile .menu-list button img {
  background: #1E1E23 !important;
  border: 1px solid rgba(255, 106, 0, 0.2) !important;
}

body.dark #view-profile #logout {
  background: #18181C !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #F4F4F5 !important;
}

/* 7. Inputs, Segmented Controls, Chips & Sliders */
body.dark :is(.input, select, textarea),
body.divido-premium.dark :is(.input, select, textarea) {
  background: #18181C !important;
  color: #FFFFFF !important;
  border: 1.5px solid rgba(255, 255, 255, 0.12) !important;
}

body.dark :is(.input, select, textarea):focus {
  border-color: #FF6A00 !important;
  box-shadow: 0 0 0 3px rgba(255, 106, 0, 0.25) !important;
}

body.dark :is(.seg, #home-seg, #inv-seg) {
  background: #141417 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark .seg-btn {
  color: #A1A1AA !important;
}

body.dark .seg-btn.on {
  background: #FF6A00 !important;
  color: #FFFFFF !important;
}

body.dark :is(.chip, .pchip, .m-chip, .d-amt-chip) {
  background: #18181C !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #A1A1AA !important;
}

body.dark :is(.chip.on, .pchip.on, .m-chip.on, .d-amt-chip.on) {
  background: #FF6A00 !important;
  border-color: #FF6A00 !important;
  color: #FFFFFF !important;
}

/* 8. Text Typography & Neutral Contrast */
body.dark :is(h1, h2, h3, h4, h5, h6, .prop-title, .inv-title, .prof-name, #d-title, .hg-name, .nw-val),
body.divido-premium.dark :is(h1, h2, h3, h4, h5, h6, .prop-title, .inv-title, .prof-name, #d-title, .hg-name, .nw-val) {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

body.dark :is(.sec-title, .sec-h, .sub-title) {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

body.dark :is(.sec-count, #prop-count, #fund-count, .prop-loc-line, .prop-loc, .hint, .d-desc, .step p, .lease-desc, .empty-note, .kyc-hint, .saved-hint, .card-price small, .d-cta-sub, .m-label, .dc-label, .ws-txt span, .hs-item span, .tx-mid span, .w-sub, .nw-label, .w-label),
body.divido-premium.dark :is(.sec-count, #prop-count, #fund-count, .prop-loc-line, .prop-loc, .hint, .d-desc, .step p, .lease-desc, .empty-note, .kyc-hint, .saved-hint, .card-price small, .d-cta-sub, .m-label, .dc-label, .ws-txt span, .hs-item span, .tx-mid span, .w-sub, .nw-label, .w-label) {
  color: #A1A1AA !important;
}

body.dark :is(.ws-txt b, .hs-item b, .m-val, .dc-val, .r-step b, .calc-grid b, .stat b, .tx-mid b, .nw-row b, .w-sub-row b) {
  color: #F4F4F5 !important;
  -webkit-text-fill-color: #F4F4F5 !important;
}

body.dark :is(.tx, .lease-row, .faq-item, .help-row, .d-price-row, .kyc-status-row, .sub-head) {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark .eye-btn,
body.dark .nw-eye {
  background: #1E1E23 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #F4F4F5 !important;
}

/* Strictly Hide Native Select to prevent duplicate Sort Button */
select#quick-sort-select,
select.sort-select-btn,
select[data-custom-dropdown-done="true"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Filter Bar Compact Typography & Unified 26px Heights (Available, Funded, Exited, Recommended, Filters) */
#view-home :is(#status-tabs .chip, .status-chips-row .chip, .custom-dropdown-trigger, .filters-open-btn, #filters-open),
#status-tabs .chip,
.status-chips-row .chip,
body.divido-premium #status-tabs .chip,
.custom-dropdown-trigger,
.filters-open-btn,
#filters-open {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  font-size: 8px !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  letter-spacing: 0.1px !important;
}

#status-tabs .chip,
.status-chips-row .chip {
  padding: 0 8px !important;
  font-weight: 400 !important;
}

.custom-dropdown-trigger {
  padding: 0 8px !important;
  font-weight: 400 !important;
  gap: 3px !important;
}

.custom-dropdown-trigger .dd-arrow svg {
  width: 9px !important;
  height: 9px !important;
}

.filters-open-btn {
  padding: 0 9px !important;
  font-weight: 400 !important;
  gap: 3px !important;
}

.filters-open-btn i {
  font-size: 11px !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* ================= 100% FULL-WIDTH NAVBAR ALIGNED WITH PAGE CONTENT ================= */
.app-header,
body.divido-premium .app-header,
#screen-app .app-header,
header.app-header {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  padding: 0 100px !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid transparent !important;
  transition: background 0.25s ease, backdrop-filter 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.app-header.is-scrolled,
body.divido-premium .app-header.is-scrolled,
#screen-app .app-header.is-scrolled {
  background: rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: blur(20px) saturate(1.8) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.8) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03) !important;
}

@media (max-width: 900px) {

  .app-header,
  body.divido-premium .app-header,
  #screen-app .app-header,
  header.app-header {
    padding: 10px 24px !important;
  }
}

@media (max-width: 768px) {

  .app-header,
  body.divido-premium .app-header,
  #screen-app .app-header,
  header.app-header {
    padding: 8px 16px !important;
  }
}

/* ================= 3-COLUMN PROPERTY CARDS ON DESKTOP ================= */
#prop-list,
.prop-bento,
#fund-list,
#inv-list,
body.divido-premium #prop-list,
body.divido-premium .prop-bento,
body.divido-premium #fund-list,
body.divido-premium #inv-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 20px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

#prop-list .prop-card,
.prop-bento .prop-card,
#fund-list .prop-card,
#inv-list .prop-card,
body.divido-premium #prop-list .prop-card,
body.divido-premium .prop-bento .prop-card,
body.divido-premium #fund-list .prop-card,
body.divido-premium #inv-list .prop-card {
  grid-column: span 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

@media (max-width: 991px) {

  #prop-list,
  .prop-bento,
  #fund-list,
  #inv-list,
  body.divido-premium #prop-list,
  body.divido-premium .prop-bento,
  body.divido-premium #fund-list,
  body.divido-premium #inv-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }
}

@media (max-width: 640px) {

  #prop-list,
  .prop-bento,
  #fund-list,
  #inv-list,
  body.divido-premium #prop-list,
  body.divido-premium .prop-bento,
  body.divido-premium #fund-list,
  body.divido-premium #inv-list {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
}

/* ================= PROPERTY CARD LOCATION & ICONS ================= */
.prop-loc-line {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  font-size: 12px !important;
  color: #71717A !important;
  margin: 0 0 6px 0 !important;
}

.prop-loc-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.prop-loc-item i {
  color: #FF6A00 !important;
  font-size: 13px !important;
}

.loc-sep {
  color: #D4D4D8 !important;
  margin: 0 2px !important;
}

.card-metrics .metric .m-icon {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 8px !important;
  background: rgba(255, 106, 0, 0.08) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.card-metrics .metric .m-icon img {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
  opacity: 1 !important;
}

/* ================= UNIVERSAL BUTTON TEXT CENTERING ================= */
button,
input[type="button"],
input[type="submit"],
.btn,
.chip,
.pchip,
.seg-btn,
.round-btn,
.hdr-btn,
.tabbar-btn,
.filters-open-btn,
.custom-dropdown-trigger,
.cp,
.inv-now,
#start-invest,
#logout,
#detail-back,
#filters-apply,
.map-lazy-btn,
.ref-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  vertical-align: middle !important;
}

/* ================= PROPERTY DETAIL: TOP HERO IMAGE WITH TOP BORDER RADIUS ================= */
#view-detail .detail-hero,
#view-detail .d-hero,
body.divido-premium #view-detail .detail-hero,
body.divido-premium #view-detail .d-hero {
  position: relative !important;
  max-width: 1080px !important;
  margin: 0 auto !important;
  border-top-left-radius: 24px !important;
  border-top-right-radius: 24px !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  overflow: hidden !important;
}

#view-detail :is(.hero-img, #detail-img, .d-hero-img),
body.divido-premium #view-detail :is(.hero-img, #detail-img, .d-hero-img) {
  width: 100% !important;
  max-width: 100% !important;
  height: 380px !important;
  object-fit: cover !important;
  display: block !important;
  border-top-left-radius: 24px !important;
  border-top-right-radius: 24px !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* ================= PROPERTY DETAIL: CLEAN WHITE CONTENT CONTAINER ================= */
#view-detail,
body.divido-premium #view-detail {
  padding-top: 16px !important;
  padding-bottom: 120px !important;
}

#view-detail .detail-body,
body.divido-premium #view-detail .detail-body {
  background: #ffffff !important;
  background-color: #ffffff !important;
  max-width: 1080px !important;
  margin: 0 auto 40px !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: 24px !important;
  border-bottom-right-radius: 24px !important;
  padding: 32px 36px 48px !important;
  box-sizing: border-box !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-top: none !important;
  position: relative !important;
  z-index: 2 !important;
}

@media (max-width: 768px) {

  #view-detail .detail-hero,
  #view-detail .d-hero,
  body.divido-premium #view-detail .detail-hero {
    max-width: 100% !important;
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
  }

  #view-detail :is(.hero-img, #detail-img, .d-hero-img) {
    height: 220px !important;
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important;
  }

  #view-detail .detail-body,
  body.divido-premium #view-detail .detail-body {
    max-width: 100% !important;
    border-bottom-left-radius: 20px !important;
    border-bottom-right-radius: 20px !important;
    padding: 20px 16px 36px !important;
  }
}

/* ================= DARK MODE REFINEMENTS ================= */
body.dark {
  background: #0D0D10 !important;
  color: #F4F4F5 !important;
}

body.dark .app-header,
body.divido-premium.dark .app-header {
  background: transparent !important;
  border-bottom: 1px solid transparent !important;
}

body.dark .app-header.is-scrolled,
body.divido-premium.dark .app-header.is-scrolled {
  background: rgba(18, 18, 22, 0.85) !important;
  backdrop-filter: blur(20px) saturate(1.8) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.8) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

body.dark .hdr-btn,
body.dark #hdr-saved,
body.dark #hdr-bell,
body.dark #lang-toggle,
body.dark #dark-toggle,
body.divido-premium.dark .hdr-btn {
  background: #1C1C22 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #F4F4F5 !important;
}

body.dark .hdr-btn i,
body.dark .hdr-btn .icon-img,
body.dark .lang-code {
  color: #F4F4F5 !important;
}

body.dark .logo-img,
body.dark #hdr-logo {
  filter: brightness(1.2) drop-shadow(0 0 1px rgba(255, 255, 255, 0.4)) !important;
}

body.dark .prop-card,
body.divido-premium.dark .prop-card {
  background: #151518 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark .prop-title {
  color: #FFFFFF !important;
}

body.dark .prop-loc-line {
  color: #A1A1AA !important;
}

body.dark .decision-row {
  background: #1D1D22 !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

body.dark .card-cta-row {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark .card-price {
  color: #F4F4F5 !important;
}

body.dark #view-detail .detail-body,
body.divido-premium.dark #view-detail .detail-body {
  background: #141417 !important;
  background-color: #141417 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35) !important;
}

/* ================= GUARANTEED PERMANENT FIXED BOTTOM TABBAR ================= */
.tabbar,
body.divido-premium .tabbar,
#screen-app .tabbar {
  position: fixed !important;
  bottom: 0 !important;
  z-index: 9999 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.dark .tabbar,
body.divido-premium.dark .tabbar {
  background: rgba(18, 18, 22, 0.92) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}

/* ================= FUND CARDS & PROPERTY CARDS UNIFIED STYLING ================= */
#fund-list .fund-card,
body.divido-premium #fund-list .fund-card {
  grid-column: span 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

body.dark :is(.prop-card, .fund-card) {
  background: #151518 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}