/*
 * RaksaData ERP — Brand & Design System Overlay
 * ===============================================
 * Tämä CSS-tiedosto YLIKIRJOITTAA base_bootstrap.html:n inline-tyylit
 * tuomalla yhtenäisen brändinmukaisen ilmeen koko sovellukseen.
 *
 * Käyttöönotto: <link> base_bootstrap.html:n inline <style> -lohkon JÄLKEEN.
 *
 * Brand-perusta:
 *   Pääväri:  #2D5F4F (metsänvihreä)  — ammattimainen, kestävyys, puurakentaminen
 *   Aksentti: #C9923D (puusävy)       — lämmin, identiteetti
 *   Tausta:   #FAFAF7 (off-white)     — pehmeä, ei terävä
 *   Teksti:   #1F2937 (tumma harmaa)  — luettava
 *   Reuna:    #E5E7EB (vaalea harmaa) — hienovarainen
 *
 * Status:
 *   Onnistuminen: #10B981 (vihreä)
 *   Varoitus:     #F59E0B (kullankeltainen)
 *   Virhe:        #DC2626 (punainen)
 *   Info:         #3B82F6 (sininen)
 */

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

/* ===== Brändimuuttujat ===== */
:root {
    /* Brändivärit */
    --rd-primary: #2D5F4F;
    --rd-primary-dark: #1B4332;
    --rd-primary-light: #3F8C73;
    --rd-accent: #C9923D;
    --rd-accent-light: #D4A574;

    /* Neutraalit */
    --rd-bg: #FAFAF7;
    --rd-bg-alt: #F4F4EE;
    --rd-card: #FFFFFF;
    --rd-text: #1F2937;
    --rd-text-muted: #6B7280;
    --rd-border: #E5E7EB;
    --rd-border-light: #F3F4F6;

    /* Status */
    --rd-success: #10B981;
    --rd-warning: #F59E0B;
    --rd-danger: #DC2626;
    --rd-info: #3B82F6;

    /* Sidebar (oma paletti) */
    --rd-sidebar-bg: #1B4332;
    --rd-sidebar-hover: rgba(255, 255, 255, 0.08);
    --rd-sidebar-active-bg: rgba(212, 165, 116, 0.18);
    --rd-sidebar-active-border: var(--rd-accent);
    --rd-sidebar-text: rgba(255, 255, 255, 0.65);
    --rd-sidebar-text-active: #FFFFFF;
    --rd-sidebar-divider: rgba(255, 255, 255, 0.08);

    /* Tilat ja varjot */
    --rd-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.04);
    --rd-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.06), 0 1px 2px -1px rgba(0, 0, 0, 0.06);
    --rd-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.06), 0 2px 4px -2px rgba(0, 0, 0, 0.04);

    /* Bootstrap-muuttujien yliajot */
    --bs-primary: var(--rd-primary);
    --bs-primary-rgb: 45, 95, 79;
    --bs-success: var(--rd-success);
    --bs-success-rgb: 16, 185, 129;
    --bs-warning: var(--rd-warning);
    --bs-warning-rgb: 245, 158, 11;
    --bs-danger: var(--rd-danger);
    --bs-danger-rgb: 220, 38, 38;
    --bs-info: var(--rd-info);
    --bs-info-rgb: 59, 130, 246;
    --bs-body-bg: var(--rd-bg);
    --bs-body-color: var(--rd-text);
    --bs-border-color: var(--rd-border);
    --bs-link-color: var(--rd-primary);
    --bs-link-hover-color: var(--rd-primary-dark);

    /* Yliajetaan vanhan teeman muuttujat */
    --primary-color: var(--rd-primary);
    --sidebar-bg: var(--rd-sidebar-bg);
    --sidebar-hover: var(--rd-sidebar-hover);
    --sidebar-active: var(--rd-sidebar-active-bg);
    --sidebar-text: var(--rd-sidebar-text);
    --sidebar-text-active: var(--rd-sidebar-text-active);
    --content-bg: var(--rd-bg);
    --card-bg: var(--rd-card);
}

/* ===== Typografia ===== */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    color: var(--rd-text);
    background-color: var(--rd-bg);
    font-feature-settings: "cv02", "cv03", "cv04", "cv11";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--rd-text);
    font-weight: 600;
    letter-spacing: -0.01em;
}

h1 { font-size: 1.75rem; line-height: 1.2; }
h2 { font-size: 1.5rem; line-height: 1.25; }
h3 { font-size: 1.25rem; line-height: 1.3; }
h4 { font-size: 1.125rem; line-height: 1.35; }
h5 { font-size: 1rem; line-height: 1.4; font-weight: 600; }
h6 { font-size: 0.875rem; font-weight: 600; }

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

