.loader {
  width: 30px;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 6px solid #f3f3f3;
  border-right-color: var(--lightred);
  animation: l2 1.2s infinite linear;
}
@keyframes l2 {
  to {
    transform: rotate(1turn);
  }
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

#pr-shortcode-container.background-change {
  background-size: auto;
}

#pr {
  box-shadow: 0px 0px 33px 3px rgba(0, 0, 0, 0.1);
  background-color: #fff;
}

.ast-desktop #pr {
  background-image: url("/wp-content/uploads/2024/12/pellets-rechts.jpg");
  background-repeat: no-repeat;
  background-position: center right;
  background-size: contain;
}

#pr .pr-form,
#pr .pr-offer {
  padding: 3rem;
}

#pr .angebot-buttons {
  display: flex;
  gap: 20px;
  height: fit-content;
}

#pr .angebot-buttons .pr-back-button {
  height: 100%;
}

#pr .pr-offer {
  display: none;
}

#pr .pr_positions.mobile {
  display: none;
}

#pr .pr-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 75%;
  gap: 20px;
  align-items: end;
}

#pr .pr-form h2.pr-headline,
#pr .pr-form p.pr-sub-headline,
#pr .pr-validation-error-message {
  grid-column-start: 1;
  grid-column-end: 3;
}

#pr .pr-form div.pr-form-inputs.hidden {
  display: none;
}

#pr .pr-form input,
#pr .pr-form select {
  width: 100%;
}

#pr .pr-form select:focus-visible {
  outline-color: var(--ast-border-color);
}

/* #pr .pr-form button[type="submit"] {
  width: fit-content;
} */

#pr .pr-form button[type="submit"],
#pr .pr-form div.pr-form-inputs {
  margin-top: 2rem;
}

#pr .pr-links {
  width: 75%;
  padding: 3rem;
}

#pr .pr-rechts {
  width: 25%;
}

#pr .submit-btn {
  display: inline-flex;
  align-items: center;
  gap: 20px;
  padding: 10px 25px 10px 40px;
  justify-content: center;
}

#pr .pr-sub-headline {
  font-size: 26px;
  line-height: 31px;
  color: #9c9c9c;
}

#pr .pr-form-inputs select {
  min-height: 52px;
}

#pr label {
  margin-bottom: 8px;
}

#pr .pr-form-inputs input,
#pr .pr-form-inputs select,
#pr .pr-offer-to-order input {
  border-radius: 10px;
  background-color: #fff;
  padding: 0.5em;
}

#pr .pr-angebot-heading {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1rem;
}

#pr .pr-angebot-heading .pr-pdf,
#pr .pr-nxt-button {
  display: flex;
  align-items: center;
  padding: 25px;
  height: 50px;
  gap: 15px;
}

#pr .pr-angebot-heading .pr-pdf {
  background-color: #fff;
  color: #e40038;
  border: 1px solid #e40038;
}

#pr .pr-angebot-heading .pr-pdf:hover {
  background-color: #890022;
  color: #fff;
  border-color: #890022;
}

#pr .pr-angebot-heading .pr-pdf svg path {
  fill: #e40038;
}

#pr .pr-angebot-heading .pr-pdf:hover svg path {
  fill: #fff;
}

table,
td,
th {
  border: unset;
}

#pr .pr-table {
  font-size: 18px;
}

#pr .pr-table tr.sum_mwst td {
  font-size: 16px;
}

/* #pr .pr-table th,
#pr .pr-table td {
  padding: 8px;
  border-bottom: 1px solid var(--ast-border-color);
} */

#pr .pr-offer-to-order {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

#pr .pr-offer-to-order > div {
  display: flex;
  gap: 2rem;
}

#pr .pr-offer-to-order input {
  padding: 0.45em;
  background-color: #dddddd;
}

#pr .price-label {
  font-size: 80%;
  background: #999;
  padding: 5px;
  border-radius: 5px;
  color: #fff;
  display: inline-block;
  text-align: center;
}

#pr .price-label p {
  margin-bottom: 0;
  line-height: 1.2;
}

