:root{
  --pm-bg: #edf3fb;
  --pm-bg-grad-top: #f8fbff;
  --pm-bg-glow-a: rgba(37,99,235,.08);
  --pm-bg-glow-b: rgba(14,165,233,.08);
  --pm-card: #ffffff;
  --pm-card-soft: #fbfdff;
  --pm-line: #dbe7f5;
  --pm-line-soft: #edf2f8;
  --pm-ink: #0f172a;
  --pm-muted: #64748b;
  --pm-shadow: 0 10px 24px rgba(15,23,42,.05);
  --pm-sidebar-bg: #182032;
  --pm-sidebar-line: rgba(255,255,255,.12);
  --pm-sidebar-text: #cbd5e1;
  --pm-sidebar-active: rgba(255,255,255,.14);
}

html[data-theme="dark"]{
  --pm-bg: #0b1220;
  --pm-bg-grad-top: #0f172a;
  --pm-bg-glow-a: rgba(37,99,235,.18);
  --pm-bg-glow-b: rgba(14,165,233,.12);
  --pm-card: #111827;
  --pm-card-soft: #0f172a;
  --pm-line: #223046;
  --pm-line-soft: #1b2638;
  --pm-ink: #e5edf8;
  --pm-muted: #9fb1c8;
  --pm-shadow: 0 16px 34px rgba(0,0,0,.34);
  --pm-sidebar-bg: #0a1020;
  --pm-sidebar-line: rgba(148,163,184,.18);
  --pm-sidebar-text: #dbe6f5;
  --pm-sidebar-active: rgba(37,99,235,.22);
}

body{
  background:
    radial-gradient(circle at 0% 0%, var(--pm-bg-glow-a), transparent 28%),
    radial-gradient(circle at 100% 100%, var(--pm-bg-glow-b), transparent 28%),
    linear-gradient(180deg, var(--pm-bg-grad-top), var(--pm-bg)) !important;
  color: var(--pm-ink) !important;
}

.topbar,
.search-box,
.widget-card,
.profile-card,
.ref-box,
.ref-card,
.card,
.panel,
.table-wrap,
.form-wrap,
.info-box,
.card-soft,
.offer-card,
.section-card,
.filter-bar,
.jobs-shell,
.wl-card,
.doc-card,
.side-card,
.guide-box,
.lead-card,
.metric,
.job-card,
.job-payout,
.offer-price,
.sub-box,
.domain-type-wrap label,
.timeline,
.link-row,
.mini-box,
.readonly-box,
.jobs-count,
.topbar-user,
.table-responsive > .table,
.modal-content{
  background: linear-gradient(180deg, var(--pm-card), var(--pm-card-soft)) !important;
  border-color: var(--pm-line) !important;
  box-shadow: var(--pm-shadow) !important;
}

.table,
.table tbody,
.table thead,
.table tr,
.table th,
.table td{
  border-color: var(--pm-line-soft) !important;
  color: var(--pm-ink) !important;
  background: transparent !important;
}

.table th{
  background: color-mix(in srgb, var(--pm-card) 70%, var(--pm-bg-grad-top) 30%) !important;
  color: var(--pm-ink) !important;
}

.topbar{
  background: color-mix(in srgb, var(--pm-card) 86%, transparent) !important;
}

.form-control,
.form-select,
.ref-input,
.input-group-text,
textarea,
select{
  background: var(--pm-card) !important;
  color: var(--pm-ink) !important;
  border-radius: 10px !important;
  border-color: var(--pm-line) !important;
}

.form-control::placeholder,
textarea::placeholder{
  color: var(--pm-muted) !important;
}

.form-control:focus,
.form-select:focus,
textarea:focus,
select:focus{
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important;
}

.btn,
.copy-btn,
.btn-primary,
.btn-primary-soft,
.btn-login,
.btn-dark,
.btn-outline-secondary,
.btn-outline-primary,
.btn-outline-dark,
.btn-outline-success{
  border-radius: 10px !important;
}

.badge,
.ref-status,
.alert,
.rounded,
.rounded-3,
.rounded-4,
.rounded-pill{
  border-radius: 8px !important;
}

.bottom-nav{
  border-top: 1px solid var(--pm-line) !important;
  background: color-mix(in srgb, var(--pm-card) 92%, transparent) !important;
}

.text-muted,
.small,
.profile-key,
.ref-info,
.widget-label,
.section-sub,
.jobs-sub,
.metric-sub,
.hero-sub,
.offer-subtext,
.field-help{
  color: var(--pm-muted) !important;
}

.offer-title,
.job-name,
.lead-name,
.jobs-title,
.section-title,
.panel-title,
.topbar-title,
.stat-value,
.metric .value,
.value,
.section-title,
.lead-item .v,
.mini-box .v,
.readonly-box{
  color: var(--pm-ink);
}

.offer-card .offer-body,
.job-card .job-copy,
.lead-card,
.section-card,
.card-soft,
.panel,
.table-wrap,
.filter-bar,
.guide-box,
.doc-card,
.wl-card,
.side-card{
  color: var(--pm-ink) !important;
}

