/* ============ AJAX Auth Messages ============ */
.auth-message { padding: 1.2rem 1.6rem; border-radius: .8rem; margin-bottom: 1.6rem; font-size: 1.5rem; line-height: 1.5; }
.auth-message--success { background: #f6ffed; border: 1px solid #b7eb8f; color: #16a34a; }
.auth-message--error { background: #fff1f0; border: 1px solid #ffccc7; color: #e11d48; }

/* gepmath app — styling tối thiểu cho UI làm bài / lộ trình học. */
.gm-exercise, .gm-learn { margin: 24px 0; }
.gm-loading { padding: 24px 0; color: #888; }
.gm-msg { padding: 16px 20px; background: #fff7e6; border: 1px solid #ffe1a8; border-radius: 10px; }
.gm-msg--err { background: #fff1f0; border-color: #ffccc7; }

.gm-quiz__bar { display: flex; justify-content: space-between; align-items: center; position: sticky; top: 0; background: #fff; padding: 12px 0; border-bottom: 1px solid #eee; z-index: 5; }
.gm-quiz__timer { font-weight: 700; color: #f33b00; }
.gm-q { padding: 20px; border: 1px solid #eee; border-radius: 12px; margin: 16px 0; }
.gm-q__head { font-weight: 700; margin-bottom: 8px; }
.gm-q__head em { color: #888; font-weight: 400; }
.gm-q__opt { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid #eee; border-radius: 8px; margin: 6px 0; cursor: pointer; }
.gm-q__opt:hover { background: #fafafa; }
.gm-q__essay { width: 100%; border: 1px solid #ddd; border-radius: 8px; padding: 10px; }
.gm-quiz__submit { margin-top: 16px; }

.gm-result__head { padding: 20px; border-radius: 12px; text-align: center; margin-bottom: 16px; }
.gm-result__head.is-pass { background: #f6ffed; border: 1px solid #b7eb8f; }
.gm-result__head.is-fail { background: #fff1f0; border: 1px solid #ffccc7; }
.gm-result__score { font-size: 20px; font-weight: 700; }
.gm-result__actions { display: flex; gap: 12px; margin-bottom: 20px; }
.gm-rq { padding: 16px; border-radius: 10px; margin: 10px 0; border: 1px solid #eee; }
.gm-rq.is-correct { border-color: #b7eb8f; background: #f6ffed; }
.gm-rq.is-wrong { border-color: #ffccc7; background: #fff1f0; }
.gm-rq.is-pending { border-color: #ffe1a8; background: #fff7e6; }
.gm-rq__opts { list-style: none; padding: 0; margin: 10px 0 0; }
.gm-rq__opts li { padding: 6px 10px; border-radius: 6px; }
.gm-rq__opts li.gm-correct { background: #d9f7be; font-weight: 600; }
.gm-rq__explain { margin-top: 10px; padding: 10px; background: #f5f5f5; border-radius: 6px; }

/* Lộ trình học */
.gm-curri__chapter { border: 1px solid #eee; border-radius: 12px; margin: 12px 0; overflow: hidden; }
.gm-curri__chead { padding: 14px 18px; font-weight: 700; background: #fafafa; display: flex; justify-content: space-between; }
.gm-curri__chapter.is-locked { opacity: .55; }
.gm-curri__lessons { list-style: none; margin: 0; padding: 0; }
.gm-curri__lesson { display: flex; justify-content: space-between; align-items: center; padding: 12px 18px; border-top: 1px solid #f0f0f0; }
.gm-curri__lesson.is-done { color: #52c41a; }
.gm-progressbar { height: 8px; background: #eee; border-radius: 4px; overflow: hidden; }
.gm-progressbar > span { display: block; height: 100%; background: linear-gradient(90deg,#f33b00,#f9d314); }

/* Dạng câu mở rộng (2026-06-10): xác định mệnh đề / điền từ / kéo thả. */
.gm-tf { width: 100%; border-collapse: collapse; margin-top: 8px; }
.gm-tf th, .gm-tf td { border: 1px solid #eee; padding: 8px 10px; text-align: left; }
.gm-tf th:nth-child(1), .gm-tf th:nth-child(2),
.gm-tf td:nth-child(1), .gm-tf td:nth-child(2) { text-align: center; width: 64px; }
.gm-fill, .gm-drag { line-height: 2.4; margin-top: 8px; }
.gm-blank { width: 140px; padding: 6px 10px; border: 1px solid #cbd5e1; border-radius: 8px; }
.gm-drop { padding: 6px 10px; border: 1px dashed #94a3b8; border-radius: 8px; background: #fff; }
.gm-rq__opts { list-style: none; margin: 8px 0 0; padding: 0; }
.gm-rq__opts li { padding: 4px 0; }
.gm-rq__opts .gm-correct { color: #16a34a; font-weight: 600; }
.gm-rq__opts .gm-wrong { color: #ef4444; }
.gm-rq.is-correct { border-left: 3px solid #16a34a; padding-left: 12px; }
.gm-rq.is-wrong { border-left: 3px solid #ef4444; padding-left: 12px; }
.gm-rq.is-pending { border-left: 3px solid #f59e0b; padding-left: 12px; }

/* Lịch sử làm bài — panel chi tiết review (account). */
.gm-detail-toggle { display: inline-block; margin-top: 6px; background: none; border: 0; padding: 0; color: #2563eb; font-size: 13px; cursor: pointer; text-decoration: underline; }
.gm-detail { display: none; padding: 16px 20px; background: #f8fafc; border-radius: 12px; margin: 8px 0 16px; }
.gm-detail.is-open { display: block; }
.gm-detail__score { font-size: 15px; margin: 0 0 12px; }

/* Lịch sử làm bài — mobile labels cho data-tt. */
@media (max-width: 1199px) {
    .brd-tb .list .item::before {
        content: attr(data-tt);
        display: block;
        font-size: 1.2rem;
        font-weight: 600;
        color: var(--qz-text-soft, #64748b);
        margin-bottom: .2rem;
    }
}

/* Nav khu tài khoản: icon Font Awesome trong .myacc-it (design dùng <img>, ở đây dùng <i>). */
.myacc-it i { flex: 0 0 auto; width: 2.4rem; height: 2.4rem; display: flex; align-items: center; justify-content: center; font-size: 1.9rem; color: #475569; transition: color .3s ease; }
.myacc-it.active i, .myacc-it:hover i { color: #2563eb; }

/* ============ Khu Địa chỉ (My Account → edit-address) ============ */
.gm-addr-desc { font-size: 1.6rem; color: #475569; margin-bottom: 2.4rem; }
.gm-addr-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.4rem; }
@media (max-width: 800px) { .gm-addr-grid { grid-template-columns: 1fr; } }
.gm-addr-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 1.6rem; padding: 2.4rem; display: flex; flex-direction: column; box-shadow: 0 .6rem 1.6rem rgba(30,41,59,.05); }
.gm-addr-card__head { display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.6rem; }
.gm-addr-icon { width: 4.4rem; height: 4.4rem; border-radius: 1rem; background: #eef3fe; color: #2563eb; display: flex; align-items: center; justify-content: center; font-size: 2rem; flex: 0 0 auto; }
.gm-addr-card__tt { font-size: 1.8rem; font-weight: 700; color: #0f172a; margin: 0; }
.gm-addr-card__body { flex: 1; font-size: 1.5rem; color: #475569; line-height: 1.7; margin-bottom: 1.6rem; }
.gm-addr-card__body address { font-style: normal; }
.gm-addr-empty { color: #94a3b8; font-style: italic; margin: 0; }
.gm-addr-edit { display: inline-flex; align-items: center; gap: .8rem; align-self: flex-start; padding: 1rem 2rem; border-radius: 999rem; background: #2563eb; color: #fff; font-size: 1.5rem; font-weight: 600; text-decoration: none; transition: background .2s ease; }
.gm-addr-edit:hover { background: #1d4fd0; color: #fff; }
.gm-addr-card.is-set .gm-addr-edit { background: #fff; color: #2563eb; border: 1px solid #2563eb; }
.gm-addr-card.is-set .gm-addr-edit:hover { background: #eef3fe; }

/* Form sửa địa chỉ — style field Woo theo .frm-* */
.gm-addr-form .woocommerce-address-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 2.4rem; margin-bottom: 2.4rem; }
@media (max-width: 700px) { .gm-addr-form .woocommerce-address-fields__field-wrapper { grid-template-columns: 1fr; } }
.gm-addr-form .form-row { margin: 0; display: flex; flex-direction: column; }
.gm-addr-form .form-row-wide, .gm-addr-form .address-field.form-row-wide { grid-column: 1 / -1; }
.gm-addr-form .form-row label { font-size: 1.5rem; font-weight: 600; color: #0f172a; margin-bottom: .8rem; }
.gm-addr-form .form-row .required, .gm-addr-form .form-row .optional { color: #ef4444; text-decoration: none; border: 0; }
.gm-addr-form .woocommerce-input-wrapper { width: 100%; display: block; }
.gm-addr-form .input-text, .gm-addr-form input[type="text"], .gm-addr-form input[type="tel"], .gm-addr-form input[type="email"], .gm-addr-form select { width: 100%; height: 4.8rem; padding: 0 1.4rem; border: 1px solid #cbd5e1; border-radius: .8rem; font-size: 1.5rem; color: #0f172a; background: #fff; outline: none; font-family: inherit; }
.gm-addr-form textarea.input-text { height: auto; min-height: 9rem; padding: 1.2rem 1.4rem; }
.gm-addr-form .input-text:focus, .gm-addr-form select:focus { border-color: #2563eb; box-shadow: 0 0 0 .3rem rgba(37,99,235,.12); }
.gm-addr-form .select2-container { width: 100% !important; }
.gm-addr-form .select2-container--default .select2-selection--single { height: 4.8rem; border: 1px solid #cbd5e1; border-radius: .8rem; display: flex; align-items: center; }
.gm-addr-form .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 4.6rem; padding-left: 1.4rem; font-size: 1.5rem; color: #0f172a; }
.gm-addr-form .select2-container--default .select2-selection--single .select2-selection__arrow { height: 4.6rem; right: .6rem; }
.gm-addr-form .myacc-frm-btn { margin-top: .4rem; }

/* Form địa chỉ: ép mỗi .form-row chiếm trọn ô grid (ghi đè width 47%/float mặc định của Woo) → cột Tên/Họ đều nhau. */
.gm-addr-form .woocommerce-address-fields__field-wrapper .form-row { width: 100% !important; float: none !important; }
.myacc-ava .avt { background: #eef1f8; }

/* ============================================================
 * CHECKOUT (thanhtoan-thongtin) — bổ trợ cho markup template
 * ============================================================ */

/* Dấu * bắt buộc ở label billing (.frm-lb) — bỏ gạch chân, tô đỏ. */
.woocommerce-checkout .frm-lb abbr.required { color: #e11d48; text-decoration: none; border: none; margin-left: .2rem; }

/* Trạng thái lỗi/hợp lệ của WooCommerce validate trên ô .frm-input. */
.woocommerce-checkout .frm-col.woocommerce-invalid .frm-input { border-color: #e11d48; }
.woocommerce-checkout .frm-col.woocommerce-validated .frm-input { border-color: #16a34a; }

/* Body phương thức thanh toán: dùng layout flex của template (ảnh QR 16rem + .list 2 cột),
 * ghi đè rule display:block cũ để BACS hiển thị y chang template (.bdy.active). */
.woocommerce-checkout .woocommerce-checkout-payment .shopcart-item.recheck-item.active .recheck-bdy {
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: var(--dist32, 3.2rem); }
@media screen and (max-width: 800px) {
  .woocommerce-checkout .woocommerce-checkout-payment .shopcart-item.recheck-item.active .recheck-bdy {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column; } }

/* Coupon chuẩn WooCommerce ở ĐẦU trang — bọc trong .container, style gọn đẹp, không lệch. */
.gm-checkout-coupon { padding: 4rem 0 0; }
.gm-checkout-coupon-inner { background: #fff; border: .1rem solid var(--border); border-radius: 1.2rem; padding: 1.6rem 2rem; }
.gm-checkout-coupon .woocommerce-form-coupon-toggle { margin: 0; }
/* Dòng "Bạn có mã giảm giá? — Nhập mã tại đây" (ghi đè notice mặc định). */
.gm-checkout-coupon .woocommerce-form-coupon-toggle .woocommerce-info {
  list-style: none; margin: 0; padding: 0; background: none; color: #0f172a;
  border: none; border-radius: 0; font-size: 1.5rem; display: flex; flex-wrap: wrap;
  align-items: center; gap: .8rem; }
.gm-checkout-coupon .woocommerce-form-coupon-toggle .woocommerce-info::before { content: none; }
.gm-checkout-coupon .gm-coupon-q { display: inline-flex; align-items: center; gap: .8rem; font-weight: 600; color: #0f172a; }
.gm-checkout-coupon .gm-coupon-q i { color: var(--color-pri); }
.gm-checkout-coupon a.showcoupon { color: var(--color-pri); font-weight: 600; text-decoration: underline; text-underline-offset: .3rem; }
.gm-checkout-coupon a.showcoupon:hover { opacity: .85; }
/* Form nhập mã (toggle). */
.gm-checkout-coupon .checkout_coupon { margin: 1.6rem 0 0; padding: 1.6rem 0 0; border-top: .1rem solid var(--border); }
.gm-checkout-coupon .gm-coupon-hint { font-size: 1.4rem; color: rgba(16, 24, 40, .7); margin: 0 0 1rem; }
.gm-checkout-coupon .gm-checkout-coupon-field { display: flex; gap: 1rem; flex-wrap: wrap; }
.gm-checkout-coupon .gm-checkout-coupon-field .input-text {
  flex: 1 1 24rem; min-width: 0; height: 4.8rem; padding: 0 1.6rem; font-size: 1.5rem;
  border: .1rem solid var(--border); border-radius: .8rem; background: #fff; color: #0f172a; outline: none; }
.gm-checkout-coupon .gm-checkout-coupon-field .input-text:focus { border-color: var(--color-pri); }
.gm-checkout-coupon .gm-coupon-apply { flex: 0 0 auto; height: 4.8rem; padding: 0 2.8rem; border: none; cursor: pointer; }

/* Link gỡ mã giảm giá trong dòng coupon (.shopcart-des-bot). */
.shopcart-des-bot .cart-discount .woocommerce-remove-coupon { font-size: 1.2rem; margin-left: .6rem; color: #e11d48; text-decoration: underline; }

/* Mã giảm giá: cho phép coupon dòng xuống gọn gàng. */
.shopcart-des-bot .cart-discount .txt { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem; }

/* ===== "Khóa học của tôi" — tiến độ trên card .nws (trang /tai-khoan/my-courses/) ===== */
.myacc-course .nws-desc { display: flex; flex-direction: column; }
.gm-cprogress { margin: 1.2rem 0 1.4rem; }
.gm-cprogress__bar {
	height: .8rem;
	background: #eef2f7;
	border-radius: 999px;
	overflow: hidden;
}
.gm-cprogress__bar span {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: linear-gradient(90deg, #f33b00 0%, #f9d314 100%);
	transition: width .4s ease;
}
.gm-cprogress__txt {
	margin-top: .8rem;
	font-size: 1.4rem;
	color: #475569;
}
.gm-cprogress__txt strong { color: #0f172a; }
