@charset "utf-8";  

/* 
CSS Document HPK - Layout 21 
Definition Farbschema 
Rot - Grau
*/

/**********************************************/
/***************** Default, Light ************/
/********************************************/

:root,
[data-bs-theme=light] {
	
	--si-blue: #0d6efd;
	--si-indigo: #6610f2;
	--si-purple: #6f42c1;
	--si-pink: #d63384;
	--si-red: #dc3545;
	--si-orange: #fd7e14;
	--si-yellow: #ffc107;
	--si-green: #198754;
	--si-teal: #20c997;
	--si-cyan: #0dcaf0;
	--si-black: #000;
	--si-white: #fff;
	--si-gray: #999999;
	--si-gray-dark: #3a3a3a;
	--si-gray-100: #f9f9f9;
	--si-gray-200: #f2f2f2;
	--si-gray-300: #e8e8e8;
	--si-gray-400: #d9d9d9;
	--si-gray-500: #b8b8b8;
	--si-gray-600: #999999;
	--si-gray-700: #565656;
	--si-gray-800: #3a3a3a;
	--si-gray-900: #1b1b1b;	

	--si-success: #adeeeb;          
	--si-success-hover: #990000;
	--si-success-active: #800000;

	--si-info: #4c82f7;
	--si-info-hover: #990000;
	--si-info-active: #800000;

	--si-warning: #ffba08;
	--si-warning-hover: #ff6666;
	--si-warning-active: #ff4d4d;

	--si-danger: #e60000;
	--si-danger-hover: #cc0000;
	--si-danger-active: #990000;

	--si-light: #fff;
	--si-light-hover: #f2f2f2;
	--si-light-active: #e6e6e6;

	--si-dark: #1b1b1b;
	--si-dark-hover: #333;
	--si-dark-active: #660000;
	
	/* Hauptfarben */
	
	--si-primary: #e11d2f;
	--si-primary-hover: #f4143b;
	--si-primary-active: #d91133;
	--si-primary-light: #ffadb8;

	--si-secondary: #dddee1;
	--si-secondary-hover: #d2d3d6;
	--si-secondary-active: #a8a8a8;
	--si-secondary-bg-light: #eff0f3;	

	--si-primary-rgb: 225, 29, 47;
	--si-secondary-rgb: 221, 222, 225;

	--si-primary-text-emphasis: #e11d2f;
	--si-secondary-text-emphasis: #cccccc;

	--si-primary-border-subtle: #ffadb8;
	--si-secondary-border-subtle: #cccccc;

	--si-gradient-1: #e11d2f;
	--si-gradient-2: #f4143b;
	--si-gradient-3: #ff5a6a;

	--si-primary-bg-subtle: #ffe6ea;
	--si-secondary-bg-subtle: #f5f5f5;

	--si-code-color: #e11d2f;
	--si-highlight-color: #f4143b;
	--si-highlight-bg: #ffd6dc;
	--si-heading-link-hover-color: #e11d2f;
	--si-heading-link-color: #000;

	--si-heading-color2: var(--si-light);
	--si-body-color2: rgba(255, 255, 255, 0.8);
	--si-secondary-bg2: rgba(255, 255, 255, .04);
	--si-card-border-color2: rgba(255, 255, 255, .15);
	--si-primary2: var(--si-primary-hover);
	--si-primary-hover2: var(--si-primary-active);
	--si-primary-active2: var(--si-primary-active);
	
  	--si-success-rgb: 173, 238, 235;
  	--si-info-rgb: 76, 130, 247;
  	--si-warning-rgb: 255, 186, 8;
  	--si-danger-rgb: 239, 68, 68;
	--si-light-rgb: 255, 255, 255;
	--si-dark-rgb: 27, 27, 27;
	
	--si-success-text-emphasis: #83E5E1;
	--si-info-text-emphasis: #1B60F5;
	--si-warning-text-emphasis: #D49900;
	--si-danger-text-emphasis: #EB1515;
	--si-light-text-emphasis: #565656;
	--si-dark-text-emphasis: #1B1B1B;
	
	--si-success-bg-subtle: #F7FDFD;
	--si-info-bg-subtle: #EDF2FE;
	--si-warning-bg-subtle: #FFF8E6;
	--si-danger-bg-subtle: #FDECEC;
	--si-light-bg-subtle: #fff;
	--si-dark-bg-subtle: #EDEDED;
	
	--si-success-border-subtle: #EAFBFA;
	--si-info-border-subtle: #D2E0FD;
	--si-warning-border-subtle: #FFEEC1;
	--si-danger-border-subtle: #FBD0D0;
	--si-light-border-subtle: #cccccc;
	--si-dark-border-subtle: #333333;

	--si-body-color: #555555;
	--si-body-color-rgb: 0, 0, 0;
	--si-body-bg: #fff;
	--si-body-bg-rgb: 85, 85, 85;

	--si-link-color: var(--si-primary);
	--si-link-color-rgb: var(--si-primary-rgb);
	--si-link-hover-color: #e11d2f;
	--si-link-hover-color-rgb: 225, 29, 47;

	--si-nav-link-color: var(--si-dark);
	--si-nav-link-hover-color: var(--si-primary);
	--si-nav-link-disabled-color: rgba(0,0,0,0.4);

	--si-dropdown-link-hover-color: var(--si-light);
	--si-dropdown-link-hover-bg: var(--si-primary);
	--si-dropdown-link-active-color: var(--si-light);
	--si-dropdown-link-active-bg: var(--si-primary-active);
	--si-dropdown-link-disabled-color: rgba(0,0,0,0.4);
	
	--si-btn-primary-color: var(--si-light);
	--si-btn-primary-bg: var(--si-primary);
	--si-btn-primary-border: var(--si-primary);
	--si-btn-primary-hover-bg: var(--si-primary-hover);
	--si-btn-primary-hover-border: var(--si-primary-hover);
	--si-btn-primary-active-bg: var(--si-primary-active);
	--si-btn-primary-active-border: var(--si-primary-active);
	--si-btn-primary-disabled-bg: var(--si-primary-rgb, 0.5);
	--si-btn-primary-disabled-border: var(--si-primary-rgb, 0.5);
	
	--si-btn-secondary-color: var(--si-dark);
	--si-btn-secondary-bg: var(--si-secondary);
	--si-btn-secondary-border: var(--si-secondary);
	--si-btn-secondary-hover-bg: var(--si-secondary-hover);
	--si-btn-secondary-hover-border: var(--si-secondary-hover);
	--si-btn-secondary-active-bg: var(--si-secondary-active);
	--si-btn-secondary-active-border: var(--si-secondary-active);
	--si-btn-secondary-disabled-bg: var(--si-secondary-rgb, 0.5);
	--si-btn-secondary-disabled-border: var(--si-secondary-rgb, 0.5);

	--si-bx-search-color: #666666;	
}

