/* Global Dark Mode Styles */

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    font-family: var(--font-sans);
    font-size: var(--text-base);
    line-height: var(--line-normal);
    background-color: var(--color-bg-primary);
    color: var(--color-text-primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    background: var(--color-bg-surface);
}

::-webkit-scrollbar-thumb {
    background: var(--color-border);
    border-radius: var(--radius-md);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--color-border-light);
}

/* Focus styles */
:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

/* Selection */
::selection {
    background-color: var(--color-primary);
    color: white;
}

thead th {
    padding: 1rem 0.3rem;
}

.badge {
    text-align: center;
    padding: 0.3rem 0.7rem;
    background: var(--color-bg-primary);
    border-radius: var(--radius-xl);
}

.badge.badge-success {
    background: var(--color-success);
}

.success {
    color: var(--color-success);
}

.warning {
    color: var(--color-warning);
}

.danger {
    color: var(--color-error);
}

.bold {
    font-weight: bold;
}

.w-100{width:100%;}.w-65{width:65%;}.w-60{width:60%;}.w-50{width:50%;}.w-45{width:45%;}.w-40{width:40%;}.w-25{width:25%;}.w-20{width:20%;}.w-15{width: 15%;}.w-10{width: 10%;}

.text-start {
    text-align: left;
}
.text-center{
    text-align: center;
}
.text-end {
    text-align: right;
}

.fs-6{
    font-size: 0.8rem;
}

.fs-7{
    font-size: 0.6rem;
}