/* =========================================================
   DRIVE ZERNYX · VISTA MÓVIL
   Se carga al final. Reglas para pantallas angostas.
   ========================================================= */

@media (max-width: 700px) {
  /* ---------- Cabeceras y resúmenes compactos ---------- */

  .drive-summary,
  .file-type-page__summary,
  .recent-page__summary,
  .trash-page__summary,
  .users-summary {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .drive-summary > *,
  .file-type-page__summary > *,
  .recent-page__summary > *,
  .trash-page__summary > *,
  .users-summary > * {
    min-width: 0;
    min-height: 0 !important;
    padding: 10px 12px !important;
  }

  .drive-summary [class*="__icon"],
  .file-type-page__summary [class*="__icon"],
  .recent-page__summary [class*="__icon"],
  .trash-page__summary [class*="__icon"],
  .users-summary [class*="__icon"] {
    display: none !important;
  }

  .drive-summary [class*="__copy"] span,
  .file-type-page__summary [class*="__copy"] span,
  .recent-page__summary [class*="__copy"] span,
  .trash-page__summary [class*="__copy"] span,
  .users-summary [class*="__copy"] span {
    font-size: 10px !important;
    line-height: 1.25;
  }

  .drive-summary [class*="__copy"] strong,
  .file-type-page__summary [class*="__copy"] strong,
  .recent-page__summary [class*="__copy"] strong,
  .trash-page__summary [class*="__copy"] strong,
  .users-summary [class*="__copy"] strong {
    overflow: hidden;

    font-size: 15px !important;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .drive-command__copy p,
  [class*="page__heading-copy"] p,
  [class*="page__header"] p {
    display: none !important;
  }

  .drive-command__actions .button,
  .recent-page__header-actions .button {
    padding: 0 8px;

    font-size: 12px;
    white-space: nowrap;
  }

  .drive-command__actions,
  .recent-page__header-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 8px;

    width: 100%;
  }

  /* ---------- Barra de herramientas de lista ---------- */

  .lv-toolbar {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;

    padding: 10px 12px;
  }

  .lv-search {
    grid-column: 1 / -1;

    max-width: none;
  }

  .lv-toolbar select,
  .lv-dir {
    width: 100%;
    max-width: none;
  }

  .lv-dir {
    justify-content: center;
  }

  .lv-sep {
    display: none;
  }

  .lv-count {
    display: block;
    margin: 0;

    align-self: center;
  }

  .lv-views {
    justify-self: end;
  }

  /* ---------- Listas: de tabla a tarjetas apiladas ---------- */

  .drive-table-wrap,
  .file-type-page__table-wrap,
  .trash-page__table-wrap,
  .recent-page__content {
    overflow-x: visible !important;
  }

  .drive-table-head,
  .file-type-page__table-head,
  .trash-page__table-head,
  .recent-page__table-head {
    display: none !important;
  }

  .lv-list:not(.lv-view-grid) {
    min-width: 0 !important;
    width: 100%;
  }

  .lv-list:not(.lv-view-grid) > :is(.drive-item, .file-type-row, .trash-row, .tags-file) {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center !important;
    gap: 6px 10px;

    min-width: 0 !important;
    min-height: 0 !important;
    height: auto;
    padding: 10px 12px !important;

    grid-template-columns: none !important;
  }

  .lv-list:not(.lv-view-grid) [class*="__selection"] {
    flex: 0 0 auto;
  }

  .lv-list:not(.lv-view-grid) [class*="__main"] {
    /* El nombre ocupa casi toda la línea; tamaño y fecha pasan abajo */
    flex: 1 1 calc(100% - 44px);

    min-width: 0;
    padding: 0 !important;
  }

  .lv-list:not(.lv-view-grid) [class*="__name"] strong {
    white-space: normal;

    overflow-wrap: anywhere;
  }

  .lv-list:not(.lv-view-grid) [class*="__drag-handle"],
  .lv-list:not(.lv-view-grid) [class*="__user"],
  .lv-list:not(.lv-view-grid) [class*="__visibility"],
  .lv-list:not(.lv-view-grid) [class*="__location"] {
    display: none !important;
  }

  .lv-list:not(.lv-view-grid) [class*="__size"],
  .lv-list:not(.lv-view-grid) [class*="__date"] {
    flex: 0 0 auto;

    color: var(--text-soft);
    font-size: 11px;
  }

  .lv-list:not(.lv-view-grid) [class*="__actions"] {
    display: flex !important;
    flex: 0 0 100%;
    flex-wrap: wrap;
    gap: 6px;

    min-width: 0;
    padding: 0 !important;
  }

  .lv-list:not(.lv-view-grid) [class*="__actions"] .icon-button {
    width: 34px;
    height: 34px;
  }

  .lv-list.lv-view-compact [class*="__actions"] {
    display: none !important;
  }

  .lv-list.lv-view-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;

    padding: 10px;
  }

  .lv-list.lv-view-grid [class*="__preview"],
  .lv-list.lv-view-grid [class*="__main"] > [class*="__icon"] {
    height: 96px !important;
  }

  /* ---------- Usuarios: tabla → tarjetas ---------- */

  .users-table-wrap {
    overflow-x: visible !important;
  }

  .users-table,
  .users-table tbody {
    display: block;

    min-width: 0 !important;
    width: 100%;
  }

  .users-table thead {
    display: none;
  }

  .users-table tbody tr {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;

    padding: 12px;

    border-bottom: 1px solid var(--line-soft);
  }

  .users-table tbody td {
    display: block;

    padding: 0 !important;

    border: 0 !important;
  }

  .users-table tbody td:nth-child(1) {
    flex: 0 0 100%;
  }

  .users-table tbody td:nth-child(4),
  .users-table tbody td:nth-child(5) {
    display: none;
  }

  .users-table tbody td:last-child {
    margin-left: auto;
  }

  /* ---------- Perfil ---------- */

  .profile__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px;
  }

  .profile__stats article {
    padding: 12px;
  }

  .profile__stats strong {
    font-size: 16px;
  }

  .profile__row {
    grid-template-columns: 1fr !important;
  }

  /* Transferencias a todo el ancho */
  .transfers-dock {
    right: 8px;
    bottom: 8px;
    left: 8px;

    width: auto;
  }

  /* Tarjetas de página */
  .tags-page,
  .profile {
    padding: 12px;
  }

  .calendar {
    right: 8px;
    left: 8px !important;

    width: auto;
  }
}

/* Login: menos texto en pantallas chicas */
@media (max-width: 900px) {
  .login-info__body > p {
    display: none;
  }

  .login-info__body h2 {
    font-size: 20px;
  }
}

@media (max-width: 700px) {
  /* Buscador: al abrirse ocupa todo el ancho de la barra superior */
  .app-topbar {
    position: sticky;
  }

  .app-topbar__search.is-open,
  .app-topbar__search:focus-within {
    position: absolute;
    top: 50%;
    right: 8px;
    left: 8px;
    z-index: 20;

    width: auto !important;
    max-width: none !important;
    height: 40px;
    min-height: 40px;

    background: #101013;
    transform: translateY(-50%);
  }

  .app-topbar__search.is-open input,
  .app-topbar__search:focus-within input {
    width: 100%;
    opacity: 1;
  }
}

@media (max-width: 700px) {
  .app-topbar__right {
    position: static;
  }
}

.app-topbar__search input[type="search"]::-webkit-search-cancel-button,
.app-topbar__search input[type="search"]::-webkit-search-decoration {
  display: none;
  -webkit-appearance: none;
}