/*
  Unified purple depth pass
  Reduces the remaining light-blue/cyan accents and brings buttons, text accents,
  badges, pills, forms, tables and panel details into one subtle purple brand system.
*/

:root{
  --csp-purple-950:#12071f!important;
  --csp-purple-900:#190a2b!important;
  --csp-purple-800:#261040!important;
  --csp-purple-700:#3a1762!important;
  --csp-purple-600:#6f2dff!important;
  --csp-purple-500:#8b20ff!important;
  --csp-purple-400:#b56cff!important;
  --csp-purple-300:#d9c4ff!important;
  --csp-purple-200:#efe6ff!important;
  --csp-accent:#b56cff!important;
  --csp-accent-2:#8b20ff!important;
  --csp-accent-3:#6d54ff!important;
  --csp-link:#d9c4ff!important;
  --csp-link-hover:#ffffff!important;
  --brand:#8b20ff!important;
  --brand-2:#b56cff!important;
  --pro-blue:#8b20ff!important;
  --pro-cyan:#b56cff!important;
}

/* Replace remaining cyan/light-blue text accents with a softer purple/lavender. */
html body :where(
  .eyebrow,
  .uc-overline,
  .uc-auth-panel-head span,
  .uc-contact-panel-head span,
  .uc-page-facts span,
  .uc-auth-feature-list span,
  .uc-contact-feature-list span,
  .showcase-kicker span,
  .datacenter-location-head .eyebrow,
  .about-timeline article span,
  .contact-support-grid article > span,
  .dedicated-live-dot,
  .dedicated-section-head .eyebrow,
  .api-method,
  .plan-tag,
  .plan-kind,
  .side-ico,
  .nav-ico
){
  color:var(--csp-purple-300)!important;
}

/* Links should not pop cyan anymore. */
html body :where(a:not(.btn), .uc-auth-panel-foot a, .uc-auth-small-link a, .uc-contact-muted a, .contact-support-grid a:not(.btn)){
  color:var(--csp-link)!important;
}

html body :where(a:not(.btn), .uc-auth-panel-foot a, .uc-auth-small-link a, .uc-contact-muted a, .contact-support-grid a:not(.btn)):hover{
  color:#fff!important;
}

/* Top navigation and language controls: more purple, less blue outline. */
html body .topbar{
  background:
    radial-gradient(circle at 18% -20%,rgba(181,108,255,.12),transparent 24rem),
    linear-gradient(180deg,rgba(11,5,24,.88),rgba(7,6,18,.86))!important;
}

html body .language-switcher,
html body .flag-language-switcher,
html body .wallet-chip,
html body .icon-btn,
html body .icon-btn.dashboard-shortcut{
  border-color:rgba(217,196,255,.18)!important;
  background:
    linear-gradient(180deg,rgba(181,108,255,.13),rgba(255,255,255,.035))!important;
  color:#eadfff!important;
}

html body .language-flag.active{
  background:rgba(181,108,255,.20)!important;
  color:#fff!important;
}

html body .top-link.active,
html body .top-link:hover{
  color:#fff!important;
}

