/*  styles to override default_style.css

    Check the settings for LOCAL_STATIC_FOLDER and then
    copy this file to that location.

    Uncomment and or make changes to this file
    to override the defaults

*/


/* change the fixed width of the right menu here*/
/*
.menu_space {
    margin-right:200px;
}
.menu_width {
    width:200px;
}
*/

/*p {margin-top:0;margin-bottom:.4em;}*/

/*
pre {
    overflow-x: scroll;
}

*/


/*
  Add a little blank space between input fields in w3 columns 
  May want to add more later, but this will do for now...
*/
.w3-quarter label, .w3-quarter input,
.w3-third label, .w3-third input,
.w3-half label, .w3-half input
{width:98%;}


/* colors to use... */
/* Teal and Pale green */
:root {
    color:#000;
    background-color: #f8f8f8;
    --primary-color: #009688;
    --primary-contrast: #fff;
    --primary-border: rgb(63, 36, 20);
    --secondary-color: #ddffdd; 
    --secondary-contrast: #000;
    --secondary-border: #ddffdd;
    --menu-border: rgb(247, 240, 230);
   }

@media (prefers-color-scheme: dark)
{
    :root {
        color: white;
        background-color: black;

        --primary-color: #005d54;
        --primary-contrast: #fff;
        --primary-border: white;
        --secondary-color: #3f813f; 
        --secondary-contrast: #fafbfa;
        --secondary-border: #ddffdd;
        --menu-border: rgb(247, 240, 230);
       }
    .datatable tr {
        color:black;
        background-color:lightgray;
    }
    .w3-striped tbody tr:nth-child(even) {
        background-color:#e1e0e0;
    }
    .sg-busy-box {
        background-color:black;
        border:2pt solid white;
    }
    .w3-table-all tr:nth-child(even), .datatable tr:nth-child(even) {
        background-color: var(--secondary-color)!important;
        color:white!important;
    }
    
    .w3-hoverable tbody tr:hover, .w3-ul.w3-hoverable li:hover, .datatable tr {
        background-color:rgb(80, 81, 80)!important;
        color: white !important;
    }
    .w3-btn, .w3-button {
        border: white .5pt solid;
    }
    
    #keypad_header {
        color:white;
    }
    #keypad_window div:first-child {
        background-color:black;
    }
}

/* the actual styles... */
.w3-menu-color,.w3-drop-menu-hover-color:hover,
.w3-primary-color,.w3-primary-hover-color:hover,
.w3-drop-menu-section-hover-color:hover,.w3-drop-menu-section-color:hover,
.w3-drop-menu-section-color
{color:var(--primary-contrast)!important;background-color:var(--primary-color)!important}
.w3-primary-border-color,.w3-primary-hover-border-color:hover{border-color:var(--primary-border)!important}

.w3-menu-hover-color:hover,
.w3-secondary-color,.w3-secondary-hover-color:hover,.w3-drop-menu-color,
.w3-label-color,.w3-label-hover-color:hover,.roster-hover-color:hover
{color:var(--secondary-contrast)!important;background-color:var(--secondary-color)!important}
.w3-secondary-border-color,.w3-secondary-hover-border-color:hover{border-color:var(--secondary-border)!important}

.w3-menu-border {
    border:solid 1pt var(--menu-border)!important;
}

/* styles for the pagination in the record lists */

/* .sg.pagination {} */
.sg-page-current {
    font-weight: bold;
}
a.sg-page-end, a.sg-page-prev,
a.sg-page-next, a.sg-page-select,
a.sg-page-begin
    {
    text-decoration: none;
}
.sg-page-end, .sg-page-begin,
.sg-page-next, .sg-page-prev  {
    background-color: var(--primary-color);
    color: var(--primary-contrast);
    padding:2pt;
}
.sg-page-begin.sg-page-inactive, .sg-page-end.sg-page-inactive,
.sg-page-begin.sg-page-current, .sg-page-end.sg-page-current,
.sg-page-next.sg-page-inactive, .sg-page-prev.sg-page-inactive,
.sg-page-next.sg-page-current, .sg-page-prev.sg-page-current {
    color: var(--secondary-contrast);
    background-color: var(--secondary-color);
    padding:2pt;
}