:root{
  --tarot-bg:#0d0d0f;
  --tarot-surface:#161618;
  --tarot-text:#e0e0e0;
  --tarot-muted:#a9a9b0;
  --tarot-border: rgba(255,255,255,.10);
  --tarot-gold:#c5a059; /* accent */
  --tarot-bronze:#6e4a2b;
}

@font-face{
  font-family:'Playfair Display';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src: local('Playfair Display'), url('https://fonts.gstatic.com/s/playfairdisplay/v30/nuFiD-vYSZviVYUb_rj3ij__anPXDTzYh3Y.woff2') format('woff2');
}

body{
  background: var(--tarot-bg);
  color: var(--tarot-text);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif;
}

/* Bootstrap text utilities: ensure readable contrast on dark surfaces */
.text-muted,
.text-secondary,
.text-body-secondary,
.text-body-tertiary,
.form-text,
small.text-muted{
  color: var(--tarot-muted) !important;
}

h1,h2,h3,h4,h5,.navbar-brand{
  font-family:'Playfair Display', Georgia, 'Times New Roman', serif;
  letter-spacing:.3px;
}

.navbar-glass{
  background: rgba(13,13,15,.6)!important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--tarot-border);
}
.navbar .navbar-brand{ color: var(--tarot-gold)!important; }

/* Лёгкий звёздный фон */
.container, main{ position: relative; }

/* Карточки с золотым свечением */
.tarot-card{
  background: var(--tarot-surface);
  border: 1px solid var(--tarot-border);
  border-radius: 15px;
}

/* Аватар с золотой рамкой */
.avatar-gold{
  width: 72px; height:72px; border-radius:50%;
  border: 1px solid var(--tarot-border);
  object-fit: cover;
}

/* Градиентная кнопка золото */
.btn-gradient-gold{
  color: #fff;
  font-weight:600;
  background-image: linear-gradient(135deg, var(--tarot-gold), var(--tarot-bronze));
  border: 1px solid var(--tarot-gold);
}
.btn-gradient-gold:hover{ filter: brightness(1.03); }
.btn-outline-primary{ color: var(--tarot-gold); border-color: var(--tarot-gold); }
.btn-outline-primary:hover{ background: rgba(197,160,89,.08); color:#fff; border-color: var(--tarot-gold); }
.btn-outline-secondary{ color: var(--tarot-muted); border-color: var(--tarot-border); }
.btn-outline-secondary:hover{ background: rgba(255,255,255,.06); color:#fff; }

/* Shimmer effect for buttons */
.btn-shimmer{
  position: relative;
  overflow: hidden;
}
.btn-shimmer::after{
  content:"";
  position: absolute;
  top:0; left:-150%;
  width: 50%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.35), transparent);
  transform: skewX(-20deg);
  animation: tarot-shimmer 2s infinite;
}
@keyframes tarot-shimmer{
  0%{ left:-150%; }
  100%{ left:200%; }
}

