/* ----------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------- base.css --------------------------------------------------- */
/* ---------------------------- Developed by 'Tsakiris Studio' do not modify this file. ---------------------------- */
/* ------------------------  Latest version (--CD-01062026 --MD-01062026 --BUILD-0.0.0-1) -------------------------- */
/* ----------------------------------------------------------------------------------------------------------------- */


/* --------------------------------------------- TOUCH MEDIA SETTINGS ---------------------------------------------- */

/* STAR */
* {

    -webkit-tap-highlight-color : transparent ;

}

/* ----------------------------------------------------------------------------------------------------------------- */


/* ---------------------------------------------- GENERAL BOX SIZING ----------------------------------------------- */

/* STAR & STAR AFTER, BEFORE */
*, *::after, *::before {

    box-sizing : border-box ;

}

/* ----------------------------------------------------------------------------------------------------------------- */


/* ------------------------------------------------- HTML SETTINGS ------------------------------------------------- */

/* HTML */
html {

	margin : 0 ;
	padding : 0 ;

	scrollbar-width : none ;
	-ms-overflow-style : none ;

}

/* HTML WEBKIT SCROLLBAR */
html::-webkit-scrollbar {

    display : none ;

}

/* ----------------------------------------------------------------------------------------------------------------- */


/* ------------------------------------------------- BODY SETTINGS ------------------------------------------------- */

/* BODY */
body {

	margin : 0 ;
	padding : 0 ;

	font-family : var(--font-primary) ;

	background :

		linear-gradient(

            90deg,
            rgba(var(--color-ink-rgb), 0.05) 1px,
            transparent 1px
        
        ),

		linear-gradient(

            180deg,
            rgba(var(--color-ink-rgb), 0.05) 1px,
            transparent 1px
    
        ),

		var(--color-paper) ;

	background-size : var(--size-32) var(--size-32) ;

}

/* ----------------------------------------------------------------------------------------------------------------- */


/* ------------------------------------------------ MATERIAL SYSTEM ------------------------------------------------ */

/* MAT */
.mat {

	inset : 0 ;
	width : auto ;
	height : auto ;
	position : absolute ;
	pointer-events : none ;
	mix-blend-mode : overlay ;
    background-position : center ;
	background-repeat : no-repeat ;

}


/* MAT EXPAND */
.mat-expand--width { width : 100% ; }
.mat-expand--height { height : 100% ; }


/* MAT STRENGTH */
.mat-strength--xxxsoft { opacity : 0.025 ; }
.mat-strength--xxsoft { opacity : 0.075 ; }
.mat-strength--xsoft { opacity : 0.125 ; }
.mat-strength--soft { opacity : 0.250 ; }
.mat-strength--medium { opacity : 0.375 ; }
.mat-strength--strong { opacity : 0.500 ; }
.mat-strength--xstrong { opacity : 0.625 ; }
.mat-strength--xxstrong { opacity : 0.750 ; }
.mat-strength--xxxstrong { opacity : 0.875 ; }


/* MAT STYLE */
.mat-style--panel { border-radius : 6px ; }
.mat-style--button { border-radius : 4px ; }
.mat-style--circle { border-radius : 50% ; }


/* MAT SIZE */
.mat-size--small { background-size : auto 25vw ; }
.mat-size--medium { background-size : auto 50vw ; }
.mat-size--large { background-size : auto 100vw ; }


/* MAT TEXTURE */
.mat-texture--metal { background-image : var(--material-metal) ; }
.mat-texture--steel { background-image : var(--material-steel) ; }
.mat-texture--copper { background-image : var(--material-copper) ; }

/* ----------------------------------------------------------------------------------------------------------------- */