/* Brand Identity and Customization */

:root {
    /* Main Branding Colors - Easily configurable */
    --brand-primary: #0d6efd; /* Bootstrap blue */
    --brand-secondary: #6c757d; /* Bootstrap gray */
    --brand-accent: #ffc107; /* Bootstrap yellow */
    --brand-bg: #f8f9fa; /* Background color */
    --brand-text: #212529; /* Text color */
    --brand-danger: #dc3545; /* Error color */
    --brand-success: #198754; /* Success color */

    /* Typography */
    --font-family-sans: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

body {
    background-color: var(--brand-bg);
    color: var(--brand-text);
    font-family: var(--font-family-sans);
}

.btn-primary {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
}

.btn-primary:hover {
    background-color: color-mix(in srgb, var(--brand-primary), black 10%);
    border-color: color-mix(in srgb, var(--brand-primary), black 10%);
}

.card {
    border: none;
    border-radius: 12px;
}

.form-control:focus {
    border-color: color-mix(in srgb, var(--brand-primary), white 20%);
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.text-primary {
    color: var(--brand-primary) !important;
}

/* Minimalist and Clean Touches */
.shadow {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

.nav-link {
    transition: color 0.2s ease-in-out;
}

.nav-link:hover {
    color: var(--brand-primary) !important;
}