/* Stepper */
.stepper{ display:flex; align-items:flex-start; gap:18px; }
.step-item{ display:flex; align-items:center; gap:10px; opacity:.7; }
.step-item.active{ opacity:1; }
.step-item.completed{ opacity:1; }
.step-item .step-circle{
  width:30px; height:30px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.08);
  border:1px solid var(--tarot-gold);
  color: var(--tarot-gold);
  font-weight:600;
}
.step-item.completed .step-circle{ background: var(--tarot-gold); color:#1a0933; }
.step-item .step-label{ line-height:1.1; }
.step-item.disputed .step-circle{ background:#8b2d2d; border-color:#c76; color:#fff; }

/* Transparent list-group items on dark bg */
.list-group-item{ border-color: rgba(212,175,55,.2); }
.list-group-item.bg-transparent{ background: rgba(255,255,255,.02)!important; }

/* Candles — subtle tarot ambience */
.tarot-candles{
  position: fixed; inset: 0; pointer-events:none; z-index: 0;
}
.candle{ position: absolute; width: 12px; height: 52px; }
.candle .wax{
  position:absolute; bottom:0; left:0; right:0; height: 44px;
  background: linear-gradient(180deg, #1c1c1f, #121214);
  border: 1px solid var(--tarot-border);
  border-radius: 4px 4px 2px 2px;
}
.candle .wick{
  position:absolute; bottom: 42px; left:50%; transform: translateX(-50%);
  width: 2px; height: 8px; background:#2a2a2d; border-radius: 1px;
}
.candle .flame{
  position:absolute; bottom: 48px; left:50%; transform: translateX(-50%);
  width: 12px; height: 18px;
  background: radial-gradient(45% 60% at 50% 40%, #ffd98a, #ffb347 60%, transparent 100%);
  border-radius: 50% 50% 45% 45%;
  filter: drop-shadow(0 0 6px rgba(255,190,120,.6));
  animation: flame-flicker 1.6s infinite ease-in-out;
}
.candle .glow{
  position:absolute; bottom: 32px; left:50%; transform: translateX(-50%);
  width: 80px; height: 80px;
  background: radial-gradient(closest-side, rgba(255,200,120,.12), transparent 70%);
  border-radius: 50%;
  animation: glow-pulse 2.4s infinite ease-in-out;
}
@keyframes flame-flicker{
  0%{ transform: translateX(-50%) translateY(0) scale(1); opacity:.95; }
  25%{ transform: translateX(-50%) translateY(-1px) scale(1.05); opacity:.9; }
  50%{ transform: translateX(-50%) translateY(0) scale(.98); opacity:.85; }
  75%{ transform: translateX(-50%) translateY(-2px) scale(1.08); opacity:.9; }
  100%{ transform: translateX(-50%) translateY(0) scale(1); opacity:.95; }
}
@keyframes glow-pulse{
  0%{ opacity:.35; }
  50%{ opacity:.5; }
  100%{ opacity:.35; }
}

.candle-left{ transform: translateX(0) }
.candle-center{ transform: translateY(4px) }
.candle-right{ transform: translateX(0) }

/* Бейджи статусов — приглушённые, контур + цветной текст */
.badge-status{ background: transparent; border:1px solid var(--tarot-border); padding:.35rem .5rem; }
.badge-in_progress{ color:#6da3ff; border-color: rgba(109,163,255,.35); }
.badge-delivered{ color:#7ecf9a; border-color: rgba(126,207,154,.35); }
.badge-completed{ color:#86d3b3; border-color: rgba(134,211,179,.35); }
.badge-new{ color:#b58cff; border-color: rgba(181,140,255,.35); }
.badge-disputed{ color:#ff827a; border-color: rgba(255,130,122,.35); }

/* Таб-контейнер */
.nav-tabs .nav-link{ color: var(--tarot-text); }
.nav-tabs .nav-link.active{
  color: var(--tarot-gold);
  background: rgba(255,255,255,.04);
  border-color: var(--tarot-border) var(--tarot-border) transparent;
}

/* Модальные окна — glassmorphism */
.modal-content{ background: rgba(22,22,24,.85); border:1px solid var(--tarot-border); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: var(--tarot-text); }

/* Формы */
.form-control, .form-select, .form-control:focus, .form-select:focus{
  background: var(--tarot-surface); color: var(--tarot-text);
  border: 1px solid var(--tarot-border);
}
.form-control::placeholder{ color: var(--tarot-muted); opacity: 1; }
.form-control:focus, .form-select:focus{ box-shadow: 0 0 0 .2rem rgba(197,160,89,.15); border-color: var(--tarot-gold); }

/* Pagination (used on marketplace + admin pagination partial) */
.pagination .page-link{
  background: var(--tarot-surface);
  color: var(--tarot-text);
  border-color: var(--tarot-border);
}
.pagination .page-link:hover{
  background: rgba(255,255,255,.05);
  border-color: var(--tarot-border);
  color: var(--tarot-text);
}
.pagination .page-link:focus{ box-shadow: 0 0 0 .2rem rgba(197,160,89,.15); }
.pagination .page-item.active .page-link{
  background: rgba(255,255,255,.08);
  border-color: var(--tarot-border);
  color: var(--tarot-text);
}
.pagination .page-item.disabled .page-link{
  background: var(--tarot-surface);
  border-color: var(--tarot-border);
  color: var(--tarot-muted);
  opacity: .6;
}

[data-theme="light"] .pagination .page-link:hover{ background: rgba(0,0,0,.03); }
[data-theme="light"] .pagination .page-item.active .page-link{ background: rgba(0,0,0,.05); }

/* Типографика/отступы */
h1,h2,h3,h4,h5{ color: var(--tarot-text); }
.card-body{ padding: 1.25rem 1.5rem; }
.row.g-4{ gap: 1.5rem; }

/* Глобальные компоненты Bootstrap под тёмную тему */
.card{ background: var(--tarot-surface); border:1px solid var(--tarot-border); color: var(--tarot-text); }
.table{ color: var(--tarot-text); }
.table thead{ color: var(--tarot-muted); }
.table tbody tr{ border-color: var(--tarot-border); }
.dropdown-menu{ background: var(--tarot-surface); color: var(--tarot-text); border:1px solid var(--tarot-border); }
.dropdown-item{ color: var(--tarot-text); }
.dropdown-item:hover, .dropdown-item.active{ background: rgba(255,255,255,.06); color:#fff; }

/* Ссылки */
a{ color: var(--tarot-muted); text-decoration: none; }
a:hover{ color: var(--tarot-text); text-decoration: underline; }
.text-accent{ color: var(--tarot-gold); }