html body .top-link::after{
  background:linear-gradient(90deg,#d9c4ff,#b56cff,#8b20ff)!important;
}

/* Buttons: make all secondary/utility actions part of the same purple family. */
html body :where(
  .btn,
  .action-btn,
  .copy-btn,
  .queue-actions .btn,
  td .btn.small,
  button:not(.plain),
  input[type="submit"]
){
  border-color:rgba(217,196,255,.14)!important;
  color:#efe6ff!important;
  background:
    radial-gradient(circle at 18% 0%,rgba(217,196,255,.10),transparent 55%),
    linear-gradient(180deg,rgba(139,32,255,.12),rgba(255,255,255,.035))!important;
}

html body :where(
  .btn:hover,
  .action-btn:hover,
  .copy-btn:hover,
  .queue-actions .btn:hover,
  td .btn.small:hover,
  button:not(.plain):hover,
  input[type="submit"]:hover
){
  border-color:rgba(217,196,255,.24)!important;
  background:
    radial-gradient(circle at 18% 0%,rgba(217,196,255,.16),transparent 60%),
    linear-gradient(180deg,rgba(139,32,255,.20),rgba(255,255,255,.05))!important;
  color:#fff!important;
}

/* Primary buttons are now purple-first, with only a tiny indigo depth at the end. */
html body :where(
  .btn.primary,
  .action-btn.primary,
  button.primary,
  input[type="submit"].primary,
  .package-order,
  .add-balance-btn,
  .uc-hero-actions .btn.primary,
  .uc-page-actions .btn.primary,
  .uc-auth-form .btn.primary,
  .uc-contact-form .btn.primary,
  .dedicated-card-bottom .btn.primary
){
  background:
    radial-gradient(circle at 20% 0%,rgba(255,255,255,.28),transparent 38%),
    linear-gradient(135deg,#d9c4ff 0%,#b56cff 22%,#8b20ff 58%,#6d54ff 100%)!important;
  color:#fff!important;
  box-shadow:
    0 18px 48px rgba(139,32,255,.30),
    0 0 0 1px rgba(255,255,255,.10) inset!important;
}

html body :where(
  .btn.primary:hover,
  .action-btn.primary:hover,
  button.primary:hover,
  input[type="submit"].primary:hover,
  .package-order:hover,
  .add-balance-btn:hover
){
  background:
    radial-gradient(circle at 20% 0%,rgba(255,255,255,.34),transparent 38%),
    linear-gradient(135deg,#eadbff 0%,#c883ff 24%,#9d35ff 60%,#7866ff 100%)!important;
  box-shadow:
    0 22px 62px rgba(139,32,255,.38),
    0 0 0 1px rgba(255,255,255,.14) inset!important;
}

/* Remove cyan from icon-like buttons and panel icons. */
html body :where(
  .icon,
  .icon.sm,
  .kpi-icon,
  .panel-icon,
  .side-ico,
  .status-icon,
  .one-feature-strip article::before,
  .csp-sort-icon
){
  background:
    radial-gradient(circle at 25% 15%,rgba(255,255,255,.14),transparent 38%),
    linear-gradient(135deg,rgba(181,108,255,.26),rgba(139,32,255,.12))!important;
  color:#eadfff!important;
  border-color:rgba(217,196,255,.16)!important;
}

/* Small light-blue dots/accents become purple. */
html body :where(
  .one-feature-strip article::after,
  .dc-node,
  .map-location-pulse circle,
  .datacenter-map-marker
){
  background:#b56cff!important;
  fill:#8b20ff!important;
  box-shadow:0 0 22px rgba(181,108,255,.52)!important;
}

/* Cards and panels: deeper purple wash, still subtle. */
html body :where(
  .card,
  .panel,
  .clean-panel,
  .dashboard-card,
  .status-card,
  .admin-table-card,
  .admin-form-card,
  .service-table-card,
  .metric,
  .stat,
  .kpi,
  .featured-card,
  .one-plan-card,
  .dedicated-inventory-card,
  .contact-support-grid article,
  .platform-feature-row article,
  .api-endpoint,
  .api-doc-card,
  .api-docs-tools,
  .faq-layout details,
  .legal-page,
  .auth-card,
  .uc-auth-panel,
  .uc-contact-panel,
  .uc-signup-panel
){
  background:
    radial-gradient(circle at 100% 0%,rgba(181,108,255,.13),transparent 190px),
    radial-gradient(circle at 0% 100%,rgba(139,32,255,.055),transparent 220px),
    linear-gradient(180deg,rgba(255,255,255,.047),rgba(255,255,255,.020))!important;
  box-shadow:
    0 24px 72px rgba(0,0,0,.20),
    0 0 0 1px rgba(217,196,255,.08) inset!important;
}

/* Card top lines and separators should be purple, not blue. */
html body :where(
  .refined-server-card,
  .dedicated-inventory-card,
  .contact-support-grid article,
  .platform-feature-row article,
  .api-endpoint,
  .admin-table-card,
  .service-table-card,
  .uc-auth-panel,
  .uc-contact-panel
)::before{
  background:linear-gradient(90deg,#eadbff,#b56cff,#8b20ff)!important;
}

html body :where(.card,.clean-panel,.api-doc-card,.legal-page,.faq-layout details)::before{
  background:linear-gradient(90deg,transparent,rgba(217,196,255,.14),transparent)!important;
}

/* Table controls/search/filter area: purple depth. */
html body :where(.csp-table-controls,.table-controls,.filter-bar,.search-row){
  background:
    linear-gradient(180deg,rgba(139,32,255,.08),rgba(255,255,255,.025))!important;
  border-color:rgba(217,196,255,.12)!important;
  box-shadow:0 0 0 1px rgba(217,196,255,.06) inset!important;
}

html body :where(table,.table,.csp-enhanced-table) thead th,
html body :where(.table th,table.csp-enhanced-table th){
  background:
    linear-gradient(180deg,rgba(181,108,255,.16),rgba(139,32,255,.055))!important;
  color:#eadfff!important;
}

/* Form inputs and selects: purple focus/edge, no cyan glow. */
html body :where(input,select,textarea,.read-field,input[type="search"]){
  border-color:rgba(217,196,255,.12)!important;
  background:
    linear-gradient(180deg,rgba(12,6,28,.74),rgba(5,10,23,.70))!important;
  color:#f8f4ff!important;
}

html body :where(input,select,textarea,.read-field,input[type="search"]):focus{
  outline-color:rgba(181,108,255,.58)!important;
  border-color:rgba(181,108,255,.48)!important;
  box-shadow:
    0 0 0 4px rgba(139,32,255,.15),
    inset 0 0 0 1px rgba(217,196,255,.18)!important;
}

/* Badges and pills. */
html body :where(
  .badge,
  .status-pill,
  .invoice-status,
  .plan-tag,
  .plan-kind,
  .section-chip-row span,
  .trust-row span,
  .map-stat-row span,
  .dedicated-card-meta span,
  .dedicated-status-pill,
  .pill,
  .alert
){
  border-color:rgba(217,196,255,.14)!important;
  background:
    linear-gradient(180deg,rgba(181,108,255,.13),rgba(255,255,255,.035))!important;
  color:#eadfff!important;
}

/* Keep success/danger recognizable, but remove the blue undertone. */
html body :where(.pill.success,.alert.success,.status-pill.active,.dedicated-status-pill.available,.btn.success){
  color:#d7ffe6!important;
  background:
    linear-gradient(135deg,rgba(67,232,137,.16),rgba(139,32,255,.10))!important;
  border-color:rgba(67,232,137,.22)!important;
}

html body :where(.pill.danger,.alert.danger,.status-pill.suspended,.btn.danger){
  color:#ffc6cf!important;
  background:
    linear-gradient(135deg,rgba(255,94,115,.16),rgba(139,32,255,.10))!important;
  border-color:rgba(255,94,115,.20)!important;
}

/* Charts and empty/waiting graph panels should not go white/blue. */
html body :where(.mini-chart,.chart-card,.metric-chart,.graph-card,canvas){
  background:
    linear-gradient(180deg,rgba(139,32,255,.055),rgba(255,255,255,.020))!important;
  border-color:rgba(217,196,255,.10)!important;
}

/* Hero abstract ribbons: richer purple, still no orb/cloud/fiber artwork. */
html body :where(.uc-ribbon,.uc-page-ribbon,.uc-auth-ribbon,.uc-contact-ribbon){
  background:
    linear-gradient(90deg,transparent 0%,rgba(181,108,255,.10) 16%,rgba(199,103,255,.50) 36%,rgba(139,32,255,.46) 58%,rgba(107,84,255,.14) 74%,transparent 100%)!important;
}

html body :where(.uc-ribbon-two,.uc-page-ribbon-two,.uc-auth-ribbon-two,.uc-contact-ribbon-two){
  background:
    linear-gradient(90deg,transparent,rgba(107,84,255,.12),rgba(139,32,255,.34),rgba(199,103,255,.25),transparent)!important;
}

/* Explicitly neutralize remaining hard-coded cyan-ish text colors in common public sections. */
html body .price-line span,
html body .dedicated-price span,
html body .muted,
html body .lead,
html body small,
html body .meta,
html body .help-text{
  color:#bdb0d3!important;
}

html body :where(.price-line strong,.dedicated-price strong,.kpi strong,.metric b,.stat b){
  color:#ffffff!important;
}

/* SVG map marker/card accent to purple family. */
html body .datacenter-map-marker{
  background:radial-gradient(circle at 50% 50%,#eadbff 0%,#b56cff 42%,#8b20ff 100%)!important;
}

html body .datacenter-map-marker::before{
  border-color:rgba(181,108,255,.35)!important;
}

/* Admin queue/manual buttons should match unified palette. */
html body .queue-actions .btn.success,
html body td .btn.success{
  color:#d7ffe6!important;
  background:linear-gradient(135deg,rgba(67,232,137,.16),rgba(139,32,255,.10))!important;
}

html body .queue-actions .btn.danger,
html body td .btn.danger{
  color:#ffc6cf!important;
  background:linear-gradient(135deg,rgba(255,94,115,.16),rgba(139,32,255,.10))!important;
}

/* Final catch for common hard-coded cyan colors in inherited CSS via CSS variables/classes. */
html body [style*="#54d4ff"],
html body [style*="#88d8ff"],
html body [style*="#9bddff"]{
  color:#d9c4ff!important;
}