:root {
    --primary: #3b82f6;
    /* Modern Blue */
    --primary-dark: #1e40af;
    --secondary: #ef4444;
    /* Red for actions */
    --background: #f3f4f6;
    /* Light Gray Background */
    --surface: #ffffff;
    /* White Cards */
    --text: #111827;
    /* Near Black */
    --text-light: #6b7280;
    /* Gray Text */
    --border: #d1d5db;
    /* Visible Border */
    --radius: 8px;
    --shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --font-heading: 'Outfit', sans-serif;
    --font-body: 'Inter', sans-serif;
}

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

body {
    background-color: var(--background);
    color: var(--text);
    font-family: var(--font-body);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

h1,
h2,
h3,
h4,
h5,
h6,
.title,
.subtitle,
.navbar-item,
.button {
    font-family: var(--font-heading);
}

/* Navbar */
.navbar {
    background-color: #1f2937;
    /* Dark Navbar */
    box-shadow: var(--shadow);
    padding: 0.75rem 0;
}

.navbar-item,
.navbar-link {
    font-weight: 500;
    color: #e5e7eb !important;
    /* Light text on dark */
    transition: color 0.2s;
}

.navbar-item:hover,
.navbar-link:hover {
    color: var(--primary) !important;
    background-color: transparent !important;
}

.navbar-dropdown {
    background-color: #1f2937;
    border-top: 1px solid #374151;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5);
}

.navbar-dropdown .navbar-item:hover {
    background-color: #374151 !important;
    color: white !important;
}

.navbar-brand .title {
    color: white !important;
}

.main-content {
    flex: 1;
    padding: 2rem 1.5rem;
}

/* Cards/Boxes */
.box {
    background-color: var(--surface);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    border: 1px solid var(--border);
    padding: 1.5rem;
}

.title {
    color: var(--text);
    font-weight: 700;
    letter-spacing: -0.025em;
}

.box,
.box strong,
.box p {
    color: var(--text) !important;
}

.content,
.content strong {
    color: var(--text) !important;
}

.subtitle {
    color: var(--text-light);
}

/* Buttons */
.button {
    border-radius: 6px;
    font-weight: 600;
    transition: all 0.2s;
    border: 1px solid var(--border);
}

.button.is-primary {
    background-color: var(--primary);
    border-color: var(--primary);
    color: white;
}

.button.is-primary:hover {
    background-color: var(--primary-dark);
    border-color: var(--primary-dark);
}

.button.is-danger {
    background-color: var(--secondary);
    border-color: var(--secondary);
    color: white;
}

/* Tables */
.table {
    background-color: var(--surface);
    color: var(--text);
}

.table thead th {
    border-bottom: 2px solid var(--border);
    color: var(--text);
    font-weight: 700;
    background-color: #f9fafb;
    /* Light header bg */
}

/* Fix for Bulma .content table conflict */
.content table thead td,
.content table thead th {
    color: var(--text) !important;
}

.table td {
    color: var(--text) !important;
    color: var(--text) !important;
    /* Force dark text */
}

.table tbody tr:not(:last-child) {
    border-bottom: 1px solid var(--border);
}

.table.is-striped tbody tr:not(.is-selected):nth-child(even) {
    background-color: #f9fafb;
}

/* Tags */
.tags .tag {
    margin-bottom: 0.25rem;
}

.tag {
    border-radius: 4px;
    font-weight: 600;
}

.tag.is-dark {
    background-color: #374151;
    color: white;
}

.tag.is-info {
    background-color: #eff6ff;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
}

.tag.is-light {
    background-color: #f3f4f6;
    color: #4b5563;
    border: 1px solid #e5e7eb;
}

/* Forms */
.input,
.textarea,
.select select {
    border-radius: 6px;
    border: 1px solid var(--border);
    box-shadow: none;
    background-color: #fff;
    color: var(--text);
}

.input:focus,
.textarea:focus,
.select select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

.label {
    color: var(--text);
    font-weight: 600;
}

/* Utilities */
.modal-card-head,
.modal-card-foot {
    background-color: #f9fafb;
    border-color: var(--border);
}

.modal-card-title {
    color: var(--text);
}

hr {
    background-color: var(--border);
    height: 1px;
}

/* Footer & Copyright - High Contrast */
.footer {
    background-color: #f3f4f6 !important;
    padding: 3rem 1.5rem 3rem;
    color: var(--text) !important;
}

.footer strong {
    color: var(--text) !important;
}

/* Fix Bulma Table Hover Conflict */
/* Ensure text turns white when row is hovered (assuming dark hover effect) */
.table.is-hoverable tbody tr:not(.is-selected):hover {
    background-color: #1f2937 !important;
    /* Dark gray for visible hover */
}

.table.is-hoverable tbody tr:not(.is-selected):hover td,
.table.is-hoverable tbody tr:not(.is-selected):hover th {
    color: #ffffff !important;
}