/* Quote page: compact two-column desktop layout and softer controls. */
body[data-page="bao-gia"]{
  --quote-radius:var(--radius);
  --quote-control-radius:var(--radius-sm);
}
body[data-page="bao-gia"] .page-head{padding:var(--space-md) 0}
body[data-page="bao-gia"] .page-head h1{font-size:var(--text-2xl);margin-bottom:var(--space-2xs)}
body[data-page="bao-gia"] .page-head .breadcrumb{margin-bottom:var(--space-xs)}
body[data-page="bao-gia"] .page-head p{font-size:var(--text-sm);max-width:76ch;margin:0;line-height:1.6}
body[data-page="bao-gia"] .page-head+.section{padding-block:var(--space-lg) var(--space-xl)}
body[data-page="bao-gia"] .quote-contact{margin:var(--space-md) 0 0;font-size:var(--text-xs)}
body[data-page="bao-gia"] .btn,
body[data-page="bao-gia"] .nav__cart-btn,
body[data-page="bao-gia"] .cart-tab,
body[data-page="bao-gia"] .submenu-toggle,
body[data-page="bao-gia"] .cart-form input,
body[data-page="bao-gia"] .cart-form textarea,
body[data-page="bao-gia"] .guest-quote input,
body[data-page="bao-gia"] .bg-alert{border-radius:var(--quote-control-radius)}
body[data-page="bao-gia"] .bg-panel{border-radius:var(--quote-radius)}
.bg-root:has(>.guest-quote){grid-template-columns:minmax(0,1.55fr) minmax(330px,1fr);align-items:start;gap:var(--space-lg)}
.bg-root:has(>.guest-quote)>.bg-panel--login{max-width:none;margin:0;padding:var(--space-md);background:var(--color-paper-3)}
.bg-root:has(>.guest-quote) .guest-quote{margin:0;min-width:0;padding:var(--space-md);border:1px solid var(--color-rule);border-radius:var(--quote-radius);background:var(--color-paper-3)}
.bg-root:has(>.guest-quote) .guest-quote h2{font-size:var(--text-xl);margin:0}
.bg-root:has(>.guest-quote) .guest-quote ul{margin:var(--space-sm) 0 var(--space-md)}
.bg-root:has(>.guest-quote) .guest-quote li{grid-template-columns:56px minmax(0,1fr) 72px 44px;gap:var(--space-xs);padding-block:var(--space-sm)}
.guest-quote__image{display:flex;align-items:center;justify-content:center;width:56px;height:72px;background:var(--color-paper-2);border-radius:var(--quote-control-radius);overflow:hidden}
.guest-quote__image img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.bg-root:has(>.guest-quote) .guest-quote li a{line-height:1.5}
.bg-root:has(>.guest-quote) .guest-quote li span{margin-top:var(--space-3xs);overflow-wrap:anywhere}
.bg-root:has(>.guest-quote) .guest-quote input{background:var(--color-paper);text-align:center;padding-inline:var(--space-3xs)}
.bg-root:has(>.guest-quote) .guest-quote .hero__cta{display:flex;align-items:stretch;gap:var(--space-xs)}
.bg-root:has(>.guest-quote) .guest-quote .btn{font-size:var(--text-sm);white-space:normal;text-align:center;justify-content:center;min-height:46px;padding:var(--space-xs) var(--space-sm)}
.bg-root:has(>.guest-quote) .guest-quote .form-note{margin:var(--space-sm) 0 0;line-height:1.6}
.bg-root:has(>.guest-quote) .bg-panel__title{font-size:var(--text-lg)}
.bg-root:has(>.guest-quote) .cart-tabs{margin-top:var(--space-sm);border-radius:var(--quote-control-radius);gap:var(--space-3xs)}
.bg-root:has(>.guest-quote) .cart-tab{min-height:44px;padding:var(--space-2xs);font-size:var(--text-xs);white-space:normal;line-height:1.4}
.bg-root:has(>.guest-quote) .cart-form{margin-top:var(--space-sm);padding-top:var(--space-sm);gap:var(--space-xs)}
@media(max-width:980px){
  .bg-root:has(>.guest-quote){grid-template-columns:minmax(0,1fr);gap:var(--space-md)}
}
@media(max-width:520px){
  body[data-page="bao-gia"] .page-head{padding-block:var(--space-sm)}
  body[data-page="bao-gia"] .page-head+.section{padding-top:var(--space-md)}
  body[data-page="bao-gia"] .page-head h1{font-size:1.8rem}
  .bg-root:has(>.guest-quote) .guest-quote,.bg-root:has(>.guest-quote)>.bg-panel--login{padding:var(--space-sm)}
  .bg-root:has(>.guest-quote) .guest-quote li{grid-template-columns:48px minmax(0,1fr) 62px;gap:var(--space-2xs)}
  .guest-quote__image{width:48px;height:64px}
  .bg-root:has(>.guest-quote) .guest-quote li>button{grid-column:3;padding:0;justify-self:end}
  .bg-root:has(>.guest-quote) .guest-quote li>div{grid-column:2/4}
  .bg-root:has(>.guest-quote) .guest-quote li>label{grid-column:2;display:flex;align-items:center;gap:var(--space-2xs);white-space:nowrap}
  .bg-root:has(>.guest-quote) .guest-quote input{width:62px;flex:none}
  .bg-root:has(>.guest-quote) .guest-quote .hero__cta{flex-direction:column;gap:var(--space-2xs)}
  .bg-root:has(>.guest-quote) .guest-quote .btn{width:100%;min-height:46px}
}