.hero,
.jobs-head{
  box-shadow: 0 18px 36px rgba(29,78,216,.18) !important;
}

.hero .stat-box,
.hero .hero-stat,
.hero .hero-mini-card,
.jobs-head .stat-box{
  background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.10)) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  color: #fff !important;
}

.hero .stat-box .k,
.hero .hero-stat .k,
.hero .hero-mini-card .hero-mini-k,
.jobs-head .stat-box .k{
  color: rgba(255,255,255,.76) !important;
}

.hero .stat-box .v,
.hero .hero-stat .v,
.hero .hero-mini-card .hero-mini-v,
.jobs-head .stat-box .v{
  color: #fff !important;
}

.hero .stat-box .s,
.hero .hero-stat .s,
.hero .hero-mini-card .hero-mini-s,
.hero .hero-sub,
.jobs-head .jobs-sub{
  color: rgba(255,255,255,.84) !important;
}

.hero .hero-title,
.hero-card .hero-title,
.jobs-head .jobs-title{
  color:#fff !important;
}

.hero .hero-chip,
.jobs-head .jobs-count{
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.18) !important;
  color: #fff !important;
}

.badge-owner,
.payout-chip-status,
.payout-chip-reward{
  box-shadow:none !important;
}

html[data-theme="dark"] .btn-outline-secondary,
html[data-theme="dark"] .btn-outline-dark,
html[data-theme="dark"] .btn-outline-primary{
  color: #dbe6f5 !important;
  border-color: #334155 !important;
  background: transparent !important;
}

html[data-theme="dark"] .btn-outline-secondary:hover,
html[data-theme="dark"] .btn-outline-dark:hover,
html[data-theme="dark"] .btn-outline-primary:hover{
  background: #162235 !important;
}

html[data-theme="dark"] .badge.bg-warning,
html[data-theme="dark"] .badge.text-bg-warning{
  color: #111827 !important;
}

html[data-theme="dark"] .url-box,
html[data-theme="dark"] .readonly-box,
html[data-theme="dark"] .lead-item,
html[data-theme="dark"] .mini-box,
html[data-theme="dark"] .sub-preview,
html[data-theme="dark"] .domain-type-wrap label,
html[data-theme="dark"] .guide-box,
html[data-theme="dark"] .job-payout,
html[data-theme="dark"] .offer-price,
html[data-theme="dark"] .link-row,
html[data-theme="dark"] .sub-box{
  background: #0f172a !important;
  border-color: #223046 !important;
  color: var(--pm-ink) !important;
}

html[data-theme="dark"] .cat-chip{
  background:#162235 !important;
  color:#dbe6f5 !important;
}

html[data-theme="dark"] .cat-chip.active{
  color:#fff !important;
}

html[data-theme="dark"] .badge-model{
  background:#dbe6f5 !important;
  color:#111827 !important;
}

html[data-theme="dark"] .badge-owner{
  background:#162235 !important;
  border-color:#2b3c56 !important;
  color:#dbe6f5 !important;
}

html[data-theme="dark"] .bottom-nav a{
  color:#9fb1c8 !important;
}

html[data-theme="dark"] .bottom-nav a.active{
  color:#60a5fa !important;
}

html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .payout-premium{
  background: linear-gradient(180deg,#111827,#0f172a) !important;
  border-color: #223046 !important;
}

html[data-theme="dark"] .topbar-user,
html[data-theme="dark"] .jobs-count,
html[data-theme="dark"] .hero-chip{
  color: #e5edf8 !important;
}

html[data-theme="dark"] .stat-box,
html[data-theme="dark"] .metric,
html[data-theme="dark"] .job-card,
html[data-theme="dark"] .offer-card,
html[data-theme="dark"] .section-card,
html[data-theme="dark"] .card-soft,
html[data-theme="dark"] .filter-bar,
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .guide-box,
html[data-theme="dark"] .wl-card,
html[data-theme="dark"] .doc-card,
html[data-theme="dark"] .side-card,
html[data-theme="dark"] .lead-card{
  background: linear-gradient(180deg,#111827,#0f172a) !important;
  border-color:#223046 !important;
}

html[data-theme="dark"] .metric .icon,
html[data-theme="dark"] .job-logo,
html[data-theme="dark"] .sidebar-logo{
  box-shadow:0 10px 18px rgba(0,0,0,.24) !important;
}

html[data-theme="dark"] .table-light,
html[data-theme="dark"] .table-light th,
html[data-theme="dark"] .table-light td{
  background:#0f172a !important;
  color:var(--pm-ink) !important;
}

html[data-theme="dark"] .alert{
  background:#162235 !important;
  border-color:#28405f !important;
  color:#dbe6f5 !important;
}

html[data-theme="dark"] .btn-light{
  background:#e5edf8 !important;
  color:#111827 !important;
  border-color:#e5edf8 !important;
}

@media(max-width:991px){
  .sidebar{box-shadow:0 16px 36px rgba(15,23,42,.3);}
}