/* =========================================================
   SMAK / social.mixt.ing — MIXT soft dark theme v1
   Safe override layer. Load AFTER Bootstrap and existing inline/header CSS.
   ========================================================= */

:root{
    --mixt-bg:#151823;
    --mixt-bg-2:#11141b;
    --mixt-surface:#1b1f2b;
    --mixt-surface-2:#202635;
    --mixt-border:rgba(255,255,255,.08);
    --mixt-border-2:rgba(255,255,255,.13);
    --mixt-text:#f3f4f6;
    --mixt-muted:#a7adbb;
    --mixt-violet:#7c5cff;
    --mixt-violet-2:#9b87ff;
    --mixt-pink:#ff6b8a;
    --mixt-cyan:#3dd9ff;
    --mixt-green:#52d68c;
}

/* Base atmosphere */
html,
body{
    background:
        radial-gradient(circle at top right, rgba(124,92,255,.18), transparent 34%),
        radial-gradient(circle at top left, rgba(127,140,179,.1), transparent 30%),
        linear-gradient(180deg,var(--mixt-bg) 0%,var(--mixt-bg-2) 100%) !important;
    color:var(--mixt-text) !important;
}

/* Typography */
body,
p,
div,
span,
li,
td,
th,
label{
    color:var(--mixt-text);
}

.text-muted,
small,
.small,
.problem-meta,
.footer-note{
    color:var(--mixt-muted) !important;
}

h1,h2,h3,h4,h5,h6,
.fw-bold,
.fw-semibold{
    color:#fff;
}

/* Header / navigation */
.smak-navbar,
.navbar,
header{
    background:rgba(17,20,27,.94) !important;
    border-bottom:1px solid var(--mixt-border) !important;
    backdrop-filter:blur(12px);
}

.navbar .nav-link{
    color:#d1d5db !important;
}

.navbar .nav-link.active,
.navbar .nav-link:hover{
    color:#fff !important;
}

.smak-user-menu .dropdown-toggle{
    background:rgba(32,38,53,.92) !important;
    color:#fff !important;
    border:1px solid var(--mixt-border-2) !important;
}

.smak-user-dropdown,
.dropdown-menu{
    background:#1b1f2b !important;
    border:1px solid var(--mixt-border) !important;
    box-shadow:0 18px 48px rgba(0,0,0,.35) !important;
}

.dropdown-item{
    color:#e5e7eb !important;
}

.dropdown-item:hover{
    background:rgba(124,92,255,.16) !important;
    color:#fff !important;
}

/* Cards and panels */
.card,
.smak-card,
.problem-card,
.page-card,
.sidebar-card,
.comment-card,
.alert-light,
.bg-white,
.bg-light,
.bg-light-subtle{
    background:rgba(27,31,43,.96) !important;
    color:var(--mixt-text) !important;
    border-color:var(--mixt-border) !important;
    box-shadow:0 14px 34px rgba(0,0,0,.22) !important;
}

.smak-hero{
    background:linear-gradient(135deg,rgba(27,31,43,.98) 0%,rgba(32,38,53,.96) 100%) !important;
    border-color:var(--mixt-border) !important;
}

/* Problem lists */
.problem-title{
    color:#fff !important;
}

.problem-title:hover{
    color:var(--mixt-violet-2) !important;
}

.problem-excerpt,
.smak-problem-page .problem-content,
.comment-text{
    color:#e5e7eb !important;
}

.mini-stat,
.badge.text-bg-light,
.text-bg-light{
    background:rgba(255,255,255,.08) !important;
    color:#e5e7eb !important;
    border-color:rgba(255,255,255,.10) !important;
}

/* Comments */
.comment-card{
    border-radius:16px !important;
}

.comment-card:target{
    border:2px solid var(--mixt-violet) !important;
    box-shadow:0 0 0 4px rgba(124,92,255,.20) !important;
    background:rgba(124,92,255,.13) !important;
}

@keyframes commentFlash{
    0%{background:rgba(124,92,255,.24);}
    100%{background:rgba(124,92,255,.13);}
}

/* Forms */
.form-control,
.form-select,
input,
textarea,
select{
    background:#202635 !important;
    border:1px solid rgba(255,255,255,.10) !important;
    color:#fff !important;
}

.form-control:focus,
.form-select:focus,
input:focus,
textarea:focus{
    background:#22293a !important;
    color:#fff !important;
    border-color:rgba(124,92,255,.65) !important;
    box-shadow:0 0 0 .25rem rgba(124,92,255,.16) !important;
}

.form-control::placeholder,
textarea::placeholder,
input::placeholder{
    color:#818899 !important;
}

/* Buttons */
.btn-primary{
    background:linear-gradient(135deg,var(--mixt-violet),var(--mixt-pink)) !important;
    border:none !important;
    color:#fff !important;
    box-shadow:0 10px 22px rgba(124,92,255,.18);
}

.btn-primary:hover{
    filter:brightness(1.08);
}

.btn-outline-primary{
    color:#b9adff !important;
    border-color:rgba(124,92,255,.62) !important;
    background:transparent !important;
}

.btn-outline-primary:hover{
    background:rgba(124,92,255,.16) !important;
    color:#fff !important;
}

.btn-outline-secondary{
    color:#d1d5db !important;
    border-color:rgba(255,255,255,.18) !important;
}

.btn-outline-secondary:hover{
    background:rgba(255,255,255,.08) !important;
    color:#fff !important;
}

/* AI/helper blocks */
.ai-helper-box,
.smak-ai-box,
.ai-result-box,
[class*="ai-"]{
    border-color:rgba(124,92,255,.30) !important;
}

/* Footer */
footer,
.footer,
.site-footer,
.smak-footer,
.footer-note{
    background:#11141b !important;
    border-top-color:var(--mixt-border) !important;
    color:var(--mixt-muted) !important;
}

/* Tables */
.table{
    --bs-table-bg:transparent;
    --bs-table-color:var(--mixt-text);
    --bs-table-border-color:var(--mixt-border);
}

.table > :not(caption) > * > *{
    background:transparent !important;
    color:var(--mixt-text) !important;
    border-color:var(--mixt-border) !important;
}

/* Keep dangerous inline colors under control */
[style*="background:#fff"],
[style*="background: #fff"],
[style*="background:#ffffff"],
[style*="background: #ffffff"],
[style*="background:#f8f9fa"],
[style*="background: #f8f9fa"],
[style*="background:#f5f7fb"],
[style*="background: #f5f7fb"]{
    background:rgba(27,31,43,.96) !important;
}

[style*="color:#1f2937"],
[style*="color: #1f2937"],
[style*="color:#374151"],
[style*="color: #374151"],
[style*="color:#212529"],
[style*="color: #212529"]{
    color:#e5e7eb !important;
}

[style*="#0d6efd"]{
    border-color:rgba(124,92,255,.55) !important;
}