/**********************************************/
/***************** Dark **********************/
/********************************************/

[data-bs-theme=dark] {
	
	color-scheme: dark;	
	
	--si-gray-600: rgba(255, 255, 255, .5);
	--si-gray-700: rgba(255, 255, 255, .7);
	--si-gray-800: rgba(255, 255, 255, .85);
	--si-gray-900: #fff;
	--si-secondary-bg: rgba(255, 255, 255, .07);
	--si-heading-link-color: rgba(255, 255, 255, 0.85);
	--si-heading-link-hover-color: var(--si-primary-hover);
	--si-code-color: #f4143b;	
		
	--si-body-color: rgba(255, 255, 255, 0.9);
	--si-body-color-rgb: 255, 255, 255;
	--si-body-bg: #111111;
	--si-body-bg-rgb: 26, 26, 26;

	--si-primary-text-emphasis: #ff5060;
	--si-secondary-text-emphasis: #ff8080;
	--si-success-text-emphasis: #ff3333;
	--si-info-text-emphasis: #ff4d4d;
	--si-warning-text-emphasis: #ff9999;
	--si-danger-text-emphasis: #ff1a1a;
	--si-light-text-emphasis: #ffe6e6;
	--si-dark-text-emphasis: #d91133;

	--si-primary-bg-subtle: #330006;
	--si-secondary-bg-subtle: #4d0a0f;
	--si-success-bg-subtle: #660000;
	--si-info-bg-subtle: #800000;
	--si-warning-bg-subtle: #993333;
	--si-danger-bg-subtle: #b30000;
	--si-light-bg-subtle: #260000;
	--si-dark-bg-subtle: #0d0000;

	--si-primary-border-subtle: #ff8794;
	--si-secondary-border-subtle: #ff9999;
	--si-success-border-subtle: #ff3333;
	--si-info-border-subtle: #ff4d4d;
	--si-warning-border-subtle: #ff8080;
	--si-danger-border-subtle: #ff0000;
	--si-light-border-subtle: #ff9999;
	--si-dark-border-subtle: #660000;

	--si-link-color: #ff5060;
	--si-link-hover-color: #ff6674;
	--si-link-color-rgb: 255, 80, 96;
	--si-link-hover-color-rgb: 255, 102, 116;	

	--si-btn-primary-color: var(--si-light);
	--si-btn-primary-bg: var(--si-primary);
	--si-btn-primary-border: var(--si-primary);
	--si-btn-primary-hover-bg: var(--si-primary-hover);
	--si-btn-primary-hover-border: var(--si-primary-hover);
	--si-btn-primary-active-bg: var(--si-primary-active);
	--si-btn-primary-active-border: var(--si-primary-active);
	--si-btn-primary-disabled-bg: var(--si-primary);
	--si-btn-primary-disabled-border: var(--si-primary);	

	--si-bx-search-color: #b3b3b3;

	--si-heading-color2: var(--si-light);
	--si-body-color2: rgba(255, 255, 255, 0.9);
	--si-secondary-bg2: rgba(255, 255, 255, .04);
}