:root {
    /* numbers */
    --border-radius-xs: 4px;
    --border-radius-sm: 8px;
    --border-radius-md: 12px;
    --border-radius-lg: 16px;
    --border-radius-xl: 24px;
    --spaces-xs: 4px;
    --spaces-sm: 8px;
    --spaces-md: 12px;
    --spaces-lg: 24px;
    --spaces-xl: 40px;
    --spaces-xxl: 80px;
    /* colors */
    --border-border: #d0d0d0;
    --border-border-muted: #e8e8e8;
    --border-border-variant: #afafaf;
    --brand-based: #0a47bb;
    --brand-highest: #082c6e;
    --brand-lowest: #c1d8fb;
    --golf-other: #8f4cbf;
    --golf-albatros: #f55753;
    --golf-birdie: #f5c5c4;
    --golf-bogey: #d3d1eb;
    --golf-double-bogey: #bbb0eb;
    --golf-eagle: #f59391;
    --golf-hole-in-one: #00ff02;
    --golf-par: #fcf6a1;
    --golf-triple-bogey: #9a78db;
    --info-based: #5fbdd4;
    --info-highest: #246373;
    --info-lowest: #e3f6fa;
    --red-based: #ec0f19;
    --red-highest: #742334;
    --red-lowest: #fae3e5;
    --secondary-lowest: #8e8e8e;
    --success-based: #038c19;
    --success-highest: #02500e;
    --success-lowest: #e1fde6;
    --surface-based: #f3f3f3;
    --surface-highest: #e8e8e8;
    --surface-lowest: #ffffff;
    --tertiary-based: #e79a2a;
    --tertiary-highest: #745a29;
    --tertiary-lowest: #fbeac6;
    --text-icons-on-surface: #353535;
    --text-icons-on-surface-muted: #8e8e8e;
    --text-icons-on-surface-variant: #6f6f6f;
    --ion-color-danger: var(--red-based);
    --ion-color-primary: var(--brand-based);
    --ion-color-primary-contrast: #ffffff;
    --ion-color-primary-shade: var(--brand-based);
    --ion-color-primary-tint: var(--brand-based);

}

@media (max-height: 700px) {
    :root {
        /*--spaces-xxl: 60px;*/
    }
}


[data-theme="tycko"] {
    /* numbers */
    --border-radius-xs: 4px;
    --border-radius-sm: 8px;
    --border-radius-md: 12px;
    --border-radius-lg: 16px;
    --border-radius-xl: 24px;
    --spaces-xs: 4px;
    --spaces-sm: 8px;
    --spaces-md: 12px;
    --spaces-lg: 24px;
    --spaces-xl: 40px;
}

[data-theme="tycko"] {
    /* colors */
    --border-border: #262940;
    --border-border-muted: #f2ebde;
    --border-border-variant: #268068;
    --brand-based: #268068;
    --brand-highest: #1a5948;
    --brand-lowest: #d8f3ec;
    --golf-other: #8f4cbf;
    --golf-albatros: #f55753;
    --golf-birdie: #f5c5c4;
    --golf-bogey: #d3d1eb;
    --golf-double-bogey: #bbb0eb;
    --golf-eagle: #f59391;
    --golf-hole-in-one: #00ff02;
    --golf-par: #fcf6a1;
    --golf-triple-bogey: #9a78db;
    --info-based: #5fbdd4;
    --info-highest: #246373;
    --info-lowest: #e3f6fa;
    --red-based: #a31621;
    --red-highest: #5a0c12;
    --red-lowest: #fae3e5;
    --secondary-lowest: #dfe1ec;
    --success-based: #038c19;
    --success-highest: #02500e;
    --success-lowest: #e1fde6;
    --surface-based: #faf7f2;
    --surface-highest: #f2ebde;
    --surface-lowest: #ffffff;
    --tertiary-based: #ffd166;
    --tertiary-highest: #664700;
    --tertiary-lowest: #fef6e1;
    --text-icons-on-surface: #262940;
    --text-icons-on-surface-muted: #767992;
    --text-icons-on-surface-variant: #3d405a;
    --ion-color-danger: var(--red-based);
    --ion-color-primary: var(--brand-based);
    --ion-color-primary-contrast: #ffffff;
    --ion-color-primary-shade: var(--brand-based);
    --ion-color-primary-tint: var(--brand-based);
}

[data-theme="skga"] {
    /* colors */
    --border-border: #112d5d;
    --border-border-muted: #dbe2e8;
    --border-border-variant: #b4131d;
    --brand-based: #b4131d;
    --brand-highest: #860e16;
    --brand-lowest: #fae3e5;
    --golf-other: #8f4cbf;
    --golf-albatros: #f55753;
    --golf-birdie: #f5c5c4;
    --golf-bogey: #d3d1eb;
    --golf-double-bogey: #bbb0eb;
    --golf-eagle: #f59391;
    --golf-hole-in-one: #00ff02;
    --golf-par: #fcf6a1;
    --golf-triple-bogey: #9a78db;
    --info-based: #5fbdd4;
    --info-highest: #246373;
    --info-lowest: #e3f6fa;
    --red-based: #b4131d;
    --red-highest: #860e16;
    --red-lowest: #fae3e5;
    --secondary-lowest: #dbe1ec;
    --success-based: #038c19;
    --success-highest: #02500e;
    --success-lowest: #e1fde6;
    --surface-based: #f5f6fa;
    --surface-highest: #dbe2e8;
    --surface-lowest: #ffffff;
    --tertiary-based: #61a1d9;
    --tertiary-highest: #205584;
    --tertiary-lowest: #dfecf7;
    --text-icons-on-surface: #112d5d;
    --text-icons-on-surface-muted: #50687c;
    --text-icons-on-surface-variant: #344869;
    --ion-color-danger: var(--red-based);
    --ion-color-primary: var(--brand-based);
    --ion-color-primary-contrast: #ffffff;
    --ion-color-primary-shade: var(--brand-based);
    --ion-color-primary-tint: var(--brand-based);
}

