﻿/* ============================================
   DESIGN TOKENS — LIGHT THEME (BLUE VARIANT)
   ============================================ */

:root {
    /* --------------------------------------------
     COLORS — BRAND (BLUE PALETTE)
     -------------------------------------------- */
    --color-primary: #0D47A1; /* granat — główny kolor */
    --color-primary-hover: #0B3E8A;
    --color-selected-item: #1976D2; /* intensywny niebieski */
    --color-selected-item-hover: #1565C0;
    --color-accent: #64B5F6; /* jasny błękit */
    --color-accent-hover: #42A5F5;
    /*BUTTONS*/
    --color-button-primary: #1976D2;
    --color-button-primary-hover: #1565C0;
    --color-button-cancel: #6c757d;
    --color-button-cancel-hover: #5a6268;
    --color-button-warning: #EF6C00;
    --color-button-warning-hover: #E65100;
    --color-button-success: #0b9fa9;
    --color-button-success-hover: #096a71;
    --color-button-blue-chip: #e8f0ff;
    --color-button-blue-chip-hover: #dfe8ff;
    /* --------------------------------------------
     COLORS — FEEDBACK
     -------------------------------------------- */
    --color-success: #2E7D32; /* zieleń stonowana */
    --color-warning: #FFA000; /* ciepły pomarańcz */
    --color-danger: #D32F2F; /* czerwony */
    --color-info: #0288D1; /* niebieski informacyjny */
    /* --------------------------------------------
     COLORS — STATUSES
     -------------------------------------------- */
    --color-status-green: #4CAF50;
    --color-status-darkblue: #007AB1;
    --color-status-gray: #9E9E9E;
    --color-status-darkgray: #666666;
    --color-status-darkred: #980a00;
    --color-status-red: #c10d00;
    --color-status-font-neutral: #9E9E9E;
    /* --------------------------------------------
     COLORS — NEUTRALS
     -------------------------------------------- */
    --color-background: #FFFFFF;
    --color-surface: #F4F6F8; /* lekko chłodny odcień */
    --color-border: #D0D7DE;
    --color-text: #1A1A1A;
    --color-text-light: #5A5A5A;
    --color-text-inverse: #FFFFFF;
    --color-info: #0a3d62;
    --color-info-light: #3c6382;
    --color-warning: #8e3a00;
    /* --------------------------------------------
     ERRORS
     -------------------------------------------- */
    --error-details-background: rgba(255, 80, 80, 0.05);
    --error-details-frame: rgba(255, 80, 80, 0.18);
    --error-bg: #fdecea;
    --error-text: #c0392b;
    --error-border: rgba(192, 57, 43, 0.15);
    /* --------------------------------------------
     INFO-TOP-BARS
     -------------------------------------------- */
    --color-bg-light-blue: #d9f3ff;
    --color-text-light-blue: #1c92c9;
    --color-border-light-blue: rgba(217, 243, 255, 0.15);
    --color-bg-light-green: #dbffdd;
    --color-text-light-green: #0c7a12;
    --color-border-light-green: rgba(219, 255, 221, 0.15);
    /* --------------------------------------------
     TYPOGRAPHY
     -------------------------------------------- */
    --font-family-base: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-size-xxs: 10px;
    --font-size-xs: 12px;
    --font-size-sm: 14px;
    --font-size-md: 16px;
    --font-size-lg: 20px;
    --font-size-xl: 24px;
    --font-size-xxl: 32px;
    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    --mud-typography-default-font-family: var(--font-family-base);
    --mud-typography-body1-font-family: var(--font-family-base);
    --mud-typography-body2-font-family: var(--font-family-base);
    --mud-typography-button-font-family: var(--font-family-base);
    --mud-typography-caption-font-family: var(--font-family-base);
    --mud-typography-h1-font-family: var(--font-family-base);
    --mud-typography-h2-font-family: var(--font-family-base);
    --mud-typography-h3-font-family: var(--font-family-base);
    --mud-typography-h4-font-family: var(--font-family-base);
    --mud-typography-h5-font-family: var(--font-family-base);
    --mud-typography-h6-font-family: var(--font-family-base);
    /* --------------------------------------------
     SPACING
     -------------------------------------------- */
    --space-xxs: 2px;
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    /* --------------------------------------------
     RADII
     -------------------------------------------- */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-round: 999px;
    /* --------------------------------------------
     SHADOWS
     -------------------------------------------- */
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.12);
    --shadow-md: 0 3px 6px rgba(0,0,0,0.16);
    --shadow-lg: 0 6px 12px rgba(0,0,0,0.20);
    /* --------------------------------------------
     TRANSITIONS
     -------------------------------------------- */
    --transition-fast: 150ms ease;
    --transition-normal: 250ms ease;
    --transition-slow: 400ms ease;
    /* --------------------------------------------
     GRADIENTS
     -------------------------------------------- */
    --gradient-tile: linear-gradient(135deg, #ffffff 0%, #e2edff 100%);
}
