/* Nini — trang chi tiết sản phẩm theo Figma (frame "Chi tiết sản phẩm — Desktop"). Nạp bởi plugin nini-shop. */

/* Khung trang rộng bằng header (logo ↔ nút Đặt bánh ngay) */
.single-product #main.site-main{max-width:1280px!important;padding-left:40px!important;padding-right:40px!important}
.single-product .woocommerce-breadcrumb{max-width:none;margin:0;padding:28px 0 0!important;font-size:14px;color:var(--n-muted)}
.single-product .woocommerce-breadcrumb a{color:var(--n-muted);text-decoration:none}
.single-product .woocommerce-breadcrumb a:hover{color:var(--n-husk)}
.single-product .woocommerce-breadcrumb .nini-bc-sep{margin:0 8px;color:var(--n-muted)}

/* Bố cục 2 cột (ảnh không bám theo khi cuộn) */
.woocommerce div.product{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 56px;align-items:start;padding:24px 0 0!important}
.woocommerce div.product>*{grid-column:1/-1;min-width:0}
.woocommerce div.product>div.images.woocommerce-product-gallery{grid-column:1;width:auto!important;float:none!important;margin:0!important;position:relative!important;top:auto!important}
.woocommerce div.product>.summary{grid-column:2;width:auto!important;float:none!important;margin:0!important}
.woocommerce div.product>span.onsale{display:none}

/* Thẻ cam kết dưới ảnh: ảnh hàng 1, thẻ hàng 2 (cột trái), phần thông tin chiếm cả 2 hàng bên phải */
.woocommerce div.product{grid-template-rows:auto 1fr}
.woocommerce div.product>div.images.woocommerce-product-gallery{grid-row:1}
.woocommerce div.product>.summary{grid-row:1/span 2}
.woocommerce div.product>.nini-trust{grid-column:1;grid-row:2;align-self:start}
.nini-trust{background:#fff;border:1px solid var(--n-line);border-radius:28px;padding:26px 28px}
.nini-trust__title{margin:0 0 18px;font:600 22px/1.25 Fraunces,serif;color:var(--n-cocoa)}
.nini-trust ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:20px 24px}
.nini-trust li{display:flex;gap:12px;align-items:flex-start}
.nini-trust li>span{width:42px;height:42px;border-radius:14px;background:var(--n-corn1);color:var(--n-husk);display:inline-flex;align-items:center;justify-content:center;flex:none}
.nini-trust li>span svg{width:20px;height:20px}
.nini-trust strong{display:block;font:600 14.5px/1.35 "Be Vietnam Pro",sans-serif;color:var(--n-cocoa)}
.nini-trust small{display:block;margin-top:3px;font:400 13px/1.45 "Be Vietnam Pro",sans-serif;color:var(--n-muted)}
.nini-trust__cta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:22px;padding-top:20px;border-top:1px solid var(--n-line)}
.nini-trust__cta p{margin:0 auto 0 0;font:600 14.5px "Be Vietnam Pro",sans-serif;color:var(--n-cocoa)}
.nini-trust__cta a{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;border:1.5px solid var(--n-line);color:var(--n-cocoa);font:600 14px "Be Vietnam Pro",sans-serif;text-decoration:none;transition:border-color .2s,background .2s}
.nini-trust__cta a:hover{border-color:var(--n-corn);background:var(--n-corn1)}
.nini-trust__cta a svg{width:16px;height:16px;color:var(--n-husk)}

