/*
Theme Name: Monash (No-React Quiz)
Theme URI:
Author: Monash Arts team
Author URI:
Description: Classic WordPress theme for the Monash Arts site. The quiz (tutorial + questions + result) is rendered entirely with PHP/WordPress templates and vanilla JS — no React bundle. A clean-room rebuild of the original Monash theme.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 7.4
License: Proprietary
Text Domain: monash
*/

/* Minimal global resets - every per-page CSS file scopes its own variables. */
:root {
	--monash-shell-width: 529px;
	--monash-shell-height: 874px;
	--monash-vh: 100dvh;
	--monash-shell-offset-y: 0px;
	--monash-shell-radius: 24px;
	--monash-shell-bg: #1987c5;
	--monash-shell-page-bg: #ffffff;
		--monash-shell-effective-height: min(
			var(--monash-shell-height),
			calc(100dvh - 32px)
		);
}

:root {
	--secondary-navy: #102f86;
	--secondary-purple: #7463d7;
	--secondary-ruby: #cd2fb0;
	--secondary-maroon: #710044;
	--secondary-red: #ea001f;
	--secondary-orange: #f86700;
	--secondary-yellow: #ffba00;
	--secondary-green: #83a00a;
	--secondary-forest: #0b6554;
	--secondary-brown: #9d6a43;
	--monash-blue: #006dae;
	--monash-blue-500: rgba(0, 108, 174, 0.5);
	--light-blue: #5198c1;
	--grey-3: #e6e6e6;
	--grey-2: #5a5a5a;
	--grey-1: #969696;
	--black: #000;
	--white: #fff;
	--annemarie-pink: #f8dcdc;
	--charcoal: #2c2c2c;
	--arts-advantage-cream: #ffffef;
	--dark-cream-transparent: rgba(233, 233, 207, 0.26);
	--light-red: #fe4447;
	--monash-heritage-blue: #abf5f9;
	--monash-electric-blue: #285aff;
	--monash-blueberry: #121256;
	--success-green: #05eb80;
	--white: #fff;
	--no-red: #ff6868;
	--cream: #ffffef;
	--color: #e077cd;
	--color-2: #ff2326;
	--cream-shade-dark: #ededd3;
	--cream-shade-mid: #f3f4de;
	--card-outline-dark: #d3d3d3;
	--card-outline-mid: #ddd;
	--blue-2: #aed2e7;
	--dark-red: #bb0202;
	--button-light-blue: #5bacdd;

  --font-family: "Roboto", sans-serif;
  --second-family: "Rethink Sans", sans-serif;
  --third-family: "Roboto Flex", sans-serif;
  --font3: "SF Pro", sans-serif;
  --font4: "Albert Sans", sans-serif;
  --font5: "Open Sans", sans-serif;
  --font6: "Public Sans", sans-serif;
  --font7: "Roboto Condensed", sans-serif;
}

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

html,
body {
	margin: 0;
	padding: 0;
	font-family: var(--second-family);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: inherit;
	text-decoration: none;
}

button {
	font: inherit;
	cursor: pointer;
}

/* Hide native scrollbars site-wide. */
* {
	-ms-overflow-style: none;
	scrollbar-width: none;
}

*::-webkit-scrollbar {
	display: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--second-family);
}

main,
main.monash-home-main {
	max-width: 100%;
	width: var(--monash-shell-width);
	margin: 0 auto;
	min-height: 100dvh;
}
.shell{
	
    position: relative;
    width: var(--monash-shell-width);
    margin: 0 auto;
    max-width: 100%;
}
@media (min-width: 1024px) {
	:root {
		--monash-shell-width: 402px;
		--monash-vh: var(--monash-shell-height);
		--monash-shell-effective-height: min(
			var(--monash-shell-height),
			calc(100dvh - 32px)
		);
		--monash-shell-offset-y: max(
			16px,
			calc((100dvh - var(--monash-shell-effective-height)) / 2)
		);
	}

	html,
	body {
		background: var(--monash-shell-bg);
	}

	body,
	body.home {
		min-height: 100dvh;
        max-height: 100dvh;
		height: 100dvh;
		overflow: hidden;
        display: flex;
        align-items: center;
	}

	main,
	main.monash-home-main {
		max-width: var(--monash-shell-width);
		width: var(--monash-shell-width);
		height: var(--monash-shell-effective-height);
		min-height: var(--monash-shell-effective-height);
		margin: 0 auto;
		border-radius: var(--monash-shell-radius);
		border: 1.5px solid rgba(255, 255, 255, 0.85);
		background: var(--monash-shell-page-bg);
		overflow: hidden auto;
		overscroll-behavior: contain;
        position: relative;
		-webkit-overflow-scrolling: touch;
	}

	body main.monash-home-main {
		background: var(--monash-shell-bg);
	}


}