/* Light theme styles */
:root {
    --background-color: #f5f9f8;
    --background-color-bright: #fff;
    --text-font-size: 14px;
    --text-color: #333;
    --text-color-bright: #fff;
    --switch-track-color: #ccc;
    --switch-thumb-color: #fff;
    --main-color: #00AA87;
    --header-color: #1C2B32;
    --image-brightness: 1;
    --text-red: red;
    --text-white: #FFFFFF;
    /* Header Panel */
    --header-panel-background-color: #007BC7;

    /* Login Page Specific - Light Mode */
    --login-body-background: #FFFFFF;
    --login-body-text: #333;
    --login-panel-dark-bg: #0D1027;
    --login-text-white: #FFFFFF;
    --login-link-color: #007bc7;
    --login-image-overlay: rgba(0, 0, 0, 0.6);
    --login-error-text: #D40000;
    --login-panel-alt-bg: #F2F3F8;
    --login-cookie-overlay: rgba(20,20,20,0.8);
    --login-cookie-text: #ccc;

    /* Login Page Images - Light Mode */
    --login-img-numberlookup: url('../img/illustration-numberlookup.svg');
    --login-img-contactlist: url('../img/illustration-contactlist.svg');
    --login-img-laptop: url('../img/illustration-laptop.svg');

}

/* Dark theme styles */
[data-theme="theme-mode-dark"] {
    --background-color: #2d2d2d;
    --background-color-bright: #333;
    --text-color: #bbb;
    --header-color: #4E6A78;
    --switch-track-color: #666;
    --switch-thumb-color: #eee;
    --image-brightness: 0.9;

    /* Login Page Specific - Dark Mode (based on frontend colors.css) */
    --login-body-background: #000B2E;
    --login-body-text: white;
    --login-panel-dark-bg: #000B2E;
    --login-text-white: #F4F4F4;
/*    --login-link-color: var(--main-color);*/
    --login-image-overlay: rgba(0, 0, 0, 0.75);
    --login-error-text: #C70505;
    --login-panel-alt-bg: #18223f;
    --login-cookie-overlay: rgba(34, 34, 34, 0.9);
    --login-cookie-text: #F4F4F4;

    /* Login Page Images - Dark Mode */
    --login-img-numberlookup: url('../img/illustration-numberlookup-dark.svg');
    --login-img-contactlist: url('../img/illustration-contactlist-dark.svg');
    --login-img-laptop: url('../img/illustration-laptop-dark.svg');
}

body {
    background-color: var(--background-color);
    color: var(--text-color);
}