/* Mobile Home Pro+ CSS */

/* container */
.mh-container { max-width:1200px; margin:0 auto; display:flex; gap:18px; align-items:flex-start; }
.mh-main { width:100%; }
.mh-sidebar-pc { width:300px; }
@media(max-width:991px){ .mh-container{flex-direction:column} .mh-sidebar-pc{display:none} .mh-sidebar-mobile{display:block} }

/* header card */
.card{ background:#fff;border-radius:10px;padding:14px;margin-bottom:16px;box-shadow:0 6px 22px rgba(6,21,34,.06); }

/* SWIPER */
.swiper { width:86%; height:400px; border-radius:8px; overflow:hidden; position:relative; margin-bottom:12px; }
.swiper-slide { background-size:cover;background-position:center; display:flex; align-items:center; justify-content:center; }
.swiper-pagination { position:absolute; left:50% !important; transform:translateX(-50%); bottom:12px; z-index:30; }
.swiper-button-next, .swiper-button-prev { color:#fff; opacity:.9; }
.swiper-wrapper {
    position: absolute !important;
	height: 100%;}
/* caption */
.swipe-caption { position:absolute; left:20px; bottom:18px; color:#fff; background:rgba(0,0,0,.36); padding:8px 12px; border-radius:8px; font-weight:700; }

/* blocks */
.mh-block-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.mh-row{ display:flex; gap:12px; overflow:auto; padding-bottom:6px; -webkit-overflow-scrolling:touch; }
.mh-item{ width:120px; flex:0 0 auto; text-align:center; }
.mh-thumb img{ width:100%; height:140px; object-fit:scale-down; border-radius:8px;}
.mh-title{ font-size:14px; margin:8px 0 4px; color:#0b1b28; }
.mh-price{ color:#e54b4b; font-weight:700; font-size:13px; }

/* sidebars and widgets */
.mh-sidebar-pc { background:var(--pc-sidebar-bg); color:var(--pc-sidebar-text); padding:12px; border-radius:8px; margin-top: 40px; }
.mh-sidebar-pc .widget-title{ color: var(--pc-sidebar-title);font-weight: 700;margin-bottom: 8px;background: #000000;padding: 5px;border: 2px solid var(--pc-sidebar-title);border-radius: 5px;text-align: center; }
.mh-sidebar-mobile { display:none; background:var(--mob-sidebar-bg); color:var(--mob-sidebar-title); padding:12px; border-radius:8px; }
.mh-linklist a {color: var(--pc-sidebar-text);}

/* brand list */
.mh-brand-list{ list-style:none;padding:0;margin:0; }
.mh-brand-list li{ padding:8px 6px; border-bottom:1px solid rgba(255,255,255,.04); display:flex; justify-content:space-between; align-items:center; }
.mh-brand-list a{ color:var(--pc-sidebar-text); text-decoration:none; }

/* ribbons */
.mh-ribbon{ display:inline-block; font-size:11px; padding:4px 6px; border-radius:6px; margin-left:8px; color:#fff; background:#ff5a5a; font-weight:700; }
.mh-ribbon.new{ background:#ff4d4f; }
.mh-ribbon.trending{ background:#ff8a00; }
.mh-ribbon.coming-soon{ background:#6b7280; }
.mh-ribbon.popular{ background:#0ea5a0; }
.mh-ribbon.discount{ background:#d946ef; }

/* linklist */
.mh-linklist{ list-style:none;padding:0;margin:0; }
.mh-linklist li{ padding:8px 0; border-bottom:1px dashed rgba(0,0,0,.03); }

/* misc */
.mh-more{ color:#0f62ff; font-weight:700; text-decoration:none; }

/* responsive tweaks */
@media(max-width:600px){
  .swiper { height:210px; width: 95%;}
  .mh-item{ width:92px; }
  .mh-thumb img{ height:80px; }
.swiper-button-next, .swiper-button-prev { display:none; }
.mh-sidebar-mobile {
	display: block !important;
	background: var(--mob-sidebar-bg);
    color: var(--mob-sidebar-title);
    padding: 12px;
    border-radius: 8px;
    width: -webkit-fill-available;
	margin: 15px;}
}
	@media(max-width:412px){ .swiper { height:180px; width: 95%;}
		
	}