/*
Theme Name: Flux
Theme URI:
Author: Kings Digital
Author URI: https://www.kingsdigital.com.au/
Description: Flux is a minimalist, versatile and adaptable theme designed to be applicable to any website. It contains a collection of templates and patterns tailor to different needs and to speed up site building process. It is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4. It also contains custom code designed to improve site performance and speed.
Requires at least: 6.0
Tested up to: 6.4.3
Requires PHP: 5.7
Version: 1.1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: flux
Tags: blog, news, portfolio, one-column, wide-blocks, accessibility-ready, block-patterns, block-styles, custom-colors, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, rtl-language-support, sticky-post, style-variations, threaded-comments, translation-ready
*/

/* CSS Reset
---------------------------------------------------------------------------- */
html {
  scroll-behavior: smooth;
}
*,
*::before,
*::after {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

b,
strong {
  font-weight: 600;
}

/* Standardize form styling
--------------------------------------------- */

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

:where(:focus-visible, :focus) {
  outline-style: dotted;
  outline-width: 1px;
  outline-offset: 3px;
  outline-color: var(--wp--custom--color--ring);
}

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

input:not([type="submit"]),
select,
textarea {
  color: var(--wp--preset--color--text);
  border-radius: 5px;
  border: 1px solid var(--wp--custom--color--border);
  overflow: hidden;
  width: 100%;
  background-color: var(--wp--preset--color--gray-50);
}

input:not([type="submit"]),
textarea {
  font-size: var(--wp--preset--font-size--small);
}

input:not([type="submit"]),
select:not([multiple]),
select[multiple] option,
textarea {
  padding: 0.5em;
}

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

li:has(input:is([type="checkbox"], [type="radio"])) {
  display: grid;
  grid-template-columns: 1em auto;
  gap: 0.5em;
}

.list-checkbox-wrap .nf-field-element li input,
.list-image-wrap .nf-field-element li input,
.list-radio-wrap .nf-field-element li input {
  margin: 0;
}

.list-checkbox-wrap .nf-field-element li label,
.list-image-wrap .nf-field-element li label,
.list-radio-wrap .nf-field-element li label {
  margin-inline-start: 0.5em;
}

label {
  width: 100%;
  display: block;
}

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

/* Helper styles that can't be done via theme.json
---------------------------------------------------------------------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: pretty;
}

/* Ninja Forms styles
---------------------------------------------------------------------------- */
.nf-form-fields-required {
  display: none;
}

.nf-after-field,
.nf-field-description {
  font-size: var(--wp--preset--font-size--small);
}

/* buttons */
input[type="submit"],
.nf-field-element :is(button) {
  background-color: var(--wp--custom--button--primary-background);
  color: var(--wp--custom--button--primary-text);
  border-radius: var(--wp--custom--button--border-radius);
  padding-block: 0.33rem;
  padding-inline: 1rem;
  cursor: pointer;
  box-shadow: none;
  outline: none;
  border: none;
}

.nf-error-msg,
.ninja-forms-req-symbol {
  color: var(--wp--preset--color--status-error);
}

.nf-error.listimage-wrap .nf-field-element ul,
.nf-error .ninja-forms-field {
  border-color: var(--wp--preset--color--status-error);
}

/* Utility classes
---------------------------------------------------------------------------- */
.truncate {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Global block styles
---------------------------------------------------------------------------- */

html {
  scroll-padding-top: calc(var(--wp-admin--admin-bar--height, 0px) + 4rem);
}

@font-face {
  font-family: "seoulnamsan-cl";
  src:
    url("/wp-content/themes/flux/assets/fonts/seoul-namsan-cl/71SeoulNamsan-CL.woff2")
      format("woff2"),
    url("/wp-content/themes/flux/assets/fonts/seoul-namsan-cl/71SeoulNamsan-CL.woff/")
      format("woff");
  font-display: auto;
}

* {
  font-family: "seoulnamsan-cl", sans-serif !important;
}

/* post-title link styles */
.wp-block-post-template li {
  position: relative;
}
.wp-block-post-title a {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
}
.wp-block-post-title a:hover {
  text-decoration: none;
}
.wp-block-post-template li img {
  transition: transform 300ms ease-in-out;
}
.wp-block-post-template li:hover img {
  transform: scale(1.01);
  transition: transform 300ms ease-in-out;
}
.wp-block-post-title a::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg stroke='currentColor' fill='currentColor' stroke-width='0' viewBox='0 0 512 512' height='1em' width='1em' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M295.6 163.7c-5.1 5-5.1 13.3-.1 18.4l60.8 60.9H124.9c-7.1 0-12.9 5.8-12.9 13s5.8 13 12.9 13h231.3l-60.8 60.9c-5 5.1-4.9 13.3.1 18.4 5.1 5 13.2 5 18.3-.1l82.4-83c1.1-1.2 2-2.5 2.7-4.1.7-1.6 1-3.3 1-5 0-3.4-1.3-6.6-3.7-9.1l-82.4-83c-4.9-5.2-13.1-5.3-18.2-.3z'%3E%3C/path%3E%3C/svg%3E");
  display: inline-block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100%;
  transition: all 300ms ease-in-out;
}
.wp-block-post-title a:hover::after {
  background-position: 3px center;
  transition: all 300ms ease-in-out;
}
.wp-block-post-title a:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.has-white-color.has-text-color {
  color: var(--wp--preset--color--white) !important;
}

/* editor styles for acf */
.block-editor-block-list__block ul.acf-radio-list li,
.block-editor-block-list__block ul.acf-checkbox-list li {
  display: flex;
  align-items: center;
  gap: 0.5em;
}
.homepage-hero-logo img {
  max-height: 50vh;
  width: auto;
  margin: 0 auto;
  display: block;
}
.homepage-hero .wp-block-cover {
  max-height: 100vh;
}