/* Color Theme */
:root {
    --depths-1: #A6A6A6;
    --depths-2: #737373;
    --depths-3: #404040;
    --depths-4: #262626;
    --depths-5: #0D0D0D;
    --nano-product-color: #008000;
    --list-item-text-color: #000000; /* Listview row background */
    --list-item-background-color-primary: #FFFFFF; /* Listview row background */
    --list-item-background-color-secondary: #F1F1F1; /* Listview row background */

    --text-color-primary: #000000; /* Main text */
    --text-color-secondary: #737373; /* Secondary text, subtler */
    --text-color-tertiary: #A6A6A6; /* For less prominent text */

    --page-background-color: #FFFFFF; /* Overall page background */
    --content-background-color: #FFFFFF; /* Content area background */
    --navbar-background-color: #1A1A1A; /* Navbar or header background */

    --border-color-light: #E0E0E0; /* Light border */
    --border-color-dark: #404040; /* Darker border for depth */

    --shadow-color: rgba(0, 0, 0, 0.2); /* Soft shadow for elevation */

    --button-primary-color: #FFFFFF; /* Primary button text */
    --button-primary-background-color: #0066EC; /* Primary button background */
    --button-primary-hover-background: #0058CA; /* Primary button hover background */

    --button-secondary-color: #737373; /* Secondary button text */
    --button-secondary-background-color: #E0E0E0; /* Secondary button background */
    --button-secondary-hover-background: #A6A6A6; /* Secondary button hover background */

    --button-success-color: #FFFFFF; /* Success button text */
    --button-success-background-color: #28A745; /* Success button background */
    --button-success-hover-background: #218838; /* Success hover background */

    --button-danger-color: #FFFFFF; /* Danger button text */
    --button-danger-background-color: #DC3545; /* Danger button background */
    --button-danger-hover-background: #C82333; /* Danger hover background */

    --status-success-color: #28A745; /* Success messages or indicators */
    --status-warning-color: #FFC107; /* Warning messages or indicators */
    --status-error-color: #DC3545; /* Error messages or indicators */
    --status-info-color: #17A2B8; /* Info messages or indicators */

    --input-background-color: #FFFFFF; /* Input fields background */
    --input-border-color: #E0E0E0; /* Input border */
    --input-focus-border-color: #0066EC; /* Input border on focus */
    --input-placeholder-color: #A6A6A6; /* Placeholder text color */

    --link-color: #0066EC; /* Link text */
    --link-hover-color: #0058CA; /* Link on hover */
    --link-visited-color: #0049A8; /* Visited link color */
}

/*

    #a6a6a6; --nav buttons
    #404040 --nav item hover
    #0D0D0D nav-item active
    #a6a6a6 --icon color
    #141414 --content-container-background-color
    #1d1d1d --page background
    #1a1a1a --upper navbar
*/


.dark-mode {
    --list-item-text-color: #FFFFFF; /* Listview row text */
    --list-item-background-color-primary: #22252A; /* Listview row background */
    --list-item-background-color-secondary: #181A1F; /* Listview alternate background */

    --text-color-primary: #F5F5F5; /* Main text */
    --text-color-secondary: #B3B3B3; /* Secondary text, subtler */
    --text-color-tertiary: #757575; /* For less prominent text */

    --page-background-color: #181A1F; /* Overall page background */
    --content-background-color: #22252A; /* Content area background */
    --navbar-background-color: #111216; /* Navbar or header background */

    --border-color-light: #31343A; /* Light border (relatively) */
    --border-color-dark: #23252B; /* Darker border for depth */

    --shadow-color: rgba(0, 0, 0, 0.7); /* Softer, deeper shadow */

    --button-primary-color: #FFFFFF; /* Primary button text */
    --button-primary-background-color: #247AFF; /* Primary button background (keep it vibrant) */
    --button-primary-hover-background: #1A59B8; /* Primary button hover background */

    --button-secondary-color: #B3B3B3; /* Secondary button text */
    --button-secondary-background-color: #31343A; /* Secondary button background */
    --button-secondary-hover-background: #A6A6A6; /* Secondary button hover background */

    --button-success-color: #FFFFFF; /* Success button text */
    --button-success-background-color: #218838; /* Success button background */
    --button-success-hover-background: #17642A; /* Success hover background */

    --button-danger-color: #FFFFFF; /* Danger button text */
    --button-danger-background-color: #DC3545; /* Danger button background */
    --button-danger-hover-background: #9A2531; /* Danger hover background */

    --status-success-color: #3FD07A; /* Success messages or indicators */
    --status-warning-color: #FFC43D; /* Warning messages or indicators */
    --status-error-color: #FF5C77; /* Error messages or indicators */
    --status-info-color: #42BFEF; /* Info messages or indicators */

    --input-background-color: #23252B; /* Input fields background */
    --input-border-color: #31343A; /* Input border */
    --input-focus-border-color: #247AFF; /* Input border on focus */
    --input-placeholder-color: #757575; /* Placeholder text color */

    --link-color: #4A97FF; /* Link text */
    --link-hover-color: #8FB7FF; /* Link on hover */
    --link-visited-color: #426DCB; /* Visited link color */
}