/* static/guardify.css */
/* GUARDIFY PRO THEME - REFINED GRAYSCALE */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
    --font-main: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    
    /* Professional Grey Palette (No pure black) */
    --color-bg: #f8fafc;       /* Slate-50 */
    --color-surface: #ffffff;  /* White */
    --color-border: #e2e8f0;   /* Slate-200 */
    
    --text-main: #334155;      /* Slate-700 (Leipäteksti) */
    --text-heading: #1e293b;   /* Slate-800 (Otsikot - EI MUSTA) */
    --text-muted: #64748b;     /* Slate-500 (Aputekstit) */
    
    --brand-primary: #475569;  /* Slate-600 (Pääväri - Hillitty) */
    --brand-hover: #1e293b;    /* Slate-800 */
}

body {
    font-family: var(--font-main);
    background-color: var(--color-bg);
    color: var(--text-main);
    -webkit-font-smoothing: antialiased;
}

/* --- POISTETTU LOGO TAUSTALTA --- */
.watermark-container, .watermark-logo {
    display: none !important;
}

/* --- TYPOGRAFIA --- */
h1, h2, h3, h4, h5, h6 {
    color: var(--text-heading) !important;
    letter-spacing: -0.02em; /* Moderni, tiivis tyyli */
    font-weight: 600;
}

p, span, div {
    color: var(--text-main);
}

.text-slate-900 { color: var(--text-heading) !important; } /* Yliajetaan Tailwindin mustat */
.text-slate-500 { color: var(--text-muted) !important; }

/* --- KORTIT (CARDS) --- */
.card {
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px -1px rgba(0, 0, 0, 0.01); /* Todella kevyt varjo */
    border-radius: 0.75rem; /* 12px */
}

.card-title {
    color: var(--text-heading);
    font-size: 1.125rem;
}

/* --- KUVAKKEET (ICONS) --- */
/* Yhtenäistetään kaikki ikonit */
i.fa-solid, i.fa-regular, i.fa-brands {
    color: var(--text-muted); /* Oletusväri harmaa */
    width: 1.25em;
    text-align: center;
    transition: color 0.2s ease;
}

/* Aktiiviset tai korostetut ikonit */
.btn i, .menu-item i {
    color: inherit; /* Perii napin tekstivärin */
}

/* --- PAINIKKEET (BUTTONS) --- */
.btn {
    font-weight: 500;
    text-transform: none; /* Ei pakotettuja isoja kirjaimia */
    border-radius: 0.5rem;
    border: 1px solid transparent;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

/* Päänappi (Primary) - Muutetaan mustasta tummanharmaaksi */
.btn-primary, .btn-neutral, .bg-slate-900 {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    color: white !important;
}

.btn-primary:hover, .btn-neutral:hover, .bg-slate-900:hover {
    background-color: var(--brand-hover) !important;
    border-color: var(--brand-hover) !important;
}

/* Haamu-napit (Ghost) */
.btn-ghost {
    color: var(--text-muted);
    box-shadow: none;
}
.btn-ghost:hover {
    background-color: #f1f5f9; /* Slate-100 */
    color: var(--text-heading);
}

/* --- INPUT KENTÄT --- */
.input, .select, .textarea {
    background-color: #fff;
    border-color: var(--color-border);
    color: var(--text-heading);
    border-radius: 0.5rem;
    transition: all 0.2s;
}

.input:focus, .select:focus, .textarea:focus {
    border-color: var(--brand-primary);
    outline: 2px solid transparent;
    box-shadow: 0 0 0 2px rgba(71, 85, 105, 0.1); /* Slate-600 glow */
}

/* --- NAVIGATIO (Navbar) --- */
.navbar {
    background-color: rgba(255, 255, 255, 0.9); /* Hieman läpinäkyvä */
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--color-border);
    box-shadow: none; /* Poistetaan varjo, käytetään reunusta */
}

.menu-item {
    color: var(--text-muted);
    font-weight: 500;
    border: 1px solid transparent;
}

.menu-item:hover, .menu-item.active {
    background-color: #f1f5f9;
    color: var(--text-heading);
    border-color: var(--color-border);
}

/* --- TAULUKOT (Tables) --- */
.table th {
    background-color: #f8fafc; /* Slate-50 */
    color: var(--text-heading);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--color-border);
}

.table td {
    border-bottom: 1px solid #f1f5f9;
    color: var(--text-main);
}

.table tr:hover td {
    background-color: #f8fafc;
}

/* --- MODERN SCROLLBARS --- */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* --- Badges (Hillityt) --- */
.badge-new {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;
    background-color: #f1f5f9;
    color: var(--text-heading);
    border: 1px solid var(--color-border);
}

/* --- UTILS --- */
/* Pakotetaan taustat pois mustasta */
.bg-slate-800, .bg-slate-900, .bg-gray-900 {
    background-color: var(--brand-primary) !important;
}

/* JSON Pre Block - Tumma teema koodille on ok, mutta pehmennetään */
.json-pre {
    background-color: #1e293b; /* Slate-800 */
    color: #e2e8f0;
    border: 1px solid #334155;
}