/* Shared small-screen overrides. Desktop styles remain in the existing sheets. */
@media screen and (max-width: 767.98px) {
  .layout-page.custom-layout {
    padding-left: 0;
  }

  .layout-page,
  .content-wrapper,
  .content-wrapper > .container-fluid,
  .content-wrapper > .container-xxl,
  .row > *,
  .page-shell,
  .card,
  .card-body,
  .modal-body {
    min-width: 0;
  }

  .content-wrapper > .container-fluid,
  .content-wrapper > .container-xxl {
    padding-inline: 1rem;
  }

  .page-hero,
  .page-filter-card__header,
  .page-table-card__header {
    flex-wrap: wrap;
  }

  .page-hero__content,
  .page-hero__summary {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .content-wrapper .table-responsive,
  .content-wrapper .flex-container,
  .modal .table-responsive {
    max-width: 100%;
    min-width: 0;
    -webkit-overflow-scrolling: touch;
  }

  /* These editable period tables do not have a Bootstrap scroll wrapper. */
  .multi-cups:has(> #multiCupsTablePower),
  .multi-cups:has(> #multiCupsTableDeclared) {
    overflow-x: auto;
  }

  #multiCupsTablePower,
  #multiCupsTableDeclared {
    min-width: 640px;
  }

  .content-wrapper .pagination,
  .dataTables_wrapper .pagination {
    flex-wrap: wrap;
    gap: .25rem;
    justify-content: center;
  }

  .content-wrapper .select2-container,
  .modal .select2-container,
  .content-wrapper .bootstrap-select,
  .modal .bootstrap-select {
    max-width: 100%;
    min-width: 0;
  }

  .content-wrapper .form-control,
  .content-wrapper .form-select,
  .modal .form-control,
  .modal .form-select,
  .authentication-wrapper .form-control {
    /* Prevent automatic input zoom on iOS. */
    font-size: 1rem;
  }

  .content-wrapper .btn,
  .modal-footer .btn {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .modal-content {
    min-width: 0;
  }

  .modal-title {
    overflow-wrap: anywhere;
  }

  .proposal-layout-placeholder {
    display: none;
  }

  .proposal-future-activation {
    width: 100% !important;
  }

  .ahorraluz-filter-field,
  .ahorraluz-offer-card > *,
  .ahorraluz-invoice-main-row > *,
  .ahorraluz-holder-supply-row > * {
    min-width: 0;
  }

  .ahorraluz-filter-field .bootstrap-select {
    width: 100% !important;
  }

  .ahorraluz-filter-field .bootstrap-select > .dropdown-menu {
    min-width: 100%;
    max-width: 100%;
  }

  .ahorraluz-filter-field .bootstrap-select .dropdown-item {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .ahorraluz-vendor img,
  .ahorraluz-recommended-company img {
    max-width: 100%;
  }

  .ahorraluz-detail-table-wrapper {
    max-width: 100%;
    overflow-x: auto;
  }
}

@media screen and (max-width: 575.98px) {
  .card-body,
  .page-filter-card {
    padding: 1rem;
  }

  .modal-dialog {
    margin: .5rem;
  }

  .modal .modal-header,
  .modal .modal-body,
  .modal .modal-footer {
    padding-inline: 1rem;
  }

  .modal-footer {
    gap: .5rem;
  }

  .modal-footer > .btn {
    flex: 1 1 auto;
    margin: 0;
  }

  .ahorraluz-tab {
    min-width: 0;
    white-space: normal;
  }

  .ahorraluz-recommended {
    position: static;
    justify-self: center;
    transform: none;
    margin-top: .9rem;
    white-space: normal;
  }

  .ahorraluz-invoice-summary-row {
    flex-wrap: wrap;
    gap: .25rem .75rem;
  }

  .ahorraluz-invoice-summary-row span:last-child {
    margin-left: auto;
  }
}