/*
 * Proxycin dashboard — graphite glass + teal/violet neon.
 * Visual layer only: colors, borders, radii, shadows. Layout (widths, positions) stays with the base theme.
 */
body.blck-body {
  --dx-teal: #5eead4;
  --dx-violet: #a78bfa;
  --dx-bg: #0b0b10;
  --dx-panel: linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.012));
  --dx-panel-solid: linear-gradient(180deg, #15151e, #0d0d14);
  --dx-border: rgba(255,255,255,0.08);
  --dx-ring: linear-gradient(130deg, rgba(94,234,212,0.45), rgba(255,255,255,0.05) 45%, rgba(167,139,250,0.45));
  --dx-orb: radial-gradient(circle at 32% 28%, #3a3a4c, #15151e 62%, #0a0a10);
  --dx-radius: 20px;
  background: var(--dx-bg) !important;
  color: var(--v2-text, #f4f4f8);
}

/* ---------- sidebar ---------- */
body.blck-body .pc-sidebar.blck-sidebar {
  background: radial-gradient(120% 40% at 0% 0%, rgba(94,234,212,0.07), transparent 60%), linear-gradient(180deg, #101018, #0a0a10) !important;
  border-right: 0 !important;
  box-shadow: 1px 0 0 rgba(255,255,255,0.05), 18px 0 50px -30px rgba(0,0,0,0.8);
}
body.blck-body .pc-sidebar.blck-sidebar::after {
  content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 1px; pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(94,234,212,0.35) 30%, rgba(167,139,250,0.35) 70%, transparent);
}
body.blck-body .blck-m-header { border-bottom: 1px solid var(--dx-border) !important; background: transparent !important; }
body.blck-body .blck-caption label { color: rgba(255,255,255,0.38) !important; font-size: 0.66rem !important; letter-spacing: 0.14em !important; }
body.blck-body .blck-caption.admin label { color: #fca5a5 !important; }
body.blck-body .pc-navbar .blck-nav-link {
  border-radius: 14px !important; color: rgba(255,255,255,0.68) !important;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s !important;
}
body.blck-body .pc-navbar .blck-nav-link:hover { background: rgba(255,255,255,0.04) !important; color: #fff !important; }
body.blck-body .pc-navbar li.active > .blck-nav-link,
body.blck-body .pc-navbar .blck-nav-link.active {
  color: #fff !important;
  background: radial-gradient(120% 140% at 0% 50%, rgba(94,234,212,0.16), transparent 65%), linear-gradient(180deg, #1b1b26, #12121a) !important;
  box-shadow: inset 0 0 0 1px rgba(94,234,212,0.22), inset 3px 0 0 var(--dx-teal) !important;
}
body.blck-body .blck-nav-icon {
  width: 34px !important; height: 34px !important; border-radius: 50% !important;
  background: var(--dx-orb) !important; color: var(--dx-teal) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 0 1px rgba(94,234,212,0.18) !important;
  text-shadow: 0 0 10px rgba(94,234,212,0.6);
}
body.blck-body .blck-nav-icon.purple, body.blck-body .blck-nav-icon.blue { color: #c4b5fd !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 0 1px rgba(167,139,250,0.22) !important; text-shadow: 0 0 10px rgba(167,139,250,0.6); }
body.blck-body .blck-nav-icon.red { color: #fca5a5 !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 0 1px rgba(248,113,113,0.25) !important; }
body.blck-body .blck-nav-icon.yellow, body.blck-body .blck-nav-icon.orange { color: #fcd34d !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 0 1px rgba(252,211,77,0.2) !important; }
body.blck-body li.active > .blck-nav-link .blck-nav-icon { box-shadow: inset 0 1px 0 rgba(255,255,255,0.14), 0 0 0 1px rgba(94,234,212,0.5), 0 0 14px -2px rgba(94,234,212,0.55) !important; }
body.blck-body .blck-submenu { border-left: 1px solid rgba(94,234,212,0.18) !important; }
body.blck-body .blck-submenu .pc-link { color: rgba(255,255,255,0.6) !important; border-radius: 10px; }
body.blck-body .blck-submenu .pc-link:hover { color: var(--dx-teal) !important; }
body.blck-body .blck-balance-tag {
  font-family: var(--v2-mono, ui-monospace, monospace); font-size: 0.68rem !important; color: #ccfbf1 !important;
  background: linear-gradient(180deg, #1c1c28, #101018) padding-box, linear-gradient(120deg, #5eead4, #a78bfa) border-box !important;
  border: 1px solid transparent !important; border-radius: 999px !important;
}
body.blck-body .dx-help {
  position: relative; margin: 18px 14px 14px; padding: 16px 14px 14px 92px; min-height: 92px; border-radius: 18px;
  background: var(--dx-panel-solid) padding-box, var(--dx-ring) border-box; border: 1px solid transparent; overflow: visible;
}
body.blck-body .dx-help img { position: absolute; left: -6px; bottom: -4px; width: 96px; height: auto; filter: drop-shadow(0 10px 16px rgba(0,0,0,0.6)); }
body.blck-body .dx-help strong { display: block; font-size: 0.85rem; color: #fff; }
body.blck-body .dx-help p { margin: 2px 0 8px; font-size: 0.74rem; line-height: 1.4; color: rgba(255,255,255,0.6); }
body.blck-body .dx-help a { font-size: 0.75rem; font-weight: 700; color: var(--dx-teal); text-decoration: none; }

/* ---------- header ---------- */
body.blck-body .pc-header.blck-header {
  background: linear-gradient(180deg, rgba(11,11,16,0.88), rgba(11,11,16,0.7)) !important;
  backdrop-filter: blur(18px); border-bottom: 0 !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.05);
}
body.blck-body .pc-header.blck-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(94,234,212,0.35), rgba(167,139,250,0.35), transparent);
}
body.blck-body .blck-header-btn, body.blck-body .blck-menu-btn, body.blck-body .blck-user-avatar {
  border-radius: 50% !important; background: var(--dx-orb) !important; color: var(--dx-teal) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 0 1px rgba(94,234,212,0.2) !important; border: 0 !important;
}
body.blck-body .blck-header-btn:hover, body.blck-body .blck-menu-btn:hover, body.blck-body .blck-user-btn:hover .blck-user-avatar {
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 0 0 1px rgba(94,234,212,0.5), 0 0 16px -2px rgba(94,234,212,0.5) !important;
}
body.blck-body .blck-balance-chip {
  border-radius: 999px !important; color: #fff !important; font-family: var(--v2-mono, monospace);
  background: linear-gradient(180deg, #1b1b27, #0e0e15) padding-box, linear-gradient(120deg, #5eead4, #a78bfa) border-box !important;
  border: 1px solid transparent !important; box-shadow: 0 8px 22px -12px rgba(94,234,212,0.6) !important;
}
body.blck-body .blck-balance-dot { background: var(--dx-teal) !important; box-shadow: 0 0 8px var(--dx-teal) !important; }
body.blck-body .blck-notification-badge { background: linear-gradient(135deg, #f472b6, #a78bfa) !important; box-shadow: 0 0 10px rgba(244,114,182,0.6) !important; }
body.blck-body .blck-dropdown, body.blck-body .dropdown-menu {
  border-radius: 18px !important; border: 1px solid transparent !important;
  background: radial-gradient(90% 60% at 100% 0%, rgba(167,139,250,0.1), transparent 70%) padding-box, linear-gradient(180deg, #161620, #0c0c12) padding-box, var(--dx-ring) border-box !important;
  box-shadow: 0 30px 70px -10px rgba(0,0,0,0.85) !important;
}
body.blck-body .blck-dropdown-item { border-radius: 12px !important; color: rgba(255,255,255,0.75) !important; }
body.blck-body .blck-dropdown-item:hover { background: rgba(94,234,212,0.07) !important; color: #fff !important; }
body.blck-body .blck-logout:hover { background: rgba(248,113,113,0.1) !important; color: #fca5a5 !important; }
body.blck-body .blck-notification-icon, body.blck-body .blck-user-avatar-lg { border-radius: 50% !important; background: var(--dx-orb) !important; color: var(--dx-teal) !important; box-shadow: 0 0 0 1px rgba(94,234,212,0.2) !important; }
body.blck-body .blck-offcanvas { background: linear-gradient(180deg, #13131b, #0a0a10) !important; border-left: 1px solid var(--dx-border) !important; }
body.blck-body .blck-news-card { border-radius: 16px !important; border: 1px solid var(--dx-border) !important; background: var(--dx-panel) !important; }
body.blck-body .blck-news-badge { color: #ccfbf1 !important; background: rgba(94,234,212,0.12) !important; border-radius: 999px !important; }

/* ---------- content surfaces ---------- */
body.blck-body .pc-container, body.blck-body .pc-content { background: transparent !important; }
body.blck-body .blck-card, body.blck-body .misra-panel, body.blck-body .card, body.blck-body .summary-card,
body.blck-body .blck-modal-content, body.blck-body .modal-content {
  border-radius: var(--dx-radius) !important; border: 1px solid var(--dx-border) !important;
  background: var(--dx-panel) !important; box-shadow: 0 30px 60px -40px rgba(0,0,0,0.9), inset 0 1px 0 rgba(255,255,255,0.04) !important;
  color: inherit;
}
body.blck-body .blck-modal-content, body.blck-body .modal-content { background: linear-gradient(180deg, #16161f, #0c0c12) !important; }
body.blck-body .blck-card-header, body.blck-body .card-header, body.blck-body .misra-panel-head, body.blck-body .modal-header, body.blck-body .modal-footer {
  border-color: var(--dx-border) !important; background: transparent !important;
}
body.blck-body .blck-page-title, body.blck-body .misra-hero h1 { letter-spacing: -0.03em; }
body.blck-body .blck-section-title i, body.blck-body .misra-panel-head h2 i, body.blck-body .blck-card-header i { color: var(--dx-teal); }
body.blck-body .misra-hero {
  position: relative; overflow: hidden; border-radius: 24px !important; border: 1px solid transparent !important;
  background: radial-gradient(70% 140% at 0% 0%, rgba(94,234,212,0.16), transparent 60%), radial-gradient(60% 140% at 100% 100%, rgba(167,139,250,0.18), transparent 60%), linear-gradient(180deg, #14141d, #0c0c12) padding-box, var(--dx-ring) border-box !important;
}
body.blck-body .icon-box, body.blck-body .blck-feature-icon, body.blck-body .blck-proxy-icon {
  border-radius: 50% !important; background: var(--dx-orb) !important; color: var(--dx-teal) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 0 1px rgba(94,234,212,0.22) !important;
}
body.blck-body .blck-feature-item, body.blck-body .blck-info-item, body.blck-body .blck-proxy-item, body.blck-body .blck-payment-row, body.blck-body .blck-session-item, body.blck-body .blck-ticket-item {
  border-radius: 16px !important; border: 1px solid var(--dx-border) !important; background: rgba(255,255,255,0.02) !important;
  transition: border-color 0.2s, background 0.2s;
}
body.blck-body .blck-proxy-item:hover, body.blck-body .blck-ticket-item:hover, body.blck-body .blck-payment-row:hover { border-color: rgba(94,234,212,0.3) !important; background: rgba(94,234,212,0.03) !important; }
body.blck-body .blck-info-label { color: rgba(255,255,255,0.5) !important; }
body.blck-body .blck-info-value, body.blck-body .blck-balance-value { color: #fff !important; font-family: var(--v2-mono, monospace); }

/* ---------- buttons ---------- */
body.blck-body .blck-btn, body.blck-body .btn-refresh, body.blck-body .btn-primary, body.blck-body .dx-btn {
  border-radius: 12px !important; font-weight: 600 !important; transition: box-shadow 0.25s, transform 0.15s, background 0.25s !important;
}
body.blck-body .blck-btn-primary, body.blck-body .btn-refresh, body.blck-body .btn-primary, body.blck-body .dx-btn-primary {
  color: #fff !important; border: 1px solid transparent !important;
  background: radial-gradient(120% 160% at 50% 130%, rgba(94,234,212,0.35), transparent 60%) padding-box, linear-gradient(180deg, #1e1e2b, #0c0c13) padding-box, linear-gradient(120deg, #5eead4, #a78bfa) border-box !important;
  box-shadow: 0 10px 26px -12px rgba(94,234,212,0.7), inset 0 1px 0 rgba(255,255,255,0.14) !important;
}
body.blck-body .blck-btn-primary:hover, body.blck-body .btn-refresh:hover, body.blck-body .btn-primary:hover, body.blck-body .dx-btn-primary:hover {
  box-shadow: 0 14px 34px -12px rgba(94,234,212,0.85), 0 0 24px -6px rgba(167,139,250,0.55), inset 0 1px 0 rgba(255,255,255,0.2) !important;
  transform: translateY(-1px);
}
body.blck-body .blck-btn-outline, body.blck-body .dx-btn-ghost {
  color: #f4f4f8 !important; border: 1px solid transparent !important;
  background: linear-gradient(180deg, #16161f, #0d0d14) padding-box, linear-gradient(120deg, rgba(255,255,255,0.18), rgba(255,255,255,0.05)) border-box !important;
}
body.blck-body .blck-btn-outline:hover, body.blck-body .dx-btn-ghost:hover {
  background: linear-gradient(180deg, #1b1b26, #101018) padding-box, linear-gradient(120deg, rgba(94,234,212,0.6), rgba(167,139,250,0.6)) border-box !important;
}
body.blck-body .blck-btn-danger { color: #fecaca !important; background: rgba(248,113,113,0.1) !important; border: 1px solid rgba(248,113,113,0.35) !important; }
body.blck-body .blck-btn-danger:hover { background: rgba(248,113,113,0.18) !important; }
body.blck-body .blck-btn:disabled, body.blck-body .btn-refresh:disabled { opacity: 0.55; transform: none; }

/* ---------- forms ---------- */
body.blck-body .blck-input, body.blck-body .blck-select, body.blck-body .blck-textarea, body.blck-body .form-control, body.blck-body .form-select {
  border-radius: 12px !important; color: #f4f4f8 !important; background: #0d0d14 !important;
  border: 1px solid rgba(255,255,255,0.1) !important; transition: border-color 0.2s, box-shadow 0.2s !important;
}
body.blck-body .blck-input:focus, body.blck-body .blck-select:focus, body.blck-body .blck-textarea:focus, body.blck-body .form-control:focus, body.blck-body .form-select:focus {
  border-color: rgba(94,234,212,0.55) !important; box-shadow: 0 0 0 3px rgba(94,234,212,0.13) !important; outline: none !important;
}
body.blck-body .blck-input::placeholder, body.blck-body .form-control::placeholder { color: rgba(255,255,255,0.32) !important; }
body.blck-body .blck-form-label, body.blck-body .form-label { color: rgba(255,255,255,0.62) !important; font-weight: 600 !important; font-size: 0.8rem !important; }
body.blck-body .blck-copy-field { border-radius: 12px !important; background: #0d0d14 !important; border: 1px solid rgba(255,255,255,0.1) !important; }
body.blck-body .blck-switch-slider { background: #1b1b26 !important; }
body.blck-body input:checked + .blck-switch-slider { background: linear-gradient(120deg, #5eead4, #a78bfa) !important; }

/* ---------- alerts, badges, tabs, tables ---------- */
body.blck-body .blck-alert, body.blck-body .alert { border-radius: 14px !important; border: 1px solid var(--dx-border) !important; background: rgba(255,255,255,0.03) !important; color: #f4f4f8 !important; }
body.blck-body .blck-alert-success, body.blck-body .alert-success { border-color: rgba(52,211,153,0.35) !important; background: rgba(52,211,153,0.08) !important; }
body.blck-body .blck-alert-warning, body.blck-body .alert-warning { border-color: rgba(252,211,77,0.35) !important; background: rgba(252,211,77,0.08) !important; }
body.blck-body .blck-alert-danger, body.blck-body .alert-danger { border-color: rgba(248,113,113,0.35) !important; background: rgba(248,113,113,0.08) !important; }
body.blck-body .blck-alert-info, body.blck-body .alert-info { border-color: rgba(94,234,212,0.35) !important; background: rgba(94,234,212,0.07) !important; }
body.blck-body .blck-badge, body.blck-body .blck-status, body.blck-body .badge, body.blck-body .blck-dept-badge { border-radius: 999px !important; font-weight: 700 !important; letter-spacing: 0.02em; }
body.blck-body .blck-tab { border-radius: 999px !important; color: rgba(255,255,255,0.6) !important; border: 1px solid rgba(255,255,255,0.1) !important; background: transparent !important; }
body.blck-body .blck-tab.active { color: #fff !important; border-color: transparent !important; background: linear-gradient(180deg, #1c1c28, #101018) padding-box, linear-gradient(120deg, #5eead4, #a78bfa) border-box !important; }
body.blck-body .blck-wizard-tab.active { color: #fff !important; box-shadow: inset 0 -2px 0 var(--dx-teal) !important; }
body.blck-body .blck-progress-bar { background: linear-gradient(90deg, #5eead4, #a78bfa) !important; box-shadow: 0 0 10px rgba(94,234,212,0.5) !important; }
body.blck-body table { color: inherit; }
body.blck-body .table > :not(caption) > * > * { background: transparent !important; color: rgba(255,255,255,0.8) !important; border-color: var(--dx-border) !important; }
body.blck-body .table thead th { color: rgba(255,255,255,0.5) !important; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; }

/* ---------- pricing cards (residential buy) ---------- */
body.blck-body .blck-pricing-card { border-radius: 18px !important; border: 1px solid var(--dx-border) !important; background: var(--dx-panel) !important; transition: border-color 0.2s, transform 0.2s !important; }
body.blck-body .blck-pricing-card:hover { border-color: rgba(94,234,212,0.3) !important; transform: translateY(-2px); }
body.blck-body .blck-pricing-card.is-selected, body.blck-body .blck-pricing-card.popular {
  border-color: transparent !important;
  background: radial-gradient(100% 70% at 50% 0%, rgba(94,234,212,0.14), transparent 70%) padding-box, linear-gradient(180deg, #15151f, #0d0d14) padding-box, linear-gradient(160deg, #5eead4, rgba(167,139,250,0.8)) border-box !important;
  box-shadow: 0 24px 50px -28px rgba(94,234,212,0.5) !important;
}
body.blck-body .blck-pricing-price { color: var(--dx-teal) !important; font-family: var(--v2-mono, monospace); }

/* ---------- empty / error states get Cino ---------- */
body.blck-body .blck-empty-state::before, body.blck-body .blck-error-state::before {
  content: ""; display: block; width: 140px; height: 140px; margin: 0 auto 12px;
  background: url(/home/img/cino/laptop.webp) center / contain no-repeat;
  filter: drop-shadow(0 14px 20px rgba(0,0,0,0.55));
}
body.blck-body .blck-error-state::before { background-image: url(/home/img/cino/error.webp); }

/* ---------- footer & loader ---------- */
body.blck-body .pc-footer { background: transparent !important; border-top: 1px solid var(--dx-border) !important; }
body.blck-body .loader-bg { background: var(--dx-bg) !important; }
body.blck-body .loader-fill { background: linear-gradient(90deg, #5eead4, #a78bfa) !important; }

/* =================================================================
 * Dashboard home (panel.php) components
 * ================================================================= */
body.blck-body .dx-shell { display: flex; flex-direction: column; gap: 22px; max-width: 1240px; margin: 0 auto; }
body.blck-body .dx-grad { background: linear-gradient(110deg, #5eead4, #a78bfa); -webkit-background-clip: text; background-clip: text; color: transparent; }
body.blck-body .dx-welcome {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 240px; align-items: center; gap: 12px;
  min-height: 220px; padding: 30px 34px; border-radius: 26px; border: 1px solid transparent; overflow: hidden;
  background: radial-gradient(70% 140% at 0% 0%, rgba(94,234,212,0.18), transparent 60%), radial-gradient(60% 140% at 100% 100%, rgba(167,139,250,0.22), transparent 60%), linear-gradient(180deg, #14141d, #0c0c12) padding-box, var(--dx-ring) border-box;
}
body.blck-body .dx-welcome::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.6;
  background-image: linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size: 40px 40px; -webkit-mask-image: radial-gradient(60% 80% at 80% 50%, #000, transparent); mask-image: radial-gradient(60% 80% at 80% 50%, #000, transparent);
}
body.blck-body .dx-welcome-copy { position: relative; }
body.blck-body .dx-eyebrow { margin: 0 0 6px; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--dx-teal); }
body.blck-body .dx-welcome h1 { margin: 0 0 8px; font-size: clamp(1.6rem, 3vw, 2.3rem); font-weight: 800; letter-spacing: -0.035em; color: #fff; }
body.blck-body .dx-sub { margin: 0 0 20px; color: rgba(255,255,255,0.62); }
body.blck-body .dx-actions { display: flex; flex-wrap: wrap; gap: 10px; }
body.blck-body .dx-btn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 18px; font-size: 0.88rem; text-decoration: none; }
body.blck-body .dx-btn i { color: var(--dx-teal); }
body.blck-body .dx-welcome-cino { position: relative; justify-self: center; width: 230px; height: auto; margin: -20px 0 -40px; filter: drop-shadow(0 24px 30px rgba(0,0,0,0.55)); animation: dxFloat 7s ease-in-out infinite; }
@keyframes dxFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }

body.blck-body .dx-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
body.blck-body .dx-kpi {
  display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: var(--dx-radius); text-decoration: none; color: inherit;
  border: 1px solid var(--dx-border); background: var(--dx-panel); transition: border-color 0.2s, transform 0.2s;
}
body.blck-body .dx-kpi:hover { border-color: rgba(94,234,212,0.3); transform: translateY(-2px); color: inherit; }
body.blck-body .dx-kpi small { display: block; font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255,255,255,0.5); }
body.blck-body .dx-kpi strong { font-family: var(--v2-mono, monospace); font-size: 1.25rem; color: #fff; }
body.blck-body .dx-orb {
  position: relative; display: grid; place-items: center; flex-shrink: 0; width: 46px; height: 46px; border-radius: 50%;
  font-size: 1.2rem; color: var(--dx-teal); text-shadow: 0 0 10px rgba(94,234,212,0.7);
  background: var(--dx-orb); box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 0 0 1px rgba(94,234,212,0.22), 0 8px 18px -8px rgba(0,0,0,0.9);
}
body.blck-body .dx-orb::after {
  content: ""; position: absolute; left: -6px; right: -6px; top: 40%; height: 22%; border-radius: 50%;
  border: 1px solid rgba(167,139,250,0.55); border-top-color: transparent; transform: rotate(-14deg);
}

body.blck-body .dx-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
body.blck-body .dx-section-head h2 { margin: 0; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255,255,255,0.55); }
body.blck-body .dx-section-head span { font-size: 0.78rem; color: rgba(255,255,255,0.45); }
body.blck-body .dx-products { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
body.blck-body .dx-products-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.blck-body .dx-product {
  position: relative; display: flex; flex-direction: column; padding: 20px 18px 18px; border-radius: var(--dx-radius); overflow: hidden;
  border: 1px solid var(--dx-border); background: var(--dx-panel); transition: border-color 0.25s, transform 0.25s;
}
body.blck-body .dx-product:hover { border-color: rgba(94,234,212,0.3); transform: translateY(-3px); }
body.blck-body .dx-product-art { position: absolute; right: 12px; top: 12px; width: 76px; max-height: 84px; object-fit: contain; height: auto; opacity: 0.95; filter: drop-shadow(0 12px 18px rgba(0,0,0,0.5)); transition: transform 0.4s; -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent 98%); mask-image: linear-gradient(180deg, #000 72%, transparent 98%); }
body.blck-body .dx-product:hover .dx-product-art { transform: translateY(-4px) rotate(-3deg); }
body.blck-body .dx-product-stat { margin: 0 0 6px; font-family: var(--v2-mono, monospace); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--dx-teal); }
body.blck-body .dx-product.premium .dx-product-stat, body.blck-body .dx-product.v6 .dx-product-stat { color: #c4b5fd; }
body.blck-body .dx-product h3 { margin: 0; padding-right: 84px; font-size: 1.02rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; }
body.blck-body .dx-product > p { margin: 6px 0 12px; padding-right: 72px; font-size: 0.82rem; line-height: 1.45; color: rgba(255,255,255,0.6); }
body.blck-body .dx-product ul { margin: 0 0 16px; padding: 0; list-style: none; display: grid; gap: 4px; }
body.blck-body .dx-product li { position: relative; padding-left: 16px; font-size: 0.8rem; color: rgba(255,255,255,0.72); }
body.blck-body .dx-product li::before { content: ""; position: absolute; left: 0; top: 0.55em; width: 6px; height: 6px; border-radius: 50%; background: var(--dx-teal); box-shadow: 0 0 6px rgba(94,234,212,0.7); }
body.blck-body .dx-product .dx-btn { margin-top: auto; align-self: flex-start; }
body.blck-body .dx-quick { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
body.blck-body .dx-quick a {
  display: flex; align-items: center; gap: 12px; padding: 14px; border-radius: 16px; text-decoration: none; font-weight: 600; font-size: 0.9rem; color: #f4f4f8;
  border: 1px solid var(--dx-border); background: var(--dx-panel); transition: border-color 0.2s;
}
body.blck-body .dx-quick a:hover { border-color: rgba(94,234,212,0.3); color: #fff; }
body.blck-body .dx-quick .dx-orb { width: 38px; height: 38px; font-size: 1rem; }

@media (max-width: 1199px) {
  body.blck-body .dx-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.blck-body .dx-kpis, body.blck-body .dx-quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  body.blck-body .dx-welcome { grid-template-columns: 1fr; padding: 24px 20px 0; }
  body.blck-body .dx-welcome-cino { width: 170px; margin: 0 auto -30px; }
  body.blck-body .dx-products, body.blck-body .dx-products-2 { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { body.blck-body .dx-welcome-cino { animation: none; } }

/* =================================================================
 * Auth pages (login / register / forgot)
 * ================================================================= */
body.solver-auth { overflow-x: hidden; overflow-y: auto; background: #0b0b10; }
body.solver-auth .ax-wrap {
  position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) 420px; align-items: center; gap: 28px;
  width: 100%; max-width: 980px; margin: 24px; padding: 18px; border-radius: 32px;
  background: radial-gradient(60% 90% at 0% 0%, rgba(94,234,212,0.14), transparent 60%), radial-gradient(60% 90% at 100% 100%, rgba(167,139,250,0.16), transparent 60%), linear-gradient(180deg, rgba(20,20,29,0.9), rgba(11,11,16,0.92)) padding-box, linear-gradient(130deg, rgba(94,234,212,0.45), rgba(255,255,255,0.05) 45%, rgba(167,139,250,0.45)) border-box;
  border: 1px solid transparent; box-shadow: 0 50px 100px -40px rgba(0,0,0,0.9);
}
body.solver-auth .ax-side { padding: 18px 10px 18px 26px; color: #f4f4f8; }
body.solver-auth .ax-cino { display: block; width: 220px; height: auto; margin: 0 0 6px -10px; filter: drop-shadow(0 24px 30px rgba(0,0,0,0.55)); animation: axFloat 7s ease-in-out infinite; }
body.solver-auth .ax-side h2 { margin: 0 0 16px; font-size: 1.7rem; font-weight: 800; letter-spacing: -0.035em; line-height: 1.15; }
body.solver-auth .ax-side ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
body.solver-auth .ax-side li { display: flex; align-items: center; gap: 10px; font-size: 0.92rem; color: rgba(255,255,255,0.72); }
body.solver-auth .ax-side li i {
  display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #5eead4;
  background: radial-gradient(circle at 32% 28%, #3a3a4c, #15151e 62%, #0a0a10); box-shadow: 0 0 0 1px rgba(94,234,212,0.25);
}
body.solver-auth .ax-wrap .auth-card { margin: 0; max-width: none; border-radius: 24px; background: linear-gradient(180deg, #15151e, #0d0d14); border: 1px solid rgba(255,255,255,0.08); box-shadow: inset 0 1px 0 rgba(255,255,255,0.05); }
body.solver-auth .auth-card::before { background: linear-gradient(90deg, transparent, #5eead4, #a78bfa, transparent); }
body.solver-auth .auth-input { background: #0b0b11; border-radius: 12px; }
body.solver-auth .auth-btn {
  color: #fff !important; border: 1px solid transparent !important; border-radius: 12px !important;
  background: radial-gradient(120% 160% at 50% 130%, rgba(94,234,212,0.38), transparent 60%) padding-box, linear-gradient(180deg, #1e1e2b, #0c0c13) padding-box, linear-gradient(120deg, #5eead4, #a78bfa) border-box !important;
  box-shadow: 0 12px 30px -12px rgba(94,234,212,0.7), inset 0 1px 0 rgba(255,255,255,0.15) !important;
}
body.solver-auth .auth-btn:hover { box-shadow: 0 16px 36px -12px rgba(94,234,212,0.85), 0 0 26px -6px rgba(167,139,250,0.55) !important; }
body.solver-auth .alert { border-radius: 12px; padding: 10px 12px; margin-bottom: 14px; font-size: 0.86rem; border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.03); color: #f4f4f8; }
body.solver-auth .alert-warning { border-color: rgba(252,211,77,0.35); background: rgba(252,211,77,0.08); }
body.solver-auth .alert-danger { border-color: rgba(248,113,113,0.35); background: rgba(248,113,113,0.08); }
body.solver-auth .alert-success { border-color: rgba(52,211,153,0.35); background: rgba(52,211,153,0.08); }
@keyframes axFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@media (max-width: 860px) {
  body.solver-auth .ax-wrap { grid-template-columns: 1fr; max-width: 460px; padding: 10px; }
  body.solver-auth .ax-side { display: none; }
}
@media (prefers-reduced-motion: reduce) { body.solver-auth .ax-cino { animation: none; } }

/* =================================================================
 * Residential buy page (uye_new-residential-buy.php)
 * ================================================================= */
body.blck-body .bx-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; }
body.blck-body .bx-hero {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 210px; align-items: center; gap: 12px;
  min-height: 190px; margin-bottom: 18px; padding: 26px 30px; border-radius: 26px; border: 1px solid transparent; overflow: hidden;
  background: radial-gradient(70% 140% at 0% 0%, rgba(94,234,212,0.16), transparent 60%), radial-gradient(60% 140% at 100% 100%, rgba(167,139,250,0.2), transparent 60%), linear-gradient(180deg, #14141d, #0c0c12) padding-box, var(--dx-ring) border-box;
}
body.blck-body .bx-hero h1 { margin: 0 0 6px; font-size: clamp(1.5rem, 2.6vw, 2.1rem); font-weight: 800; letter-spacing: -0.035em; color: #fff; }
body.blck-body .bx-sub { margin: 0 0 16px; color: rgba(255,255,255,0.62); }
body.blck-body .bx-back { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 12px; font-size: 0.8rem; font-weight: 600; color: rgba(255,255,255,0.6); text-decoration: none; }
body.blck-body .bx-back:hover { color: var(--dx-teal); }
body.blck-body .bx-cino { justify-self: center; width: 200px; height: auto; margin: -14px 0 -34px; filter: drop-shadow(0 22px 28px rgba(0,0,0,0.55)); animation: dxFloat 7s ease-in-out infinite; }
body.blck-body .bx-steps { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
body.blck-body .bx-steps li { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 999px; font-size: 0.78rem; font-weight: 600; color: rgba(255,255,255,0.55); border: 1px solid rgba(255,255,255,0.1); }
body.blck-body .bx-steps li span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: 0.72rem; background: #1b1b26; color: rgba(255,255,255,0.6); }
body.blck-body .bx-steps li.is-on { color: #fff; border-color: rgba(94,234,212,0.35); }
body.blck-body .bx-steps li.is-on span { color: #042f2e; background: linear-gradient(135deg, #5eead4, #a78bfa); }

body.blck-body .bx-products { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
body.blck-body .bx-product {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 16px 16px 14px; text-align: left;
  border-radius: 18px; border: 1px solid var(--dx-border); background: var(--dx-panel); color: inherit; cursor: pointer; overflow: hidden;
  transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s;
}
body.blck-body .bx-product:hover { border-color: rgba(94,234,212,0.3); transform: translateY(-2px); }
body.blck-body .bx-product:focus-visible { outline: 2px solid var(--dx-teal); outline-offset: 2px; }
body.blck-body .bx-product.is-on {
  border-color: transparent;
  background: radial-gradient(100% 70% at 50% 0%, rgba(94,234,212,0.16), transparent 70%) padding-box, linear-gradient(180deg, #15151f, #0d0d14) padding-box, linear-gradient(160deg, #5eead4, rgba(167,139,250,0.85)) border-box;
  box-shadow: 0 22px 46px -26px rgba(94,234,212,0.55);
}
body.blck-body .bx-product img { position: absolute; right: 10px; top: 10px; width: 62px; height: 62px; object-fit: contain; filter: drop-shadow(0 10px 14px rgba(0,0,0,0.5)); transition: transform 0.3s; }
body.blck-body .bx-product.is-on img { transform: scale(1.08) rotate(-4deg); }
body.blck-body .bx-product-stat { font-family: var(--v2-mono, monospace); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--dx-teal); }
body.blck-body .bx-product strong { padding-right: 66px; font-size: 0.98rem; font-weight: 700; color: #fff; }
body.blck-body .bx-product-lead { padding-right: 40px; font-size: 0.78rem; line-height: 1.4; color: rgba(255,255,255,0.58); }
body.blck-body .bx-product-price { margin-top: 8px; padding: 4px 10px; border-radius: 999px; font-family: var(--v2-mono, monospace); font-size: 0.74rem; font-weight: 700; color: #c4b5fd; background: rgba(167,139,250,0.1); box-shadow: inset 0 0 0 1px rgba(167,139,250,0.3); }
body.blck-body .bx-check { position: absolute; right: 12px; bottom: 12px; font-size: 1.25rem; color: var(--dx-teal); opacity: 0; transform: scale(0.6); transition: opacity 0.2s, transform 0.2s; text-shadow: 0 0 10px rgba(94,234,212,0.7); }
body.blck-body .bx-product.is-on .bx-check { opacity: 1; transform: none; }

body.blck-body .bx-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 16px; }
body.blck-body .bx-seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 4px; border-radius: 14px; background: #0d0d14; border: 1px solid rgba(255,255,255,0.1); }
body.blck-body .bx-seg button { padding: 9px 6px; border-radius: 10px; border: 0; background: transparent; color: rgba(255,255,255,0.6); font: inherit; font-size: 0.85rem; font-weight: 600; cursor: pointer; transition: background 0.2s, color 0.2s; }
body.blck-body .bx-seg button:hover { color: #fff; }
body.blck-body .bx-seg button.is-on { color: #fff; background: linear-gradient(180deg, #1e1e2b, #12121a); box-shadow: inset 0 0 0 1px rgba(94,234,212,0.4), 0 0 14px -4px rgba(94,234,212,0.5); }
body.blck-body .bx-extend { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; padding: 12px 14px; border-radius: 16px; border: 1px solid var(--dx-border); background: rgba(255,255,255,0.02); }
body.blck-body .bx-extend img { width: 48px; height: 48px; object-fit: contain; }
body.blck-body .bx-extend strong { display: block; color: #fff; }
body.blck-body .bx-extend span { font-size: 0.8rem; color: rgba(255,255,255,0.55); }
body.blck-body .bx-gb { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center; }
body.blck-body .bx-gb .px-gb-input { background: #0d0d14 !important; }
body.blck-body .bx-gb-step { width: 48px; height: 48px; border-radius: 50%; border: 0; font-size: 1.1rem; color: var(--dx-teal); background: var(--dx-orb); box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 0 1px rgba(94,234,212,0.22); cursor: pointer; transition: box-shadow 0.2s; }
body.blck-body .bx-gb-step:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 0 0 1px rgba(94,234,212,0.5), 0 0 14px -2px rgba(94,234,212,0.5); }
body.blck-body .px-gb-suffix { color: #ccfbf1 !important; background: linear-gradient(180deg, #1c1c28, #101018) padding-box, linear-gradient(120deg, #5eead4, #a78bfa) border-box !important; border: 1px solid transparent; }

body.blck-body .blck-pricing-card.popular::before { color: #ccfbf1 !important; background: linear-gradient(180deg, #1c1c28, #101018) padding-box, linear-gradient(120deg, #5eead4, #a78bfa) border-box !important; border: 1px solid transparent; box-shadow: 0 0 12px -3px rgba(94,234,212,0.6); }
body.blck-body .blck-pricing-gb { color: #fff; }
body.blck-body .blck-pricing-discount { color: #6ee7b7 !important; }

body.blck-body .bx-summary { border-color: transparent !important; background: linear-gradient(180deg, #15151e, #0d0d14) padding-box, var(--dx-ring) border-box !important; }
body.blck-body .bx-total { padding: 16px 0 !important; }
body.blck-body .bx-balance { display: flex; justify-content: space-between; align-items: center; margin: 4px 0 10px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,0.03); border: 1px solid var(--dx-border); font-size: 0.85rem; color: rgba(255,255,255,0.6); }
body.blck-body .bx-balance i { color: var(--dx-teal); }
body.blck-body .bx-balance strong { font-family: var(--v2-mono, monospace); color: #fff; }
body.blck-body .bx-balance.is-low { border-color: rgba(252,211,77,0.4); }
body.blck-body .bx-balance.is-low strong { color: #fcd34d; }
body.blck-body .bx-topup { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; padding: 10px 12px; border-radius: 12px; font-size: 0.82rem; font-weight: 600; color: #fde68a; text-decoration: none; background: rgba(252,211,77,0.08); border: 1px solid rgba(252,211,77,0.3); }
body.blck-body .bx-topup[hidden] { display: none; }
body.blck-body .bx-topup:hover { color: #fff; background: rgba(252,211,77,0.14); }
body.blck-body .bx-topup .ti-arrow-right { margin-left: auto; }
body.blck-body .bx-secure { display: flex; align-items: center; gap: 6px; margin: 12px 0 0; font-size: 0.75rem; color: rgba(255,255,255,0.45); }
body.blck-body .bx-secure i { color: var(--dx-teal); }
body.blck-body .bx .px-feature-grid { margin-top: 4px; }

@media (max-width: 640px) {
  body.blck-body .bx-hero { grid-template-columns: 1fr; padding: 22px 18px 0; }
  body.blck-body .bx-cino { width: 150px; margin: 0 auto -24px; }
  body.blck-body .bx-fields { grid-template-columns: 1fr; }
}
body.blck-body a.bx-product { text-decoration: none; }
body.blck-body a.bx-product:hover { color: inherit; box-shadow: 0 22px 46px -26px rgba(94,234,212,0.45); }
body.blck-body .bx-go { position: absolute; right: 14px; bottom: 14px; color: var(--dx-teal); transition: transform 0.2s; }
body.blck-body a.bx-product:hover .bx-go { transform: translateX(4px); }
body.blck-body .bx-strip { margin-top: 18px; }
body.blck-body .px-buy-layout .bx-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.blck-body .blck-pricing-card.popular::before { top: 8px !important; right: 8px !important; padding: 2px 7px !important; font-size: 0.56rem !important; }
body.blck-body .blck-pricing-card.popular .blck-pricing-gb { margin-top: 16px; }
@media (max-width: 560px) { body.blck-body .px-buy-layout .bx-products { grid-template-columns: 1fr; } }