/*
Theme Name: Flapjacks Restaurant
Theme URI: https://flapjacksrestaurant.ca
Author: Abstract Marketing
Author URI: https://abstractmarketing.ca
Description: Developed for Flapjacks Restaurant in Chatham-Kent
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 8.0
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: flapjacks-restaurant
Tags: full-site-editing
*/

/* Core styles
---------------------------------------------------------------------------- */

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

html {
	scroll-behavior: smooth;
}

b,
strong {
	font-weight: var(--wp--custom--font-weight--semi-bold);
}

ol,
ul {
	padding: 0;
}

ol:where(:not([class*="wp-block"])),
ol:where(.wp-block-list),
ul:where(:not([class*="wp-block"])),
ul:where(.wp-block-list) {
	padding-inline-start: var(--wp--preset--spacing--medium);
}

div[class*="wp-block-"] figcaption {
	color: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--x-small);
	margin-bottom: 0;
	margin-top: 20px;
	text-align: center;
}

img,
figure {
	max-width: 100%;
	height: auto;
}

/* Temporary fix for text-decoration-thickness in Firefox */
@-moz-document url-prefix() {
	a {
		text-decoration-thickness: .1rem !important;
	}
}

/* Form styles
---------------------------------------------------------------------------- */


input,
button,
textarea,
select {
	font: inherit;
}

input[type="button"],
input[type="email"],
input[type="search"],
input[type="submit"],
input[type="text"],
textarea {
	-webkit-appearance: none;
	appearance: none;
}

input:not([type="submit"]),
select,
textarea,
.wp-block-post-comments-form input:not([type="submit"]):not([type="checkbox"]),
.wp-block-post-comments-form textarea {
	color: var(--wp--preset--color--contrast);
	border-radius: 0;
	border: solid 1px #e0e1e1;
	padding: .25em .5em;
	font-size: var(--wp--preset--font-size--small);
	background-color: #fcfcfc;
	width: 100%;
}

textarea {
	height: 140px;
}

input:not([type="submit"]):focus,
select:focus,
textarea:focus,
.wp-block-post-comments-form input:not([type="submit"]):not([type="checkbox"]):focus,
.wp-block-post-comments-form textarea:focus {
	background: #fff;
}

input:focus-visible,
textarea:focus-visible {
	outline-color: var(--wp--preset--color--primary);
}

input[type="checkbox"],
input[type="image"],
input[type="radio"] {
	width: auto;
}

label {
	width: 100%;
	display: block;
	font-size: var(--wp--preset--font-size--x-small);
}

::placeholder {
	color: var(--wp--preset--color--secondary);
	font-size: var(--wp--preset--font-size--small);
	opacity: 0.75;
}

input[type="submit"],
input[type="reset"],
button {
	background-color: var(--wp--preset--color--primary);
	color: #fff;
	padding: .6em 1.1em;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--x-small);
	border: none;
	border-radius: 5px;
	cursor: pointer;
}

.wpcf7-form {
  display: grid;
  gap: 24px;
}

@media (min-width: 580px) {
  .wpcf7-form {
    grid-template-columns: 1fr 1fr;
  }
}

.wpcf7-form p {
  margin: 0;
}

.wpcf7-form p:has([name="your-name"]),
.wpcf7-form p:has([name="your-message"]),
.wpcf7-response-output {
  grid-column: 1 / -1;
}



/* Site styles
---------------------------------------------------------------------------- */

.site-header {
  position: sticky;
  top: 0;
  z-index: 1;
}

.is-menu-open ul.wp-block-navigation {
  align-items: end !important;
}

.is-menu-open .wp-block-navigation-item:has(.wp-block-site-logo) {
  order: -1;
}

@media (max-width: 991px) {
  .site-header__main {
    display: flex;
    justify-content: space-between !important;
  }
 
  .mobile-logo {
    flex-grow: 1;
  }
}

@media (min-width: 992px) {
  .mobile-logo {
    display: none;
  }
  
  .mobile-logo + * {
    margin-top: 0;
  }
}

.site-header {
  transition: margin-bottom .2s ease;
  margin-bottom: 0;
}

.is-compact {
  margin-bottom: 32px;
}

.desktop-logo img {
  transition: all .2s ease;
  height: 62px;
  object-fit: contain;
}

.is-compact .desktop-logo img {
  height: 30px;
}

.current_menu_item {
  color: var(--wp--preset--color--primary);
  text-decoration: underline currentColor 3px;
}