:root {
  --pt-bg:          #f0f2f5;
  --pt-card-bg:     #ffffff;
  --pt-text:        #1a1f2e;
  --pt-text-muted:  #6c757d;
  --pt-border:      rgba(0, 0, 0, 0.08);
  --pt-profit-pos:  #198754;
  --pt-profit-neg:  #dc3545;
  --pt-shadow:      0 1px 4px rgba(0, 0, 0, 0.08);
  --pt-navbar-bg:   #1a1f2e;
  --pt-link:        #0d6efd;
  --pt-link-hover:  #0a58ca;
  --pt-table-stripe: rgba(0, 0, 0, 0.03);
  --pt-table-hover: rgba(0, 0, 0, 0.05);
  --pt-chart-grid:  rgba(0, 0, 0, 0.05);
  --pt-input-bg:    #ffffff;
  --pt-input-border: #ced4da;
}

[data-bs-theme="dark"] {
  --pt-bg:          #0f1419;
  --pt-card-bg:     #1a2028;
  --pt-text:        #e6e6e6;
  --pt-text-muted:  #8b95a1;
  --pt-border:      rgba(255, 255, 255, 0.08);
  --pt-profit-pos:  #2dd4a4;
  --pt-profit-neg:  #f87171;
  --pt-shadow:      0 1px 4px rgba(0, 0, 0, 0.4);
  --pt-navbar-bg:   #0a0e13;
  --pt-link:        #6ea8fe;
  --pt-link-hover:  #9ec5fe;
  --pt-table-stripe: rgba(255, 255, 255, 0.02);
  --pt-table-hover: rgba(255, 255, 255, 0.05);
  --pt-chart-grid:  rgba(255, 255, 255, 0.06);
  --pt-input-bg:    #212932;
  --pt-input-border: #3a4452;
}

body { background: var(--pt-bg); color: var(--pt-text); transition: background-color .15s ease, color .15s ease; }
.navbar { background: var(--pt-navbar-bg) !important; }
.navbar-brand { font-weight: 700; letter-spacing: .5px; }

.card {
  background: var(--pt-card-bg);
  color: var(--pt-text);
  border: 1px solid var(--pt-border);
  box-shadow: var(--pt-shadow);
  border-radius: 10px;
}

.text-muted { color: var(--pt-text-muted) !important; }
.text-dark  { color: var(--pt-text) !important; }

.stat-card .display-6 { font-weight: 700; }
.bg-teal { background-color: #20c997; }
.table th { font-size: .8rem; text-transform: uppercase; color: var(--pt-text-muted); letter-spacing: .5px; }
.btn-sm { font-size: .78rem; }

.profit-positive { color: var(--pt-profit-pos); font-weight: 600; }
.profit-negative { color: var(--pt-profit-neg); font-weight: 600; }

.photo-thumb { width: 50px; height: 50px; object-fit: cover; border-radius: 6px; }

body.login { background: var(--pt-navbar-bg); display: flex; align-items: center; min-height: 100vh; }
.login-card { max-width: 380px; width: 100%; }

.pagination-wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.pagination-wrap .small { color: var(--pt-text-muted); }

.form-control, .form-select { background-color: var(--pt-input-bg); border-color: var(--pt-input-border); color: var(--pt-text); }
.form-control:focus, .form-select:focus { background-color: var(--pt-input-bg); color: var(--pt-text); }
.table { color: var(--pt-text); }
.table-hover > tbody > tr:hover > * { background-color: var(--pt-table-hover); }

a { color: var(--pt-link); }
a:hover { color: var(--pt-link-hover); }

.theme-toggle { background: none; border: 1px solid rgba(255, 255, 255, 0.2); color: #fff; padding: .25rem .55rem; border-radius: 6px; cursor: pointer; line-height: 1; }
.theme-toggle:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.35); }
.theme-toggle i { font-size: 1rem; }

.hero-pl {
  background: linear-gradient(135deg, #0d6efd 0%, #6610f2 100%);
  color: #fff;
  border-radius: 14px;
  padding: 1.75rem 2rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 18px rgba(13, 110, 253, 0.25);
}
.hero-pl::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.hero-pl.is-positive { background: linear-gradient(135deg, #198754 0%, #20c997 100%); box-shadow: 0 4px 18px rgba(25, 135, 84, 0.25); }
.hero-pl.is-negative { background: linear-gradient(135deg, #dc3545 0%, #fd7e14 100%); box-shadow: 0 4px 18px rgba(220, 53, 69, 0.25); }
.hero-pl .pl-label { font-size: .85rem; opacity: .9; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; }
.hero-pl .pl-value { font-size: 3rem; font-weight: 800; line-height: 1.1; margin: .25rem 0 .5rem; letter-spacing: -1px; }
.hero-pl .pl-meta { font-size: .9rem; opacity: .9; }
.hero-pl .pl-meta strong { font-weight: 700; }

.spark { width: 100%; height: 38px; display: block; }
.spark path.line   { fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.spark path.area   { stroke: none; opacity: .18; }
.spark .dot       { stroke-width: 1.5; }
.spark.pos path.line { stroke: var(--pt-profit-pos); }
.spark.pos path.area { fill: var(--pt-profit-pos); }
.spark.pos .dot      { fill: var(--pt-profit-pos); stroke: var(--pt-card-bg); }
.spark.neg path.line { stroke: var(--pt-profit-neg); }
.spark.neg path.area { fill: var(--pt-profit-neg); }
.spark.neg .dot      { fill: var(--pt-profit-neg); stroke: var(--pt-card-bg); }
.spark.neu path.line { stroke: var(--pt-text-muted); }
.spark.neu path.area { fill: var(--pt-text-muted); }
.spark.neu .dot      { fill: var(--pt-text-muted); stroke: var(--pt-card-bg); }

@media (max-width: 575.98px) {
  .hero-pl { padding: 1.25rem 1.25rem; }
  .hero-pl .pl-value { font-size: 2.1rem; }
}
