/* General Styles */
.ph-campaign-receipt {
  position: relative;
}
.ph-campaign-receipt .form-wrapper {
  border: none;
  padding: 0;
}

.ph-campaign-receipt .ph-campaign-receipt-form {
  max-width: 430px;
  margin: 0 auto;
  padding: 0;
  color: white;
}

.ph-campaign-receipt input:focus-visible {
  outline: none;
}

.ph-campaign-receipt #items-fieldset-wrapper legend {
  margin-bottom: 0.6875rem;
}

.ph-campaign-receipt .form-item-order-number {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* Form Field Styles */
.ph-campaign-receipt .form-type-textfield,
.ph-campaign-receipt .form-type-date {
  margin-bottom: 16px;
}

.ph-campaign-receipt label,
.ph-campaign-receipt .fieldset-legend {
  color: white;
  font-size: 20px;
}

.ph-campaign-receipt .form-text,
.ph-campaign-receipt .form-date,
.ph-campaign-receipt .form-select,
.ph-campaign-receipt input[type="text"],
.ph-campaign-receipt input[type="date"] {
  width: 100%;
  height: 40px;
  padding: 0px 8px;
  margin: 0;
  border: 1px solid #bcbcbc;
  border-radius: 8px;
  background: white;
  font-size: 14px;
  color: #202123;
}

.ph-campaign-receipt .form-select {
  appearance: none;
  background-image: url('data:image/svg+xml;utf8,<svg width="18" height="12" viewBox="0 0 18 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.376577 1.12658C0.840056 0.663098 1.56935 0.627445 2.07373 1.01962L2.19485 1.12658L9 7.93071L15.8051 1.12658C16.2686 0.663098 16.9979 0.627445 17.5023 1.01962L17.6234 1.12658C18.0869 1.59006 18.1226 2.31935 17.7304 2.82373L17.6234 2.94485L9.90914 10.6591C9.44566 11.1226 8.71636 11.1583 8.21199 10.7661L8.09086 10.6591L0.376577 2.94485C-0.125526 2.44275 -0.125526 1.62868 0.376577 1.12658Z" fill="%23BCBCBC"/></svg>');
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-color: white;
}

/* Item Fieldset Styles */
.ph-campaign-receipt .item-fieldset {
  display: flex;
  gap: 16px;
  margin-bottom: 27.5px;
}

.ph-campaign-receipt .form-item-receipt-number,
.ph-campaign-receipt .form-item-cnpj,
.ph-campaign-receipt .form-item-receipt-date {
  position: relative;
  max-width: 90%;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.ph-campaign-receipt .form-item-receipt-number::after,
.ph-campaign-receipt .form-item-cnpj::after,
.ph-campaign-receipt .form-item-receipt-date::after {
  margin-right: 5px;
  content: "";
  position: absolute;
  top: 68%;
  right: -40px;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  background-color: white !important;
  border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6.66953%2014.1381L14.5297%206.27792C15.0928%205.71481%2015.9136%205.49489%2016.6828%205.701C17.452%205.90712%2018.0529%206.50795%2018.259%207.27718C18.4651%208.04641%2018.2452%208.86716%2017.6821%209.43028L9.82188%2017.2905C9.75024%2017.3621%209.66113%2017.4138%209.56338%2017.4405L6.36108%2018.3138C5.92644%2018.4324%205.52762%2018.0336%205.64616%2017.5989L6.51951%2014.3966C6.54617%2014.2989%206.59788%2014.2098%206.66953%2014.1381ZM17.1546%207.67084L17.1342%207.57857C17.0358%207.21119%2016.7488%206.92424%2016.3814%206.8258L16.2892%206.8054C15.9496%206.746%2015.5997%206.8548%2015.3531%207.10133L7.60175%2014.8526L7.03698%2016.9224L9.10683%2016.3577L16.8587%208.60687C17.1052%208.36034%2017.214%208.01042%2017.1546%207.67084Z%22%20fill%3D%22%23DC0019%22%2F%3E%3C%2Fsvg%3E")
    no-repeat center;
  background-size: contain;
}

/* Product Item Styles */
.ph-campaign-receipt .product-item {
  display: grid;
  grid-template-columns: 81px auto;
  grid-template-rows: 1fr 1fr;
  gap: 19px 12px;
  grid-auto-flow: row;
  grid-template-areas:
    "image-wrapper item-select"
    "image-wrapper quantity-wrapper";
}

.ph-campaign-receipt .product-item img {
  height: 100%;
}

.ph-campaign-receipt .product-item > div:first-child {
  grid-area: image-wrapper;
  width: 81px;
  height: 112px;
  object-fit: contain;
}

.ph-campaign-receipt .product-item > input:first-child {
  grid-area: item-select;
}

/* Quantity Wrapper Styles */
.ph-campaign-receipt .quantity-wrapper {
  grid-area: quantity-wrapper;
  display: flex;
  align-items: center;
  gap: 15px;
}

.ph-campaign-receipt .quantity-increment,
.ph-campaign-receipt .quantity-decrement {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: none;
  background: white;
  color: transparent;
  font-size: 0;
  cursor: pointer;
  position: relative;
}

.ph-campaign-receipt .quantity-increment::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  transform: translate(-50%, -50%);
  background: url('data:image/svg+xml,<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.1174 0.993801C10.0524 0.434295 9.57694 0 9 0C8.37868 0 7.875 0.50368 7.875 1.125V7.875H1.125L0.993801 7.88257C0.434295 7.94755 0 8.42306 0 9C0 9.62132 0.50368 10.125 1.125 10.125H7.875V16.875L7.88257 17.0062C7.94755 17.5657 8.42306 18 9 18C9.62132 18 10.125 17.4963 10.125 16.875V10.125H16.875L17.0062 10.1174C17.5657 10.0524 18 9.57694 18 9C18 8.37868 17.4963 7.875 16.875 7.875H10.125V1.125L10.1174 0.993801Z" fill="%23DC0019"/></svg>') no-repeat center;
  background-size: contain;
}

.ph-campaign-receipt .quantity-decrement::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  transform: translate(-50%, -50%);
  background: url('data:image/svg+xml,<svg width="18" height="3" viewBox="0 0 18 3" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17 0.875C17.5523 0.875 18 1.32272 18 1.875C18 2.38784 17.614 2.81051 17.1166 2.86827L17 2.875H1C0.447715 2.875 0 2.42728 0 1.875C0 1.36216 0.38604 0.939493 0.883379 0.881728L1 0.875H17Z" fill="%23DC0019"/></svg>') no-repeat center;
  background-size: contain;
}

