﻿@charset "UTF-8";

/* ============================================================================
   TRANG CHU - style RIENG
   ----------------------------------------------------------------------------
   Hien chi lo vung "Bo suu tap". Tach khoi style.css de sua vung nay khong
   phai mo tep chung.

   Vi sao doi ten lop tu .az-template-showcase sang .az-template-collection:
	 script.js co ham Showcase() tu chay bang setInterval - cac o chong len
	 nhau, ba giay doi mot anh, KHONG keo duoc. Gio chuyen sang slick thi hai
	 co che se dam nhau. Doi ten lop la cach sach nhat: ham kia tim
	 '.az-template-showcase' khong thay gi nen tu thoat, khong phai sua tep chung.
   ========================================================================== */

@layer overrides {

	/* ======================================================================
	   BANG BANG DAU TRANG
	   ====================================================================== */

	/* Viec chon anh theo thiet bi da lam o MAY CHU (OS.Device.isDesktop) nen
	   trong trang chi con DUNG MOT khoi. Phai go hai luat an/hien cu trong
	   style.css:
	     .az-template-slidemobile { display: none }
	     @media (max-width: 768px) { .az-template-slidedesktop { display: none } }
	   De nguyen thi thu nho cua so may tinh xuong duoi 768px la bang bang bien
	   mat han, va may dien thoai co khung nhin rong hon 768px cung mat luon. */
	.az-template-slidedesktop,
	.az-template-slidemobile { display: block; }

	/* Ban dang chay tren dien thoai: anh TRAN VIEN, cao tu nhien theo anh.
	   Ban ta dang de le hai ben, bo goc, va khoa ti le 16/6 nen anh doc bi xen
	   mat phan tren duoi. Neo theo LOP chu khong theo be ngang khung nhin, cho
	   khop voi cach chon o may chu - may tinh bang khung nhin rong van dung
	   dung kieu cua thiet bi minh. */
	.az-template-slidemobile {
		max-width: none;
		margin: 0;
		padding: 0;
	}

	.az-template-slidemobile img {
		width: 100%;
		height: auto;
		aspect-ratio: auto;
		object-fit: initial;
		border-radius: 0;
	}


	/* Khung ti le 2:1 - dung bang 'padding-top: 50%' cua ban dang chay
	   (DevTools: div.img-inner.image-cover style="padding-top:50%"). */
	.az-template-collection {
		position: relative;
		aspect-ratio: 2;
		margin-bottom: 30px;
		background: #000;
		border-radius: var(--az-template-radius);
		overflow: hidden;
	}

	/* Truoc khi slick dung xong: chi hien o dau tien. Khong co luat nay thi ca
	   nam anh xep chong doc lam trang giat mot nhip khi tai. */
	.az-template-collection > div { display: none; }
	.az-template-collection > div:first-child { display: block; }
	.az-template-collection.slick-initialized > div { display: block; }

	/* slick long them hai lop khung - keo chieu cao xuyen qua chung, khong thi
	   anh khong biet lay chieu cao o dau va se sap xuong 0. */
	.az-template-collection .slick-list,
	.az-template-collection .slick-track { height: 100%; }

	.az-template-collection .slick-slide,
	.az-template-collection .slick-slide > div { height: 100%; }

	.az-template-collectionitem {
		display: block;
		width: 100%;
		height: 100%;
	}

	/* Ban goc dung lop 'image-cover' (background-size: cover) - anh phu KIN
	   khung, thua dau cat dau. Ban cu dat 'contain' vi so cat mat chu trong
	   anh, doi lai anh khong lap day vung va lo hai dai den hai ben.
	   Do lai: anh ban goc 1560x878 (ti le 1,78) trong khung ti le 2 nen cover
	   chi xen tren duoi mot chut, ma chu thi nam giua anh - khong mat chu. */
	.az-template-collection img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	/* Con tro hinh ban tay cho biet keo duoc */
	.az-template-collection .slick-list.draggable { cursor: grab; }
	.az-template-collection .slick-list.dragging { cursor: grabbing; }
}
