/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Sarabun:wght@400;700&display=swap');

/* Basic HTML */
body {
	font-family: Sarabun;
	font-size: 16px;
	margin: 0;
	padding: 0;
	color: #666;
}

a,
a:link,
a:hover {
	color: #000;
	text-decoration: none;
}

h1,h2,h3,h4,h5,h6,h7 {
	/*font-family: Kanit;*/
	font-weight: normal;
	margin: 0;
	padding: 0;
}

/* Maintenance page */
body.maintenance-page header {
	display: none;
}

body.maintenance-page main > .row {
	display: flex;
	align-items: center;
  	justify-content: center;
	width: 100%;
	height: 100vh;
	margin: 0 auto;
}

/* Privacy policy */
#sliding-popup {
	background: #E8EAED url("images/privacy-policy.png") center top 19px no-repeat !important;
	background-size: 40px 45px !important;
	box-shadow: 0 -5px 5px rgba(0,0,0,.16);
	padding: 72px 40px 40px 34px;
}

#sliding-popup div,
#sliding-popup h2,
#sliding-popup p,
#sliding-popup button {
	font-size: 14px;
	font-weight: normal;
	color: #35383B;
}

#sliding-popup #popup-text {
}

#sliding-popup #popup-buttons {
	padding-top: 16px;
}

#sliding-popup button.find-more-button {
	font-weight: bold;
}

#sliding-popup button.agree-button,
#sliding-popup button.decline-button {
	display: block;
	width: 100%;
	margin: 8px 0 0;
	padding: 0 10px;
	/*font-size: 18px;*/
	line-height: 40px;
	font-weight: bold;
	border-radius: 20px;
	background-image: none;
}

#sliding-popup button.agree-button {
	color: #fff;
	background-color: #4285F4;
	border: #6BADF9 2px solid;
}

#sliding-popup button.decline-button {
	color: #80868B;
	background-color: #fff !important;
	border: #80868B 2px solid;
}

/* Slick */
.slick .slide__content img {
	width: 100%;
	height: auto;
}

/* Drupal elements */
.site-logo img {
	width: 200px;
	height: auto;
}

/* Product */
.page-product #block-belgrade-content .row .col-md-5 {
	display: none;
}

.page-product #block-belgrade-content .row .col-md-7 {
	width: 100%;
}

.page-product article {
	display: flex;
	flex-wrap: wrap;
	padding: 0 10px;
}

.page-product article > div {
	display: block;
	width: 100%;
	order: 999;
	font-size: 14px;
	margin: 0;
	padding: 10px 0;
	border-bottom: #E3E3E3 1px dashed;
}

.page-product article .form-label {
	margin-bottom: 0;
	font-size: 14px;
}

.page-product article .form-label::after {
	content: ":";
	vertical-align: text-top;
}

.page-product article .slick--field-images {
	border: none;
	order: 1;
}

.page-product article .product-category {
	order: 2;
}

.page-product article .field-categories {
	display: inline-block;
}

.page-product article .field-categories::after {
	content: ",";
	margin-right: 5px;
}

.page-product article .field-categories:last-child::after {
	content: "";
	margin-right: 0;
}

.page-product article .product-price,
.page-product article [class^="product--variation-field--variation_price__"] {
	order: 3;
	padding-bottom: 0;
	border: none;
}

.page-product article .price {
	font-size: 22px;
}

.page-product article .product-list-price,
.page-product article [class^="product--variation-field--variation_list_price__"] {
	order: 4;
}

.page-product article .product-brand {
	order: 5;
}

.page-product article .field-title-th,
.page-product article .field-title-en {
	border-bottom: none;
}

.page-product article .field-title-th {
	order: 6;
	font-size: 22px;
	padding-bottom: 0;
}

.page-product article .field-title-en {
	order: 7;
	font-size: 16px;
	padding-top: 0;
}

.page-product article .body {
	order: 8;
}

.page-product article .product-dimension {
	order: 9;
}

.page-product article .product-material {
	order: 10;
}

.page-product article .product-addtocart {
	order: 11;
	border-bottom: none;
}

.page-product article .product-vari-image {
	order: 12;
}

