/* ============================================================
 *  MuTeDoo / MiKo · theme.css — ธีมสว่างกลาง (ใส่ได้ทุกหน้า)
 *  วิธีใช้: <link rel="stylesheet" href="/theme.css"> + <script src="/theme.js">
 *  flip ตัวแปรร่วม (--night/--gold/--cream/--pink) → พื้นหลัง+ตัวอักษร+การ์ดสลับตามธีม
 * ============================================================ */
[data-theme="light"]{
  /* ตัวแปรพื้นหลังมืด (แต่ละหน้าใช้ชื่อต่างกัน) → พลิกเป็นสว่างทั้งหมด
     ใส่ !important เพื่อชนะ :root ที่หน้าประกาศเอง (กันกรณี theme.css โหลดก่อน <style>) */
  --night:#FFF7EE !important; --night-2:#FFF0E2 !important; --night-3:#FFFFFF !important;
  --wine:#FFF7EE !important;  --wine-2:#FFF0E2 !important;  --wine-3:#FFFFFF !important;
  --navy:#FFF7EE !important;  --navy-2:#FFF0E2 !important;  --navy-3:#FFFFFF !important;
  --cream-2:#FFF0E2 !important;
  /* ตัวอักษร → เข้ม · ทอง → เข้มขึ้นให้อ่านออกบนพื้นสว่าง */
  --gold:    #A67722 !important;  --gold-lt: #8A5E14 !important;  --gold-deep: #6E4A10 !important;
  --cream:   #3A2A22 !important;  --cream-soft: #7A6252 !important;
  --pink:    #C85A8E !important;  --pink-lt: #F8DEE7 !important;  --rose: #B85878 !important;
}
/* พื้นหลังสว่างสะอาด (override radial สีเข้มที่ hardcode ในแต่ละหน้า) */
[data-theme="light"] body{
  background:
    radial-gradient(60% 40% at 16% 6%, rgba(255,255,255,.75), transparent 60%),
    radial-gradient(50% 38% at 86% 10%, rgba(233,166,192,.20), transparent 60%),
    radial-gradient(80% 55% at 50% 104%, rgba(217,178,94,.15), transparent 66%),
    linear-gradient(180deg, #FFF3E4 0%, #FDEAF0 52%, #FFF7EE 100%) !important;
}
/* พื้นผิวที่ hardcode สีเข้มบ่อยๆ → ทำให้สว่างในธีมสว่าง */
[data-theme="light"] .card,
[data-theme="light"] .panel,
[data-theme="light"] .box{
  background:linear-gradient(160deg,#fff,#FFF3E4) !important;
  border-color:rgba(181,133,43,.3) !important;
}
/* ปุ่มสลับธีมลอย (มุมขวาบน) — ใส่ <button id="themeToggle" class="mk-theme-btn">🌙</button> ในทุกหน้าย่อย */
.mk-theme-btn{ position:fixed; top:12px; right:12px; z-index:200; width:36px; height:36px; border-radius:50%;
  border:1px solid rgba(217,178,94,.5); background:rgba(20,10,30,.55); color:var(--gold-lt); font-size:1rem; cursor:pointer;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; padding:0; line-height:1; }
.mk-theme-btn:hover{ border-color:var(--gold-lt); }
[data-theme="light"] .mk-theme-btn{ background:rgba(255,255,255,.8); border-color:rgba(181,133,43,.45); }
/* ปุ่มธีมในแถบบน (topbar) — ใส่คู่กับปุ่มกลับ */
.tb-right{ display:flex; align-items:center; gap:10px; }
.tb-theme{ width:34px; height:34px; border-radius:50%; border:1px solid rgba(217,178,94,.5); background:rgba(255,255,255,.06);
  color:var(--gold-lt); font-size:.98rem; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; padding:0; flex-shrink:0; line-height:1; }
.tb-theme:hover{ border-color:var(--gold-lt); }
[data-theme="light"] .tb-theme{ background:rgba(255,255,255,.7); }

/* ============================================================
   เหรียญตราสมาชิก (badge.js) — Lite เงิน · Pro ทอง · Premium เพชร
   ============================================================ */
.mk-badge{ display:block; flex-shrink:0; filter:drop-shadow(0 4px 10px rgba(0,0,0,.4)); }
.mk-chip{ display:inline-flex; align-items:center; gap:9px; }
.mk-chip__txt{ display:flex; flex-direction:column; line-height:1.25; text-align:left; }
.mk-chip__txt b{ font-family:"Trirong",serif; font-size:.95rem; }
.mk-chip__txt i{ font-style:normal; font-size:.68rem; opacity:.75; }
.mk-chip--lite    .mk-chip__txt b{ color:#C7CEDA; }
.mk-chip--pro     .mk-chip__txt b{ color:#E8B93F; }
.mk-chip--premium .mk-chip__txt b{ color:#7FDDF2; }
[data-theme="light"] .mk-badge{ filter:drop-shadow(0 3px 8px rgba(0,0,0,.18)); }
[data-theme="light"] .mk-chip--lite    .mk-chip__txt b{ color:#5E6879; }
[data-theme="light"] .mk-chip--pro     .mk-chip__txt b{ color:#8F6111; }
[data-theme="light"] .mk-chip--premium .mk-chip__txt b{ color:#1B6E8C; }
/* เหรียญข้างชื่อบัญชี (หัวเว็บ) */
.mk-mybadge{ display:inline-flex; align-items:center; vertical-align:middle; margin-right:5px; }

/* ============================================================
   ธีมสว่าง — ดันสีเน้นที่ hardcode สีอ่อน (ทอง/ชมพู/ฟ้าอ่อน) ให้เข้มพออ่านออก
   ครอบทุกหน้าที่ใช้สีเหล่านี้เป็นตัวหนังสือ (กันตัวจมพื้นขาว)
   ============================================================ */
[data-theme="light"] .role--avoid u,
[data-theme="light"] .lwc.avoid u{ color:#C4455C !important; }        /* คำเตือนแดงอ่อน → แดงเข้ม */
[data-theme="light"] .feat__quota.used{ color:#B85891 !important; }    /* ชมพูอ่อน → ชมพูเข้ม */
[data-theme="light"] .donate__amount b{ color:#9A7426 !important; }    /* ทองอ่อน → ทองเข้ม */