/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

:root, :root.cf-theme-dark .theme-inverted {

    /*Colors*/
    --primary: hsl(349, 88%, 23%);
    --primary-d-1: hsl(206, 72%, 37%);
    --primary-d-2: hsl(208, 57%, 26%);
    --primary-d-3: hsl(211, 42%, 15%);

    --black-color: hsl(0, 0%, 5%);
    --black-color-d-1: hsl(240, 2%, 8%);
    --black-color-d-2: hsl(240, 2%, 6%);
    --black-color-d-3: hsl(240, 3%, 3%);

    --light-color: hsl(213, 41%, 95%);
    --light-color-d-1: hsl(210, 4%, 69%);
    --light-color-d-2: hsl(210, 2%, 44%);
    --light-color-d-3: hsl(210, 2%, 22%);
    --light-bg-color: hsl(0, 0%, 95%);

    --white-color: hsl(0, 0%, 100%);

    --text-body: hsl(240, 2%, 10%);
    --text-title: hsl(240, 2%, 10%);
  

    /*Space*/
    --space-4xs: clamp(0.52rem, calc(-0.02vw + 0.53rem), 0.49rem);
    --space-3xs: clamp(0.66rem, calc(0.04vw + 0.64rem), 0.7rem);
    --space-2xs: clamp(0.82rem, calc(0.13vw + 0.78rem), 0.99rem);
    --space-xs: clamp(1.02rem, calc(0.29vw + 0.93rem), 1.4rem);
    --space-s: clamp(1.28rem, calc(0.55vw + 1.1rem), 1.98rem);
    --space-m: clamp(1.6rem, calc(0.94vw + 1.3rem), 2.8rem);
    --space-l: clamp(2rem, calc(1.53vw + 1.51rem), 3.96rem);
    --space-xl: clamp(2.5rem, calc(2.42vw + 1.73rem), 5.6rem);
    --space-2xl: clamp(3.13rem, calc(3.74vw + 1.93rem), 7.92rem);
    --space-3xl: clamp(3.91rem, calc(5.69vw + 2.08rem), 11.19rem);
    --space-4xl: clamp(4.88rem, calc(8.55vw + 2.15rem), 15.83rem);

    /*Font size*/

    --text-xs: clamp(1.1rem, calc(0.31vw + 1rem), 1.5rem);
    --text-s: clamp(1.3rem, calc(0.31vw + 1.2rem), 1.7rem);
    --text-m: clamp(1.5rem, calc(0.47vw + 1.35rem), 2.1rem);
    --text-l: clamp(1.8rem, calc(0.23vw + 1.73rem), 2.1rem);
    --text-xl: clamp(2rem, calc(0.63vw + 1.8rem), 2.8rem);
    --text-2xl: clamp(2.8rem, calc(0.63vw + 2.6rem), 3.6rem);
    --text-3xl: clamp(3.8rem, calc(1.41vw + 3.35rem), 5.6rem);
    --text-4xl: clamp(4rem, calc(3.13vw + 3rem), 8rem);
	--text-5xl: clamp(8rem, calc(10vw + -1rem), 15rem);

    /*Border-radius, shadow, transition*/
    --radius-xs: clamp(0.4rem, calc(0vw + 0.4rem), 0.4rem);
    --radius-s: clamp(0.8rem, calc(-0.16vw + 0.85rem), 0.6rem);
    --radius-m: clamp(1.2rem, calc(-0.16vw + 1.25rem), 1rem);
    --radius-l: clamp(2rem, calc(-0.31vw + 2.1rem), 1.6rem);
    --radius-xl: clamp(3.2rem, calc(-0.47vw + 3.35rem), 2.6rem);
    --radius-full: 999rem;
	
    --shadow-xs: 0 1px 2px var(--primary-d-3);
    --shadow-s: 0 1.5px 3px var(--primary-d-3);
    --shadow-m: 0 2px 6px var(--primary-d-3);
    --shadow-l: 0 3px 12px var(--primary-d-3);
    --shadow-xl: 0 6px 48px var(--primary-d-3);
	
    --border: 1px solid var(--primary);
    --border-black: 1px solid var(--black-color);
    --border-white: 1px solid var(--light-color);
    --transition: all 0.2s ease-in-out;
}

body {
	animation: fadeInAnimation ease 0.1s;
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

@keyframes fadeInAnimation {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

body.bricks-is-frontend :focus{
	outline: none !important;
}