.ph-campaign-receipt .quantity-field {
  width: 34px;
  height: 40px;
  background-color: #fff;
  border: 1px solid #bcbcbc;
  border-radius: 4px;
  box-sizing: border-box;
  text-align: center;
  font-size: 14px;
}

.ph-campaign-receipt .quantity-field::-webkit-inner-spin-button {
  display: none;
}

/* Remove Item Button */
.ph-campaign-receipt .remove-item {
  background-color: white !important;
  border-radius: 50%;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -2 12 22" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M7.2.5c.959 0 1.742.795 1.797 1.797L9 2.409v.636h2.4c.331 0 .6.285.6.637a.625.625 0 0 1-.53.632l-.07.004h-.6v8.273c0 1.017-.75 1.848-1.694 1.906L9 14.5H3c-.959 0-1.742-.795-1.797-1.797l-.003-.112V4.318H.6c-.331 0-.6-.285-.6-.636 0-.327.232-.595.53-.632l.07-.005H3V2.41C3 1.392 3.75.561 4.694.503L4.8.5zM3.6 4.318H2.4v8.273c0 .326.232.595.53.632l.07.004h6c.308 0 .561-.245.596-.562l.004-.074V4.318zm4.2-1.273H4.2V2.41l.004-.074c.035-.317.288-.562.596-.562h2.4l.07.004c.298.037.53.306.53.632zm-3 3.182c.308 0 .561.246.596.562l.004.075v3.818c0 .351-.269.636-.6.636-.308 0-.561-.245-.596-.562l-.004-.074V6.864c0-.352.269-.637.6-.637m2.996.562c-.035-.316-.288-.562-.596-.562-.331 0-.6.285-.6.637v3.818l.004.074c.035.316.288.562.596.562.331 0 .6-.285.6-.636V6.864z" fill="%23DC0019"/></svg>')
    no-repeat center;
  background-size: contain;
  color: transparent;
  width: 24px;
  height: 24px;
  border: none;
  cursor: pointer;
}

