/* QSA v2 UI */
#teem-qsa-root {
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  padding: 0 30px;
}

/* shell 60/40 */
#teem-qsa-root .qsa-shell { display: flex;}
#teem-qsa-root .qsa-card.qsa-left {    width: 60%;}
#teem-qsa-root .qsa-card.qsa-right {    width: 40%;
    margin-left: 20px; }
@media (max-width: 1024px){
  #teem-qsa-root .qsa-shell { flex-direction: column; }
  #teem-qsa-root .qsa-card.qsa-left,
  #teem-qsa-root .qsa-card.qsa-right { flex: 1 1 auto; }
}
#teem-qsa-root .qsa-card .totals .row::before, #teem-qsa-root .qsa-card .totals .row::after{Display:none;}
#teem-qsa-root .qsa-card {
  background: #fff;
  border-radius: 28px;
  padding: 30px 36px;
}

#teem-qsa-root .qsa-title {
    font-size: 26px;
    line-height: 1.2;
    margin: 0 0 24px 0;
    font-weight: 600;
    font-family: 'Plus Jakarta Sans';
}

/* ===== Products table (header + rows) ===== */
:root{
  --qsa-col-product: minmax(240px, 1.3fr);
  --qsa-col-qty: 90px;
  --qsa-col-unit: 110px;
  --qsa-col-disc: 50px;
  --qsa-col-net: 105px;
  --qsa-col-remove: 20px;
}

/* header row (labels) */
#qsa-lines-header{
  display: grid;
  grid-template-columns:
    var(--qsa-col-product)
    var(--qsa-col-qty)
    var(--qsa-col-unit)
    var(--qsa-col-disc)
    var(--qsa-col-net)
    var(--qsa-col-remove);
  gap: 8px;
  margin-bottom: 12px;
  padding: 0 0 6px 0;
  border-bottom: 1px solid #ecf2f7;
  font-size: 13px;
  font-weight: 600;
}

#qsa-lines-header .col.col-product{text-align: left;}
#qsa-lines-header .col{text-align: center;}
#qsa-lines-header .col.col-qty{display:block;}
#qsa-lines .col.col-qty::after{display:none;margin:0;}
/* rows */
#teem-qsa-form #qsa-lines .qsa-line{
  display: grid;
  grid-template-columns:
    var(--qsa-col-product)
    var(--qsa-col-qty)
    var(--qsa-col-unit)
    var(--qsa-col-disc)
    var(--qsa-col-net)
    var(--qsa-col-remove);
  gap: 8px;
  align-items: center;
  margin-bottom: 16px;
}

/* generic inputs */
#teem-qsa-form input[type="text"],
#teem-qsa-form input[type="email"],
#teem-qsa-form input[type="tel"],
#teem-qsa-form input[type="number"],
#teem-qsa-form select{
  appearance: none;
  background: #fff;
  border: 1px solid #b1c6d8;
  border-radius: 9999px;
  padding: 12px 16px;
  height: 44px;
  font-size: 13px;
  outline: none;
  width: 100%;
  color: #062f55;
}
#teem-qsa-form input::placeholder{
  color: #062f55;

}
#teem-qsa-form input[type="number"]::-webkit-outer-spin-button,
#teem-qsa-form input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance: none; margin: 0; }
#teem-qsa-form input[type="number"]{ -moz-appearance: textfield; }

/* money fields ($) — works for text inputs and the Net Price "display" */
#teem-qsa-form .qsa-money{ position: relative; display: grid; align-items: center; }
#teem-qsa-form .qsa-money .qsa-money-prefix::before{ content: '$';font-size: 13px; }
#teem-qsa-form .qsa-money .qsa-money-prefix{
  position: absolute; left: 12px; top: 48%; transform: translateY(-50%); pointer-events: none;
}
#teem-qsa-form .qsa-money input[type="text"]{ padding-left: 24px; text-align: right; }
#teem-qsa-form .qsa-money .qsa-money-display{
  display: inline-block;
  padding: 10px 12px 10px 24px;
  border: 1px solid #c8d6e5;
  border-radius: 24px;
  min-width: 100px;
  text-align: right;
  color: #18324a;
  font-size:13px;
  background: #fff;
}

