/* Doctor KYC responsive rules — migrated out of responsive.css, where they
   lived under "media queries cleaned css" interleaved with vendor's (vv-)
   rules and unrelated site-wide rules. Covers .dd-kyc-pdf-grid,
   .dd-kyc-form-grid, .dd-kyc-field-row, .dd-kyc-submit-row,
   .dd-plx-file-preview-eye. */

/* Extra Small Only (Mobile): < 576px */
@media (max-width: 575.98px) {
  .dd-kyc-pdf-grid {
    grid-template-columns: repeat(1, 1fr);
  }

  .dd-kyc-form-grid {
    grid-template-columns: 1fr;
  }

  .dd-kyc-field-row {
    grid-template-columns: 1fr;
  }

  .dd-kyc-submit-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .dd-plx-file-preview-eye {
    padding: var(--space-xs);
  }
}

/* Small Only (Landscape phones): 576px to 767.98px */
@media (min-width: 576px) and (max-width: 767.98px) {
  .dd-kyc-pdf-grid {
    grid-template-columns: repeat(1, 1fr);
  }

  .dd-kyc-form-grid {
    grid-template-columns: 1fr;
  }

  .dd-kyc-field-row {
    grid-template-columns: 1fr;
  }

  .dd-plx-file-preview-eye {
    padding: var(--space-xs);
  }
}

/* Medium Only (Tablets): 768px to 991.98px */
@media (min-width: 768px) and (max-width: 991.98px) {
  .dd-kyc-pdf-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .dd-kyc-form-grid {
    grid-template-columns: 1fr;
  }
}

/* Large Only (Desktops): 992px to 1199.98px */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .dd-kyc-pdf-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Extra Large Only (Large desktops): 1200px to 1399.98px */
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .dd-kyc-pdf-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Extra Extra Large Only (Largest screens): ≥ 1400px */
@media (min-width: 1400px) {
  .dd-kyc-pdf-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Responsive overrides for Degree Slots Container */
@media (max-width: 991.98px) {
  #degree-slots-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 599.98px) {
  #degree-slots-container {
    grid-template-columns: 1fr;
  }
}