/* ===================== FPT360 — Tỉnh thành: popup + khu ưu đãi ===================== */

/* ---------- Popup chọn tỉnh ---------- */
.fpt360-tinh-overlay{
	position:fixed; inset:0; z-index:99998;
	background:rgba(15,23,42,.55);
	display:none; align-items:flex-start; justify-content:center;
	padding:6vh 16px 16px;
	overflow-y:auto;
}
.fpt360-tinh-overlay.is-open{ display:flex; }

.fpt360-tinh-modal{
	position:relative;
	width:100%; max-width:640px;
	background:#fff;
	border-radius:12px;
	padding:28px 24px 24px;
	box-shadow:0 20px 50px rgba(0,0,0,.25);
	animation:fpt360TinhVao .2s ease;
}
@keyframes fpt360TinhVao{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:none;} }

.fpt360-tinh-close{
	position:absolute; top:10px; right:10px;
	width:34px; height:34px; line-height:1;
	font-size:22px; color:#666;
	background:#fff; border:1px solid var(--fpt-xam,#e3e6ea); border-radius:50%;
	cursor:pointer;
}
.fpt360-tinh-close:hover{ color:#fff; background:var(--fpt-cam,#f37021); border-color:var(--fpt-cam,#f37021); }

.fpt360-tinh-title{
	margin:0 0 6px; font-size:22px; font-weight:700;
	color:var(--fpt-xanh,#004a99); text-align:center;
}
.fpt360-tinh-sub{ margin:0 0 16px; font-size:14px; color:#555; text-align:center; }

.fpt360-tinh-search{
	display:block; width:100%;
	padding:10px 14px; margin-bottom:14px;
	font-size:15px;
	border:1px solid var(--fpt-xam,#e3e6ea); border-radius:8px;
}
.fpt360-tinh-search:focus{ outline:none; border-color:var(--fpt-cam,#f37021); }

.fpt360-tinh-grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:8px;
	max-height:46vh; overflow-y:auto;
	padding-right:4px;
}
.fpt360-tinh-item{
	padding:10px 8px;
	font-size:14px; font-weight:500; color:#333;
	background:var(--fpt-xam-nhat,#f6f7f9);
	border:1px solid var(--fpt-xam,#e3e6ea); border-radius:8px;
	cursor:pointer; text-align:center;
	transition:all .12s ease;
}
.fpt360-tinh-item:hover{
	color:#fff; background:var(--fpt-cam,#f37021); border-color:var(--fpt-cam,#f37021);
}

@media (max-width:600px){
	.fpt360-tinh-grid{ grid-template-columns:repeat(2,1fr); }
	.fpt360-tinh-modal{ padding:24px 16px 16px; }
}

/* ---------- Nút đổi tỉnh (header) ---------- */
.fpt360-tinh-btn{
	display:inline-flex; align-items:center; gap:6px;
	padding:8px 14px;
	font-size:14px; font-weight:600;
	color:var(--fpt-xanh,#004a99);
	background:#fff;
	border:1px solid var(--fpt-xam,#e3e6ea); border-radius:20px;
	cursor:pointer;
	transition:all .12s ease;
}
.fpt360-tinh-btn:hover{ border-color:var(--fpt-cam,#f37021); color:var(--fpt-cam,#f37021); }

/* ---------- Khu highlight ưu đãi ---------- */
.fpt360-uudai{
	position:relative;
	margin:24px auto;
	max-width:1080px;
	padding:28px 28px 20px;
	background:linear-gradient(135deg,#fff7f2 0%,#fff 55%,#f2f7ff 100%);
	border:2px solid var(--fpt-cam,#f37021);
	border-radius:14px;
	box-shadow:0 6px 24px rgba(243,112,33,.12);
}
.fpt360-uudai-badge{
	position:absolute; top:-14px; left:24px;
	padding:4px 14px;
	font-size:13px; font-weight:700; letter-spacing:1px; color:#fff;
	background:var(--fpt-cam,#f37021);
	border-radius:14px;
}
.fpt360-uudai-title{
	margin:4px 0 12px;
	font-size:24px; line-height:1.35; font-weight:800;
	color:var(--fpt-xanh,#004a99);
	text-transform:uppercase;
}
.fpt360-uudai-body{ font-size:15px; line-height:1.7; color:#333; }
.fpt360-uudai-body ul{ margin:0; padding-left:20px; }
.fpt360-uudai-body li{ margin-bottom:6px; }

@media (max-width:600px){
	.fpt360-uudai{ padding:24px 16px 14px; margin:18px auto; }
	.fpt360-uudai-title{ font-size:18px; }
}

/* ---------- v2.0: Nút location nổi (góc phải dưới) ---------- */
.fpt360-tinh-noi{
	position:fixed; right:16px; bottom:16px; z-index:99990;
	display:inline-flex; align-items:center; gap:7px;
	padding:10px 16px;
	font-size:14px; font-weight:700; color:#fff;
	background:var(--fpt-xanh,#004a99);
	border:none; border-radius:24px;
	box-shadow:0 4px 16px rgba(0,0,0,.28);
	cursor:pointer;
	transition:background .15s ease, transform .15s ease;
}
.fpt360-tinh-noi:hover{ background:var(--fpt-cam,#f37021); transform:translateY(-2px); }
@media (max-width:600px){
	.fpt360-tinh-noi{ right:10px; bottom:10px; padding:9px 13px; font-size:13px; }
}

/* ---------- v2.0: Banner đầu trang ---------- */
.fpt360-banner{ display:block; margin:0 auto 20px; max-width:1080px; }
.fpt360-banner img{ display:block; width:100%; height:auto; border-radius:12px; }
.fpt360-banner:hover img{ opacity:.95; }

/* ---------- v2.2: Banner slider nhiều ảnh (tự trượt) ---------- */
.fpt360-banner-slider{ position:relative; max-width:1080px; margin:0 auto 20px; overflow:hidden; border-radius:12px; }
.fpt360-banner-track{ display:grid; }
.fpt360-banner-slide{ grid-area:1 / 1; opacity:0; transition:opacity .5s ease; pointer-events:none; }
.fpt360-banner-slide.is-active{ opacity:1; pointer-events:auto; z-index:1; }
.fpt360-banner-slide img{ display:block; width:100%; height:auto; }
.fpt360-banner-nav{ position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; border:none; border-radius:50%; background:rgba(0,0,0,.4); color:#fff; font-size:18px; line-height:40px; cursor:pointer; z-index:3; opacity:0; transition:opacity .2s; }
.fpt360-banner-slider:hover .fpt360-banner-nav{ opacity:1; }
.fpt360-banner-nav.is-prev{ left:12px; }
.fpt360-banner-nav.is-next{ right:12px; }
.fpt360-banner-nav:hover{ background:rgba(0,0,0,.65); }
.fpt360-banner-dots{ position:absolute; left:0; right:0; bottom:12px; display:flex; justify-content:center; gap:8px; z-index:3; }
.fpt360-banner-dot{ width:10px; height:10px; padding:0; border:none; border-radius:50%; background:rgba(255,255,255,.6); cursor:pointer; box-shadow:0 0 3px rgba(0,0,0,.3); }
.fpt360-banner-dot.is-active{ background:#fff; }
@media (max-width:600px){
	.fpt360-banner-nav{ width:32px; height:32px; font-size:15px; line-height:32px; opacity:1; }
}