/*
 * type-scale.css - thang cỡ chữ cho thiệp, ưu tiên dễ đọc với người lớn tuổi.
 *
 * Cách làm: thiệp gốc đặt cỡ chữ bằng các class Tailwind (text-[12px], text-sm, md:text-[13px]...).
 * File này đổi từng class đó sang cỡ mới, theo một thang nhất quán. Muốn chỉnh thì sửa số ở đây.
 * Tablet/máy tính (>= 768px) dùng cùng điểm ngắt với Tailwind (md:).
 *
 * Thang mới (điện thoại / từ 768px):
 *   nhãn viết hoa giãn chữ   13 / 14   (thứ trong lịch, "Trưởng Nam")
 *   chữ phụ                  15 / 16   (địa chỉ, câu báo tin, số ngày trong lịch, nhãn giờ, ghi chú)
 *   chữ thường               16 / 17   (form, lời chúc, ngày giờ, mô tả, "VÀO LÚC 15:00")
 *   chữ nhấn                 18 / 20   (giờ lễ, dòng thông tin chính, đếm ngược)
 *   tiêu đề mục              22 / 26
 * Chữ viết thành câu không nhỏ hơn 15px; chỉ nhãn viết hoa giãn chữ mới xuống 13px.
 *
 * Phần tử đã tự đặt font-size trực tiếp (tên hai nhà tự co chữ, tiêu đề lịch, ký hiệu ✦) không bị đụng:
 * mọi luật bên dưới đều có :not([style*="font-size"]).
 */

/* ---- Điện thoại ---- */
.text-\[10px\]:not([style*="font-size"]) { font-size: 13px !important; }
.text-\[11px\]:not([style*="font-size"]) { font-size: 15px !important; }
.text-\[12px\]:not([style*="font-size"]) { font-size: 15px !important; }
.text-xs:not([style*="font-size"])       { font-size: 15px !important; }
.text-\[13px\]:not([style*="font-size"]) { font-size: 16px !important; }
.text-\[14px\]:not([style*="font-size"]) { font-size: 16px !important; }
.text-sm:not([style*="font-size"])       { font-size: 16px !important; }
.text-\[15px\]:not([style*="font-size"]) { font-size: 17px !important; }
.text-base:not([style*="font-size"])     { font-size: 17px !important; }
.text-\[16px\]:not([style*="font-size"]) { font-size: 18px !important; }
.text-\[18px\]:not([style*="font-size"]) { font-size: 20px !important; }
.text-lg:not([style*="font-size"])       { font-size: 20px !important; }
.text-xl:not([style*="font-size"])       { font-size: 22px !important; }
.text-\[20px\]:not([style*="font-size"]) { font-size: 22px !important; }

/* Tiêu đề mục đặt cỡ 20px trực tiếp trong style (Album ảnh, Dress code, Sổ lưu bút) */
[style*="font-size: 20px"] { font-size: 22px !important; }

/* Dòng chữ nhiều dòng: giãn dòng thoáng hơn, trừ chỗ thiệp đã tự đặt leading-* */
.text-xs:not([class*="leading-"]):not([style*="font-size"]),
.text-sm:not([class*="leading-"]):not([style*="font-size"]),
.text-base:not([class*="leading-"]):not([style*="font-size"]) { line-height: 1.5; }
.text-lg:not([class*="leading-"]):not([style*="font-size"])   { line-height: 1.4; }
.text-xl:not([class*="leading-"]):not([style*="font-size"])   { line-height: 1.35; }

/* Ô nhập liệu (RSVP, lời chúc): 16px để dễ đọc và trình duyệt điện thoại không tự phóng to khi bấm vào */
input, textarea, select { font-size: 16px !important; }

/* Các cặp class đi chung, cần cỡ riêng để các khối ngày giờ và địa chỉ đồng đều */
.text-\[14px\].md\:text-\[18px\]:not([style*="font-size"]) { font-size: 18px !important; } /* THÁNG, NĂM (lễ thành hôn) */
.text-\[12px\].md\:text-\[16px\]:not([style*="font-size"]) { font-size: 18px !important; } /* THÁNG (tiệc cưới) */
.text-\[12px\].md\:text-\[14px\]:not([style*="font-size"]) { font-size: 16px !important; } /* địa chỉ nơi tổ chức tiệc */
.text-sm.md\:text-lg:not([style*="font-size"])             { font-size: 18px !important; } /* đồng hồ đếm ngược */

/* Ngắt dòng gọn hơn ở màn hẹp: tiêu đề và dòng viết hoa dài chia đều các dòng, đoạn văn tránh chữ mồ côi ở dòng cuối.
   (Trình duyệt cũ chưa hỗ trợ thì bỏ qua, chữ vẫn hiển thị bình thường.) */
.text-xl, .text-\[20px\], [style*="font-size: 20px"],
.text-\[16px\].md\:text-\[18px\], .tracking-\[0\.12em\] { text-wrap: balance; }
.text-xs, .text-sm, .cd-fam-addr { text-wrap: pretty; }

/* Khối Ông Bà hai nhà (class do tools/build.py gắn vào). Tên có cỡ riêng do hàm tự co chữ quyết định */
.cd-fam-title { font-size: 15px; }
.cd-fam-addr  { font-size: 15px; line-height: 1.4; }

/* ---- Tablet / máy tính (>= 768px) ---- */
@media (min-width: 768px) {
  .text-\[20px\]:not([style*="font-size"]) { font-size: 26px !important; }
  .text-xl:not([style*="font-size"])       { font-size: 26px !important; }
  [style*="font-size: 20px"]               { font-size: 26px !important; }

  .md\:text-\[11px\]:not([style*="font-size"]) { font-size: 14px !important; }
  .md\:text-\[12px\]:not([style*="font-size"]) { font-size: 16px !important; }
  .md\:text-\[13px\]:not([style*="font-size"]) { font-size: 16px !important; }
  .md\:text-\[14px\]:not([style*="font-size"]) { font-size: 17px !important; }
  .md\:text-\[15px\]:not([style*="font-size"]) { font-size: 17px !important; }
  .md\:text-\[16px\]:not([style*="font-size"]) { font-size: 18px !important; }
  .md\:text-\[17px\]:not([style*="font-size"]) { font-size: 19px !important; }
  .md\:text-\[18px\]:not([style*="font-size"]) { font-size: 20px !important; }
  .md\:text-\[24px\]:not([style*="font-size"]) { font-size: 24px !important; }
  .md\:text-\[26px\]:not([style*="font-size"]) { font-size: 26px !important; }
  .md\:text-sm:not([style*="font-size"])       { font-size: 17px !important; }
  .md\:text-base:not([style*="font-size"])     { font-size: 18px !important; }
  .md\:text-lg:not([style*="font-size"])       { font-size: 20px !important; }
  .md\:text-xl:not([style*="font-size"])       { font-size: 22px !important; }

  .text-\[14px\].md\:text-\[18px\]:not([style*="font-size"]) { font-size: 20px !important; }
  .text-\[12px\].md\:text-\[16px\]:not([style*="font-size"]) { font-size: 20px !important; }
  .text-\[12px\].md\:text-\[14px\]:not([style*="font-size"]) { font-size: 17px !important; }
  .text-sm.md\:text-lg:not([style*="font-size"])             { font-size: 20px !important; }

  .cd-fam-title { font-size: 16px; }
  .cd-fam-addr  { font-size: 16px; }
}
