/*
Theme Name: Men Stay Simplicity Child
Template: blocksy
Author: Migration
Version: 1.0
Text Domain: menstay-child
*/

:root{
  /* NAKIZ brand palette */
  --pink:#EC0A8C; --pink-dark:#c40873; --yellow:#FFE100; --teal:#0C8B9C; --teal-dark:#0a7381;
  --main-color:#EC0A8C; --text-color:#212529; --price:#212121; --hover:#EC0A8C;
  --btn-color:#a05139; --btn-bg:#fff4f0; --btn-hover:#ffb9a4;
  --title-promo:#EC0A8C; --title-new:#0C8B9C; --title-best:#EC0A8C; --title-featured:#EC0A8C;
  --allprod-bg:#fff2eb; --banner-bg:#f8f3bc; --social-footer:#ffece1; --footer-title:#a05139;
  --bg-related-blog:#fcf8f4; --font-base:'Roboto',sans-serif;
  --wrap:1200px;
}

/* Force Roboto everywhere — override Blocksy's system-font CSS variables + direct rules */
:root, body{
  --theme-font-family:'Roboto',sans-serif;
  --theme-heading-font-family:'Roboto',sans-serif;
  --theme-button-font-family:'Roboto',sans-serif;
  --theme-form-font-family:'Roboto',sans-serif;
}
body,button,input,select,textarea,h1,h2,h3,h4,h5,h6{font-family:'Roboto',sans-serif !important;}
body{color:var(--text-color);font-size:14px;line-height:1.5;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;height:auto;display:block;}
.mss-wrap{max-width:var(--wrap);margin:0 auto;padding:0 15px;}