/* Block: Chat icons */
#block-block-chat-icons {
	padding: 20px;
	background-color: #F7F7F7;
}

#block-block-chat-icons > h2 {
	font-size: 14px;
	line-height: 30px;
	font-weight: bold;
	padding-left: 30px;
	background: transparent url(images/icon-chats.png) left center no-repeat;
	background-size: 20px;
	border-bottom: #000 1px solid;
}

.view-block-chat-icons .view-content .views-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.view-block-chat-icons .view-content .views-field {
	/*display: inline-block;*/
}

.view-block-chat-icons .view-content .views-field-field-line-id a,
.view-block-chat-icons .view-content .views-field-field-line-at a,
.view-block-chat-icons .view-content .views-field-field-facebook a,
.view-block-chat-icons .view-content .views-field-field-instagram a {
	display: inline-block;
	font-size: 0;
	width: 40px;
	height: 40px;
	background-size: 100%;
}

.view-block-chat-icons .view-content .views-field-field-line-id a,
.view-block-chat-icons .view-content .views-field-field-line-at a {
	background-image: url(images/button-line.png);
}

.view-block-chat-icons .view-content .views-field-field-facebook a {
	background-image: url(images/button-facebook.png);
}

.view-block-chat-icons .view-content .views-field-field-instagram a {
	background-image: url(images/button-instagram.png);
}

.view-block-chat-icons .view-content .views-field-field-phone,
.view-block-chat-icons .view-content .views-field-field-email {
	display: block;
	width: 100%;
}

.view-block-chat-icons .view-content .views-field-field-phone a,
.view-block-chat-icons .view-content .views-field-field-email a {
	display: block;
	font-size: 14px;
	line-height: 30px;
	font-weight: bold;
	padding: 10px 0 10px 40px;
	background-position: center left;
	background-repeat: no-repeat;
	background-size: 20px;
}

.view-block-chat-icons .view-content .views-field-field-phone a {
	background-image: url(images/icon-phone.png);
	margin-top: 20px;
	border-top: #000 1px solid;
}

.view-block-chat-icons .view-content .views-field-field-email a {
	background-image: url(images/icon-email.png);
}

/* Views: Product list */
.view-page-product-list {

}

.view-header-brand-list .view-header,
.view-header-brand-list .view-content,
.view-header-brand-list .view-content .item-list,
.view-header-brand-list .view-content .item-list ul {
	display: inline;
}

.view-header-brand-list .view-content .item-list ul,
.view-header-brand-list .view-content .item-list ul > li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.view-header-brand-list .view-header a,
.view-header-brand-list .view-content .item-list ul > li {
	display: inline-block;
	/*border: #000 1px solid;*/
	margin: 5px;
	padding: 0 10px;
	box-shadow: 0 0 5px rgba(0,0,0,0.1);
	border-radius: 10px;
}

.view-page-product-list .view-content .views-view-responsive-grid__item {
	padding-bottom: 40px;
}

.view-page-product-list .view-content .views-field-field-image {
}

.view-page-product-list .view-content .views-field-field-title-th {
	margin-top: 10px;
}

.view-page-product-list .view-content .views-field-field-title-th,
.view-page-product-list .view-content .views-field-field-title-th a {
	font-size: 14px;
	color: #000;
}

.view-page-product-list .view-content .views-field-field-title-en,
.view-page-product-list .view-content .views-field-field-title-en a {
	font-size: 12px;
	color: #696A69;
}

/* Add to cart confirm */
.commerce-confirmation-popup {
	max-width: 100% !important;
}

.commerce-add-to-cart-confirmation .button {
	margin-bottom: 10px;
}

.commerce-add-to-cart-confirmation .button a {
	color: #fff;
}

.commerce-add-to-cart-confirmation .button.checkout {
	background-color: #4285F4;
}

.commerce-add-to-cart-confirmation .button.continue {
	background-color: green;
}

/* Payment Instructions */
.checkout-complete__payment-instructions a[title="Add slip"] {
	color: #fff;
	background-color: green;
	border-radius: 5px;
	padding: 10px 20px;
}

/* Block: QR Code */
#qr-block img {
	width: 300px;
	max-width: 100%;
	margin: 20px auto;
}