cowoReset

/*
 * Built by: cowowo.cat
 * Author: Carl Johansson
 * File: CSS Reset
 */



/* 
 * BOX MODEL
 */
*, *::before, *::after {
	box-sizing: border-box;
}

 /* 
  * REMOVE MARGIN AROUND THE PAGE 
  * BODY MARGIN 0 IS THE KEY - this is the actual solver for the body margin issue 
  */ 
 html, body {
	height: 100%; /* Useful for full-height layouts */
	margin: 0;
	padding: 0;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-smooth: always; /* For non-WebKit browsers */
  }


/* 
 *
 * MEDIA (RESET) 
 *
 */
 
 img {
	 max-width:100%; 
	 height:auto; /* The height is added to ensure the aspect ratio of the image is retained. */ /* Maintain aspect ratio */
 }
	 
/* Media Handling */
img,
picture,
/* video,
audio, */
canvas {
  display: block; /* to avoid default margin bottom due to display: inline(-block) */ /* To avoid default margin bottom due to inline-block */
  max-width: 100%;
  width: 100%; 	
}

audio,
video {
  max-width: 100%;
  height: auto;
}

  
/* 
 * CSS RESET - basics
 */
html, body,
h1, h2, h3, h4, h5, h6, 
p, 
input, textarea,
pre, code, 
img,
dl, dt, dd, 
ol, ul, li {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: inherit; /* VS font-size: 100%; */ /* Use 'inherit' to scale with parent font sizes */
}


/* 
 *
 * TYPOGRAPHY BASICS (RESET) 
 *
 */

 p {}


/* Headings */	
h1, h2, h3, h4, h5, h6 {
	font-size: 100%; /* Reset for consistent sizing */
	font-weight: normal; /* Reset to avoid bold headings */
}

h1, h2, h3, h4, h5, h6 {
	text-wrap: balance; 
}
p {
	text-wrap: pretty; 
}



 /* Links */
 a, a:hover, a:visited {
	 color: inherit;
	 text-decoration: none;
 }


/* Lists */
ul, ol {
	list-style:none;
	padding: 0; /* test this */
}




/*
blockquote, q {quotes:none;}	
*/

blockquote {
	margin-left: 1.5em;
	padding-left: 1em;
	border-left: 4px solid #ccc; /* Simple blockquote styling */
  }




  hr {
	border: 0;
	height: 1px;
	background: #ccc;
	margin: 1em 0;
  }
  
  





/* FOT INHERITANCE, THIS SI PROBABLY NEAT - ALSO ADD INOUTS / PLACEHODERS ...  */
 input,
 button,
 textarea,
 select,
 legend
 ::placeholder {
   font: inherit;
 }


input[type="checkbox"],
input[type="radio"] {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}




/* 
 *
 * FORMS (RESET) 
 *
 */
	

 fieldset {
	margin: 0;
	padding: 0;
	border: 0;
  }
  
  legend {
	font-size: inherit;
	padding: 0;
  }
  
  


input[type=text], 
input[type=submit],
input[type=reset],
input[type=button], 
input[type=image], 
textarea,
select {
	-webkit-appearance: none; /* iOS Safari default override */
	border-radius:0px;
} 
	

/* Focus Styles for Forms */
input, textarea {
	outline: none; /* Only if you add custom focus styles elsewhere */
}

input:focus,
textarea:focus,
button:focus,
select:focus {
  outline: 2px solid #007bff; /* Custom focus outline */
  outline-offset: 2px; /* Adds space between element and outline */
}





	
/* option {cursor:pointer;} */ /* NOT WORKING !!! */
label,
input[type="submit"],
input[type="reset"],
button,
select {
  cursor:pointer; 
}


/* Form Field Size */
/* input, */
input[type=text], 
input[type=password], 
select, 
textarea {
	width:100%; 
}		
	

button {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;

	/* You've already reset buttons for modern browsers, but to ensure no additional browser-specific styles (like gradients or shadows) are applied to buttons, consider the following reset. */
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;

}


button,
input[type="submit"],
input[type="reset"] {
  touch-action: manipulation; /* To improve interactions on touch devices, consider adding touch-action: manipulation for buttons and interactive elements to prevent undesirable touch events like double-tap zooming. */
}


input,
button {
  -webkit-tap-highlight-color: transparent; /* Ensure clickable buttons and inputs have no delay in touch environments (useful for mobile devices): */
}


/* 
 *
 * FORM ELEMENTS - TEXTAREA
 *
 */
textarea {
	/* resize:none; */
	resize:vertical;
	display: block; /* to avoid default margin bottom due to display: inline(-block) */
}	
	



		
/* 
 *
 * TABLES
 *
 */
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* 
 *
 * GENRAL BRANIDNG ...   SCROLBAR, MAKERS, INPUET CARET... 
 *
 */
::-webkit-scrollbar {
	width: 8px;
  }
  
  ::-webkit-scrollbar-thumb {
	background-color: #ccc;
	border-radius: 4px;
  }
  
  ::-webkit-scrollbar-track {
	background: #f0f0f0;
  }