/* Form Actions */
.ph-campaign-receipt .form-actions {
  display: flex;
  gap: 12px;
  margin-top: 32px;
}

.ph-campaign-receipt input.add-item,
.ph-campaign-receipt input.next-step {
  flex: 1;
  height: 40px;
  border: none;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
}

.ph-campaign-receipt #edit-actions-add-item {
  background: transparent;
  color: white;
}

.ph-campaign-receipt #edit-actions-step-one-submit {
  background: white;
  color: #ff0000;
}

/* Hidden Elements */
.ph-campaign-receipt .hidden {
  display: none !important;
}

/* Confirmation Details */
.ph-campaign-receipt #edit-confirmation-details legend {
  display: none;
}

.ph-campaign-receipt #edit-confirmation-details .confirmation-details-header {
  margin-bottom: 1.75rem;
}

.ph-campaign-receipt #edit-confirmation-details-receipt-number label,
.ph-campaign-receipt #edit-confirmation-details-cnpj label,
.ph-campaign-receipt #edit-confirmation-details-receipt-date label {
  display: block;
  font-weight: bold;
  margin-bottom: 0.5rem;
}

.ph-campaign-receipt #edit-confirmation-details-receipt-number:not(label),
.ph-campaign-receipt #edit-confirmation-details-cnpj:not(label),
.ph-campaign-receipt #edit-confirmation-details-receipt-date:not(label) {
  margin-bottom: 24px;
}

.ph-campaign-receipt #edit-confirmation-details-cnpj:not(label) {
  float: left;
  margin-right: 80px;
}

/* Confirmation Items */
.ph-campaign-receipt #edit-confirmation-details-order-number {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.ph-campaign-receipt #edit-confirmation-items legend {
  display: none;
}

.ph-campaign-receipt #edit-confirmation-items {
  border-top: 1px solid #EAF8EE;
  margin-bottom: 60px;
}

.ph-campaign-receipt .confirmation-item {
  display: flex;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid #EAF8EE;
  padding: 28px 0;
  line-height: 1.25rem;
}

.ph-campaign-receipt .confirmation-item p strong {
  font-size: 19px;
}

.ph-campaign-receipt .confirmation-item img {
  margin-right: 12px;
  object-fit: contain;
  width: 81px;
  height: 112px;
}

/* Back and Submit Buttons */
.ph-campaign-receipt .back-step2-button, .ph-campaign-receipt .submit-step2-button {
  height: 40px;
  border: none;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
}

.ph-campaign-receipt .step-two-buttons {
  display: flex;
  justify-content: center;
  width: 100%;
  gap: 0.75rem;
}

.ph-campaign-receipt .back-step2-button {
  width: 157px;
  background: transparent;
  color: white;
}

.ph-campaign-receipt .submit-step2-button {
  width: 111px;
  background: white;
  color: #ff0000;
}

.ph-campaign-receipt .ph-campaign-receipt__header {
  width: 100%;
}

@media only screen and (min-width: 1200px) {
  .ph-campaign-receipt .ph-campaign-receipt__header {
    margin-bottom: 10px;
  }
}

@media only screen and (max-width: 1199px) {
  .ph-campaign-receipt .ph-campaign-receipt-form {
    width: 100%;
  }

  .ph-campaign-receipt #edit-confirmation-details .confirmation-details-header {
    margin-bottom: 3rem;
  }

  .ph-campaign-receipt .ph-campaign-receipt__header {
    margin-bottom: 47px;
  }

  .ph-campaign-receipt .ph-campaign-receipt__header img {
    width: 170px;
    height: 112px;
  }
}

@media only screen and (max-width: 400px) {
  .ph-campaign-receipt #edit-actions {
    flex-direction: column;
  }

  .ph-campaign-receipt #edit-actions input {
    width: 100%;
    line-height: 1.5rem;
    padding: 0.5rem 1.5rem;
  }
}

.ajax-progress-fullscreen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: transparent;
  background-size: 24px 24px;
  z-index: 1000;
  border-radius: 7px;
  background-image: url(../assets/loading-small.gif);
  background-repeat: no-repeat;
  background-position: center center;
  padding: 4px;
  opacity: 0.9;
}