/* Bestellformular */
#hidden_order_form,
#hidden_inquiry_form {
  display: none;
}

#hidden_order_form .gform_required_legend,
#hidden_inquiry_form .gform_required_legend {
  display: none;
}

#hidden_order_form .gfield--type-section,
#hidden_inquiry_form .gfield--type-section {
  border: unset;
}

#hidden_order_form .gfield--type-section .gsection_title,
#hidden_inquiry_form .gfield--type-section .gsection_title {
  margin-bottom: -20px;
}

/* Formular Styling */
.gform-theme--framework
  .gform-field-label:where(
    :not(.gform-theme__disable):not(.gform-theme__disable *):not(
        .gform-theme__disable-framework
      ):not(.gform-theme__disable-framework *)
  ) {
  --gf-local-color: var(--ast-global-color-4);
}

.gform-body.gform_body label.gfield_label.gform-field-label,
.gform-body.gform_body legend.gfield_label.gform-field-label,
.gform-body.gform_body .gfield_required.gfield_required_asterisk {
  font-size: 20px;
}

.gform-body.gform_body .gfield_required.gfield_required_asterisk,
.gform-body.gform_body .gfield_checkbox input::before {
  color: var(--gf-local-color);
}

.gform-body.gform_body .gfield_checkbox input:hover {
  background-color: transparent;
  border-color: var(--gf-local-color);
}

.gform-body.gform_body .gfield_checkbox label,
.gform-body.gform_body .ginput_container_radio label.gform-field-label {
  font-size: 15px;
}

.gform-body.gform_body input,
.gform-body.gform_body textarea {
  border-color: var(--ast-border-color) !important;
  padding: 0.5em;
}

.gform-body.gform_body input:not(input[type="checkbox"], input[type="radio"]),
.gform-body.gform_body textarea {
  height: 52px;
  border-radius: 10px;
  font-size: 1rem;
}

body
  .gform-theme--framework
  input[type="radio"]:where(
    :not(.gform-theme__disable):not(.gform-theme__disable *):not(
        .gform-theme__disable-framework
      ):not(.gform-theme__disable-framework *)
  )::before {
  background-color: var(--lightred);
}

input#gform_submit_button_1,
input#gform_submit_button_2 {
  font-size: 0.85rem;
  border-radius: 10px;
  padding: 15px 25px 15px 25px;
  font-weight: 400;
  background-color: var(--lightred);
  border-color: var(--lightred);
}

input#gform_submit_button_1:hover,
input#gform_submit_button_2:hover {
  background-color: var(--darkred);
  border-color: var(--darkred);
}

#pr .pr-validation-error-message {
  margin-top: 1rem;
  margin-right: 20px;
  background-color: #fafafa;
  color: var(--ast-global-color-0);
  border-radius: 10px;
}

#pr .pr-validation-error-message p {
  margin-bottom: 0;
  padding: 10px 15px;
}

@media (min-width: 921px) {
  #pr .pr-validation-error-message {
    width: 80%;
  }
}

@media (max-width: 974px) {
  #pr .pr-offer-to-order {
    flex-direction: column;
    gap: 50px;
    margin-top: 2rem;
  }
}

@media (max-width: 921px) {
  #pr .pr-form,
  #pr .pr-offer {
    padding: 2rem;
  }

  #pr .pr-form-grid {
    width: 100%;
  }

  #pr .pr-form-inputs select {
    min-height: 44.5px;
  }

  #pr .pr-validation-error-message {
    margin-right: 0;
  }

  #pr .pr-form-grid div.pr-form-inputs {
    margin-top: 1rem;
  }

  /* #pr .table-container {
    overflow-x: auto;
  } */
}

@media (max-width: 800px) {
  #pr .pr-angebot-heading {
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 50px;
  }
}

@media (max-width: 921px) {
  #pr .pr-form,
  #pr .pr-offer {
    padding: 2rem;
  }

  #pr .pr-form-grid {
    width: 100%;
  }

  #pr .pr-form-inputs select {
    min-height: 44.5px;
  }

  #pr .pr-validation-error-message {
    margin-right: 0;
  }

  #pr .pr-form-grid div.pr-form-inputs {
    margin-top: 1rem;
  }

  #pr .table-container {
    overflow-x: auto;
  }
}

