/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

@import url("https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700&display=swap");

/* Add your custom styles here */

/* Chaty */
.chaty-channel .chaty-tooltip:after {
  display: block !important;
  opacity: 1 !important;
}

/* ==========================================================================
   GRAVITY FORMS
   ========================================================================== */

/* Form wrapper — background and rounded corners */
.gform_wrapper {
  max-width: 1200px; /* Adjust this value to control the form's width */
  margin-left: auto;
  margin-right: auto;
  background-color: #eedcc0 !important;
  border-radius: 40px !important;
  padding: 40px !important;

  /* Overwrite Gravity Forms vertical field gap */
  --gf-field-gap-y: 30px !important; /* Adjust this value to your liking */
}

/* Hide form title */
.gform_wrapper .gform_title {
  display: none !important;
}

/* Field labels */
.gform_wrapper .gfield_label {
  font-family: "FuturaBook", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}

/* Required label asterisk */
.gform_wrapper .gfield_required {
  color: #603813 !important;
}

/* Input fields, textareas, selects */
.gform_wrapper input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.gform_wrapper textarea,
.gform_wrapper select {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  letter-spacing: 0.5px !important;
  margin-bottom: -20px !important;
  border: none !important;
  border-radius: 50px !important;
  transition: none !important;
}

/* Placeholder text */
.gform_wrapper input::placeholder,
.gform_wrapper textarea::placeholder {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
}

/* Remove focus outline/border */
.gform_wrapper input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* Checkbox and radio labels */
.gform_wrapper .gfield_checkbox label,
.gform_wrapper .gfield_radio label {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  letter-spacing: 0.5px !important;
}

/* Checkbox — remove border, rounded corners, brown accent */
.gform_wrapper .gfield_checkbox input[type="checkbox"],
.gform_wrapper input[type="checkbox"] {
  border: none !important;
  border-radius: 8px !important;
  outline: none !important;
  box-shadow: none !important;
  accent-color: #603813 !important;
  --gf-ctrl-choice-check-color: #603813 !important;
}

/* Field description / sublabel */
.gform_wrapper .gfield_description,
.gform_wrapper .gform_sublabel {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  letter-spacing: 0.5px !important;
}

#gfield_description_2_6 {
  margin-top: 35px;
}

/* Validation messages */
.gform_wrapper .gfield_validation_message,
.gform_wrapper .validation_message {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
}

/* Submit button — match site button style */
.gform_wrapper .gform_footer,
.gform_wrapper .gform_page_footer {
  display: flex !important;
  justify-content: center !important;
}

.gform_wrapper input[type="submit"],
.gform_wrapper button[type="submit"] {
  display: inline-block !important;
  background-color: #015ca8 !important;
  font-family: "FuturaBook", serif !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  color: #ffffff !important;
  border: 2px solid #015ca8 !important;
  border-radius: 80px 80px 80px 80px !important;
  padding: 15px 100px !important;
  transition:
    background-color 0.3s ease,
    color 0.3s ease !important;
  cursor: pointer !important;
  margin-top: 10px !important;
}

.gform_wrapper input[type="submit"]:hover,
.gform_wrapper button[type="submit"]:hover {
  background-color: transparent !important;
  color: #015ca8 !important;
}

#input_2_8 {
  width: 150% !important;
}

/* Mobile adjustment for Gravity Forms */
@media only screen and (max-width: 768px) {
  .gform_wrapper {
    padding: 20px !important;
  }
}

/* ==========================================================================
   ROTATING TEXT ON THE CIRCLE
   ========================================================================== */

/* main container */
.logo-spinning-wrapper {
  position: relative;
  width: 180px; /* overall size, adjusted to leave blank space on the outer part */
  height: 180px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}

/* adjust center image */
.center-logo-box {
  position: absolute;
  width: 90px; /* image size, leaving white space before the text */
  height: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
  /* Use transform for easy off-centering adjustments, e.g. translate(5px, 10px) */
  transform: translate(0px, 0px);
}

.center-logo-img {
  width: 100%;
  height: auto;
  display: block;
}

/* rotating text */
.circular-text-box {
  position: absolute;
  width: 160px; /* text circle diameter, smaller than wrapper to leave outer space */
  height: 160px;
  z-index: 2;
  animation: rotateTextAnimation 15s linear infinite;
}

/* text style */
.text-char {
  position: absolute;
  left: 50%;
  top: 0;
  transform-origin: 50% 80px; /* radius (half of the circular-text-box width) */
  font-family: "FuturaBook", Tahoma, sans-serif; /* fonts */
  font-weight: 600;
  font-size: 14px;
  color: #00a9ce; /*color */
  text-transform: uppercase;
  white-space: nowrap;
}

/* rotate */
@keyframes rotateTextAnimation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* ==========================================================================
   INDIVIDUAL MODULE ADJUSTMENTS
   ========================================================================== */

/* Target ONLY the first module (using the unique #rotatingText ID inside it) */
.logo-spinning-wrapper:has(#rotatingText) .center-logo-box {
  /* Adjust the first value for Horizontal (left/right) movement. 
     For example: translate(5px, 0px) moves it 5px to the right. 
     translate(-5px, 0px) moves it 5px to the left. */
  transform: translate(-2px, 0px);
}

/* Target ONLY the second module (using the #rotatingText2 ID) - just in case! */
.logo-spinning-wrapper:has(#rotatingText2) .center-logo-box {
  transform: translate(0px, 0px);
}

/* ==========================================================================
WPML Mobile Language Switcher   
========================================================================== */
/* Force language items/flags to display horizontally */
.wpml-ls-item {
  display: inline-block !important;
  margin-right: 10px; /* Space between languages */
}

/* For WPML items integrated directly into the main menu */
.wpml-ls-menu-item {
  display: inline-block !important;
}

/* Set the main container to Flexbox layout */
.wpml-ls-statics-shortcode_actions ul,
.wpml-ls-slot-footer ul,
.menu-item-language ul {
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  align-items: center !important; /* Center the switcher; use 'flex-start' for left-align */
  list-style-type: none !important;
  padding: 0 !important;
  width: 100% !important; /* บังคับให้กล่องกว้าง 100% เพื่อให้มีพื้นที่จัดกึ่งกลาง */
  margin: 0 auto !important; /* จัดให้ตัวกล่องเองอยู่กึ่งกลางหน้าจอ */
}

/* Remove bottom borders often found in mobile menus */
.wpml-ls-item {
  border-bottom: none !important;
}

/*  WPML <li> after main menu */
.wpml-ls-menu-item {
  display: inline-flex !important;
  align-self: center !important; /* force center */
}

/* Add padding right only for the Thai language site */
html[lang^="th"] .wpml-ls-menu-item {
  padding-right: 30px !important;
}

/* ==========================================================================
   THAI LANGUAGE FONT (KANIT) OVERRIDE
   ========================================================================== */

html[lang^="th"],
html[lang^="th"] body,
html[lang^="th"] h1,
html[lang^="th"] h2,
html[lang^="th"] h3,
html[lang^="th"] h4,
html[lang^="th"] h5,
html[lang^="th"] h6,
html[lang^="th"] p,
html[lang^="th"] a,
html[lang^="th"] li,
html[lang^="th"] label,
html[lang^="th"] button,
html[lang^="th"] input,
html[lang^="th"] textarea,
html[lang^="th"] div {
  font-family: "Kanit", sans-serif !important;
}