/* ============ TOP BAR ============ */
.mss-topbar{position:relative;width:100%;background:var(--pink);line-height:0;}
.mss-topbar__link{display:block;}
.mss-topbar img{width:100%;height:auto;margin:0 auto;max-width:1920px;}
.mss-topbar__close{position:absolute;top:50%;right:14px;transform:translateY(-50%);width:26px;height:26px;padding:0;border:none;border-radius:50%;background:rgba(0,0,0,.28);color:#fff;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;transition:background .2s;}
.mss-topbar__close:hover{background:rgba(0,0,0,.5);}

/* ============ HEADER ============ */
.mss-header{background:var(--pink);color:#fff;}
.mss-header__inner{display:flex;align-items:center;gap:28px;padding:16px 15px;max-width:1400px;margin:0 auto;}
.mss-logo img{height:52px;width:auto;}
.mss-search{flex:1;position:relative;max-width:760px;}
.mss-search input[type=search]{width:100%;height:52px;border:none;border-radius:30px;padding:0 54px 0 26px;font-size:15px;background:#fff;color:#333;outline:none;}
.mss-search button{position:absolute;left:14px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#333;font-size:20px;line-height:1;}
.mss-head-actions{display:flex;align-items:center;gap:26px;margin-left:auto;}
.mss-head-actions a{color:#fff;display:flex;align-items:center;}
.mss-icon{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:1.6;}
.mss-cart{position:relative;}
.mss-cart__count{position:absolute;top:-8px;right:-10px;background:var(--yellow);color:var(--pink-dark);font-size:11px;font-weight:700;min-width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0 4px;}

/* ============ NAV ============ */
.mss-nav{background:var(--pink);border-top:1px solid rgba(255,255,255,.15);}
.mss-nav__inner{display:flex;justify-content:center;flex-wrap:wrap;gap:0;max-width:1400px;margin:0 auto;}
.mss-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;}
.mss-nav li{position:relative;}
.mss-nav a{color:#fff;display:block;padding:16px 24px;font-size:16px;font-weight:600;transition:color .2s;}
.mss-nav a:hover{color:var(--yellow);}
.mss-nav .sub-menu{position:absolute;top:100%;left:0;background:#fff;min-width:230px;box-shadow:0 12px 30px rgba(0,0,0,.15);border-radius:0 0 8px 8px;padding:8px 0;display:none;z-index:60;}
.mss-nav li:hover>.sub-menu{display:block;}
.mss-nav .sub-menu a{color:#333;padding:10px 22px;font-size:14px;font-weight:500;}
.mss-nav .sub-menu a:hover{color:var(--pink);background:#fdeaf5;}

/* ============ HERO ============ */
.mss-hero{display:grid;grid-template-columns:1fr 320px;gap:14px;max-width:1400px;margin:14px auto;padding:0 15px;}
.mss-hero__main{position:relative;border-radius:10px;overflow:hidden;}
.mss-hero__main .slide{display:none;}
.mss-hero__main .slide.active{display:block;animation:fade .6s;}
@keyframes fade{from{opacity:.4}to{opacity:1}}
.mss-hero__side{display:grid;grid-template-rows:1fr 1fr;gap:14px;}
.mss-hero__side a{border-radius:10px;overflow:hidden;display:block;}
.mss-hero__dots{position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:8px;}
.mss-hero__dots span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.6);cursor:pointer;}
.mss-hero__dots span.active{background:var(--main-color);}

/* ============ POLICY STRIP ============ */
.mss-policy{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1400px;margin:22px auto;padding:0 15px;}
.mss-policy__item{background:#ededed;border-radius:12px;padding:22px 20px;display:flex;align-items:center;gap:16px;}
.mss-policy__item svg{width:42px;height:42px;flex:0 0 42px;stroke:var(--pink);fill:none;stroke-width:1.4;}
.mss-policy__t{font-weight:800;font-size:15px;text-transform:uppercase;letter-spacing:.3px;}
.mss-policy__s{font-size:14px;color:#666;}

/* ============ SECTION TITLES ============ */
.mss-section{max-width:1400px;margin:40px auto;padding:0 15px;}
.mss-section__head{text-align:center;margin-bottom:26px;}
.mss-section__title{font-size:30px;font-weight:900;text-transform:uppercase;color:var(--title-featured);margin:0;}
.mss-section--promo .mss-section__title{color:var(--title-promo);}
.mss-section--new .mss-section__title{color:var(--title-new);}
.mss-section--best .mss-section__title{color:var(--title-best);}
.mss-section__sub{color:#888;font-size:15px;margin-top:6px;}

/* ============ PRODUCT GRID (homepage modules) ============ */
.mss-products ul.products{display:grid !important;grid-template-columns:repeat(4,1fr);gap:20px;list-style:none;margin:0;padding:0;}
.mss-products ul.products li.product{margin:0 !important;width:auto !important;text-align:left;background:#fff;}
.mss-products ul.products li.product a img{border-radius:8px;margin-bottom:12px;}
.mss-products ul.products li.product .woocommerce-loop-product__title{font-size:14px !important;font-weight:500;color:var(--text-color);padding:0 !important;line-height:1.4;min-height:40px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.mss-products ul.products li.product .mss-buy .price{color:var(--price) !important;font-weight:600;font-size:15px;}
.mss-products ul.products li.product .price del{color:#999 !important;font-weight:400;font-size:13px;opacity:1;}
.mss-products ul.products li.product .price ins{text-decoration:none;}
.mss-products .product .button,.mss-products .product .added_to_cart{background:var(--pink) !important;color:var(--yellow) !important;border-radius:8px !important;padding:10px 14px !important;font-weight:600;}
/* hide Blocksy category meta in loop */
.mss-products ul.products li.product .entry-meta{display:none !important;}
/* hide Blocksy's own duplicate price + add-to-cart (direct children of card);
   ours live nested inside .mss-buy so child combinator (>) leaves them untouched */
.mss-products ul.products li.product > .price{display:none !important;}
.mss-products ul.products li.product > .ct-woo-card-actions{display:none !important;}
.mss-products ul.products li.product figure{position:relative;margin:0 0 12px;overflow:hidden;border-radius:8px;background:#fff;}
/* source uses square (1:1) product images on white bg — show full product, no crop */
.mss-products ul.products li.product figure img,
.mss-products ul.products li.product img.wp-post-image{aspect-ratio:1/1 !important;width:100% !important;height:auto !important;object-fit:contain !important;}
/* price + savings + icon cart button row (matches source) */
.mss-products ul.products li.product .mss-buy{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;}
.mss-products ul.products li.product .mss-buy__info{display:flex;flex-direction:column;gap:3px;min-width:0;}
.mss-products ul.products li.product .mss-buy .price{margin:0;}
.mss-save{color:var(--main-color);font-size:12px;font-weight:400;}
.mss-products ul.products li.product .mss-buy__btn .button{width:46px;height:46px;min-width:46px;padding:0 !important;border-radius:8px !important;background:var(--pink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFE100' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E") center/22px 22px no-repeat !important;display:inline-flex;font-size:0 !important;text-indent:-9999px;overflow:hidden;position:relative;margin:0 !important;flex:0 0 auto;}
.mss-products ul.products li.product .mss-buy__btn .button::before{display:none !important;}
.mss-products ul.products li.product .mss-buy__btn .added_to_cart{display:none !important;}
/* hide WooCommerce SALE badge — source bakes NO.1/SALE ribbon into the product image */
.mss-products span.onsale{display:none !important;}

/* ============ FULL-WIDTH BANNER ============ */
.mss-fullbanner{margin:40px 0;line-height:0;}
.mss-fullbanner img{width:100%;}

/* ============ CATEGORY TILES ============ */
.mss-tiles{display:grid;grid-template-columns:2fr 1fr;gap:16px;max-width:1400px;margin:40px auto;padding:0 15px;}
.mss-tiles__col{display:grid;grid-template-rows:1fr 1fr;gap:16px;}
.mss-tiles a{border-radius:10px;overflow:hidden;display:block;}

/* ============ CITIZEN (full-width image + text overlaid on right, white bg) ============ */
.mss-citizen{background:#fff;padding:0;margin:44px 0;}
.mss-citizen__inner{position:relative;max-width:1400px;margin:0 auto;padding:0 15px;}
.mss-citizen__bg{width:100%;height:auto;display:block;}
.mss-citizen__text{position:absolute;top:50%;right:15px;transform:translateY(-50%);width:46%;padding-right:30px;}
.mss-citizen__text h2{font-size:26px;font-weight:600;text-transform:uppercase;color:#000;margin:0 0 12px;line-height:1.2;}
.mss-citizen__list{list-style:none;margin:0 0 4px;padding:0;font-size:14px;line-height:1.5;color:#212529;}
.mss-citizen__list li{padding:3px 0 3px 26px;position:relative;}
.mss-citizen__list li::before{content:"✔";position:absolute;left:0;color:#2ca02c;font-weight:700;}
.mss-citizen__note{font-size:14px;margin:0 0 16px;color:#212529;}
.mss-citizen__btns{display:flex;gap:14px;}
.mss-btn{display:inline-block;padding:14px 34px;font-weight:700;border-radius:6px;font-size:16px;}
.mss-btn--outline{border:2px solid var(--teal);color:var(--teal);background:#fff;}
.mss-btn--dark{background:var(--pink);color:var(--yellow);}
.mss-citizen__btns .mss-btn{padding:8px 22px;border-radius:0;font-weight:600;border:1px solid var(--teal);}
.mss-citizen__btns .mss-btn--dark{background:var(--pink);color:var(--yellow);border-color:var(--pink);}

/* ============ FOOTER ============ */
.mss-footer{background:var(--teal);color:#eafafc;padding:50px 0 0;border-top:4px solid var(--pink);}
.mss-footer__inner{display:grid;grid-template-columns:1.2fr 1.2fr 1fr;gap:40px;max-width:1400px;margin:0 auto;padding:0 15px;}
.mss-footer h3{color:#fff;font-size:20px;font-weight:800;text-transform:uppercase;margin:0 0 20px;}
.mss-footer__logo{width:200px;margin-bottom:18px;}
.mss-footer p,.mss-footer li{font-size:14px;line-height:1.9;color:#d4f2f5;}
.mss-footer ul{list-style:none;margin:0;padding:0;}
.mss-footer a:hover{color:#fff;}
.mss-footer__bct{width:150px;margin-top:20px;}
.mss-footer__bottom{border-top:1px solid rgba(255,255,255,.2);margin-top:40px;padding:22px 15px;max-width:1400px;margin-left:auto;margin-right:auto;display:flex;align-items:center;justify-content:space-between;}
.mss-footer__social{display:flex;gap:12px;margin-left:auto;}
.mss-footer__social a{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.mss-footer__online{text-align:center;padding:14px;font-size:14px;color:#d4f2f5;}

/* ============ FLOATING CONTACT BUTTONS (Zalo + Gọi) — ported from MINIVIETNAM ============ */
.mss-fab{position:fixed;bottom:18px;z-index:1010;display:flex;flex-direction:column;gap:12px;align-items:center;}
.mss-fab--right{right:18px;}
.mss-fab--left{left:18px;}
.mss-fab__btn{position:relative;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;box-shadow:0 8px 22px -8px rgba(0,0,0,.45);transition:transform .2s,box-shadow .2s;}
.mss-fab__btn:hover,.mss-fab__btn:focus{color:#fff;transform:scale(1.1);box-shadow:0 12px 28px -8px rgba(0,0,0,.55);}
.mss-fab__btn--zalo{background:#0068ff;}
.mss-fab__btn--call{background:#16a34a;}
.mss-fab-zalo{display:block;}
.mss-fab__btn::before{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;z-index:-1;animation:mssFabPulse 2.4s ease-out infinite;}
@keyframes mssFabPulse{0%{transform:scale(1);opacity:.45;}70%{transform:scale(1.5);opacity:0;}100%{transform:scale(1.5);opacity:0;}}
@media(prefers-reduced-motion:reduce){.mss-fab__btn::before{animation:none;opacity:0;}.mss-fab__btn{transition:none;}}
@media(max-width:767px){.mss-fab{bottom:14px;gap:10px;}.mss-fab--right{right:14px;}.mss-fab--left{left:14px;}.mss-fab__btn{width:48px;height:48px;}.mss-fab-zalo{width:36px;}}

/* ============ WOO GLOBAL ACCENTS (product/category/cart pages) ============ */
.woocommerce ul.products li.product .price,.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--main-color);}
.woocommerce span.onsale{background:var(--main-color);}
.woocommerce #respond input#submit,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{background:var(--teal);color:#fff;border-radius:8px;}
.woocommerce #respond input#submit:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover{background:var(--teal-dark);color:#fff;}
.woocommerce #respond input#submit.alt,.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt{background:var(--pink);color:var(--yellow);border-radius:8px;}
.woocommerce #respond input#submit.alt:hover,.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce input.button.alt:hover{background:var(--pink-dark);color:var(--yellow);}

/* ============ RESPONSIVE ============ */
@media(max-width:1024px){
  .mss-hero{grid-template-columns:1fr;}
  .mss-hero__side{grid-template-rows:none;grid-template-columns:1fr 1fr;}
  .mss-policy{grid-template-columns:repeat(2,1fr);}
  .mss-products ul.products{grid-template-columns:repeat(3,1fr);}
  .mss-tiles{grid-template-columns:1fr;}
  .mss-citizen__text{position:static;transform:none;width:auto;right:auto;padding:20px 15px 4px;}
  .mss-footer__inner{grid-template-columns:1fr 1fr;}
}
@media(max-width:768px){
  .mss-header__inner{flex-wrap:wrap;gap:14px;}
  .mss-search{order:3;flex-basis:100%;max-width:none;}
  .mss-nav__inner{overflow-x:auto;}
  .mss-nav ul{flex-wrap:nowrap;justify-content:flex-start;}
  .mss-nav a{padding:12px 16px;font-size:14px;white-space:nowrap;}
  .mss-products ul.products{grid-template-columns:repeat(2,1fr);}
  .mss-policy{grid-template-columns:1fr 1fr;}
  .mss-section__title{font-size:22px;}
  .mss-citizen__text h2{font-size:22px;}
  .mss-footer__inner{grid-template-columns:1fr;}
  .mss-footer__bottom{flex-direction:column;gap:16px;}
}