/* discount % suffix on the input */

#teem-qsa-form .col-disc input.qsa-disc,#teem-qsa-form .col input.qsa-qty{text-align: center;padding:0; }
.qsa-card.qsa-left .col{margin:0;}
.qsa-qty-btn.qsa-qty-dec{    width: 48px;}
/* remove button */
#teem-qsa-form .qsa-remove{
  background: transparent; border: 0; font-size: 20px; color: #8ba3b8;
  cursor: pointer; width: 28px; height: 28px; line-height: 1; justify-self: end;
}
#teem-qsa-form .qsa-remove:hover{ color: #d33; }

/* Add links */
#teem-qsa-form #qsa-add-line,
#teem-qsa-form #qsa-add-discount{
  background: transparent; border: 0; color: #0089ff; font-weight: 600; cursor: pointer; padding: 0;
}
#teem-qsa-form #qsa-add-line{ margin-right: 16px; }

/* client grid (right card) */
#teem-qsa-root .client-grid{
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px;
}
#teem-qsa-root .client-grid .full{ grid-column: 1 / -1; }

/* totals */

#qsa-otd-wrap.qsa-money, #qsa-partner-wrap{
    font-weight: 600!important;
    font-size: 13px!important;
        margin-bottom: 10px;
}
#teem-qsa-form .qsa-discount .qsa-money .qsa-money-prefix{
    left: 15px;
    font-weight: 400;
    top: 71%;
    color: #062f55;
}
#qsa-otd-wrap.qsa-money div, #qsa-partner-wrap div{
    margin-top: 10px;}
#teem-qsa-root .totals{     padding: 0 15px;
    margin-top: 16px;}
#teem-qsa-root .totals .row{
  display: flex; justify-content: space-between; align-items: center;
  padding: 6px 0; font-size: 15px; color: #25496a;
}
#teem-qsa-root .totals .row.total{
  margin-top: 6px; padding-top: 12px; font-weight: 800; font-size: 20px;
}

/* submit button */
#teem-qsa-form button[type="submit"],
#teem-qsa-form .button-primary{
  display: block; width: 100%; height: 64px; border-radius: 9999px; background: #1677ff; border: none;
  color: #fff; font-size: 18px; font-weight: 700; cursor: pointer; margin-top: 20px;
  box-shadow: 0 8px 18px rgba(22, 119, 255, 0.25);
}
#teem-qsa-form button[type="submit"]:hover{ filter: brightness(0.95); }

/* qty controls */
#teem-qsa-form .col-qty{ display: inline-flex; align-items: center; gap: 2px; }
#teem-qsa-form .qsa-qty{ width: 64px; height: 36px; border-radius: 50px; text-align: center; border: 1px solid #c8d6e5; }
#teem-qsa-form .qsa-qty-btn{ background: transparent; border: 0; font-size: 24px; width: 28px; height: 28px; line-height: 1; color: #0089ff; cursor: pointer; }
#teem-qsa-form .qsa-qty-btn:active{ transform: scale(0.97); }

/* responsive */
@media (max-width: 1024px){
  #qsa-lines-header{
    grid-template-columns: 1fr 100px 1fr 100px 1fr 28px;
  }
  #teem-qsa-form #qsa-lines .qsa-line{
    grid-template-columns: 1fr 100px 1fr 100px 1fr 28px;
  }
}
@media (max-width: 720px){
  #qsa-lines-header{
    grid-template-columns: 1fr 1fr;
    row-gap: 8px;
  }
  #qsa-lines-header .col.col-product{ grid-column: 1 / -1; }
  #teem-qsa-form #qsa-lines .qsa-line{
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: minmax(44px, auto);
  }
  #teem-qsa-form #qsa-lines .qsa-line > .col.col-product{ grid-column: 1 / -1; }
}

/* misc */
@keyframes qsa-spin{ to{ transform: rotate(360deg) } }