/* =============================================
   CSS VARIABLES (THEMES)
   ============================================= */
:root {
    /* LIGHT THEME (default) */
    --bg-page: #f9f9ff;
    --bg-card: #ffffff;
    --bg-input: #ffffff;
    --bg-input-autofill: #ffffff;
    --border-color: #cbd3db;
    --border-hover: #aeb5bc;
    --text-main: #001a34;
    --text-sec: #808d9a;
    --text-autofill: #555555;
    --accent-blue: #005bff;
    --accent-disabled: #343333;
    --accent-blue-hover: #004ed6;
    --focus-shadow: rgba(0, 91, 255, 0.15);
    --error-color: #f91155;
    --dropdown-bg: #ffffff;
    --dropdown-hover: #f0f2f5;
    --tag-bg: #f0f2f5;
    --tag-text: #001a34;
    --hint-bg: #333333;
    --hint-text: #ffffff;
    --fade-bg: #0000009c;
}

/* DARK THEME */
body.dark-theme {
    --bg-page: #121214;
    --bg-card: #232427;
    --bg-input: #2c2d30;
    --bg-input-autofill: #2c2d30;
    --border-color: #3e3f42;
    --border-hover: #505155;
    --text-main: #ffffff;
    --text-sec: #8b8e99;
    --text-autofill: #e0e0e0;
    --accent-disabled: #343333;
    --accent-blue: #005bff;
    --accent-blue-hover: #337aff;
    --focus-shadow: rgba(0, 91, 255, 0.3);
    --error-color: #ff4d80;
    --dropdown-bg: #232427;
    --dropdown-hover: #2c2d30;
    --tag-bg: #3e3f42;
    --tag-text: #ffffff;
    --hint-bg: #ffffff;
    --hint-text: #000000;
    --fade-bg: #000000cc;
}

/* =============================================
   ORIGINAL RESET STYLES (UNCHANGED)
   ============================================= */
table
{
    border-spacing:0;
    border-collapse:collapse;;
}
html
{

    display: flex;
    flex-direction: column;
}
body
{

    flex-grow: 1;

}
body,html
{
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    font-family: "Roboto","Helvetica","Arial",sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    color: var(--text-main);
    transition: background-color 0.3s ease, color 0.3s ease;
}
ul,li
{
    padding: 0;
    margin: 0;
    line-height: 20px;
}
input
{

}input:focus
 {

 }

input[type="text"]:-webkit-autofill,
input[type="text"]:-webkit-autofill:hover,
input[type="text"]:-webkit-autofill:active,
input:-webkit-autofill:focus {
    background-color: var(--bg-input-autofill) !important;
    color: var(--text-autofill) !important;
    -webkit-box-shadow: 0 0 0 1000px var(--bg-input-autofill) inset !important;
    -webkit-text-fill-color: var(--text-autofill) !important;
}

input[type="password"]:-webkit-autofill,
input[type="password"]:-webkit-autofill:hover,
input[type="password"]:-webkit-autofill:active,
input:-webkit-autofill:focus {
    background-color: var(--bg-input-autofill) !important;
    color: var(--text-autofill) !important;
    -webkit-box-shadow: 0 0 0 1000px var(--bg-input-autofill) inset !important;
    -webkit-text-fill-color: var(--text-autofill) !important;
}
h1,h2
{
    line-height: 36px;
}
ul
{
    display: block;
}
ul li
{
    display: block;
}
.fade2,.fade,.fade3
{
    display: none;
    top: 0;
    left: 0;
    z-index: 3;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: var(--fade-bg);
}
input[type='number'] {
    -moz-appearance:textfield;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

/* =============================================
   DARK THEME ADDITIONAL OVERRIDES
   ============================================= */
body.dark-theme h1,
body.dark-theme h2,
body.dark-theme h3,
body.dark-theme h4,
body.dark-theme h5,
body.dark-theme h6 {
    color: var(--text-main);
}



body.dark-theme table {
    color: var(--text-main);
}

body.dark-theme ::selection {
    background-color: var(--accent-blue);
    color: #fff;
}

/* Scrollbar for dark theme */
body.dark-theme ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
body.dark-theme ::-webkit-scrollbar-track {
    background: #1a1b1e;
}
body.dark-theme ::-webkit-scrollbar-thumb {
    background: #3e3f42;
    border-radius: 4px;
}
body.dark-theme ::-webkit-scrollbar-thumb:hover {
    background: #505155;
}