/*
 * ReMind SaaS
 * Mobile Unified Store — R1
 *
 * Objetivo:
 * - camada final de normalização mobile;
 * - não substituir regras funcionais das views;
 * - evitar vazamento do legado Tables To Cards;
 * - preservar Agenda, Dashboard e interações existentes.
 */

@media (max-width: 760px) {

  /* =========================================================
     FOUNDATION
     ========================================================= */

  body.rm-mobile-app-shell {
    --rm-mobile-gap: 12px;
    --rm-mobile-radius: 14px;
    --rm-mobile-control-h: 44px;
  }

  body.rm-mobile-app-shell .clinic-saas-container {
    min-width: 0 !important;
  }

  body.rm-mobile-app-shell .page-head {
    gap: 10px !important;
    margin-bottom: 14px !important;
  }

  body.rm-mobile-app-shell .page-head h1,
  body.rm-mobile-app-shell .page-head h2 {
    margin-bottom: 2px !important;
    line-height: 1.15 !important;
  }

  body.rm-mobile-app-shell .page-sub {
    line-height: 1.35 !important;
  }

  body.rm-mobile-app-shell .cs-actionsbar {
    width: 100%;
    gap: 8px !important;
  }

  body.rm-mobile-app-shell .cs-actionsbar > .saas-btn,
  body.rm-mobile-app-shell .cs-actionsbar > a.saas-btn {
    min-height: var(--rm-mobile-control-h);
  }

  body.rm-mobile-app-shell input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  body.rm-mobile-app-shell select,
  body.rm-mobile-app-shell textarea {
    max-width: 100%;
  }


  /* =========================================================
     DASHBOARD
     Mantém dashboard-v2.css como base.
     ========================================================= */

  .rm-dashboard-v2 {
    width: 100% !important;
    min-width: 0 !important;
  }

  .rm-dashboard-v2 .rm-dash-head {
    gap: 12px !important;
  }

  .rm-dashboard-v2 .rm-primary-action {
    min-height: var(--rm-mobile-control-h);
  }

  .rm-dashboard-v2 .rm-kpi-grid {
    gap: 10px !important;
  }

  .rm-dashboard-v2 .rm-kpi-card {
    min-width: 0 !important;
  }

  .rm-dashboard-v2 .rm-dashboard-main {
    gap: 12px !important;
  }

  .rm-dashboard-v2 .rm-panel {
    min-width: 0 !important;
  }


  /* =========================================================
     AGENDA
     Preserva cálculo, drag/touch e dimensões da grade.
     ========================================================= */

  body.rm-page-agenda .agenda-mobile-day-nav {
    gap: 6px !important;
  }

  body.rm-page-agenda .agenda-mobile-day-btn {
    min-height: 40px !important;
  }

  body.rm-page-agenda .agenda-mobile-day-btn--today {
    flex: 1 1 auto;
  }

  /*
   * R262_AGENDA_HISTORY_LIGHT_ACTION
   *
   * Compacto visualmente, mas ainda clicável/tocável.
   */
  body.rm-page-agenda .ev-slot-history-badge {
    min-height: 15px !important;

    padding: 2px 3px !important;

    gap: 2px !important;

    border-color: transparent !important;
    border-radius: 4px !important;

    background: transparent !important;

    color: #64748b !important;

    font-size: 8px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    box-shadow: none !important;
  }

  body.rm-page-agenda .ev-slot-history-label {
    font-size: 8px !important;
    line-height: 1 !important;
  }

  body.rm-page-agenda .r251-slot-history-standalone {
    max-width: 100%;
  }

  body.rm-page-agenda .rm-slot-history-dialog {
    max-width: calc(100vw - 20px) !important;
  }


  /* =========================================================
     PACIENTES
     Mantém REMIND_MOBILE_PATIENTS_PRIME_R2 como base.
     ========================================================= */

  body.rm-page-patient .patients-searchbar {
    width: 100% !important;
    margin-bottom: 12px !important;
    padding: 12px !important;
  }

  body.rm-page-patient .patients-searchbar__grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100%;
  }

  body.rm-page-patient .patients-searchbar__input {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.rm-page-patient .patients-searchbar__input input {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.rm-page-patient .patients-searchbar__select,
  body.rm-page-patient .patients-searchbar__button {
    width: 100% !important;
    min-height: var(--rm-mobile-control-h) !important;
  }

  body.rm-page-patient .table-responsive {
    max-width: 100%;
  }


  /* =========================================================
     FINANCEIRO
     Neutraliza o Tables To Cards GLOBAL apenas nesta tela.
     As tabelas voltam a ser tabelas com scroll horizontal.
     ========================================================= */

  body.rm-page-financial .table-responsive,
  body.rm-page-financial .app-table-wrap,
  body.rm-page-financial .table-wrap {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
  }

  body.rm-page-financial .app-table {
    display: table !important;
    width: 100% !important;
    min-width: 680px;
    border-collapse: separate;
  }

  body.rm-page-financial .app-table thead {
    display: table-header-group !important;
  }

  body.rm-page-financial .app-table tbody {
    display: table-row-group !important;
  }

  body.rm-page-financial .app-table tr {
    display: table-row !important;
  }

  body.rm-page-financial .app-table th,
  body.rm-page-financial .app-table td {
    display: table-cell !important;
    width: auto !important;
  }

  body.rm-page-financial .app-table td::before {
    content: none !important;
    display: none !important;
  }

  body.rm-page-financial .app-table tr {
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }

  body.rm-page-financial .kpi-prime-grid {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
  }

  body.rm-page-financial .kpi-prime-card {
    min-width: 0 !important;
  }

  body.rm-page-financial .saas-tabs {
    display: flex;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }


  /* =========================================================
     AJUSTES / AUTOMAÇÃO DE MENSAGENS
     Neutraliza Tables To Cards nas tabelas de Histórico/Pacientes.
     ========================================================= */

  #waTabs {
    display: flex;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    gap: 4px;
  }

  #waTabs .saas-tab {
    flex: 0 0 auto;
  }

  #tab-config,
  #tab-monitor,
  #tab-patients {
    min-width: 0;
    max-width: 100%;
  }

  #tab-config .surface-card,
  #tab-monitor .surface-card,
  #tab-patients .surface-card {
    max-width: 100%;
  }

  #tab-monitor .app-table,
  #tab-patients .app-table {
    display: table !important;
    width: 100% !important;
    min-width: 640px;
  }

  #tab-monitor .app-table thead,
  #tab-patients .app-table thead {
    display: table-header-group !important;
  }

  #tab-monitor .app-table tbody,
  #tab-patients .app-table tbody {
    display: table-row-group !important;
  }

  #tab-monitor .app-table tr,
  #tab-patients .app-table tr {
    display: table-row !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #tab-monitor .app-table th,
  #tab-monitor .app-table td,
  #tab-patients .app-table th,
  #tab-patients .app-table td {
    display: table-cell !important;
    width: auto !important;
  }

  #tab-monitor .app-table td::before,
  #tab-patients .app-table td::before {
    content: none !important;
    display: none !important;
  }

  #tab-monitor .surface-card[style*="overflow:hidden"],
  #tab-monitor .surface-card[style*="overflow: hidden"],
  #tab-patients .surface-card[style*="overflow:hidden"],
  #tab-patients .surface-card[style*="overflow: hidden"] {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  #tab-config .field,
  #tab-config .form-actions {
    max-width: 100%;
  }

  #tab-config button[type="submit"] {
    min-height: var(--rm-mobile-control-h) !important;
  }
}


/* =========================================================
   PHONE — compactação adicional
   ========================================================= */

@media (max-width: 520px) {

  body.rm-mobile-app-shell {
    --rm-mobile-gap: 10px;
  }

  .rm-dashboard-v2 .rm-kpi-grid {
    grid-template-columns: 1fr !important;
  }

  body.rm-page-financial .app-table {
    min-width: 620px;
  }

  #tab-monitor .app-table,
  #tab-patients .app-table {
    min-width: 600px;
  }

  body.rm-page-agenda .ev-slot-history-badge {
    min-height: 15px !important;
    padding: 2px 3px !important;
    font-size: 7.5px !important;
  }
}