/* Ảnh: cột ảnh nhỏ bên trái + ảnh lớn */
.woocommerce div.product div.images{display:grid;grid-template-columns:88px minmax(0,1fr);gap:16px;align-items:start;overflow:visible}
.woocommerce div.product div.images>.flex-viewport,.woocommerce div.product div.images>.woocommerce-product-gallery__wrapper{grid-column:2;grid-row:1;background:#fff;border-radius:32px;overflow:hidden;max-width:100%}
.woocommerce div.product div.images .woocommerce-product-gallery__image a{display:block;padding:28px}
.woocommerce div.product div.images img{object-fit:contain;background:#fff;border-radius:0}
.woocommerce div.product div.images .flex-control-thumbs{grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:12px;margin:0;padding:2px;align-self:stretch;height:0;min-height:100%;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain;scroll-snap-type:y proximity;scrollbar-width:thin;scrollbar-color:var(--n-line) transparent}
/* height:0 + min-height:100% → the thumb column is exactly as tall as the main image (grid row) and scrolls inside */
.woocommerce div.product div.images .flex-control-thumbs li{scroll-snap-align:start}
.woocommerce div.product div.images .flex-control-thumbs li{width:84px!important;flex:0 0 auto;float:none!important;margin:0!important}
.woocommerce div.product div.images .flex-control-thumbs li img{width:84px;height:84px;object-fit:contain;border-radius:16px;border:2px solid transparent;background:#fff;opacity:.7;transition:opacity .2s,border-color .2s}
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active,.woocommerce div.product div.images .flex-control-thumbs li img:hover{opacity:1;border-color:var(--n-cocoa)}
.woocommerce div.product div.images .woocommerce-product-gallery__trigger{top:16px;right:16px;width:44px;height:44px;border-radius:50%;background:#fff;box-shadow:0 4px 12px rgba(11,42,66,.12);z-index:5}

/* Thông tin */
.nini-pbadges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.nini-pbadges .nini-badge{display:inline-flex;align-items:center;gap:6px}
.nini-pbadges .nini-badge svg{width:14px;height:14px}
.nini-pbadges .nini-badge.is-hot{background:var(--n-corn1)!important;color:var(--n-husk)!important}
.woocommerce div.product .product_title{display:block!important;font:600 44px/1.12 Fraunces,serif!important;color:var(--n-cocoa);margin:0 0 10px!important}
.woocommerce div.product .summary>p.price{font:700 30px/1.2 "Be Vietnam Pro",sans-serif!important;color:var(--n-cocoa)!important;margin:0 0 14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.woocommerce div.product .summary>p.price .nini-from{font:500 16px "Be Vietnam Pro",sans-serif;color:var(--n-muted)}
.woocommerce div.product .summary>p.price .nini-chosen{font:500 13px "Be Vietnam Pro",sans-serif;color:var(--n-cocoa7);background:var(--n-corn1);border-radius:999px;padding:4px 12px}
.woocommerce div.product .woocommerce-product-details__short-description{background:transparent;border:0;padding:0;margin:0 0 22px;font-size:16px;line-height:1.65;color:var(--n-cocoa7)}
.woocommerce div.product .woocommerce-product-details__short-description p{margin:0}

/* Các bước */
.nini-step{margin:0 0 22px}
.nini-step__label,.woocommerce div.product form.cart .variations th.label label{display:block;font:600 12px/1.4 "Be Vietnam Pro",sans-serif;letter-spacing:.08em;text-transform:uppercase!important;color:var(--n-muted);margin:0 0 10px}
.nini-step__label span{text-transform:none;letter-spacing:0;color:var(--n-husk)}
.nini-creams{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.nini-cream{display:flex;flex-direction:column;gap:2px;padding:14px 18px;border-radius:16px;border:1.5px solid var(--n-line);background:#fff;text-decoration:none}
.nini-cream strong{font:600 15px/1.4 "Be Vietnam Pro",sans-serif;color:var(--n-cocoa)}
.nini-cream small{font-size:12.5px;color:var(--n-muted)}
.nini-cream.is-on{border:2px solid var(--n-corn);background:var(--n-corn1)}
a.nini-cream:hover{border-color:var(--n-corn)}

/* 2. Kích thước — chip có giá */
.woocommerce div.product form.cart .variations{border:0;margin:0 0 4px;background:transparent}
.woocommerce div.product form.cart .variations tr{display:block}
.woocommerce div.product form.cart .variations th,.woocommerce div.product form.cart .variations td{display:block;padding:0;background:transparent!important;border:0;text-align:left}
.woocommerce div.product form.cart .reset_variations{display:none!important}
.woocommerce div.product form.cart .variations select.nini-chips-src{position:absolute!important;width:1px!important;height:1px!important;min-width:0!important;max-width:1px!important;padding:0!important;border:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap;opacity:0;pointer-events:none}
.nini-chips{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.woocommerce div.product form.cart .nini-chips button.nini-chip{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:auto;min-height:0;margin:0;padding:11px 4px!important;border-radius:14px!important;border:1.5px solid var(--n-line)!important;background:#fff!important;color:var(--n-cocoa)!important;font:600 15px/1.2 "Be Vietnam Pro",sans-serif!important;box-shadow:none!important;text-transform:none!important;letter-spacing:0!important}
.woocommerce div.product form.cart .nini-chips button.nini-chip small{display:block;font:500 12px/1.3 "Be Vietnam Pro",sans-serif;color:var(--n-muted)}
.woocommerce div.product form.cart .nini-chips button.nini-chip:hover{border-color:var(--n-corn)!important}
.woocommerce div.product form.cart .nini-chips button.nini-chip[aria-checked=true]{background:var(--n-cocoa)!important;border-color:var(--n-cocoa)!important;color:var(--n-corn3)!important}
.woocommerce div.product form.cart .nini-chips button.nini-chip[aria-checked=true] small{color:#fff}
.woocommerce div.product form.cart .nini-chips button.nini-chip[disabled]{opacity:.4;cursor:not-allowed}
.nini-serving{display:flex;align-items:center;gap:8px;margin:12px 0 22px;font:500 14px "Be Vietnam Pro",sans-serif;color:var(--n-husk);min-height:20px}
.woocommerce div.product .single_variation_wrap .woocommerce-variation-price{display:none}
.woocommerce div.product .woocommerce-variation-availability p{margin:0 0 8px;font-size:14px}

/* 3. Chữ trên bánh */
.nini-input{position:relative}
.nini-input svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--n-muted);pointer-events:none}
.woocommerce div.product form.cart .nini-input input{width:100%;padding-left:42px!important;background:#fff}

/* 4. Phụ kiện */
.nini-acc__list{display:flex;flex-wrap:wrap;gap:10px}
.nini-acc__chip{position:relative;display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:14px;border:1.5px solid var(--n-line);background:#fff;cursor:pointer;font:500 14px "Be Vietnam Pro",sans-serif;color:var(--n-cocoa);transition:border-color .15s,background-color .15s}
.nini-acc__chip span{font:500 14px/1.3 "Be Vietnam Pro",sans-serif!important;color:var(--n-cocoa)}
.nini-acc__chip:hover{border-color:var(--n-corn)}
.nini-acc__chip input{position:absolute;opacity:0;width:1px;height:1px}
.nini-acc__chip img{width:32px;height:32px;border-radius:50%;object-fit:cover}
.nini-acc__chip svg{width:16px;height:16px;color:var(--n-husk);display:none}
.nini-acc__chip.is-on,.nini-acc__chip:has(input:checked){border-color:var(--n-corn);background:var(--n-corn1)}
.nini-acc__chip.is-on svg,.nini-acc__chip:has(input:checked) svg{display:block}
.nini-acc__chip:has(input:focus-visible){outline:3px solid var(--n-corn);outline-offset:2px}

/* Hàng mua */
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart,.woocommerce div.product form.cart:not(.variations_form){display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.woocommerce div.product form.cart .nini-step{flex:1 0 100%}
.woocommerce div.product form.cart .single_add_to_cart_button{flex:1;min-width:0;white-space:nowrap;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;padding:17px 22px!important;font-size:15px!important}
.woocommerce div.product form.cart .single_add_to_cart_button svg{width:18px;height:18px}
.woocommerce div.product form.cart .nini-buy-now{flex:none;background:var(--n-cocoa)!important;color:#fff!important;padding:17px 24px!important;border-radius:999px!important;font:600 15px "Be Vietnam Pro",sans-serif!important}
.woocommerce div.product form.cart .nini-buy-now:hover{background:var(--n-cocoa7)!important}

/* Cam kết */
.nini-perks{list-style:none;margin:24px 0 0;padding:20px 0 0;border-top:1px solid var(--n-line);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.nini-perks li{display:flex;gap:10px;align-items:center}
.nini-perks li>span{width:40px;height:40px;border-radius:12px;background:var(--n-corn1);color:var(--n-husk);display:inline-flex;align-items:center;justify-content:center;flex:none}
.nini-perks li>span svg{width:20px;height:20px}
.nini-perks strong{display:block;white-space:nowrap;font:600 13.5px/1.35 "Be Vietnam Pro",sans-serif;color:var(--n-cocoa)}
.nini-perks small{display:block;font-size:12px;color:var(--n-muted)}
.nini-perks a{color:var(--n-husk);font-weight:600}

/* Tab */
.woocommerce div.product .woocommerce-tabs{margin-top:48px}
.woocommerce div.product .woocommerce-tabs ul.tabs{padding:0;margin:0 0 24px;border-bottom:1px solid var(--n-line);display:flex;gap:32px;overflow-x:auto}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,.woocommerce div.product .woocommerce-tabs ul.tabs li::before,.woocommerce div.product .woocommerce-tabs ul.tabs li::after{display:none!important}
.woocommerce div.product .woocommerce-tabs ul.tabs li{background:transparent!important;border:0!important;border-radius:0!important;margin:0!important;padding:0!important;flex:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{padding:0 0 14px!important;font:600 15px "Be Vietnam Pro",sans-serif!important;color:var(--n-muted)!important;border-bottom:3px solid transparent;white-space:nowrap}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--n-cocoa)!important;border-bottom-color:var(--n-corn)}
.woocommerce div.product .woocommerce-tabs .panel{background:transparent;border:0;border-radius:0;padding:0;font-size:16px;line-height:1.7;color:var(--n-cocoa7)}
.woocommerce div.product .woocommerce-tabs .panel>h2:first-child{display:none}
.nini-desc{display:grid;grid-template-columns:minmax(0,1fr) 460px;gap:48px;align-items:start}
.nini-desc__text p{margin:0 0 12px}
.nini-facts{margin:0;background:#fff;border-radius:20px;overflow:hidden}
.nini-facts div{display:flex;justify-content:space-between;gap:16px;padding:14px 20px;border-bottom:1px solid var(--n-line)}
.nini-facts div:last-child{border-bottom:0}
.nini-facts dt{font-size:14px;color:var(--n-muted)}
.nini-facts dd{margin:0;font:600 14px "Be Vietnam Pro",sans-serif;color:var(--n-cocoa);text-align:right}
.nini-list{margin:0;padding-left:20px;max-width:760px}
.nini-list li{margin-bottom:8px}
.woocommerce div.product section.related{margin-top:64px}
.woocommerce div.product section.related>h2{font:600 34px/1.2 Fraunces,serif;color:var(--n-cocoa);margin:0 0 22px}

/* Thanh đặt nhanh dính đáy (mobile) */
.nini-buybar{display:none}
@media (max-width:1024px){
  .woocommerce div.product{grid-template-columns:1fr;gap:24px}
  .woocommerce div.product>div.images.woocommerce-product-gallery,.woocommerce div.product>.summary{grid-column:1}
  .nini-desc{grid-template-columns:1fr;gap:20px}
  .woocommerce div.product>div.images.woocommerce-product-gallery,.woocommerce div.product>.summary{grid-row:auto}
  .woocommerce div.product{grid-template-rows:none}
  .woocommerce div.product>.nini-trust{display:none}
}
@media (max-width:1024px){.single-product #main.site-main{padding-left:24px!important;padding-right:24px!important}}
@media (max-width:767px){
  .single-product #main.site-main{padding-left:16px!important;padding-right:16px!important}
  .single-product .woocommerce-breadcrumb{padding:16px 0 0!important;font-size:13px}
  .woocommerce div.product{padding:12px 0 110px!important}
  .woocommerce div.product div.images{grid-template-columns:1fr;gap:10px}
  .woocommerce div.product div.images>.flex-viewport,.woocommerce div.product div.images>.woocommerce-product-gallery__wrapper{grid-column:1;border-radius:24px}
  .woocommerce div.product div.images .woocommerce-product-gallery__image a{padding:12px}
  .woocommerce div.product div.images .flex-control-thumbs{grid-column:1;grid-row:2;flex-direction:row;height:auto;min-height:0;align-self:start;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x proximity}
  .woocommerce div.product div.images .flex-control-thumbs li{width:60px!important}
  .woocommerce div.product div.images .flex-control-thumbs li img{width:60px;height:60px;border-radius:12px}
  .woocommerce div.product .product_title{font-size:32px!important}
  .woocommerce div.product .summary>p.price{font-size:24px!important}
  .nini-chips{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .woocommerce div.product form.cart .nini-chips button.nini-chip{padding:10px 2px!important;font-size:14px!important}
  .woocommerce div.product form.cart .single_add_to_cart_button{min-width:0}
  .woocommerce div.product form.cart .nini-buy-now{flex:1 0 100%}
  .nini-perks{grid-template-columns:1fr;gap:12px}
  .woocommerce div.product section.related>h2{font-size:26px}
  .single-product .nini-float{bottom:96px}
  .nini-buybar{position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:#fff;box-shadow:0 -8px 24px rgba(11,42,66,.12);transform:translateY(110%);transition:transform .3s ease}
  .nini-buybar.is-on{transform:none}
  .nini-buybar small{display:block;font:500 12px "Be Vietnam Pro",sans-serif;color:var(--n-muted)}
  .nini-buybar strong{font:700 18px "Be Vietnam Pro",sans-serif;color:var(--n-cocoa)}
  .nini-buybar button{border:0;border-radius:999px;background:var(--n-corn);color:var(--n-onp,#fff);font:600 15px "Be Vietnam Pro",sans-serif;padding:14px 22px;display:inline-flex;align-items:center;gap:8px}
  .nini-buybar button svg{width:18px;height:18px}
}