/* ===== Sidebar ===== */
.sidebar {
    background: var(--rd-sidebar-bg) !important;
    border-right: 1px solid rgba(0, 0, 0, 0.05);
}

.sidebar-brand {
    padding: 1rem 1.25rem !important;
    margin-bottom: 0.5rem !important;
    border-bottom: 1px solid var(--rd-sidebar-divider);
    color: #fff !important;
    font-weight: 700;
}

.sidebar-brand img {
    max-height: 36px;
    margin-right: 0.5rem;
}

.sidebar-brand i {
    color: var(--rd-accent) !important;
}

.sidebar .nav-link {
    color: var(--rd-sidebar-text) !important;
    padding: 0.5rem 1.25rem;
    border-left: 3px solid transparent;
    transition: all 0.15s ease;
    border-radius: 0;
    font-weight: 500;
    font-size: 0.875rem;
}

.sidebar .nav-link:hover {
    background: var(--rd-sidebar-hover) !important;
    color: var(--rd-sidebar-text-active) !important;
}

.sidebar .nav-link.active {
    background: var(--rd-sidebar-active-bg) !important;
    color: var(--rd-sidebar-text-active) !important;
    border-left-color: var(--rd-sidebar-active-border) !important;
}

.sidebar .nav-link i {
    color: var(--rd-accent-light);
    font-size: 1rem;
    margin-right: 0.6rem;
}

.sidebar .nav-link.active i {
    color: var(--rd-accent);
}

.sidebar-heading {
    color: var(--rd-sidebar-text) !important;
    opacity: 0.6;
    font-size: 0.65rem !important;
    letter-spacing: 0.12em !important;
}

.sidebar-divider {
    border-color: var(--rd-sidebar-divider) !important;
}

/* ===== Topbar ===== */
.topbar {
    background: var(--rd-card) !important;
    border-bottom: 1px solid var(--rd-border) !important;
    box-shadow: var(--rd-shadow-sm);
}

/* ===== Content ===== */
.main-content,
main,
.content {
    background: var(--rd-bg);
}

/* ===== Cards ===== */
.card {
    background: var(--rd-card);
    border: 1px solid var(--rd-border);
    border-radius: 8px;
    box-shadow: var(--rd-shadow-sm);
    transition: box-shadow 0.15s ease;
}

.card:hover {
    box-shadow: var(--rd-shadow);
}

.card-header {
    background: var(--rd-bg-alt);
    border-bottom: 1px solid var(--rd-border);
    padding: 0.875rem 1.25rem;
    font-weight: 600;
}

.card-body {
    padding: 1.25rem;
}

/* Brändillinen primary-card-header */
.card.border-primary > .card-header,
.card-header.bg-primary {
    background: var(--rd-primary) !important;
    color: #fff;
    border-bottom-color: var(--rd-primary-dark);
}

.card.border-success > .card-header,
.card-header.bg-success {
    background: var(--rd-success) !important;
    color: #fff;
}

/* ===== Buttons ===== */
.btn {
    border-radius: 6px;
    font-weight: 500;
    padding: 0.5rem 1rem;
    transition: all 0.15s ease;
    letter-spacing: -0.005em;
}

.btn-sm {
    padding: 0.35rem 0.75rem;
    font-size: 0.8125rem;
}

.btn-lg {
    padding: 0.65rem 1.5rem;
    font-size: 1rem;
}

.btn-primary {
    background: var(--rd-primary);
    border-color: var(--rd-primary);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus {
    background: var(--rd-primary-dark);
    border-color: var(--rd-primary-dark);
    color: #fff;
    box-shadow: 0 0 0 3px rgba(45, 95, 79, 0.15);
}

.btn-outline-primary {
    color: var(--rd-primary);
    border-color: var(--rd-primary);
}

.btn-outline-primary:hover {
    background: var(--rd-primary);
    border-color: var(--rd-primary);
    color: #fff;
}

.btn-success {
    background: var(--rd-success);
    border-color: var(--rd-success);
}

.btn-success:hover {
    background: #059669;
    border-color: #059669;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.15);
}

.btn-warning {
    background: var(--rd-warning);
    border-color: var(--rd-warning);
    color: #fff;
}

.btn-danger {
    background: var(--rd-danger);
    border-color: var(--rd-danger);
}

/* Aksenttinappi (esim. tärkeät CTA:t kuten "Save" tai "Generate quote") */
.btn-accent {
    background: var(--rd-accent);
    border-color: var(--rd-accent);
    color: #fff;
}

.btn-accent:hover {
    background: #B8822E;
    border-color: #B8822E;
    color: #fff;
    box-shadow: 0 0 0 3px rgba(201, 146, 61, 0.15);
}

/* ===== Forms ===== */
.form-control,
.form-select {
    border: 1px solid var(--rd-border);
    border-radius: 6px;
    transition: border-color 0.15s, box-shadow 0.15s;
    color: var(--rd-text);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--rd-primary);
    box-shadow: 0 0 0 3px rgba(45, 95, 79, 0.12);
}

