/* Mobile fix for DSpace item detail page - 2026-03-11 */
/* Root cause: DSpace uses col-xs-12 (Bootstrap 3) but runs on Bootstrap 4/5 where col-xs-* doesn't exist */

/* Fix 1: Make col-xs-12 work like col-12 (always full width on mobile) */
@media (max-width: 767.98px) {
  .col-xs-12 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Fix 2: File section - stack thumbnail, file info, download vertically */
  .file-section.row,
  .file-section {
    flex-direction: column !important;
  }
  .file-section > .col-3,
  .file-section > .col-7,
  .file-section > .col-2,
  .file-section > [class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }
  .file-section > .col-3 {
    text-align: center;
    margin-bottom: 0.75rem;
  }
  .file-section > .col-2 {
    text-align: center;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
  }

  /* Fix 3: Ensure page sidebar doesn't steal width */
  .row-with-sidebar {
    flex-direction: column !important;
  }
  .row-with-sidebar > [class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Fix 4: Container full width */
  .container {
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Fix 5: Prevent word-breaking in narrow columns */
  .simple-view-element-body,
  .item-page-field {
    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: none !important;
  }

  /* Fix 6: URI link should break properly */
  .dont-break-out {
    word-break: break-all !important;
  }
}

