/*
Theme Name: Enfold Child
Description: A <a href='http://codex.wordpress.org/Child_Themes'>Child Theme</a> for the Enfold Wordpress Theme. If you plan to do a lot of file modifications we recommend to use this Theme instead of the original Theme. Updating will be much easier then.
Version: 1.0
Author: Kriesi
Author URI: http://www.kriesi.at
Template: enfold
*/

.theme-custom-class {
	background: white;
}

/*Add your own styles here:*/

/*
 * YOKOTATE — WordPress preview parity stylesheet
 * ---------------------------------------------------------------------------
 * Paste into the Enfold CHILD THEME style.css
 * (be/wp-content/themes/enfold-child/style.css).
 *
 * Purpose: make the WordPress preview of property (物件) / Avia-built pages render
 * with the same typography as the live Vue front-end (yokotate.co.jp).
 *
 * IMPORTANT — why every rule is scoped to #wrap_all:
 * The Vue client hard-links this very file globally (nuxt.config.js:
 *   { rel:"stylesheet", href:".../themes/enfold-child/style.css" }),
 * so it loads on EVERY Vue page, including the home page and forms where the
 * bundled wordpress.scss is not present. Unscoped rules (or !important on bare
 * tags) would therefore restyle the Vue app's OWN header/footer/menus/forms.
 *
 * #wrap_all is the WP-content wrapper that exists in BOTH renders:
 *   - WP preview:  body#top > #wrap_all > #main > .avia-section…
 *   - Vue client:  only inside layouts/wp.vue (WP pages); the Vue chrome sits
 *                  OUTSIDE #wrap_all, and default.vue (home/forms) has no
 *                  #wrap_all at all.
 * Scoping here fixes the preview while guaranteeing zero bleed into the Vue UI.
 *
 * These values are lifted from the live stylesheet (assets/wordpress.scss); the
 * measured deltas vs a stock Enfold render were: font-family, base font-size
 * (16px vs 13px) and body-copy colour (#666 vs #000). Structure/layout already
 * matches and is left untouched.
 * ---------------------------------------------------------------------------
 */

/* 1. Base font-size & line-height (matches the live site's Enfold typography) */
#wrap_all h1 { font-size: 24px; }
#wrap_all h2 { font-size: 20px; }

@media only screen and (min-width: 769px) {
	#wrap_all { font-size: 16px; line-height: 1.65em; }

	#wrap_all h1.main-title { font-size: 26px; }
	#wrap_all h1 { font-size: 34px; }
	#wrap_all h2 { font-size: 28px; }
	#wrap_all h3 { font-size: 22px; }
	#wrap_all h4 { font-size: 20px; }
	#wrap_all h5 { font-size: 18px; }
	#wrap_all h6 { font-size: 16px; }

	#wrap_all .av-inherit-size .av-special-heading-tag { font-size: 1.0em; }
	#wrap_all .avia-button.avia-size-medium  { font-size: 16px; }
	#wrap_all .avia-button.avia-size-large   { font-size: 16px; }
	#wrap_all .avia-button.avia-size-x-large { font-size: 17px; }
	#wrap_all td { font-size: 16px; }
	#wrap_all #footer { font-size: 13px; }
}

/* 2. Japanese font family (all breakpoints).
 * NB: written as a plain expanded selector list, NOT the is() pseudo-class.
 * Enfold's "Merge CSS files" and XPageSpeed both run older CSS minifiers that
 * drop rules using that pseudo-class, which silently killed this rule. Plain
 * selectors survive both.
 * !important overrides Enfold's default Helvetica stack. Inline serif on the
 * decorative 〚〛 headings still wins (inline !important), so those stay serif. */
#wrap_all,
#wrap_all span, #wrap_all applet, #wrap_all object, #wrap_all iframe,
#wrap_all h3, #wrap_all h4, #wrap_all h5, #wrap_all h6,
#wrap_all p, #wrap_all blockquote, #wrap_all pre, #wrap_all a, #wrap_all abbr,
#wrap_all acronym, #wrap_all address, #wrap_all big, #wrap_all cite, #wrap_all code,
#wrap_all del, #wrap_all dfn, #wrap_all em, #wrap_all img, #wrap_all ins, #wrap_all kbd,
#wrap_all q, #wrap_all s, #wrap_all samp, #wrap_all small, #wrap_all strike,
#wrap_all strong, #wrap_all sub, #wrap_all sup, #wrap_all tt, #wrap_all var,
#wrap_all b, #wrap_all u, #wrap_all i, #wrap_all center, #wrap_all dl, #wrap_all dt,
#wrap_all dd, #wrap_all ol, #wrap_all ul, #wrap_all li, #wrap_all fieldset,
#wrap_all form, #wrap_all label, #wrap_all legend, #wrap_all table, #wrap_all caption,
#wrap_all tbody, #wrap_all tfoot, #wrap_all thead, #wrap_all tr, #wrap_all th,
#wrap_all td, #wrap_all article, #wrap_all aside, #wrap_all canvas, #wrap_all details,
#wrap_all embed, #wrap_all figure, #wrap_all figcaption, #wrap_all footer,
#wrap_all header, #wrap_all hgroup, #wrap_all menu, #wrap_all nav, #wrap_all output,
#wrap_all ruby, #wrap_all section, #wrap_all summary, #wrap_all time, #wrap_all mark,
#wrap_all audio, #wrap_all video {
	font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
	font-weight: 400 !important;
}

#wrap_all h1, #wrap_all h2 { font-weight: 400 !important; }

/* Mincho helper used by some decorative content blocks */
#wrap_all .minchotai,
#wrap_all .minchotai * {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif !important;
	font-weight: 900 !important;
}

/* 3. Base body-copy colour (#666) for main-content sections */
#wrap_all .main_color { color: #666666; }