/* ============================================================
   ICONPHUKET — ธีมสี "creative-spirits" (Edit New Color Option 1)
   โหลดต่อท้าย assets/green-theme/css/green-theme.css (ดู partials/head.php)
   ไฟล์นี้เปลี่ยน "สี" อย่างเดียว — layout / font / ขนาด ใช้ของ green-theme.css ทั้งหมด

   เปิดดู:   <เว็บ>/th?theme=creative-spirits     กลับค่าเดิม: ?theme=reset
   ใช้จริง:  application/config/config.php  $config['site_theme'] = 'creative-spirits';
   ภาพเฉพาะธีม (เช่นโลโก้ footer): วางชื่อไฟล์เดียวกันใน assets/creative-spirits/images/
                                  ไม่มีไฟล์ = ใช้ของ green-theme อัตโนมัติ

   ชุดสี (ผู้ใช้ส่งมา 2 ต.ค. 2026 — Fix_02102026-2/creative-spirits_theme.png)
     Green     nature      #499462
     Blue      ocean       #009ABF
     Pink      creativity  #E81F76
     Rose Gold prosperity  #F3CFB2  -> พื้น section เนื้อหาใช้ระดับ 20% = #FCF4EE (ค่าตาม pptx 2 oct Night)

   การจัดสีแต่ละหน้า ตาม Fix_02102026-2/Website - 2 oct - Night .pptx
     Home (+ หน้าที่ไม่ได้ระบุ) = Pink : เมนู, พื้น section concept (ตัวอักษรขาว), ป้ายหัว section, footer
                                         รวมส่วนข่าว (NEWS) ทั้งหมด — หัวข้อข่าว, หัวข้อรอง, อ่านเพิ่มเติม
                                         (3 ต.ค. ผู้ใช้สั่งเปลี่ยนจากเขียว Nature เป็นชมพู)
     Project Details            = Blue : เมนู, ข้อความ, footer
     Contact                    = Green: เมนู, ข้อความ (รวมหัวข้อ Office Address), footer
     News Detail                = Green: ข้อความ, footer
   ใช้ <body data-page="..."> ที่ partials/header.php ตั้งให้ (ค่า = $page ใน Site.php, หน้าแรก = home)
   ตัวแปร --ip-green = "สีหลักของหน้า/ส่วนนั้น" (ชื่อเดิมจากธีม green) / -dark = สีหลักเข้มขึ้น 20% (hover)
   ============================================================ */

:root {
   /* ชุดสีของธีม (ใช้อ้างอิงใน rule ด้านล่าง) */
   --cs-nature: #499462;
   --cs-nature-dark: #3A764E;
   --cs-ocean: #009ABF;
   --cs-ocean-dark: #007B99;
   --cs-creativity: #E81F76;
   --cs-creativity-dark: #BA195E;
   --cs-prosperity-20: #FCF4EE;

   --ip-green: var(--cs-creativity);       /* Home + หน้าที่ไม่ได้ระบุ */
   --ip-green-dark: var(--cs-creativity-dark);
   --ip-gray: #58595B;                     /* ตัวอักษรเนื้อหา (เทาเดิม ตรงกับ Body Text ในแบบ) */
   --ip-cream: var(--cs-prosperity-20);    /* พื้นส่วน NEWS หน้า Home + เนื้อหา Project Details */
   --ip-white: #FFFFFF;
   --ip-vdo-bg: #74103B;                   /* พื้นกรอบ thumbnail VDO ระหว่างรอภาพโหลด */
   --ip-btn-hover: #434446;                /* hover ปุ่มส่งฟอร์ม Contact */
   --ip-black: #000;
   --ip-ci: var(--cs-creativity-dark);     /* เส้นบน/กลางของเมนูแฮมเบอร์เกอร์ */
}

/* Project Details = Blue ocean */
body[data-page="project-details"] {
   --ip-green: var(--cs-ocean);
   --ip-green-dark: var(--cs-ocean-dark);
   --ip-ci: var(--cs-ocean-dark);
   --ip-vdo-bg: #004D60;
}

/* News Detail + Contact = Green nature */
body[data-page="news-detail"],
body[data-page="contact"] {
   --ip-green: var(--cs-nature);
   --ip-green-dark: var(--cs-nature-dark);
   --ip-ci: var(--cs-nature-dark);
   --ip-vdo-bg: #254A31;
}

/* Home ส่วน NEWS: ไม่มี rule พิเศษแล้ว ใช้สีชมพูของหน้า Home ทั้งหมด
   (3 ต.ค. เดิมตั้งข้อความข่าวเป็นเขียว Nature ตาม pptx slide 1 — ผู้ใช้ให้เปลี่ยนเป็นชมพู) */

/* Contact: หัวข้อ "Office Address" เป็นสีหลักของหน้า (pptx slide 3 "ตรงข้อความต่างปรับเป็นสีเขียว") */
body[data-page="contact"] .contact-address h4 { color: var(--ip-green); }