@media (max-width: 800px) {
  #pr .pr-angebot-heading {
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 50px;
  }
}

/* Ensure table has horizontal scrolling on smaller screens */
#pr .table-container {
  overflow-x: auto;
}

/* Mobile Styles */
@media (max-width: 800px) {
  #pr .pr-table {
    width: 100%;
    border-collapse: collapse;
  }

  #pr tr.pr_positions.mobile {
    display: block;
    margin-top: -30px;
  }

  #pr tr.mobile td:first-of-type {
    display: inline-block;
    width: 66%;
  }

  #pr tr.mobile td:last-of-type {
    display: inline-block;
    width: 33%;
  }

  /* Hide table headers on mobile */
  #pr .pr-table thead {
    display: none;
  }

  /* Make table rows block-level */
  #pr .pr-table tbody,
  #pr .pr-table tr {
    display: block;
    width: 100%;
    margin-bottom: 10px;

    padding-bottom: 10px;
    background: #fff;
  }

  /* Make all table cells stack vertically */
  #pr .pr-table tr td {
    display: flex;
    flex-direction: column;
    padding: 8px;
    width: 100%;
  }

  #pr .pr-table tr td.pr_artnr {
    font-weight: bold;
    color: #e40038;
  }

  /* Remove bottom border from the last cell */
  #pr .pr-table tr td:last-child {
    border-bottom: none;
  }

  /* Use the data-label attribute to create labels for each field */
  #pr .pr-table tr td::before {
    content: attr(data-label);
    font-weight: bold;
    text-align: left;
    padding-bottom: 5px;
  }

  #pr .pr-table td.pr_einzelpreis_netto,
  #pr .pr-table td.pr_einzelpreis_inkl_ust,
  #pr .pr-table td.pr_ust,
  #pr .pr-table td.pr_artnr,
  #pr .pr-table td.pr_menge,
  #pr .pr-table td.pr_einheit {
    display: none;
  }

  #pr .pr-table td.pr_beschreibung {
    display: inline-block;
    width: 66%;
    font-weight: bold;
  }

  #pr .pr-table tr.sum {
    margin-bottom: 0;
    padding-bottom: 0;
  }

  #pr .pr-table td.pr_zwischensumme,
  #pr .pr-table td.pr_pal_gesamtpreis {
    display: inline-block;
    width: 33%;
  }

  #pr .pr-table td.pr-table-left,
  #pr .pr-table td.pr-table-right {
    display: inline-block;
    width: 50%;
    border-bottom: none !important;
  }

  #pr .pr-table td.pr_beschreibung,
  #pr .pr-table td.pr_zwischensumme,
  #pr .pr-table td.pr_pal_gesamtpreis {
    border-bottom: none !important;
  }

  #pr .pr-table td.pr-table-left {
    text-align: left !important;
  }

  #pr .pr-table tr.pr_steuer_gesamt {
    border-bottom: 1px solid #890022;
  }

  #pr .pr-table tr.pr_netto_gesamt {
    border-top: 1px solid #890022;
  }
}

/* @media (max-width: 921px) {
  #pr .pr-form,
  #pr .pr-offer {
    padding: 2rem;
  }

  #pr .pr-form-grid {
    width: 100%;
  }
  #pr .pr-form-inputs select {
    min-height: 44.5px;
  }

  #pr .pr-validation-error-message {
    margin-right: 0;
  }

  #pr .pr-form-grid div.pr-form-inputs {
    margin-top: 1rem;
  }

  #pr .table-container {
    overflow-x: auto;
  }
} */

@media (max-width: 800px) {
  #pr .pr-angebot-heading {
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 50px;
  }
}

@media (max-width: 610px) {
  #pr .pr-form-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

@media (max-width: 580px) {
  #pr .pr-offer-to-order > div {
    flex-direction: column;
  }
}

@media (max-width: 490px) {
  #pr .angebot-buttons {
    flex-direction: column-reverse;
    align-items: flex-end;
  }
}
