.verifyEmail-hero {
  background-image: url("/assets/images/landing/common/privacy-bg.svg");
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: fit-content;
  /* User requested content height */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  /* Offset fixed header */
  position: relative;
  z-index: 1;
  padding-top: 80px;
  padding-bottom: 170px;
  box-sizing: border-box;
}

.hero-content-box {
  width: 100%;
  max-width: 655px;
  display: flex;
  flex-direction: column;
  gap: 24px;

}

.verifyEmail-hero h1 {
  font-family: "PlusJakartaSans-ExtraBold", sans-serif;
  color: #252525;
  font-size: 48px;
  line-height: 140%;
  padding-bottom: 8px;
  text-align: center;
}

.verifyEmail-hero p {
  font-family: "PlusJakartaSans-Regular", sans-serif;
  color: #737373;
  font-size: 20px;
  text-align: center;
  text-align: center;
}

fieldset {
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.email-container {
  margin-bottom: 8px;
}

.email-container input {
  background-color: #ffffff;
  border: 0px;
  width: 100%;
  height: 44px;
  padding: 12px;
  font-family: "Inter_28pt-Regular";
  border-radius: 8px;
  outline: none;
}

.email-container input:focus {
  outline: none;
}

/* New CTA Banner Section Styles */
.cta-banner-section {
  padding: 40px 24px;
  /* Rounded corners */
}

.cta-banner-content {
  background: linear-gradient(90deg, #dce8ff 0%, #f4f8ff 50%, #dce8ff 100%);
  padding-top: 80px;
  padding-bottom: 64px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  max-width: 1200px;
  margin: auto;
  width: 100%;
  gap: 16px;
  border-radius: 16px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.cta-banner-content h2 {
  font-family: "Inter_18pt-Bold", sans-serif;
  font-size: 40px;
  color: #010101;
  margin: 0;
  line-height: 1.3;
}

.cta-subtitle {
  font-family: "Inter_28pt-SemiBold", sans-serif;
  font-size: 20px;
  color: #595959;
  margin: 0;

}

.cta-button {
  background-color: #1452CA;
  color: #FDFDFD;
  padding: 16px 32px;
  border-radius: 8px;
  font-family: "Inter_28pt-SemiBold", sans-serif;
  font-weight: 600;
  font-size: 16px;
  text-decoration: none;
  margin-top: 8px;
  display: inline-block;
}

.cta-button:hover {
  background-color: #1040A0;
}

.cta-note {
  font-family: "Inter_28pt-Regular", sans-serif;
  font-size: 16px;
  color: #595959;
}

/* Updated Bulk Content Section */
.bulk-content-section {
  display: flex;
  background-color: #ffffff;
  padding: 80px 120px;
  /* Increased padding */
}

#checkbox {
  height: 24px;
  width: 24px;

  border: 3px solid #dbdbdb;
}

.dash-inner-inner-section {
  font-family: "Inter_28pt-SemiBold";
  width: 100%;
  height: 604px;
  /* margin-top: 40px;
  margin-bottom: 82px; */

  display: flex;
  gap: 16px;
}

.dash-inner-inner-bulk-verification {
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  padding: 20px;
  border-radius: 12px;
}

.dash-inner-inner-verification-status {
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  padding: 20px;
  border-radius: 12px;
}

.inner-content {
  display: flex;
  width: 100%;
  gap: 72px;
  align-items: center;
  justify-content: space-between;
  /* Adjusted to space-between */
}

.content-discription {
  width: 100%;
  max-width: 623px !important;
  display: flex;
  flex-direction: column;
  gap: 24px;

  /* Increased gap */
}

.content-discription p {
  font-family: "Inter_28pt-Regular";
}


/* New Button Style for Content Section */
.content-btn {
  width: fit-content;
  padding: 14px 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #1452ca;
  color: #ffffff;
  border: 0;
  border-radius: 8px;
  font-size: 16px;
  font-family: "PlusJakartaSans-Bold", sans-serif;
  text-decoration: none;
  font-weight: 700;
  white-space: nowrap;
  /* Prevent wrapping */
}

.inner-content h1 {
  font-size: 40px;
  font-family: "Inter_18pt-Bold", sans-serif;
  line-height: 130%;
  color: #010101;
  margin: 0;
}

.inner-content p {
  font-size: 18px;
  /* Adjusted font size */
  font-family: "Inter_28pt-Regular", sans-serif;
  line-height: 160%;
  color: #595959 !important;
  /* Lighter text color */
}

.content-img {
  width: 100%;
  max-width: 505px;
  /* Removed fixed height to allow auto sizing */
  height: auto;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
}

.content-img img {
  width: 100%;
  height: auto;
  /* changed from fixed height */
  max-width: 100%;
  /* Ensure it fits container */
}

.verify-status-head {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 28px;
}

.bulk-domain-download {
  display: flex;
  flex-direction: row !important;
  align-items: center;
  flex-wrap: nowrap;
  border: 0;
  background-color: transparent;
  gap: 8px;
  color: #1452ca;
  font-weight: 800;
  font-size: 16px;
  cursor: pointer;
  white-space: nowrap;
}

.bulk-domain-download.hidden {
  display: none !important;
}

.bulk-domain-download-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  flex-grow: 0;
}

.bulk-domain-download-icon img {
  display: block;
  width: auto;
  height: auto;
}

.bulk-domain-download p {
  margin: 0;
  padding: 0;
  display: inline-block;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: "PlusJakartaSans-ExtraBold";
  font-weight: 800;
  font-size: 16px;
}

tr.bulks-table-inner td {
  border-bottom: 1px solid var(--color-twenty);
  background-color: white;
  padding-bottom: 16px;
  padding-top: 16px;
  font-weight: 600;
  font-size: 16px;
  font-family: "Inter_28pt-SemiBold";
}

.status-cont {
  font-size: 14px;
  font-weight: 600;
}

.status-cont span {
  color: #737373;
  font-size: 14px;
  font-weight: 400;
  padding-right: 4px;
}

.bulk-hd,
.bulk-verify-domain-btn {
  font-size: 20px;
  font: "PlusJakartaSans-semiBold";
  margin-bottom: 12px;
}

.bulk-content {
  font-size: 16px;
  font-weight: 600;
  line-height: 140%;
  margin-bottom: 12px;
  color: #737373;
}

#bulk-links {
  width: 100%;
  min-height: 100px;
  padding: 12px;
  margin: 12px 0;
  box-sizing: border-box;
  border: 0.3px solid #737373;
  border-radius: 8px;
  background: transparent;
  overflow-y: auto;
  overflow-x: hidden;
  font-size: 16px;
  font-weight: 400;
  resize: none;
  text-decoration: underline;
}

