/*==================================================================
//
//  theme/dark.css
//
//  ENBART FÄRGER. Ingen layout, inga mått, inga typsnitt.
//
//  Samma uppsättning variabler som theme/light.css - varenda en
//  måste finnas i båda. Se rutan där om vad de betyder och vilken
//  rad man byter först i ett nytt projekt.
//
//
//  DET SOM ÄR LÄTT ATT FÅ FEL I ETT MÖRKT TEMA
//
//  Ren svart bakgrund (#000) med ren vit text ger ett hårt
//  kontrastförhållande som tröttar ögat och får texten att flimra
//  på en OLED-skärm. Därför är botten mörkgrå och texten ljusgrå,
//  inte svart och vit.
//
//  Signalfärgerna är LJUSARE här än i det ljusa temat. Samma
//  mörkröda ton som fungerar på vitt blir oläsbar på mörkt - en
//  färg är inte samma färg när underlaget byts.
//
==================================================================*/

:root {

    /*--------------------------------------------------------------
    //	Bakgrund och ytor
    --------------------------------------------------------------*/

    --color-bg: #16181c;

    --color-surface: #1e2126;
    --color-surface-strong: #262a31;
    --color-surface-hover: #2f343c;

    /*  Bakom en ruta som fällts ut (.modal::backdrop). Kraftigare än
        i det ljusa temat: en svag skugga syns knappt mot en mörk
        botten, och då försvinner skillnaden mellan rutan och sidan
        under den. */
    --color-backdrop: rgba(0, 0, 0, 0.65);


    /*--------------------------------------------------------------
    //	Text
    --------------------------------------------------------------*/

    --color-text: #c8ccd3;
    --color-heading: #f0f2f5;
    --color-text-muted: #949aa4;
    --color-text-faint: #6d737d;


    /*--------------------------------------------------------------
    //	Linjer
    --------------------------------------------------------------*/

    --color-border: #343941;
    --color-border-soft: #282c33;
    --color-border-strong: #4b515b;


    /*--------------------------------------------------------------
    //	Formulärfält
    //
    //  Rutan är MÖRKARE än panelen bakom, tvärtom mot i det ljusa
    //  temat. Det som gäller är att den ska skilja sig - inte åt
    //  vilket håll.
    --------------------------------------------------------------*/

    --color-input: #121417;
    --color-input-border: #434952;


    /*--------------------------------------------------------------
    //	Accent
    --------------------------------------------------------------*/

    --color-accent: #d7dbe1;
    --color-accent-hover: #f0f2f5;
    --color-on-accent: #16181c;


    /*--------------------------------------------------------------
    //	Länkar och fokus
    --------------------------------------------------------------*/

    --color-link: #74a8f0;
    --color-link-hover: #a3c6f7;
    --color-focus: #74a8f0;


    /*--------------------------------------------------------------
    //	Signalfärger
    --------------------------------------------------------------*/

    --color-info: #74a8f0;
    --color-success: #4cc48a;
    --color-warning: #e0a63c;
    --color-danger: #f0736a;

    --color-danger-border: #7a3a36;
    --color-on-danger: #16181c;
}