.form-label {
    font-weight: 500;
    color: var(--rd-text);
    margin-bottom: 0.4rem;
    font-size: 0.875rem;
}

.input-group-text {
    background: var(--rd-bg-alt);
    border-color: var(--rd-border);
    color: var(--rd-text-muted);
    font-size: 0.875rem;
}

/* ===== Tables ===== */
.table {
    color: var(--rd-text);
}

.table thead {
    background: var(--rd-bg-alt);
}

.table thead th {
    border-bottom: 1px solid var(--rd-border);
    font-weight: 600;
    font-size: 0.8125rem;
    color: var(--rd-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.875rem 1rem;
}

.table tbody td {
    padding: 0.875rem 1rem;
    border-bottom: 1px solid var(--rd-border-light);
    vertical-align: middle;
}

.table tbody tr:hover {
    background: var(--rd-bg-alt);
}

.table-hover tbody tr:hover {
    background: var(--rd-bg-alt);
    cursor: default;
}

/* ===== Badges ===== */
.badge {
    font-weight: 500;
    padding: 0.35em 0.65em;
    border-radius: 4px;
    letter-spacing: 0;
}

.badge.bg-primary {
    background: var(--rd-primary) !important;
}

.badge.bg-success {
    background: var(--rd-success) !important;
}

.badge.bg-info {
    background: var(--rd-info) !important;
}

.badge.bg-warning {
    background: var(--rd-warning) !important;
    color: #fff !important;
}

.badge.bg-danger {
    background: var(--rd-danger) !important;
}

.badge.bg-secondary {
    background: #6B7280 !important;
}

/* ===== Alerts ===== */
.alert {
    border-radius: 6px;
    border-width: 0;
    border-left-width: 3px;
    padding: 0.875rem 1.25rem;
}

.alert-success {
    background: rgba(16, 185, 129, 0.08);
    color: #047857;
    border-left-color: var(--rd-success);
}

.alert-warning {
    background: rgba(245, 158, 11, 0.08);
    color: #B45309;
    border-left-color: var(--rd-warning);
}

.alert-danger {
    background: rgba(220, 38, 38, 0.08);
    color: #B91C1C;
    border-left-color: var(--rd-danger);
}

.alert-info {
    background: rgba(59, 130, 246, 0.08);
    color: #1D4ED8;
    border-left-color: var(--rd-info);
}

.alert-secondary {
    background: var(--rd-bg-alt);
    color: var(--rd-text);
    border-left-color: var(--rd-border);
}

/* ===== Modal ===== */
.modal-content {
    border-radius: 8px;
    border: 1px solid var(--rd-border);
    box-shadow: var(--rd-shadow-md);
}

.modal-header {
    border-bottom: 1px solid var(--rd-border);
    padding: 1rem 1.25rem;
}

.modal-footer {
    border-top: 1px solid var(--rd-border);
    padding: 0.875rem 1.25rem;
}

/* ===== Helper Classes ===== */
.text-primary { color: var(--rd-primary) !important; }
.text-success { color: var(--rd-success) !important; }
.text-accent { color: var(--rd-accent) !important; }

.bg-primary-soft { background: rgba(45, 95, 79, 0.06); }
.bg-accent-soft { background: rgba(201, 146, 61, 0.08); }

/* ===== Pricing-spesifiset (tier-värit yhtenäistetty) ===== */
.tier-starter { background: var(--rd-info) !important; }
.tier-professional { background: var(--rd-primary) !important; }
.tier-enterprise { background: var(--rd-primary-dark) !important; }
.tier-custom { background: #6B7280 !important; }

/* ===== Print-tyyli (tarjouksia varten) ===== */
@media print {
    .sidebar,
    .topbar,
    .btn,
    .no-print {
        display: none !important;
    }

    body {
        background: #fff !important;
    }

    .card {
        border: 1px solid #ddd !important;
        box-shadow: none !important;
        page-break-inside: avoid;
    }
}