/*
Theme Name: SEC IFP
Theme URI: https://sectechnology.co.th
Author: SEC Technology Co., Ltd.
Author URI: https://sectechnology.co.th
Description: ธีม WordPress สำหรับเว็บขายจอ Interactive Display / Interactive Flat Panel (IFP) รองรับ WooCommerce โทนน้ำเงิน-เทา-ขาว สว่างสะอาด รองรับมือถือสมบูรณ์
Version: 1.5.4
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sec-ifp
WC requires at least: 7.0
WC tested up to: 9.9
*/

/* ============================================================
   CSS VARIABLES — แก้สีที่นี่ที่เดียว เปลี่ยนทั้งเว็บ
   ============================================================ */
:root{
  --color-primary:#1B5FD9;        /* ปุ่ม / ลิงก์ / หัวข้อเน้น */
  --color-primary-dark:#103F97;   /* hover / gradient / hero */
  --color-primary-soft:#E8F0FE;   /* พื้นอ่อน badge / hover */
  --color-ink:#1A2233;            /* ข้อความหลัก */
  --color-ink-muted:#5B6472;      /* ข้อความรอง */
  --color-surface:#FFFFFF;        /* พื้นขาว */
  --color-surface-alt:#F4F7FB;    /* พื้น section สลับ (เทาอ่อนมาก) */
  --color-border:#E2E8F0;         /* เส้นขอบ */
  --color-line:#06C755;           /* ปุ่ม LINE */

  --font-base:"IBM Plex Sans Thai","Prompt","Sarabun",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  --container:1200px;
  --radius:14px;
  --radius-sm:10px;
  --radius-pill:999px;
  --shadow-sm:0 1px 3px rgba(16,30,54,.06),0 1px 2px rgba(16,30,54,.04);
  --shadow-md:0 8px 24px rgba(16,30,54,.08);
  --shadow-lg:0 18px 44px rgba(16,30,54,.12);
  --header-h:72px;
  --transition:.2s ease;
}

/* ============================================================
   BASE RESET
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-h) + 16px);
  /* ⚠️ clip ไม่ใช่ hidden — hidden จะทำให้ sticky header พัง */
  overflow-x:clip;
}
body{
  margin:0;
  overflow-x:clip;
  font-family:var(--font-base);
  font-size:16px;
  line-height:1.7;
  color:var(--color-ink);
  background:var(--color-surface);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--color-primary);text-decoration:none;transition:color var(--transition)}
a:hover{color:var(--color-primary-dark)}
h1,h2,h3,h4,h5,h6{color:var(--color-ink);line-height:1.3;margin:0 0 .6em;font-weight:700}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:1.3em}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px;border-radius:4px}
svg{flex-shrink:0}

/* skip link (a11y) */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:1000;
  background:var(--color-primary);color:#fff;padding:12px 20px;border-radius:0 0 var(--radius-sm) 0
}
.skip-link:focus{left:0;color:#fff}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}