/* ==========================================================================
   Quote checkout (Webform "quote_request")
   Works for:
   - /quote (Webform dedicated URL alias)
   - /form/quote-request (system path alias)
   No !important. No duplicates.
   ========================================================================== */

/* -------- Scope (stable) --------
   The webform adds these classes to the <form>.
   This is the most reliable selector regardless of URL alias.
*/
.webform-submission-quote-request-form,
.path-quote .webform-submission-quote-request-form {
  /* scope anchor only */
}

/* Optional page wrapper tuning (only when /quote adds body.path-quote) */
.path-quote .page-content {
  padding: 14px 0;
}

.path-quote .main-content-container {
  padding-left: 10px;
  padding-right: 10px;
}

/* -------- Card wrapper (the form itself) -------- */
.webform-submission-quote-request-form.webform-submission-form {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 14px;
  padding: 14px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.04);
}

/* -------- 2-column layout on desktop --------
   Left: #edit-quote-items-markup (table markup)
   Right: all other direct children of the form
*/
@media (min-width: 992px) {
  .webform-submission-quote-request-form.webform-submission-form {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    gap: 12px;
    align-items: start;
  }

  /* Left column */
  .webform-submission-quote-request-form #edit-quote-items-markup {
    grid-column: 1;
    grid-row: 1 / span 50;
    min-width: 0;
  }

  /* Right column: everything else */
  .webform-submission-quote-request-form.webform-submission-form > *:not(#edit-quote-items-markup) {
    grid-column: 2;
    min-width: 0;

    /* Divider between table and form */
    border-left: 1px solid rgba(0, 0, 0, 0.08);
    padding-left: 12px;
  }

  /* Prevent “fragmented border” inside nested items */
  .webform-submission-quote-request-form .form-item,
  .webform-submission-quote-request-form .form-wrapper,
  .webform-submission-quote-request-form .webform-section {
    border-left: 0;
    padding-left: 0;
  }
}

@media (max-width: 991px) {
  .webform-submission-quote-request-form.webform-submission-form {
    display: block;
  }
}

/* -------- Quote table (rendered by quote.js into #quote-items) -------- */
.webform-submission-quote-request-form #quote-items {
  margin: 8px 0 10px;
}

.webform-submission-quote-request-form #quote-items .quote-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid rgba(0, 0, 0, 0.10);
  border-radius: 12px;
  overflow: hidden;
}

.webform-submission-quote-request-form #quote-items .quote-table thead th {
  text-align: left;
  font-weight: 700;
  font-size: 12px;
  padding: 10px;
  background: rgba(0, 0, 0, 0.04);
  border-bottom: 1px solid rgba(0, 0, 0, 0.10);
}

.webform-submission-quote-request-form #quote-items .quote-table tbody td {
  font-size: 13px;
  padding: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  vertical-align: top;
}

.webform-submission-quote-request-form #quote-items .quote-table tbody tr:hover {
  background: rgba(0, 0, 0, 0.02);
}

/* Column sizing */
.webform-submission-quote-request-form #quote-items .quote-table td:nth-child(1) {
  width: 56px;
  opacity: 0.75;
}

.webform-submission-quote-request-form #quote-items .quote-table td:nth-child(5) {
  white-space: nowrap;
  width: 170px;
}

.webform-submission-quote-request-form #quote-items .quote-table td:nth-child(6) {
  white-space: nowrap;
  width: 150px;
}

/* Qty controls + remove button (compact) */
.webform-submission-quote-request-form #quote-items .quote-qty-dec,
.webform-submission-quote-request-form #quote-items .quote-qty-inc {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: rgba(0, 0, 0, 0.06);
  cursor: pointer;
  font-size: 13px;
}

.webform-submission-quote-request-form #quote-items .quote-qty-value {
  display: inline-block;
  min-width: 18px;
  text-align: center;
  font-weight: 600;
  margin: 0 6px;
  font-size: 13px;
}

.webform-submission-quote-request-form #quote-items .quote-remove {
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: rgba(0, 0, 0, 0.06);
  cursor: pointer;
  font-size: 13px;
}

/* Status area from quote.js */
.webform-submission-quote-request-form #quote-status {
  margin: 8px 0 10px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.04);
  font-size: 13px;
}

/* Mobile: allow horizontal scroll for the table */
@media (max-width: 900px) {
  .webform-submission-quote-request-form #quote-items .quote-table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}

/* -------- Webform fields (compact) -------- */
.webform-submission-quote-request-form .form-item,
.webform-submission-quote-request-form .form-wrapper {
  margin: 0 0 0.25rem;
}

.webform-submission-quote-request-form label {
  display: block;
  margin: 0 0 0.25rem;
  font-weight: 600;
  font-size: 13px;
}

.webform-submission-quote-request-form input[type="text"],
.webform-submission-quote-request-form input[type="email"],
.webform-submission-quote-request-form input[type="tel"],
.webform-submission-quote-request-form select,
.webform-submission-quote-request-form textarea {
  width: 100%;
  max-width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(0, 0, 0, 0.18);
  border-radius: 12px;
  background: #fff;
  line-height: 1.4;
}

.webform-submission-quote-request-form textarea {
  min-height: 140px;
  resize: vertical;
}

.webform-submission-quote-request-form input:focus,
.webform-submission-quote-request-form select:focus,
.webform-submission-quote-request-form textarea:focus {
  outline: none;
  border-color: rgba(0, 0, 0, 0.35);
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.06);
}

/* Sections tighter */
.webform-submission-quote-request-form .webform-section {
  margin-bottom: 0.25rem;
}

.webform-submission-quote-request-form .webform-section-title {
  margin: 0 0 0.25rem;
  font-size: 1rem;
}

.webform-submission-quote-request-form .webform-element-description {
  margin-top: 0.125rem;
  margin-bottom: 0;
  font-size: 0.8125rem;
  line-height: 1.3;
}

/* Submit button */
.webform-submission-quote-request-form .form-actions {
  margin-top: 0.5rem;
}

.webform-submission-quote-request-form .button--primary,
.webform-submission-quote-request-form .webform-button--submit {
  border-radius: 12px;
  padding: 12px 14px;
  font-weight: 700;
}

/* Messages (webform status) compact */
.webform-submission-quote-request-form ~ .messages,
.webform-submission-quote-request-form .messages,
.path-quote .messages {
  padding: 10px 12px;
  border-radius: 12px;
  margin: 0 0 10px;
  font-size: 13px;
}