/**
 * MedDnevnik — design tokens.
 * Всё, что можно кастомизировать, — идёт через CSS-переменные.
 */

:root {
	/* Цвет */
	--md-color-bg:            #ffffff;
	--md-color-bg-alt:        #f5f8fa;
	--md-color-surface:       #ffffff;
	--md-color-text:          #0f172a;
	--md-color-text-muted:    #475569;
	--md-color-border:        #e2e8f0;
	--md-color-border-strong: #cbd5e1;

	/* Бренд — тёплый tealo-medical, читаемый на белом и на тёмном */
	--md-color-brand:         #0f766e;
	--md-color-brand-hover:   #115e59;
	--md-color-brand-soft:    #ccfbf1;
	--md-color-brand-text:    #134e4a;

	/* Акцентные для клинических зон (астма и т.п.) */
	--md-color-zone-green:    #16a34a;
	--md-color-zone-yellow:   #eab308;
	--md-color-zone-red:      #dc2626;

	/* Статусы */
	--md-color-info:          #0284c7;
	--md-color-success:       #16a34a;
	--md-color-warning:       #d97706;
	--md-color-danger:        #dc2626;

	/* Радиусы */
	--md-radius-sm:  4px;
	--md-radius-md:  8px;
	--md-radius-lg:  14px;
	--md-radius-xl:  22px;
	--md-radius-full: 999px;

	/* Тени */
	--md-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
	--md-shadow-md: 0 4px 12px rgba(15, 23, 42, .08);
	--md-shadow-lg: 0 12px 32px rgba(15, 23, 42, .12);

	/* Пространство */
	--md-space-1:  4px;
	--md-space-2:  8px;
	--md-space-3:  12px;
	--md-space-4:  16px;
	--md-space-5:  20px;
	--md-space-6:  24px;
	--md-space-8:  32px;
	--md-space-10: 40px;
	--md-space-12: 48px;
	--md-space-16: 64px;

	/* Типографика */
	--md-font-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--md-font-serif: 'PT Serif', Georgia, serif;
	--md-font-mono:  ui-monospace, SFMono-Regular, Menlo, monospace;

	--md-fs-xs:  12px;
	--md-fs-sm:  14px;
	--md-fs-md:  16px;
	--md-fs-lg:  18px;
	--md-fs-xl:  22px;
	--md-fs-2xl: 28px;
	--md-fs-3xl: 36px;
	--md-fs-4xl: 48px;

	--md-lh-tight:  1.25;
	--md-lh-normal: 1.55;
	--md-lh-loose:  1.75;

	--md-fw-regular: 400;
	--md-fw-medium:  500;
	--md-fw-semi:    600;
	--md-fw-bold:    700;

	/* Layout */
	--md-container-max: 1200px;
	--md-container-pad: 20px;
	--md-header-h:      64px;
	--md-header-h-mob:  56px;
}

@media (prefers-color-scheme: dark) {
	:root {
		--md-color-bg:            #0b1220;
		--md-color-bg-alt:        #101a2c;
		--md-color-surface:       #101a2c;
		--md-color-text:          #e2e8f0;
		--md-color-text-muted:    #94a3b8;
		--md-color-border:        #1e293b;
		--md-color-border-strong: #334155;
		--md-color-brand:         #2dd4bf;
		--md-color-brand-hover:   #14b8a6;
		--md-color-brand-soft:    #134e4a;
		--md-color-brand-text:    #ccfbf1;
	}
}