/* 
Theme Name:		 flatsome-child
Theme URI:		 http://childtheme-generator.com/
Description:	 flatsome-child is a child theme of Flatsome, created by ChildTheme-Generator.com
Author:			 TDC
Author URI:		 http://childtheme-generator.com/
Template:		 flatsome
Version:		 1.0.0
Text Domain:	 flatsome-child
*/

header#header {
    background: #ffffffbf;
}
ul.header-nav li.menu-item a {
    color: #000;
}
.pv_btn_primary {
	color: #ffffff;
	background: #1F0F07;
}
.bg_gr1 {
	background: #E2CEB9;
	background: linear-gradient(107deg, rgba(226, 206, 185, 1) 0%, rgba(85, 63, 45, 1) 87%);
}
.khonggian_slider .flickity-slider .col.post-item {
  transition: transform 0.4s ease, opacity 0.4s ease;
  transform-origin: center center;
}
.showroom .medium-6 {
	padding:0;
}
.home_blog .box-image {
	border-radius: 0 !important;
}
.home_blog .box.box-normal {
    border: solid 1px #ccc;
}

.ctf_footer .col {
    margin: 0;
    padding-bottom: 0;
    padding-right: 0;
}
.ctf_footer input {
    background: none;
    border-top: none;
    border-right: none;
}
.ctf_footer input[type=submit] {
    background: none;
    border-bottom: solid 1px #dddddd;
    border-left: solid 1px #dddddd;
    /* padding-right: 0; */
    /* margin-right: 0; */
}
footer#footer .col {
    margin: 0 !important;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}
footer#footer p, 
footer#footer span, 
footer#footer h5, 
footer#footer input[type=submit], 
footer#footer button {
    font-size: 87%;
}


/*.book_style .box.box-blog-post {*/
/*    box-shadow: 6px 6px 12px rgb(0 0 0 / 87%), 10px 10px 20px rgba(0, 0, 0, 0.1);*/
/*    border-right: solid 3px #ccc;*/
/*    border-bottom: solid 1px #ccc;*/
/*    transition: none;*/
/*}*/
/*.book_style .post-item:hover {*/
/*    transform: translateY(-6px);*/
/*    transition-timing-function: ease-out;*/
/*    transition-duration: 0.2s;*/
/*}*/



.box-blog-post .is-divider {
    display: none;
}





.book_style .post-item {
  perspective: 2000px;
  padding: 10px;
}

.has-shadow>.col>.col-inner {
    background: none !important;
    box-shadow: none !important;
}

/* === Vỏ sách chính === */
.book_style .box.box-blog-post {
  position: relative;
  transform-style: preserve-3d;
  transform: rotateY(-18deg);
  transform-origin: left center;
  background: #fff;
  border-radius: 3px;
  overflow: visible;
  transition: all 0.4s ease;
  box-shadow: 10px 12px 22px rgba(0,0,0,0.25);
}

/* Ảnh bìa */
.book_style .image-cover {
  position: relative;
  z-index: 5;
  overflow: hidden;
}

.book_style .image-cover img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  object-fit: cover;
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: inset 0 0 2px rgba(0,0,0,0.1);
}

/* Hiệu ứng gáy sách */
.book_style .box.box-blog-post::after {
  content: "";
  position: absolute;
  top: 3.5%;
  right: -14px;
  width: 16px;
  height: 96%;
  background: repeating-linear-gradient(
    to right,
    #fff 0px,
    #f8f8f8 1px,
    #ffffff 2px,
    #f7f7f7 3px
  );
  border-left: 1px solid rgba(0,0,0,0.05);
  border-radius: 0 2px 2px 0;
  box-shadow: inset -1px 0 2px rgba(0,0,0,0.15),
              6px 6px 12px rgba(0,0,0,0.15);
  z-index: 1;
}

/* Bóng dưới quyển sách */
.book_style .box.box-blog-post::before {
  content: "";
  position: absolute;
  bottom: 8px;
  left: 0;
  width: 100%;
  height: 6px;
  background: transparent;
  box-shadow: 12px 12px 20px rgba(0, 0, 0, 0.35);
  border-radius: 50%;
  z-index: 0;
}

/* Tiêu đề bên dưới */
.book_style .box-text {
    position: relative;
    text-align: center;
    background: transparent;
    z-index: 10;
    padding-top: 8px;
    top: -20px;
    padding-bottom: 0;
}

.book_style .post-title {
  font-family: "Playfair Display", serif;
  letter-spacing: 1px;
  color: #ccc;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  font-weight: 500;
}

/* Hover: sách hơi nghiêng ra và sáng bìa */
.book_style .post-item:hover .box.box-blog-post {
  box-shadow: 14px 16px 28px rgba(0,0,0,0.35);
}

.book_style .post-item:hover .image-cover img {
  filter: brightness(1.05);
}

/* Responsive giảm nghiêng khi màn hình nhỏ */
@media (max-width: 768px) {
  .book_style .box.box-blog-post {
    transform: rotateY(-10deg);
  }
  .book_style .box.box-blog-post::after {
    right: -10px;
    width: 10px;
  }
}