/* =========================================================
   Physics Presentation Engine

   Theme Definitions

========================================================= */



/* =========================================================
   DEFAULT DARK CLASSROOM MODE
========================================================= */


[data-theme="dark"] {


    --background-color:
        #101418;


    --surface-color:
        #182028;


    --surface-light:
        #25313d;


    --text-primary:
        #ffffff;


    --text-secondary:
        #d0d7df;


    --text-muted:
        #8c99a8;


    --border-color:
        rgba(255,255,255,.12);


}






/* =========================================================
   LIGHT CLASSROOM MODE
========================================================= */


[data-theme="light"] {


    --background-color:
        #f4f6f9;


    --surface-color:
        #ffffff;


    --surface-light:
        #edf1f7;


    --text-primary:
        #101418;


    --text-secondary:
        #384452;


    --text-muted:
        #687586;


    --border-color:
        rgba(0,0,0,.15);


}








/* =========================================================
   PROJECTOR MODE

   Designed for lecture halls.
   Strong contrast and large readable colors.

========================================================= */


[data-theme="projector"] {


    --background-color:
        #000000;


    --surface-color:
        #050505;


    --surface-light:
        #111111;


    --text-primary:
        #ffffff;


    --text-secondary:
        #eeeeee;


    --text-muted:
        #bbbbbb;


    --primary-color:
        #00ffff;


    --accent-color:
        #ffff00;


    --border-color:
        rgba(255,255,255,.25);


}






[data-theme="projector"] .slide {


    box-shadow:
        0 0 40px rgba(255,255,255,.25);


}







/* =========================================================
   HIGH CONTRAST ACCESSIBILITY MODE

========================================================= */


[data-theme="contrast"] {


    --background-color:
        #000;


    --surface-color:
        #000;


    --surface-light:
        #111;


    --text-primary:
        #fff;


    --text-secondary:
        #fff;


    --text-muted:
        #fff;


    --primary-color:
        #ffff00;


    --accent-color:
        #00ffff;


    --border-color:
        #fff;


}





[data-theme="contrast"] button {


    border:
        2px solid white;


}





/* =========================================================
   PRESENTATION SLIDE THEMES

   Applied only to slide area

========================================================= */





.slide.theme-dark {


    background:
        #111;


    color:
        white;


}






.slide.theme-blue {


    background:
        linear-gradient(
            135deg,
            #0f2027,
            #203a43,
            #2c5364
        );


    color:
        white;


}






.slide.theme-paper {


    background:
        #fffdf5;


    color:
        #111;


}





.slide.theme-blackboard {


    background:
        #14261a;


    color:
        #f1f1f1;


    font-family:
        "Comic Sans MS",
        cursive;


}






/* =========================================================
   ANIMATION SETTINGS

========================================================= */


.theme-transition {


    transition:


        background-color
        var(--transition),


        color
        var(--transition);


}





/* =========================================================
   REDUCED MOTION ACCESSIBILITY

========================================================= */


@media(prefers-reduced-motion:reduce) {


    *,
    *::before,
    *::after {


        animation-duration:
            .01ms !important;


        transition-duration:
            .01ms !important;


    }


}
