/* ==============================
   APPLY ONLY TO THIS WEBFORM
   ============================== */
  
#webform-submission-eula-webform-add-form {

  /* ==== GENERAL RESET ==== */
 :root {
    --primary: #00538f;
    --accent: #007fc8;
    --light: #f6f8fa;
    --radius: 10px;
  }
  /* ==== INTRO SECTION ==== */
  .intro-section {
    text-align: center;
    padding-right: 30px;
    padding-left: 30px;
    padding-bottom: 0px;
    background: #fff;
  }
  .intro-section p {

    text-align: center;
      font-size: 20px;
      line-height: 38px;
      font-weight: 400;
      margin-bottom: 40px;
      background: linear-gradient(to right, #012d69 40%, #25a3dd 60%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      word-break: break-word;
  }

  /* ==== SCROLLABLE INFO (VERTICAL) ==== */
  .scrollable-info {
    overflow-y: auto;
    max-height: 400px;
    padding: 40px 75px;
    background-color: rgb(246, 248, 250);
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea;
    box-sizing: border-box;
    scroll-snap-type: y mandatory;
  }
  .scrollable-info::-webkit-scrollbar {
    width: 10px;
  }
  .scrollable-info::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 5px;
  }
  .info-page {
    scroll-snap-align: start;
    background-color: #fff;
    border-radius: var(--radius);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    padding: 30px;
    margin-bottom: 20px;
    box-sizing: border-box;
  }
  .info-page h2 {
    color: var(--primary);
    font-size: 1.4rem;
    margin-top: 0;
  }
  .info-page p {
    color: #444;
    line-height: 1.5;
  }

  /* ==== FORM CONTAINER ==== */
  .form-container {
    background: #030f26;
    padding: 20px;
    border-radius: 3px;
    max-width: 900px;
    width: 100%;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    margin: 60px auto;
    box-sizing: border-box;
  }

  /* ==== FIELDS GRID ==== */
  .fields-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 24px;
    width: 100%;
    box-sizing: border-box;
    padding-top: 20px;
  }

  /* ==== STANDARD FIELDS ==== */
  .field {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0px;
  }
  .field label {
    font-size: 0.9rem;
    margin-bottom: 6px;
    color: #fff;
  }
  .field input,
  .field textarea,
  .field select {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 1rem;
  }
  .field textarea {
    resize: vertical;
    min-height: 80px;
  }

  /* ==== ADDRESS FIELD ==== */
  .field.webform-address {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
  }

  .field.webform-address .form-item-address-line1,
  .field.webform-address .form-item-city,
  .field.webform-address .form-item-state,
  .field.webform-address .form-item-postal-code {
    width: 100%;
  }

  .field.webform-address .form-item-address-line2 {
    grid-column: span 2; /* full width for line2 */
    width: 100%;
  }

  .field.webform-address input,
  .field.webform-address select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 1rem;
    box-sizing: border-box;
  }

  /* ==== CHECKBOXES & CAPTCHA ==== */
  .checkbox-group label {
    display: flex;
    align-items: flex-start; /* ensure checkbox aligns with first line of text */
    gap: 10px;
    font-size: 0.95rem;
    margin-bottom: 10px;
  }
  /* === Checkbox Alignment Fix === */
  .checkbox-field {
    display: flex !important;
    align-items: flex-start !important; /* aligns checkbox with first line of label */
    gap: 10px !important; /* spacing between checkbox and label */
    margin-bottom: 1rem; /* consistent vertical spacing */
  }

  /* Prevent checkbox from misaligning vertically */
  .checkbox-field input[type="checkbox"] {
    margin-top: 3px !important; /* fine-tune vertical offset */
    flex-shrink: 0 !important;
  }

  /* === Label Styling and Wrapping === */
  .checkbox-field label.option {
    flex: 1 1 auto !important;
    line-height: 1.5 !important;
    text-align: justify !important; /* ensures multi-line text is neatly justified */
    text-justify: inter-word;
    display: block !important;
    margin: 0 !important;
    color: #fff; /* adjust to match your theme text color */
  }

  /* === Optional: Required field asterisk spacing === */
  .checkbox-field label.form-required::after {
    margin-left: 4px;
  }

  /* === Optional: Focus & hover states for accessibility === */
  .checkbox-field input[type="checkbox"]:focus-visible {
    outline: 2px solid #007bff;
    outline-offset: 2px;
  }

  /* ==== SUBMIT BUTTON ==== */
  .submit-btn {
    color: #fff;
    border: none;
    padding: 12px 28px;
    border-radius: 6px;
    font-size: 1rem;
    cursor: pointer;
    transition: background 0.3s ease;
  }
  .submit-btn:hover {
    background: #006bb0;
  }

  .alert-success{
  text-align:center;
  }

  /* ==== RESPONSIVE ==== */
  @media (max-width: 900px) {
    .info-page {
      padding: 20px;
    }
  }
  @media (max-width: 600px) {
    .header-banner h1 {
      font-size: 1.8rem;
    }
    .form-container {
      padding: 24px;
    }
    .fields-grid {
      gap: 16px;
    }

    .field.webform-address {
      grid-template-columns: 1fr;
    }
    .field.webform-address .form-item-address-line2 {
      grid-column: span 1;
    }

  }

  /* Altera License Agreement Styling
     Screen-responsive, two-column legal layout
     Font: GT Walsheim (already loaded in Drupal theme)
  */
  /* Container */
  .altera-license {
    font-family: "GT Walsheim", sans-serif;
    font-size: 13.8px;
    color: #222;
    line-height: 1.45;
    max-width: 1100px;
    margin: 0 auto;
    padding: 60px 40px 100px; /* top and bottom padding */
    box-sizing: border-box;
    position: relative;
    background: #fff;
  }

  /* Intro paragraph */
  .license-intro {
    text-align: justify;
    font-size: 14px;
    line-height: 1.55;
    margin-bottom: 40px; /* increased spacing below intro */
  }

  /* Multi-column legal text */
  .license-body {
    column-count: 2;
    column-gap: 20px;
    column-fill: balance;
    text-align: justify;
    orphans: 3;
    widows: 3;
    margin-top: 20px;
  }

  /* Section headers – consistent vertical rhythm */
  .license-body h4 {
    font-size: 13.5px;
    font-weight: 700;
    margin-top: 0px;
    margin-bottom: 10px;
    text-transform: uppercase;
    break-inside: avoid;
    page-break-after: avoid;
  }

  /* Paragraphs */
  .license-body p {
    margin: 0 0 10px;
    break-inside: avoid-column;
  }
  /* Sub-points indentation */
  .license-body .subpoint {
    margin-left: 20px;
    line-height: 1.55;
  }

  /* Neutral links */
  .license-body a {
    color: inherit;
    text-decoration: none;
  }

  /* Footer pinned bottom-right */
  .license-footer {
    position: absolute;
    right: 40px;
    bottom: 20px;
    font-style: italic;
    font-size: 13px;
    color: #555;
  }

  /* Responsive behavior */
  @media (max-width: 900px) {
    .license-body {
      column-count: 1;
      column-gap: 0;
    }
    .license-footer {
      position: static;
      text-align: center;
      margin-top: 60px;
    }
  }
} /* END WRAPPER */