#bulk-links::placeholder {
  color: #b0b0b0;
  opacity: 0.7;
  text-decoration: none;
}

#bulk-links span {
  text-decoration: underline;

  display: inline-block;
}

.fags-wrapper {
  background-color: var(--color-seventeen);
  position: relative;
}

#bulk-links:focus {
  outline: none;
}

.bulks-fags-hd,
.fags-docs {
  font-size: 48px;
  color: var(--color-one);
  font-family: "PlusJakartaSans-ExtraBold";
  text-align: center;
  margin-bottom: 13px;
}

.fag-header-wrapper {
  padding-left: 20px;
  padding-right: 20px;
}

.bulks-fags-hd {
  padding-top: 100px;
}

fieldset {
  border: none;
  padding: 0;
}

.bulk-link-cont a {
  color: #000000;
  text-decoration: underline;
}

.bulk-verify-domain-btn {
  background-color: #1452ca;
  color: #ffffff;
  font-size: 16px;
  font-weight: 800;
  display: flex;
  justify-content: center;
  border-radius: 8px;
  align-items: center;
  border: 0px;
  width: 100%;
  height: 46px;
  margin-top: 24px;
}

.check-disposal-email {
  text-decoration: underline;
  font-size: 16px;
  font-weight: 600;
  color: #595959;
}

.bulk-tb-container {
  border: 1px solid #ededed;
  border-radius: 12px;
  padding: 12px;
  box-sizing: border-box;
  width: 100%;
}

.bulk-tb-container table {
  width: 100%;
}

.bulk-tb-container table tbody {
  width: 100%;
}

tr.bulk-table-inner td {
  width: 100%;
  padding-top: 16px;
  padding-bottom: 16px;

  font-family: "Inter_28pt-SemiBold";
}

.inner-top {
  padding-top: 0 !important;
}

.row-status-cont {
  display: flex;
  justify-content: space-between;
  width: 100%;

  margin-top: 12px;
}

.status-cont {
  display: flex;
}

