/* Public Shared Styles - VS Code Dark Theme */

/* CAD-Inspired Light Theme (SolidWorks/MATLAB style) */
:root {
    --vscode-bg-primary: #f5f5f5;
    --vscode-bg-secondary: #e8e8e8;
    --vscode-bg-tertiary: #d4d4d4;
    --vscode-bg-elevated: #ffffff;
    --vscode-border: #c0c0c0;
    --vscode-text-primary: #2c2c2c;
    --vscode-text-secondary: #5a5a5a;
    --vscode-text-disabled: #9a9a9a;
    --vscode-accent-blue: #0078d4;
    --vscode-accent-blue-hover: #005a9e;
    --vscode-accent-green: #107c10;
    --vscode-accent-orange: #d83b01;
    --vscode-accent-yellow: #ffd800;
    --vscode-accent-purple: #8661c5;
    --vscode-accent-red: #d13438;
    --vscode-warning: #ffb900;
    --vscode-error: #d13438;
    --vscode-success: #107c10;
}

/* Global Light Mode Styling */
body {
    background-color: var(--vscode-bg-primary) !important;
    color: var(--vscode-text-primary) !important;
}

.container {
    background-color: var(--vscode-bg-primary);
    color: var(--vscode-text-primary);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--vscode-text-primary) !important;
}

p, li, .text-muted {
    color: var(--vscode-text-secondary) !important;
}

/* Table styling */
.table {
    color: var(--vscode-text-primary) !important;
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border);
}

.table-hover tbody tr:hover {
    background-color: var(--vscode-bg-secondary) !important;
}

/* Enhanced table styling */
.table-dark {
    --bs-table-bg: var(--vscode-bg-elevated);
    --bs-table-striped-bg: var(--vscode-bg-secondary);
    --bs-table-hover-bg: var(--vscode-bg-tertiary);
    --bs-table-border-color: var(--vscode-border);
}

.table-dark th {
    background-color: var(--vscode-bg-secondary) !important;
    border-color: var(--vscode-border) !important;
    font-weight: 600;
    color: var(--vscode-text-primary);
}

.table-dark td {
    border-color: var(--vscode-border) !important;
}

/* Alert styling */
.alert-danger {
    background-color: rgba(209, 52, 56, 0.1) !important;
    border-color: var(--vscode-error) !important;
    color: var(--vscode-error) !important;
}

/* Spinner */
.spinner-border {
    color: var(--vscode-accent-blue) !important;
}

/* Button styling */
.btn-info {
    background-color: var(--vscode-accent-blue) !important;
    border-color: var(--vscode-accent-blue) !important;
    color: var(--vscode-text-primary) !important;
}

.btn-success {
    background-color: var(--vscode-success) !important;
    border-color: var(--vscode-success) !important;
    color: white !important;
}

.btn-primary {
    background-color: var(--vscode-accent-blue) !important;
    border-color: var(--vscode-accent-blue) !important;
    color: white !important;
}

/* Logout button styling */
#logoutBtn {
    color: var(--vscode-error) !important;
    text-decoration: underline;
}

#logoutBtn:hover {
    color: var(--vscode-accent-red) !important;
}

/* Empty state styling */
.fa-folder-open {
    color: var(--vscode-text-secondary) !important;
}

/* Welcome text styling */
.welcome-text {
    color: var(--vscode-text-primary) !important;
    font-weight: 500;
}

/* Custom styling for code blocks */
pre[class*="language-"] {
    background: var(--vscode-bg-elevated) !important;
    border: 1px solid var(--vscode-border) !important;
    border-radius: 0.375rem;
    margin: 1rem 0;
    padding: 1rem;
}

code[class*="language-"] {
    font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
    font-size: 0.875rem;
    line-height: 1.5;
    background: var(--vscode-bg-elevated) !important;
    color: var(--vscode-text-primary) !important;
}

/* Inline code styling */
code {
    background-color: var(--vscode-bg-tertiary) !important;
    color: var(--vscode-text-primary) !important;
    padding: 0.125rem 0.25rem;
    border-radius: 0.25rem;
}

/* XML/HTML specific styling */
.token.tag {
    color: #0078d4 !important;
}

.token.attr-name {
    color: #d83b01 !important;
}

.token.attr-value {
    color: #107c10 !important;
}

.token.comment {
    color: #5a5a5a !important;
}

.token.punctuation {
    color: #2c2c2c !important;
}

/* Card styling */
.card {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
    color: var(--vscode-text-primary) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.card-header {
    background-color: var(--vscode-bg-secondary) !important;
    border-bottom-color: var(--vscode-border) !important;
}

/* List group styling */
.list-group-item {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
    color: var(--vscode-text-primary) !important;
}

.list-group-item:hover {
    background-color: var(--vscode-bg-secondary) !important;
}

/* Nav tabs styling */
.nav-tabs .nav-link {
    color: var(--vscode-text-secondary) !important;
    border-color: var(--vscode-border) !important;
}

.nav-tabs .nav-link.active {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
    color: var(--vscode-text-primary) !important;
}

/* Form controls styling */
.form-control {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
    color: var(--vscode-text-primary) !important;
}

.form-control:focus {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-accent-blue) !important;
    color: var(--vscode-text-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 120, 212, 0.25) !important;
}

.form-select {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
    color: var(--vscode-text-primary) !important;
}

/* Modal styling */
.modal-content {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
}

.modal-header {
    border-bottom-color: var(--vscode-border) !important;
    background-color: var(--vscode-bg-secondary);
}

.modal-footer {
    border-top-color: var(--vscode-border) !important;
    background-color: var(--vscode-bg-secondary);
}

/* Dropdown styling */
.dropdown-menu {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.dropdown-item {
    color: var(--vscode-text-primary) !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--vscode-bg-secondary) !important;
    color: var(--vscode-text-primary) !important;
}

.dropdown-divider {
    border-color: var(--vscode-border) !important;
}

/* Progress bar styling */
.progress {
    background-color: var(--vscode-bg-secondary) !important;
}

/* Breadcrumb styling */
.breadcrumb {
    background-color: var(--vscode-bg-secondary) !important;
}

.breadcrumb-item a {
    color: var(--vscode-accent-blue) !important;
}

/* Pagination styling */
.page-link {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
    color: var(--vscode-text-primary) !important;
}

.page-link:hover {
    background-color: var(--vscode-bg-secondary) !important;
    border-color: var(--vscode-border) !important;
    color: var(--vscode-text-primary) !important;
}

.page-item.active .page-link {
    background-color: var(--vscode-accent-blue) !important;
    border-color: var(--vscode-accent-blue) !important;
    color: white !important;
}

/* Accordion styling */
.accordion-item {
    background-color: var(--vscode-bg-elevated) !important;
    border-color: var(--vscode-border) !important;
}

.accordion-button {
    background-color: var(--vscode-bg-secondary) !important;
    color: var(--vscode-text-primary) !important;
}

.accordion-button:not(.collapsed) {
    background-color: var(--vscode-bg-tertiary) !important;
    color: var(--vscode-text-primary) !important;
}

.accordion-body {
    background-color: var(--vscode-bg-elevated) !important;
    color: var(--vscode-text-primary) !important;
}