/* ==========================================================================
   FORM "DAT HANG NHANH" - DUNG CHUNG                             05/09/2026
   Bai khuyen mai (cuoi bai, section.gd3-dh) + trang chi tiet san pham (hop
   thoai #gd3DhnModal: "Mua tra gop" / "Dat hang nhanh"). Markup:
   inc/dat_hang_nhanh_form.php; JS js/dat-hang-nhanh.js; endpoint
   giaodien3/dat_hang_nhanh_ajax.php. Header nap o news_detail_bv + chi tiet SP.
   O nhap dung lai kieu .gd3-field cua trang thanh toan (cart.css khong nap o
   day nen chep lai, thu hep pham vi .gd3-dh).
   ========================================================================== */
.gd3-dh {
	margin-top: 26px;
	border-radius: 16px;
	background: #fff;
	border: 1px solid #ffe38a;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
	overflow: hidden;
}
.gd3-dh-dau {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 22px;
	background: linear-gradient(135deg, #111 0%, #2b2b2b 100%);
	color: #fff;
}
.gd3-dh-dau-chu { min-width: 0; }
.gd3-dh-nhan {
	display: inline-block;
	margin-bottom: 8px;
	padding: 3px 10px;
	border-radius: 999px;
	background: #ffc600;
	color: #111;
	font-size: 11.5px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .3px;
}
.gd3-dh-nhan i { margin-right: 4px; }
.gd3-dh-tieude { margin: 0 0 6px; font-size: 22px; font-weight: 800; line-height: 1.25; color: #fff; }
.gd3-dh-dau p { margin: 0; font-size: 13.5px; line-height: 1.5; color: #d6d6d6; }
.gd3-dh-hotline {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 0 0 auto;
	padding: 10px 16px;
	border-radius: 12px;
	background: #ffc600;
	color: #111;
	text-decoration: none;
	transition: transform .15s ease;
}
.gd3-dh-hotline:hover { transform: translateY(-2px); color: #111; text-decoration: none; }
.gd3-dh-hotline i { font-size: 22px; }
.gd3-dh-hotline small { display: block; font-size: 11px; font-weight: 600; line-height: 1.1; color: #5a4600; }
.gd3-dh-hotline b { display: block; font-size: 18px; line-height: 1.2; white-space: nowrap; }
.gd3-dh-form { padding: 20px 22px 22px; }
.gd3-dh-bay { position: absolute; left: -9999px; top: -9999px; width: 1px; height: 1px; overflow: hidden; }
.gd3-dh-loi {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	margin-bottom: 14px;
	padding: 10px 12px;
	border-radius: 8px;
	background: #fff2f2;
	border: 1px solid #f5b5b5;
	color: #b3000f;
	font-size: 13.5px;
}
/* PHAI co dong nay: luat tren dat display:flex cho .gd3-dh-loi, ma luat cua
   tac gia LUON thang luat mac dinh [hidden]{display:none} cua trinh duyet -
   nen khong co no thi o bao loi hien ra mot dai do RONG ngay dau form, ca
   khi chua co loi nao. (Phat hien 14/09/2026 khi dung lai khoi nay cho hop
   thoai tra gop cua giao dien 1 - loi nay von da co san o giao dien 3.) */
.gd3-dh-loi[hidden] { display: none; }
.gd3-dh-loi i { margin-top: 2px; }
.gd3-dh-luoi { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 16px; }
.gd3-dh-rong { grid-column: 1 / -1; }
.gd3-dh .gd3-field { margin-bottom: 14px; min-width: 0; }
.gd3-dh .gd3-field label { display: block; margin-bottom: 5px; font-size: 13px; font-weight: 700; color: #333; }
.gd3-dh .gd3-field label i { color: #d70018; font-style: normal; }
.gd3-dh .gd3-field label small { font-weight: 400; color: #999; }
.gd3-dh .gd3-field input, .gd3-dh .gd3-field select, .gd3-dh .gd3-field textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #ddd;
	border-radius: 8px;
	font-size: 15px;
	color: #111;
	background: #fff;
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	transition: border-color .15s ease, box-shadow .15s ease;
}
/* O CHON (select) co nen XAM, khac han o go chu nen trang (yeu cau
   07/09/2026). Truoc do ca hai deu trang, chi khac moi cai mui ten nho o
   goc phai - hop thoai nay co toi 6 o chon (mau, tinh, quan, cong ty, giay
   to, tra truoc, ky han) nen nhin xuong la mot cot trang deu tam tap,
   khong ro cai nao go tay cai nao bam chon.

   Dung `background-color` chu KHONG dung `background`: quy tac tren da dat
   `background: #fff`, con dong duoi day dat `background-image` (mui ten
   SVG) - viet shorthand o day se xoa mat mui ten do. */
.gd3-dh .gd3-field select {
	background-color: #f4f4f4;
	border-color: #d8d8d8;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 11px 7px;
	padding-right: 34px;
}
/* Dang chon thi sang han len - dau hieu "con tro dang o day" ro hon vong
   sang vien vang mot chut. */
.gd3-dh .gd3-field select:focus { background-color: #ffffff; }

/* NGUOC LAI trong khung tra gop. Khung do ([data-dh-tragop-o]) da co nen
   xam #f7f7f7 de gom 4 o cua phan tra gop lai mot cum; de o chon xam
   #f4f4f4 len tren thi hai mau cach nhau dung 3 bac - mat khong phan biet
   noi, tuc vua sua xong lai hong ngay o cho khac (do 07/09/2026).
   Luat that su la "o chon luon khac mau voi cai nen no dang nam tren":
   xam tren nen trang, va trang tren nen xam. */
.gd3-dh [data-dh-tragop-o] .gd3-field select { background-color: #ffffff; }
.gd3-dh .gd3-field textarea { resize: vertical; min-height: 64px; line-height: 1.5; }
.gd3-dh .gd3-field input:focus, .gd3-dh .gd3-field select:focus, .gd3-dh .gd3-field textarea:focus { outline: 0; border-color: #111; box-shadow: 0 0 0 3px rgba(255, 198, 0, .35); }
/* `background-color` chu khong phai `background`: shorthand o day tung xoa
   luon mui ten SVG cua the <select>, nen mot o chon bao loi la mat mui ten
   (loi cu, sua kem 07/09/2026). */
.gd3-dh .gd3-field.has-error input, .gd3-dh .gd3-field.has-error select { border-color: #d70018; background-color: #fffafa; }
.gd3-dh-check { display: flex; gap: 10px; align-items: flex-start; margin: 2px 0 16px; font-size: 13.5px; color: #333; cursor: pointer; }
.gd3-dh-check input { width: 18px; height: 18px; margin-top: 1px; flex: 0 0 18px; accent-color: #111; }
.gd3-dh-chan { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.gd3-dh-nut {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 13px 28px;
	border: 0;
	border-radius: 999px;
	background: #111;
	color: #ffc600;
	font-size: 15.5px;
	font-weight: 800;
	cursor: pointer;
	box-shadow: 0 6px 16px rgba(0, 0, 0, .2);
	transition: background .15s ease, transform .15s ease;
}
.gd3-dh-nut:hover { background: #ffc600; color: #111; transform: translateY(-1px); }
.gd3-dh-nut:disabled { opacity: .7; cursor: default; transform: none; }
.gd3-dh-camket { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: #666; }
.gd3-dh-camket i { margin-right: 4px; color: #b58600; }
.gd3-dh-xong {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin: 20px 22px 22px;
	padding: 18px 20px;
	border-radius: 12px;
	background: #f0fbf2;
	border: 1px solid #b7e4c0;
	color: #14532d;
	font-size: 15px;
	line-height: 1.55;
}
.gd3-dh-xong > i { font-size: 30px; color: #16a34a; }
.gd3-dh-xong-sp { margin-top: 6px; font-size: 13.5px; color: #3f6b4b; }
@media (max-width: 767.98px) {
	.gd3-dh { margin-top: 20px; border-radius: 14px; }
	.gd3-dh-dau { flex-direction: column; align-items: stretch; padding: 16px; }
	.gd3-dh-tieude { font-size: 19px; }
	.gd3-dh-hotline { justify-content: center; }
	.gd3-dh-form { padding: 16px 14px 18px; }
	.gd3-dh-luoi { grid-template-columns: 1fr; gap: 0; }
	.gd3-dh-chan { flex-direction: column; align-items: stretch; }
	.gd3-dh-nut { width: 100%; justify-content: center; }
	.gd3-dh-camket { justify-content: center; }
	.gd3-dh-xong { margin: 14px; }
}

/* San pham co dinh (trang chi tiet): dong anh + ten + gia tren dau form. */
.gd3-dh-sp { display: flex; gap: 12px; align-items: center; margin-bottom: 14px; padding: 10px 12px; border-radius: 10px; background: #fffbea; border: 1px solid #ffe38a; }
.gd3-dh-sp img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; background: #fff; }
.gd3-dh-sp b { display: block; font-size: 14.5px; line-height: 1.35; color: #111; }
.gd3-dh-sp span { display: block; margin-top: 3px; font-size: 15px; font-weight: 800; color: #d70018; }
.gd3-dh-sp s { margin-left: 6px; font-size: 12.5px; font-weight: 400; color: #999; }
/* Phan tra gop (hien khi tich o). */
.gd3-dh-tragop { margin: -4px 0 14px; padding: 12px 14px 0; border-radius: 10px; background: #f7f7f7; border: 1px dashed #ddd; }
/* Hop thoai tren trang san pham. */
.gd3-dhn-modal {
	position: fixed;
	top: 0; left: 0; right: 0; bottom: 0;
	z-index: 6000;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 24px 12px;
	overflow-y: auto;
	background: rgba(0, 0, 0, .6);
	-webkit-overflow-scrolling: touch;
}
.gd3-dhn-modal[hidden] { display: none; }
.gd3-dhn-hop { position: relative; width: 100%; max-width: 720px; margin: auto 0; }
.gd3-dhn-hop .gd3-dh { margin-top: 0; }
.gd3-dhn-dong {
	position: absolute;
	top: -12px; right: -12px;
	z-index: 2;
	width: 36px; height: 36px;
	border: 0;
	border-radius: 50%;
	background: #ffc600;
	color: #111;
	font-size: 18px;
	cursor: pointer;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
}
.gd3-dhn-dong:hover { background: #fff; }
body.gd3-dhn-mo { overflow: hidden; }
@media (max-width: 767.98px) {
	.gd3-dhn-modal { padding: 10px 8px; }
	.gd3-dhn-dong { top: -6px; right: -6px; }
}