/** Shopify CDN: Minification failed

Line 17:12 Unexpected "{"
Line 17:21 Expected ":"
Line 18:16 Expected identifier but found whitespace
Line 18:18 Unexpected "{"
Line 18:27 Expected ":"
Line 18:78 Expected ":"
Line 19:19 Expected identifier but found whitespace
Line 19:21 Unexpected "{"
Line 19:30 Expected ":"
Line 19:84 Expected ":"
... and 10 more hidden warnings

**/

  .section-{{ section.id }}-padding {
    padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
    padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
  }

  @media screen and (min-width: 750px) {
    .section-{{ section.id }}-padding {
      padding-top: {{ section.settings.padding_top }}px;
      padding-bottom: {{ section.settings.padding_bottom }}px;
    }
  }

  .form-tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
  }

  .tab-button {
    padding: 10px 16px;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    font-weight: bold;
    color: #333333;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
  }

  .tab-button:hover {
    background-color: #ebebeb;
  }

  .tab-button.active {
    background-color: #007bff;
    color: #ffffff;
    border-color: #007bff;
  }

  .form-content-wrapper {
    display: none; /* Hide all tables by default */
  }

  .form-content-wrapper.active {
    display: block; /* Show only the active table */
  }

  table {
    border-collapse: collapse;
    width: 100%;
    margin-top: 20px;
  }

#ContactForm th,
#ContactForm td {
  padding: 4px 10px; /* Reduced vertical padding from 8px to 4px */
  text-align: left;
  border-bottom: 1px solid #ddd;
  font-size: 15px;
  line-height: 1.5;
  vertical-align: middle; /* Kept the vertical centering */
}
  
  th {
    background-color: #f9f9f9;
    font-size: 16px;
  }
  
  .field__input, .text-area {
    font-size: 16px;
  }

  /* --- BOLD TEXT IMPROVEMENT --- */
  /* This new rule makes key text bolder for better readability. */
  th,
  .form-content-wrapper td label, /* Bold labels in the tables */
  .contact__fields .field__label { /* Bold labels for Name, Email, etc. */
    font-weight: 600; /* Using 600 for a strong, but not overly aggressive, bold */
  }
  /* --- END BOLD TEXT IMPROVEMENT --- */

/* --- QUANTITY BOX IMPROVEMENT V3 (WITH !important) --- */
/* This version uses the !important rule to force styles over the theme's defaults. */
#ContactForm .quantity-input {
  width: 90px !important;
  text-align: center !important;
  border: 1px solid #ced4da !important;
  border-radius: 5px !important;
  padding: 8px 5px !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.06) !important;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !important;
  background-color: #fff !important;
  /* The following are needed to ensure consistent height and remove extra margin */
  min-height: auto !important;
  margin-bottom: 0 !important;
}

#ContactForm .quantity-input:focus {
  border-color: #80bdff !important;
  outline: 0 !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.06), 0 0 0 0.2rem rgba(0,123,255,.25) !important;
}
/* --- END QUANTITY BOX IMPROVEMENT --- */

/* --- UI POLISH: ZEBRA STRIPING & TOTAL ROW --- */
/* Add alternating background colors to table rows for easier scanning */
#ContactForm .form-row:nth-child(even) {
  background-color: #f8f9fa; /* A very light, neutral grey */
}

/* Make the final "Total" row stand out visually */
#ContactForm table tbody tr:last-child {
  background-color: #e9ecef;
  border-top: 2px solid #ced4da;
}

#ContactForm table tbody tr:last-child td {
  font-size: 16px;
  font-weight: bold;
}
/* --- END UI POLISH --- */

/* --- UI POLISH: CENTER QUANTITY BOX --- */
/* This ensures the div containing the quantity input is perfectly centered, both
   horizontally and vertically, within the table cell. */
#ContactForm th,
#ContactForm td {
  vertical-align: middle; /* Vertically centers all content */
  /* other styles... */
}
/* --- END UI POLISH --- */

  /* --- UI POLISH: LAYOUT & BUTTON --- */
/* Style the container for the main user info fields */
#ContactForm .contact__fields {
  display: flex;
  flex-direction: column;
  gap: 10px; /* This will now correctly control the spacing */
  background-color: #f8f9fa;
  padding: 20px;
  border-radius: 6px;
  border: 1px solid #dee2e6;
  margin-bottom: 25px;
}

/* This new rule overrides the theme's default margin on the fields */
#ContactForm .contact__fields .field {
  margin-bottom: 0;
}

/* Style the submit button to be a clear call-to-action */
#ContactForm .contact__button .button {
  background-color: #007bff;
  color: #ffffff;
  border: none;
  padding: 12px 25px;
  font-size: 16px;
  font-weight: bold;
  border-radius: 5px;
  cursor: pointer;
  width: 100%;
  transition: background-color 0.3s ease;
}

#ContactForm .contact__button .button:hover {
  background-color: #0056b3;
}

/* Darker background for table headers */
#ContactForm th {
  background-color: #e9ecef;
}
/* --- END UI POLISH --- */

  
  
  .dark-black-text {
    color: #000000;
    font-weight: bold;
  }


/* ============================================= */
/* == Styles for 'How to Sell' Blog Post      == */
/* ============================================= */

/* Style for the container cards */
.sell-option-card {
  background-color: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 8px;
  padding: 25px;
  margin: 20px 0;
}

/* Styling for the headings inside the cards */
.sell-option-card h3 {
  margin-top: 0;
  margin-bottom: 15px;
  font-size: 1.5em;
  border-bottom: 2px solid #007bff;
  padding-bottom: 10px;
}

/* Proper styling for the lists */
.sell-option-card ul {
  list-style-type: disc;
  padding-left: 20px;
}

.sell-option-card li {
  margin-bottom: 10px;
}

/* Call-to-action button styling */
.cta-button {
  display: inline-block;
  background-color: #007bff;
  color: #ffffff !important;
  padding: 12px 25px;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s ease;
  margin-top: 15px;
}

.cta-button:hover {
  background-color: #0056b3;
  color: #ffffff !important;
}