---
export interface Props {
	title: string;
  description: string;
  keywords: string;
  ogImage: string;
  ogUrl: string;
  canonicalUrl: string;
  newSchema1:string;
  newSchema2:string;
  newSchema3:string;
}

const { title, description, keywords, ogImage, ogUrl, canonicalUrl, newSchema1, newSchema2, newSchema3 } = Astro.props;
console.log('Astro.props', newSchema1, newSchema2, newSchema3)
---

<!DOCTYPE html>
<html lang="en">
	<head>
    <!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-M4948JYT6C"></script>
<script is:inline>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-M4948JYT6C');
</script>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width" />
		<link rel="icon" type="image/svg+xml" href="/assets/akademy-logo.png" />
    <meta name="google-site-verification" content="ULrPGBKj6_niSC1FkjuvDdM985OysHCWlzhTAKwra68" />
		<meta name="generator" content={Astro.generator} />
		<title>{title}</title>
    <meta name="title" content={title} />
    <meta name="description" content={description} />
    <meta name="keywords" content={keywords} />
    <link rel="canonical" href={canonicalUrl} />

     <meta property="og:title" content={title}>
    <meta property="og:description" content={description}>
    <meta property="og:image" content={ogImage}>
    <meta property="og:url" content={ogUrl}>
    <meta property="og:type" content="website">
    <script is:inline  type="application/ld+json" set:html={newSchema1}/>
    <script is:inline type="application/ld+json" set:html={newSchema2}/>
    <script is:inline type="application/ld+json" set:html={newSchema3}/>
    <!-- {newSchema1 && (
      <script is:inline  type="application/ld+json" set:html={newSchema1}/>
    )}
    {newSchema2 && (
      // <script type="application/ld+json" dangerouslySetInnerHTML={{__html: newSchema2, }}/>
      <script is:inline type="application/ld+json" set:html={newSchema2}/>
    )}
    {newSchema3 && (
      <script is:inline type="application/ld+json" set:html={newSchema3}/>
    )} -->
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
    />
	</head>
	<body>
		<slot />
	</body>
</html>
<style is:global>
	/* :root {
		--accent: 124, 58, 237;
		--accent-gradient: linear-gradient(45deg, rgb(var(--accent)), #da62c4 30%, white 60%);
	}
	html {
		font-family: system-ui, sans-serif;
		background-color: #F6F6F6;
	}
	code {
		font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
			Bitstream Vera Sans Mono, Courier New, monospace;
	} */
	.btn {
		margin: 1rem 0rem;
		color: white;
		border-radius: 6px;
		font-weight: 500;
	}

	@font-face {
  font-family: Inter;
  src: url(/src/assets/Inter.ttf);
}

h1,h2,h3,h4,h5,h6 {
  margin:0;
}

#root {
  padding: 0;
  margin: 0;

  text-align: left;
}

:root {
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  font-weight: 300;

  color-scheme: light dark;
  color: #242424;
  background-color: white;

  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;

  /* padding: 0;
	margin: 0; */

  --interakto-coding-color1: #0348a8;
  --interakto-coding-color2: #72b3ff;

  --teenybeans-color1: #565b01;
  --teenybeans-color2: #cbd457;

  --interakto-color1: #048365;
  --interakto-color2: #81d1bf;

  --toddlers-color1: #db6691;
  --toddlers-color2: #ffd2e4;
  --toddlers-color3: #8b2349;
  --toddlers-color4: #add8e5;
  --toddlers-color5: #d9f6ff;
  --toddlers-color6: #095f79;

  --subscription-plans-color1: #048365;
  --subscription-plans-color2: #81d1bf;
  --subscription-plans-color3: #125143;
  --subscription-plans-color4: #122948;
  --subscription-plans-color5: #d9e9ff;
  --subscription-plans-color6: #125143;

  --akademy-B2C-color1: #0348a8;
  --akademy-B2C-color2: #72b3ff;
  --akademy-B2C-color3: #053a77;

  --akademy-B2B-color1: #4f12d8;
  --akademy-B2B-color2: #cad2ff;
  --akademy-B2B-color3: #1f0063;
  --akademy-B2B-color4: #8f60ff;
  --akademy-B2B-color5: #cbd4ff;

  --akademy-pricing-color1: #0348a8;
  --akademy-pricing-color2: #0348a8;
  --akademy-pricing-color3: #0348a8;
  --akademy-pricing-color4: black;
  --akademy-pricing-color5: #122948;
}

body,
p,
h1,
h2 {
  margin: 0;
}

h1 {
  font-size: 2rem;
  font-weight: 600;
}

h2 {
  font-size: 1.7rem;
  font-weight: 600;
}

section {
  width: 100vw;
}

button {
  font-family: Inter;
  padding: 0.5rem 1rem;
  background-color: transparent;
  border-color: transparent;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 500;
}

small {
  font-size: 15px;
  font-weight: 300;
}

@media (max-width: 900px) {
  h1 {
    font-size: 1.4rem;
  }
  h2 {
    font-size: 1.3rem;
    font-weight: 600;
  }
}


</style>
