/* ===== Adaptação de aparelho: nada sai da tela, tudo quebra linha ou rola dentro do próprio bloco ===== */
html { -webkit-text-size-adjust: 100%; max-width: 100%; overflow-x: hidden; }
body { max-width: 100%; overflow-x: hidden; min-height: 100dvh; padding-left: env(safe-area-inset-left); padding-right: env(safe-area-inset-right); }
img, video, canvas, iframe, svg { max-width: 100%; }
input, select, textarea, button { max-width: 100%; font-size: max(16px, 1em); }
h1, h2, h3, h4, p, span, a, label, td, th, strong, b, .badge, .file-row-name { overflow-wrap: anywhere; }
.btn, .badge, .nav-item { max-width: 100%; }
pre, code, table { max-width: 100%; }

/* Blocos flex/grid podem encolher em vez de estourar */
.header, .header-left, .header-right, .dashboard-intro, .intro-actions, .room-card-header, .room-actions, .room-meta, .card-row,
.card-row-info, .card-row-actions, .file-row, .file-main, .file-btns, .modal-header, .modal-footer, .sala-file-card, .stat-card, .form-row { min-width: 0; }
.header { flex-wrap: wrap; row-gap: 6px; padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
.header-right { flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.dashboard-intro, .intro-actions, .room-actions, .room-meta, .card-row, .card-row-actions, .file-btns, .modal-footer { flex-wrap: wrap; }
.rooms-grid, .stats-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.stats-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
.room-card, .card, .stat-card { min-width: 0; max-width: 100%; }
.file-main, .card-row-info, .grow { flex: 1 1 140px; min-width: 0; }

/* Janelas: cabem na tela, só o miolo rola, rodapé sempre visível */
.modal { padding: max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)); }
.modal-content, .rename-box, .slide-panel-content { width: 100%; max-width: min(100%, 720px); max-height: calc(100dvh - 20px); }
.modal-content { display: flex; flex-direction: column; overflow: hidden; }
.modal-content > form { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.modal-body { min-height: 0; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.modal-header, .modal-footer { flex: none; }
.modal-footer { position: sticky; bottom: 0; }
.slide-panel-content { max-width: 100vw; }

/* Avisos e barra de anúncio dentro da tela */
.toast-container { left: max(10px, env(safe-area-inset-left)); right: max(10px, env(safe-area-inset-right)); max-width: calc(100vw - 20px); }
.toast { max-width: 100%; }

/* Tabelas e listas largas rolam dentro do próprio bloco */
.table-wrap, .table-container, .tab-content table { max-width: 100%; }
@media (max-width: 800px) {
  .tab-content table, .table-wrap table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body > .app-layout, .app-layout, .layout { flex-direction: column; }
  .sidebar { position: static; width: 100%; max-width: 100%; flex-direction: row; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 8px; gap: 6px; }
  .sidebar::-webkit-scrollbar { display: none; }
  .sidebar .nav-item { flex: 0 0 auto; white-space: nowrap; }
  .main-content { width: 100%; max-width: 100%; padding: 16px 14px; margin-left: 0; }
  .dashboard-content { padding: 18px 14px; }
  .dashboard-intro { align-items: stretch; flex-direction: column; }
  .intro-actions .btn { flex: 1 1 140px; justify-content: center; }
  .file-row { align-items: flex-start; }
  #roomModal #roomFiles .file-row { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; gap: 10px; width: 100%; }
  #roomModal #roomFiles .file-main { min-width: 0; width: 100%; }
  #roomModal #roomFiles .file-btns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; min-width: 0; }
  #roomModal #roomFiles .file-btns > .btn { box-sizing: border-box; min-width: 0; max-width: 100%; width: 100%; min-height: 42px; justify-content: center; text-align: center; white-space: normal; overflow-wrap: anywhere; }
  .file-btns { width: 100%; }
  .file-btns .btn { flex: 1 1 auto; justify-content: center; }
  .sala-file-card { flex-wrap: wrap; }
  .sala-file-actions { width: 100%; }
  .sala-file-actions .btn { width: 100%; justify-content: center; }
}
@media (max-width: 480px) {
  .header { padding-top: 8px; padding-bottom: 8px; }
  .header-left h1 { font-size: 17px; }
  .header-left .badge { display: none; }
  .profile-pill { max-width: 46vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .modal { align-items: flex-end; padding: 0; }
  .modal-content, .rename-box { max-width: 100%; border-bottom-left-radius: 0; border-bottom-right-radius: 0; max-height: 94dvh; }
  .auth-container { padding: 14px; }
  .auth-card { padding: 22px 16px; }
  .stat-card { padding: 12px; gap: 10px; }
}
@media (max-width: 340px) { .btn { padding-left: 10px; padding-right: 10px; font-size: 13px; letter-spacing: .02em; } .glitch { font-size: 22px; letter-spacing: .08em; } }
/* Celular deitado: pouca altura */
@media (max-height: 480px) and (orientation: landscape) {
  .header { padding-top: 4px; padding-bottom: 4px; } .modal { align-items: center; padding: 6px; }
  .modal-content, .rename-box { max-height: calc(100dvh - 12px); } body.auth-page .auth-container { margin: 8px auto; } .fx-orb { display: none; }
}
/* Toque: alvos de 42px e sem efeitos de mouse */
@media (hover: none) { .btn, .nav-item, .modal-close { min-height: 42px; } .room-card, .stat-card, .sala-file-card { will-change: auto; } #cursor, .cursor { display: none !important; } }

/* Regras finais para componentes com muitos controles e conteúdo comprido. */
.flex, .grid, .card-row, .file-row, .sala-file-card, .room-actions, .room-actions-bar,
.room-link-bar, .form-row, .form-group, .modal-content, .modal-body, .tab-content,
.settings-grid, .user-row, .member-row, .notif-item { min-width: 0; max-width: 100%; }
.file-row-name, .file-name, .sala-file-info h4, .room-link, .room-link a,
input, select, textarea { min-width: 0; }

@media (max-width: 800px) {
  /* A lista de arquivos pode ter vários botões; deixe cada ação quebrar linha. */
  .file-row { flex-wrap: wrap; gap: 8px; }
  .file-row > .file-main { flex: 1 1 calc(100% - 48px); }
  .file-row > .btn, .file-row > a.btn, .file-row > button { flex: 0 1 auto; }
  .room-actions-bar { display: flex; flex-wrap: wrap; gap: 8px; }
  .room-actions-bar > * { min-width: 0; max-width: 100%; }
  .form-row { flex-wrap: wrap; }
  .form-row > * { min-width: 0; }
  .sala-file-meta { flex-wrap: wrap; gap: 6px 12px; }
  .modal-content { width: min(100%, 720px); }
}
@media (max-width: 480px) {
  /* Cards de arquivo empilham metadados e ações para preservar a área tocável. */
  .file-row > .text-muted { flex: 1 1 100%; }
  .file-row > .btn, .file-row > a.btn, .file-row > button { min-height: 42px; }
  .room-link-bar { gap: 8px; padding-left: 14px; padding-right: 14px; }
  .room-link-bar a { min-width: 0; }
  .toast { min-width: 0; width: 100%; }
  .modal-content { max-height: 94vh; max-height: 94dvh; }
  .modal-body { max-height: none; }
  .form-row { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 360px) {
  .main-content, .dashboard-content, .sala-container { padding-left: 10px; padding-right: 10px; }
  .card, .room-card, .auth-card { padding-left: 14px; padding-right: 14px; }
  .file-row > .btn, .file-row > a.btn, .file-row > button { flex: 1 1 42px; }
}
@supports not (height: 100dvh) {
  body { min-height: 100vh; }
  .modal-content, .rename-box, .slide-panel-content { max-height: calc(100vh - 20px); }
}
