
/* ============================================================
   CAMADA RESPONSIVA V16 — apenas apresentação tablet/smartphone
   Desktop (>1200px) permanece integralmente inalterado.
   ============================================================ */
@media (max-width:1200px){
  .shell{position:relative;overflow-x:hidden;}
  /* Sidebar escondida fora do ecrã (só aparecia com um botão de
     hambúrguer) retirada em 2026-07-19: cobria 700-1200px, exatamente a
     gama de um iPad em vertical ou horizontal — o menu ficava
     invisível por defeito, sem ninguém saber que precisava de tocar
     num botão para o abrir. Como o Modo Telemóvel já assume por
     completo o ecrã abaixo dos 700px, deixa de fazer falta esconder a
     sidebar aqui — fica sempre visível, tal como no ecrã de computador. */
  .main{width:100%;min-width:0;}
  .topbar{padding:12px 18px;gap:12px;position:sticky;top:0;z-index:80;}
  .topbar h2{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .content{padding:20px 18px;}
  .stats-row{grid-template-columns:repeat(3,minmax(0,1fr));}
  .toolbar{align-items:stretch;}
  .toolbar input[type=text],.toolbar input[type=search],.toolbar select{min-width:220px;flex:1 1 220px;}
  .card{max-width:100%;overflow:visible;}
  .responsive-table-scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:5px;}
  .responsive-table-scroll>table{min-width:max-content;}
  .modal-box{width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 32px);}
  .modal-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  input,select,textarea,button{max-width:100%;}
}

@media (max-width:700px){
  html{-webkit-text-size-adjust:100%;}
  body{overflow-x:hidden;}
  .sidebar{width:min(88vw,320px)!important;}
  .topbar{padding:10px 12px;min-height:58px;}
  .topbar h2{font-size:16px;}
  .topbar .live-dot{font-size:0;gap:0;}
  .topbar .live-dot .dot{display:block;}
  .content{padding:12px 10px 24px;overflow-x:hidden;}
  .card{padding:14px 12px;border-radius:7px;}
  .stats-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:14px;}
  .stat-card{padding:11px 10px;}
  .stat-card .num{font-size:21px;}
  .stat-card .lbl{font-size:10px;}
  .toolbar{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:12px;}
  .toolbar>*{width:100%!important;min-width:0!important;margin:0!important;}
  .toolbar .btn,.btn{min-height:42px;white-space:normal;}
  input,select,textarea{font-size:16px!important;min-height:42px;}
  textarea{min-height:88px;}
  .modal-overlay{align-items:flex-end;padding:0;}
  .modal-box{width:100%;max-width:none;max-height:94dvh;border-radius:12px 12px 0 0;padding:18px 14px calc(18px + env(safe-area-inset-bottom));}
  .modal-grid{grid-template-columns:1fr;gap:11px;}
  .modal-grid .full{grid-column:1;}
  .modal-actions{position:sticky;bottom:0;background:#fff;z-index:3;display:grid;grid-template-columns:1fr 1fr;padding-bottom:env(safe-area-inset-bottom);}
  .modal-actions>*{margin:0!important;width:100%;}
  .modal-actions>*:only-child{grid-column:1/-1;}

  /* Tabelas simples passam para cartões, mantendo todos os campos. */
  .responsive-table-scroll.card-mode{overflow:visible;border:0;}
  table.mobile-card-table,table.mobile-card-table tbody,table.mobile-card-table tr,table.mobile-card-table td{display:block;width:100%;}
  table.mobile-card-table{min-width:0!important;border-collapse:separate;border-spacing:0 10px;}
  table.mobile-card-table thead{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;}
  table.mobile-card-table tr{background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:7px 10px;margin-bottom:10px;box-shadow:0 1px 2px rgba(0,0,0,.04);}
  table.mobile-card-table tr:hover td{background:transparent;}
  table.mobile-card-table td{display:grid;grid-template-columns:minmax(105px,38%) minmax(0,1fr);gap:10px;padding:8px 2px;border-bottom:1px dashed var(--line);text-align:left!important;min-width:0!important;max-width:none!important;position:static!important;left:auto!important;right:auto!important;}
  table.mobile-card-table td:last-child{border-bottom:0;}
  table.mobile-card-table td::before{content:attr(data-mobile-label);font-size:10px;text-transform:uppercase;letter-spacing:.35px;color:var(--ink-soft);font-weight:700;align-self:start;}
  table.mobile-card-table td[data-mobile-label=""]::before{display:none;}
  table.mobile-card-table td[data-mobile-label=""]{grid-template-columns:1fr;}
  table.mobile-card-table td>*{max-width:100%;}
  table.mobile-card-table .row-actions{display:flex;gap:8px;flex-wrap:wrap;}

  /* Grelhas densas permanecem completas com deslocação horizontal controlada. */
  .responsive-table-scroll.wide-mode{margin:0 -2px;padding-bottom:6px;}
  .responsive-table-scroll.wide-mode::after{content:'Deslize horizontalmente para ver todas as colunas';display:block;font-size:10px;color:var(--ink-soft);padding:5px 2px 0;}
  table.mobile-wide-table{font-size:12px;}
  table.mobile-wide-table th,table.mobile-wide-table td{padding:8px 9px;}

  .tabs,.tab-buttons,[role="tablist"]{overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap;scrollbar-width:thin;}
  .tabs>* ,.tab-buttons>* ,[role="tablist"]>*{flex:0 0 auto;}
  .inline-add{flex-direction:column;}
  .row-actions{display:flex;flex-wrap:wrap;gap:6px;}
  .empty-state{padding:34px 14px;}
  #relmap-grid{grid-template-columns:1fr!important;}
  #relmap-stage{overflow-x:auto;}
}

@media (max-width:390px){
  .stats-row{grid-template-columns:1fr;}
  .topbar{gap:8px;}
  .mobile-menu-btn{width:40px;height:40px;flex-basis:40px;}
  table.mobile-card-table td{grid-template-columns:1fr;gap:4px;}
}

/* PWPLADUR 1524 — no formulário de Pedido de Material, alinhar a Data do Pedido
   verticalmente com o campo Obra (o número do pedido ocupa a linha superior). */
.pf-data-pedido-field{padding-top:34px}
@media(max-width:700px){.pf-data-pedido-field{padding-top:0}}
