/*
Theme Name: Molten
Author: Paul Truong
Author URI: https://www.paultruong.dev/
Description: A theme for passionate chefs and restauranteurs.
Requires at least: 5.9
Tested up to: 5.9
Requires PHP: 5.6
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: molten
Tags: food-and-drink, one-column, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, block-styles

Molten WordPress Theme, (C) 2022 Paul Truong

Molten is a derivative work of the code from the
Twenty Twenty-Two WordPress Theme, which is licensed GPLv2.

*/

/*
 * Alignment styles.
 * These rules are temporary, and should not be relied on or
 * modified too heavily by themes or plugins that build on
 * Twenty Twenty-Two. These are meant to be a precursor to
 * a global solution provided by the Block Editor.
 *
 * Relevant issues:
 * https://github.com/WordPress/gutenberg/issues/35607
 * https://github.com/WordPress/gutenberg/issues/35884
 */

.wp-site-blocks,
body > .is-root-container,
.edit-post-visual-editor__post-title-wrapper,
.wp-block-group.alignfull,
.wp-block-group.has-background,
.is-root-container .wp-block[data-align="full"] > .wp-block-group,
.is-root-container .wp-block[data-align="full"] > .wp-block-cover {
  padding-left: var(--wp--custom--spacing--outer);
  padding-right: var(--wp--custom--spacing--outer);
}

.wp-site-blocks .alignfull,
.wp-site-blocks > .wp-block-group.has-background,
.wp-site-blocks > .wp-block-cover,
.wp-site-blocks > .wp-block-template-part > .wp-block-group.has-background,
.wp-site-blocks > .wp-block-template-part > .wp-block-cover,
body > .is-root-container > .wp-block-cover,
body
  > .is-root-container
  > .wp-block-template-part
  > .wp-block-group.has-background,
body > .is-root-container > .wp-block-template-part > .wp-block-cover,
.is-root-container .wp-block[data-align="full"] {
  margin-left: calc(-1 * var(--wp--custom--spacing--outer)) !important;
  margin-right: calc(-1 * var(--wp--custom--spacing--outer)) !important;
  width: unset;
}

/* Blocks inside columns don't have negative margins. */
.wp-site-blocks .wp-block-columns .wp-block-column .alignfull,
 .is-root-container .wp-block-columns .wp-block-column .wp-block[data-align="full"],
 /* We also want to avoid stacking negative margins. */
 .wp-site-blocks .alignfull:not(.wp-block-group) .alignfull,
 .is-root-container .wp-block[data-align="full"] > *:not(.wp-block-group) .wp-block[data-align="full"] {
  margin-left: auto !important;
  margin-right: auto !important;
  width: inherit;
}

.wp-site-blocks > main {
  margin-block-start: 0;
}

h3 + p {
  --wp--style--block-gap: 1rem;
}

p + h2 {
  --wp--style--block-gap: 3rem;
}

a {
  text-decoration-thickness: 2px;
  transition: background-color 200ms ease-out;
}

a:hover {
  background-color: var(--wp--preset--color--foreground);
  color: var(--wp--preset--color--background);
}

.wp-block-site-title a:hover,
.custom-logo-link:hover,
nav a:hover {
  color: var(--wp--preset--color--foreground);
  background-color: unset;
}

.wp-social-link a:hover {
  background-color: unset;
}

.wp-block-navigation .wp-block-navigation-item a:hover,
.wp-block-navigation .wp-block-navigation-item a:focus {
  text-decoration: underline;
  text-decoration-style: solid;
}

/*
 * Button hover styles.
 * Necessary until the following issue is resolved in Gutenberg:
 * https://github.com/WordPress/gutenberg/issues/27075
 */

.wp-block-search__button:hover,
.wp-block-file .wp-block-file__button:hover,
.wp-block-button__link:hover {
  color: var(--wp--preset--color--foreground);
  background-color: var(--wp--preset--color--background);
  opacity: 0.9;
}

/*
 * Media Text block styles
 */

.wp-block-media-text .wp-block-media-text__content {
  padding: 0;
  padding-left: 8%;
}

.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
  padding-left: 0;
  padding-right: 8%;
}

.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
  padding-top: 8%;
}

@media (max-width: 600px) {
  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
    padding-left: 0;
  }
}

.wp-block-separator.is-style-default {
  max-width: 60px;
}

/* Theme specific styles */
.mobile-order-0 {
  order: 0;
}

.mobile-order-1 {
  order: 1;
}

.mobile-order-2 {
  order: 2;
}

@media (min-width: 782px) {
  .mobile-order-0,
  .mobile-order-1,
  .mobile-order-2 {
    order: 0;
  }
}