/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE. ***************/


@media only screen and (max-width: 48em) {
  /*************** ADD MOBILE ONLY CSS HERE ***************/
}


/* ===============================
   Fasicare — Kanit Font (Weight 100–700)
   =============================== */

/* Thin (100) */
@font-face {
  font-family: 'Kanit';
  src: url('/wp-content/uploads/fonts/Kanit/Kanit-Thin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

/* ExtraLight (200) */
@font-face {
  font-family: 'Kanit';
  src: url('/wp-content/uploads/fonts/Kanit/Kanit-ExtraLight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

/* Light (300) */
@font-face {
  font-family: 'Kanit';
  src: url('/wp-content/uploads/fonts/Kanit/Kanit-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Regular (400) */
@font-face {
  font-family: 'Kanit';
  src: url('/wp-content/uploads/fonts/Kanit/Kanit-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Medium (500) */
@font-face {
  font-family: 'Kanit';
  src: url('/wp-content/uploads/fonts/Kanit/Kanit-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* SemiBold (600) */
@font-face {
  font-family: 'Kanit';
  src: url('/wp-content/uploads/fonts/Kanit/Kanit-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* Bold (700) */
@font-face {
  font-family: 'Kanit';
  src: url('/wp-content/uploads/fonts/Kanit/Kanit-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}


/* ตั้งตัวแปรฟอนต์หลัก */
:root {
  --fsc-font: 'Kanit', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --fsc-color-teal: #0FA89E;
  --fsc-color-text: #374151;
  --fsc-bg-light: #f9fafb;
  --fsc-bg-accent: #f0fdf4;
}


/* ใช้ทั่วเว็บไซต์ */
html, body {
  font-family: var(--fsc-font) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ครอบคลุมแท็กทั้งหมด */
h1, h2, h3, h4, h5, h6,
p, a, span, small, strong, em, mark, code, pre,
ul, ol, li, dl, dt, dd,
table, th, td, caption,
blockquote, figcaption, address,
label, legend, fieldset,
button, input, select, textarea {
  font-family: var(--fsc-font) !important;
}


/* ===============================
   Typography Weight Settings
   =============================== */

h1, h2, h3 {
  font-weight: 600;
}

strong, b {
  font-weight: 500;
}

p, li, span {
  font-weight: 400;
}


/* ===============================
   Remove Underlines from Links
   =============================== */

a, a:visited,
.header-nav a,
.nav > li > a,
.ux-menu-link__link,
.footer-primary a,
.widget a,
.product-title a {
  text-decoration: none !important;
}

a:hover, a:focus {
  text-decoration: none !important;
}

.ux-menu-link__underline,
.ux-menu-link__underline::after {
  display: none !important;
  content: '' !important;
}

 
.header-nav > li > a,
.nav > li > a,
.ux-menu > li > a,
.ux-menu .ux-menu-link__link {
  font-weight: 400 !important; 
  font-size: 17px !important; 
  letter-spacing: 0.3px;
  text-transform: none;
  padding: 10px 16px;
}


.header-nav .nav > li:hover > a,
.header-nav .ux-menu li:hover > a,
.header-nav .nav > li.current-menu-item > a,
.header-nav .nav > li.current-menu-ancestor > a {
  font-weight: 500 !important; 
  font-size: 17px !important;
  background-color: var(--fsc-color-teal) !important;
  color: #ffffff !important;
}


/* ===============================
   Dropdown Menu
   =============================== */

.nav-dropdown li a,
.ux-menu .sub-menu a {
  font-weight: 400 !important;
  font-size: 16px !important;
  letter-spacing: 0.2px;
}


/* ===============================
   Tabs / Filters
   =============================== */

.fasicare-tabs .nav > li > a,
.ux-filter .nav > li > a {
  color: var(--fsc-color-teal);
  background: #fff;
  border: 1px solid var(--fsc-color-teal);
  border-radius: 9999px;
  padding: 6px 16px;
  transition: 0.2s ease;
}

.fasicare-tabs .nav > li > a:hover,
.ux-filter .nav > li > a:hover {
  background: var(--fsc-bg-accent) !important;
  color: var(--fsc-color-teal) !important;
  border-color: var(--fsc-color-teal) !important;
  opacity: 1 !important;
}

.fasicare-tabs .nav > li.active > a,
.fasicare-tabs .nav > li.current-cat > a,
.ux-filter .nav > li.active > a,
.ux-filter .nav > li.current-cat > a {
  background: var(--fsc-color-teal) !important;
  color: #fff !important;
  border-color: var(--fsc-color-teal) !important;
}


/* ===============================
   Responsive — Mobile MENU
   =============================== */

@media only screen and (max-width: 48em) {
  .mobile-nav li a {
    font-weight: 500 !important;   /* ตัวบาง */
    font-size: 16px !important;    /* ใหญ่ */
  }
}