/* Dark mode */
body.has-background-dark {
    color: #f5f5f5;
    background-color: #121212 !important; /* Ensure dark background for the entire page */
    min-height: 100vh; /* Ensure full page height */
}

body.has-background-light {
    background-color: #f5f5f5 !important;
    color: #363636;
    min-height: 100vh; /* Ensure full page height */
}

/* Tab container styling to ensure it stretches properly */
.tabs {
    width: 100%;
    background-color: inherit; /* Inherit from body */
}

/* Fix for tabs in dark mode */
.has-background-dark .tabs {
    background-color: #121212;
}

/* Fix for tabs in light mode */
.has-background-light .tabs {
    background-color: #f5f5f5;
}

.card.has-background-dark.light-mode {
    background-color: white !important;
    color: #363636 !important;
}

.light-mode .card-header {
    background-color: #f5f5f5 !important;
}

.light-mode .card-header-title {
    color: #363636 !important;
}

.light-mode .box {
    background-color: white !important;
    color: #363636 !important;
}

.light-mode .title {
    color: #363636 !important;
}

.light-mode .label {
    color: #363636 !important;
}

.light-mode .table {
    background-color: white !important;
    color: #363636 !important;
}

.light-mode .table th {
    color: #363636 !important;
}

/* Fix for table hover in dark mode */
.has-background-dark .table.is-hoverable tbody tr:hover {
    background-color: #4a4a4a !important;
    color: #f5f5f5 !important;
}

/* Fix for table hover in light mode */
.light-mode .table.is-hoverable tbody tr:hover {
    background-color: #f0f0f0 !important;
    color: #363636 !important;
}

/* Fix for tabs hover in dark mode */
.has-background-dark .tabs li a:hover {
    background-color: #4a4a4a !important;
    color: #f5f5f5 !important;
    border-bottom-color: #4a4a4a;
}

/* Fix for tabs hover in light mode */
.light-mode .tabs li a:hover {
    background-color: #f0f0f0 !important;
    color: #363636 !important;
    border-bottom-color: #f0f0f0;
}

/* Keep active tab styling */
.tabs li.is-active a {
    background-color: #3273dc !important;
    color: white !important;
    border-color: #3273dc !important;
}

.tabs li.is-active a:hover {
    background-color: #3273dc !important;
    color: white !important;
    border-color: #3273dc !important;
}

/* Ensure tab content extends full width */
.tab-content {
    width: 100%;
    background-color: inherit; /* Inherit from body */
}

.light-mode .input {
    background-color: #f5f5f5;
    color: #363636;
}

.light-mode .select select {
    background-color: #f5f5f5;
    color: #363636;
}

.notification.is-hidden {
    display: none;
}

.tabs.is-boxed li:not(.is-active) a {
    color: #f5f5f5;
}

.light-mode .tabs.is-boxed li:not(.is-active) a {
    color: #363636;
}

.tab-content.is-hidden {
    display: none;
}

.help {
    font-size: 0.8rem;
}

.feed-url {
    word-break: break-all;
}