@media only screen and (max-width: 760px) {
  .verifyEmail-hero {
    padding: 40px 16px;
    /* Adjust padding for mobile if needed, or keep consistent */
    box-sizing: border-box;
    height: fit-content;
    /* Reduced margin for mobile */
  }

  @media only screen and (max-width: 550px) {}

  /* Update padding for mobile */
  .bulk-content-section {
    padding: 40px 16px;
  }

  /* CTA Banner Mobile */
  .cta-banner-section {
    margin-top: 1px;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 40px;
    padding-top: 0px;
  }

  .cta-banner-content h2 {
    font-size: 24px;
  }

  .cta-subtitle {
    font-size: 16px;
  }

  fieldset {
    gap: 12px;
  }

  .dash-inner-inner-section {
    width: 100%;
    height: fit-content;

    justify-content: center;
    align-items: center;
    flex-direction: column;

    padding: 0px;
    gap: 0;
  }

  .verifyEmail-hero h1 {
    font-size: 24px;
  }

  .verifyEmail-hero p {
    font-size: 12px;
  }

  .email-container input {
    background-color: #ffffff;
    border: 0px;
    width: 100%;
    height: 14px;
    padding-bottom: 30px;
    border-radius: 8px;
    outline: none;
    box-sizing: border-box;
  }

  .content-discription h1 {
    font-size: 20px !important;
    /* Force override */
  }

  .content-discription p {
    font-size: 14px !important;
  }

  /* Mobile Order: Text first, then Image */
  /* If the HTML is Text Div then Image Div, normal flow works. 
     If we want Text TOP, Image BOTTOM, that's the default column flow.
     Let's just ensure flex-direction is column and order is natural, or forced.
  */
  .inner-content {
    flex-direction: column;
    gap: 32px;
  }

  /* Ensure image is large enough but fits */
  .content-img img {
    max-width: 100%;
    height: auto;
    max-height: 300px;
  }

  /* .content-discription button removal was here, we use .content-btn now */
  .content-btn {
    width: 100%;
    max-width: 200px;
  }

  .dash-inner-inner-verification-status {
    padding: 0;
    border-radius: 0;
    background-color: transparent;
  }

  .verify-status-head {
    margin-top: 12px;
  }

  .empty-state-text {
    font-size: 14px;
  }

  .dash-inner-inner-section {
    padding-top: 20px;

    margin: 0;
  }

  /* .bulk-hd {
    display: none;
  } */
  .bulk-tb-container {
    height: fit-content;
    max-height: 600px;
    overflow-y: scroll;
    padding: 12px;
  }

  .bulktitle {
    display: block;
    font-size: 14px;
    padding-top: 10px;
  }

  .dash-inner-inner-bulk-verification {
    width: 100%;
    height: 100%;
    background-color: transparent;
    padding: 0px;
    border-radius: 0px;
    box-shadow: none;
  }

  .table-inner-inner {
    padding: 0;
    border: 0;
    border-radius: 0;
  }

  .dash-inner-inner-bulk-verification {
    padding: 0;
    height: fit-content;
  }
}

@media only screen and (max-width: 520px) {
  .bulks-fags-hd {
    font-size: 20px;
    margin-bottom: 10px;
    padding-top: 40px;
  }

  .bulk-verify-domain-btn {
    font-size: 12px;
    height: 41px;
  }

  /* .content-img {
    height: 320px;
  } */
}

/* Results Overlay Section */
.results-overlay-section {
  max-width: 1200px;
  /* Constrain width */
  margin: 0 auto;
  position: relative;
  z-index: 10;
  padding-left: 20px;
  padding-right: 20px;
  margin-top: -140px;
  /* Initial overlap */
  margin-bottom: 60px;
  /* Push following content down */
}

/* Public Results Card Styles */
.public-results-card {
  background-color: #FFFFFF;
  border-radius: 12px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  border: 1px solid #EDEDED;
}

.disposal-result-main-title {
  font-family: "Inter_18pt-Bold";
  font-size: 20px;
  color: #252525;
  margin: 0;
  text-align: center;
}

.disposal-results-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  /* 4 Columns */
  gap: 16px;
}

/* Result Card Styles */
.result-card {
  display: flex;
  flex-direction: column;
  /* Stack content vertically */
  align-items: center;
  /* Center align */
  justify-content: start;
  /* Kept as start or center? Previous was start in Step 239. */
  padding: 16px 12px;
  border-radius: 12px;
  text-align: center;
  height: 100%;
}


.result-head {
  font-family: "PlusJakartaSans-Bold", sans-serif;
  font-size: 16px;
  color: #404040;
  margin-bottom: 8px;
}

.result-desc {
  font-family: "Inter_28pt-Regular", sans-serif !important;
  font-size: 16px;
  color: #404040;
  line-height: 160%;
}

.result-boolean {
  font-family: "Inter_18pt-Bold", sans-serif;
  font-size: 20px;
  margin: 0;
  padding: 0;
  margin-bottom: 20px;
  color: #404040;
}

/* Status Colors */
.status-true {
  background-color: #ECFDF3;
  /* Light green */
}

.status-true .result-boolean {
  color: #027A48;
  /* Green text */
}

.status-false {
  background-color: #FEF3F2;
  /* Light red */
}

.status-false .result-boolean {
  color: #B42318;
  /* Red text */
}

/* Responsive Overrides */
@media only screen and (max-width: 900px) {
  .disposal-results-list {
    grid-template-columns: 1fr 1fr;
    /* 2x2 on Tablet */
  }
}

@media only screen and (max-width: 600px) {
  .disposal-results-list {
    grid-template-columns: 1fr;
    /* Stack on Mobile */
  }

  .results-overlay-section {
    margin-top: -40px;
    padding-left: 16px;
    padding-right: 16px;
    /* Reduce overlap on mobile */
  }

  .disposal-result-main-title {
    font-size: 14px;
  }

  .result-boolean {
    font-size: 14px;
    margin: 12px;
    /* Reduce margin on mobile if needed, or keep 20px. User didn't specify, but smaller text usually implies tighter spacing. I'll stick to font size only unless it looks bad. But margin-bottom: 20px on desktop might be huge for 14px text. I'll keep margin as is strictly unless asked. */
  }

  .result-head {
    font-size: 12px;
  }

  .result-desc {
    font-size: 12px;
  }
}

/* Utility for full width result cards in the check page */
.full-width-card {
  grid-column: 1 / -1;
}