/* assets/css/tg-login.css — DEV-206 ปุ่ม "เข้าสู่ระบบด้วย Telegram" ใต้ปุ่มเข้าสู่ระบบของการ์ด login (new-mgmt docs/front/TGAPP/01-spec.md §14 ; components/app/TgLoginButton.vue
 * + shared/guestSheet.ts tgLoginBlock) — โหลดด้วย ?v=<deploy> (DEV-038) เฉพาะที่ที่ render ปุ่ม: หน้า /login ทุกธีม + แผ่น login ของ guest ; ปิดปุ่ม (NUXT_PUBLIC_TG_LOGIN_URL=off) = ไม่มีไฟล์นี้เลย
 * - บล็อกเดียว: เส้นคั่น "หรือ" + ปุ่มเต็มความกว้าง ; ข้อความ 17 px · สูง ≥ 48 px (owner UI quality bar) ; สีแบรนด์ Telegram #2AABEE / hover #229ED9 ; การ์ดทุกธีมเป็นพื้นมืด (toplogin ดำ · blue/gold navy/ดำ)
 * - ทุกกฎอยู่ใต้ .rg-tglogin (ไม่แตะสไตล์การ์ดเดิม .toplogin / .blue-login-card / .gold-login-card / .golden-btn) ; สี + text-decoration ใส่ !important เพราะ hamberger.css `a:visited{color:inherit}`
 *   และ index.css `.toplogin a:hover{color:#f5bd70}` (0,1,1) ชนะ class เดี่ยว ; :visited ตั้งไว้ด้วย
 * - ความกว้าง: หน้า /login ธีม default/red แถบ .toplogin บน PC กว้างทั้งจอ → ปุ่มตัดที่ 420 px กลางแถบ ; ในแผ่น login (แผง ≤ 520 px) และในการ์ด blue/gold (420 px) = เต็มการ์ด */
.rg-tglogin { max-width: 420px; margin: 10px auto 2px; padding: 0; }
.rg-gsheet .rg-tglogin { max-width: none; margin: 10px 8px 4px; } /* default/red card inside the sheet: the row's columns are px-2 (8 px) → same edges as the buttons above */
.blue-login-card .rg-tglogin, .gold-login-card .rg-tglogin { max-width: none; margin: 0 0 16px; } /* inside the form, between the sign-in button (mb-3) and the links row */
.rg-tglogin__or { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; color: #9a9a9a; font-size: 15px; line-height: 1.2; }
.rg-tglogin__or::before, .rg-tglogin__or::after { content: ""; flex: 1 1 auto; height: 1px; background: rgba(255, 255, 255, .18); }
.rg-tglogin .rg-tglogin__or > span { color: inherit !important; vertical-align: baseline; line-height: inherit; } /* index.css / guest-sheet.css `.toplogin span { color: black; vertical-align: text-top }` painted "หรือ" black on the black card (dev shots 22:5x) */
.rg-tglogin .rg-tglogin__btn, .rg-tglogin .rg-tglogin__btn:visited { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 48px; padding: 10px 14px; border-radius: 8px; border: 0;
  background: #2AABEE; color: #fff !important; font-size: 17px !important; font-weight: 600; line-height: 1.3; text-decoration: none !important; box-shadow: 0 2px 6px rgba(42, 171, 238, .35); cursor: pointer; }
.rg-tglogin .rg-tglogin__btn:hover, .rg-tglogin .rg-tglogin__btn:focus { background: #229ED9; color: #fff !important; text-decoration: none !important; outline: none; }
.rg-tglogin .rg-tglogin__btn:focus-visible { box-shadow: 0 0 0 3px rgba(42, 171, 238, .45); }
.rg-tglogin .rg-tglogin__btn:active { background: #1E8FC6; box-shadow: none; }
.rg-tglogin__ic { width: 22px; height: 22px; flex: 0 0 22px; }
.blue-login-card .rg-tglogin .rg-tglogin__btn, .gold-login-card .rg-tglogin .rg-tglogin__btn { border-radius: 10px; } /* = the radius of blue-login-btn / gold-login-btn */