[data-theme="panorama"] {
    /* colors */
    --border-border: #d0d0d0;
    --border-border-muted: #e8e8e8;
    --border-border-variant: #afafaf;
    --brand-based: #0b4c45;
    --brand-highest: #09403a;
    --brand-lowest: #c2fff8;
    --golf-other: #8f4cbf;
    --golf-albatros: #f55753;
    --golf-birdie: #f5c5c4;
    --golf-bogey: #d3d1eb;
    --golf-double-bogey: #bbb0eb;
    --golf-eagle: #f59391;
    --golf-hole-in-one: #00ff02;
    --golf-par: #fcf6a1;
    --golf-triple-bogey: #9a78db;
    --info-based: #5fbdd4;
    --info-highest: #246373;
    --info-lowest: #e3f6fa;
    --red-based: #ec0f19;
    --red-highest: #742334;
    --red-lowest: #fae3e5;
    --secondary-based: #6f6f6f;
    --secondary-highest: #353535;
    --secondary-lowest: #8e8e8e;
    --success-based: #038c19;
    --success-highest: #02500e;
    --success-lowest: #e1fde6;
    --surface-based: #f9f9f9;
    --surface-highest: #e5e5e5;
    --surface-lowest: #ffffff;
    --tertiary-based: #8f6d4f;
    --tertiary-highest: #644529;
    --tertiary-lowest: #f0e4da;
    --text-icons-on-surface: #262626;
    --text-icons-on-surface-muted: #8e8e8e;
    --text-icons-on-surface-variant: #6f6f6f;
    --ion-color-danger: var(--red-based);
    --ion-color-primary: var(--brand-based);
    --ion-color-primary-contrast: #ffffff;
    --ion-color-primary-shade: var(--brand-based);
    --ion-color-primary-tint: var(--brand-based);
}


/* CUSTOM */
:root {
    --brand-based-10: #edf3ff;
    --ion-color-danger: var(--red-based);
    --ion-color-primary: var(--brand-based);
    --ion-color-primary-contrast: #ffffff;
    --ion-color-primary-shade: var(--brand-based);
    --ion-color-primary-tint: var(--brand-based);
    /*/ CUSTOM /*/
    --gray-0: #FFFFFF;
    --gray-5: #FAFAFA;
    --gray-10: #F5F5F5;
    --gray-15: #EFEFEF;
    --gray-20: #EBEBEB;
    --gray-25: #E5E5E5;
    --gray-28: #dddddd;
    --gray-30: #D6D6D6;
    --gray-40: #B8B8B8;
    --gray-50: #999999;
    --gray-60: #7A7A7A;
    --gray-70: #5C5C5C;
    --gray-80: #3D3D3D;
    --gray-90: #1F1F1F;
    --gray-100: #000;
    --transparent: transparent;
    --blue-60: #575D90;
    --blue-80: #262940;
    --text-icons-on-surface-based: #353535;
    --text-icons-on-surface-highest: #353535;
    --text-icons-on-surface-lowest: #353535;
    --intro-background: #fbf7f3;
    --ion-toolbar-color: var(--text-icons-on-surface);
    --border-active: #effaf7;
}

[data-theme="tycko"] {
    --brand-based-10: #edfff9;
    --ion-toolbar-color: var(--text-icons-on-surface);
    --border-active: #effaf7;
}

[data-theme="skga"] {
    --brand-based-10: #ffecee;
    --text-icons-on-surface-based: #112d5d;
    --text-icons-on-surface-highest: #112d5d;
    --text-icons-on-surface-lowest: #112d5d;
    /*--intro-background: #17477b;*/
    --ion-toolbar-color: var(--text-icons-on-surface);
    --border-active: #fdf7f7;
    /*--intro-background: linear-gradient(0deg, rgba(28, 65, 118, 0.50) 0%, rgba(28, 65, 118, 0.50) 100%), url('https://assets.golferis.cz/assets/assets/app-background.webp') no-repeat center center/cover;*/
    /*--intro-background: #17477b url('https://assets.golferis.cz/tycko/assets/app-background.webp') no-repeat center center/cover;*/
}


[data-theme="panorama"] {
    --brand-based-10: #ffecee;
    --text-icons-on-surface-based: #112d5d;
    --text-icons-on-surface-highest: #112d5d;
    --text-icons-on-surface-lowest: #112d5d;
    --ion-toolbar-color: var(--text-icons-on-surface);
    --border-active: #fdf7f7;
    /*--intro-background: linear-gradient(0deg, rgba(28, 65, 118, 0.50) 0%, rgba(28, 65, 118, 0.50) 100%), url('https://assets.golferis.cz/assets/assets/app-background.webp') no-repeat center center/cover;*/
    /*--intro-background: #17477b url('https://assets.golferis.cz/tycko/assets/app-background.webp') no-repeat center center/cover;*/
}