/* Lingoquest Admin — base.css - v001
 *
 * Gedeelde reset/typografie/kleuren voor de hele admin-module — analoog
 * aan wat index.css voor de publieke site is. Onderdeel-specifieke CSS
 * (login.css, dashboard.css, toolbar.css, table.css, modal.css) blijft
 * hier los van, zie conventions.md.
 */

:root
{
    --color-bg:        #f4f6f9;
    --color-surface:   #ffffff;
    --color-border:    #dbe1e8;
    --color-text:      #1f2937;
    --color-text-dim:  #6b7280;
    --color-primary:   #2563eb;
    --color-primary-dark: #1d4ed8;
    --color-danger:    #dc2626;
    --color-danger-dark: #b91c1c;
    --radius: 8px;
    --shadow: 0 1px 3px rgba( 0, 0, 0, 0.08 ), 0 1px 2px rgba( 0, 0, 0, 0.06 );
}

*,
*::before,
*::after
{
    box-sizing: border-box;
}

html,
body
{
    margin: 0;
    padding: 0;
}

body
{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: var( --color-bg );
    color: var( --color-text );
    font-size: 14px;
    line-height: 1.5;
}

button
{
    font-family: inherit;
    font-size: inherit;
    cursor: pointer;
    border: none;
    border-radius: var( --radius );
}

input,
select,
textarea
{
    font-family: inherit;
    font-size: inherit;
    color: inherit;
}

a
{
    color: var( --color-primary );
}

.btn-primary
{
    background: var( --color-primary );
    color: #fff;
    padding: 0.55em 1.1em;
    font-weight: 600;
}

.btn-primary:hover
{
    background: var( --color-primary-dark );
}

.btn-secondary
{
    background: var( --color-surface );
    color: var( --color-text );
    border: 1px solid var( --color-border );
    padding: 0.55em 1.1em;
    font-weight: 600;
}

.btn-secondary:hover
{
    background: var( --color-bg );
}

.btn-danger
{
    background: var( --color-danger );
    color: #fff;
    padding: 0.4em 0.8em;
    font-weight: 600;
}

.btn-danger:hover
{
    background: var( --color-danger-dark );
}

[hidden]
{
    display: none !important;
}