/* Modo de trabalho compacto -- ver resources/views/filament/app/compacto.blade.php. A classe entra em antes da pintura, para nao piscar no carregamento. */ html.ch-compacto .fi-main{ max-width:100% !important; padding-left:14px !important; padding-right:14px !important; padding-top:12px !important; } html.ch-compacto .fi-header{ margin-bottom:10px !important; } html.ch-compacto .fi-header-heading{ font-size:1.15rem !important; } html.ch-compacto .fi-topbar > nav{ padding-top:6px !important; padding-bottom:6px !important; } html.ch-compacto .fi-section-content{ padding:14px !important; } html.ch-compacto .ch-card, html.ch-compacto .md-card{ padding:12px !important; } html.ch-compacto #chCompactoBtn{ background:rgb(59 130 246 / .12) !important; border-color:rgb(59 130 246 / .45) !important; color:#2563EB !important; } /* A lista de conversas nao precisa de um terco da tela: o conteudo dela e um nome e um telefone truncados. O espaco devolvido vai para a conversa. */ #wa-panel{ grid-template-columns:minmax(200px,260px) minmax(0,1fr) !important; } @media (max-width:900px){ #wa-panel{ grid-template-columns:1fr !important; } } /* ---------------------------------------------------------------- sempre */ /* Agenda: os dois blocos do topo ja nascem recolhidos, mas o respiro deles empurrava os horarios para baixo da dobra. Aperta sem mudar a estrutura. */ #agTopo{ gap:10px !important; margin-bottom:10px !important; } #agTopo .agcol{ padding:7px 14px !important; } #agTopo .agcol-h{ min-height:0 !important; } html.ch-compacto #agTopo{ gap:8px !important; margin-bottom:8px !important; } html.ch-compacto #agTopo .agcol{ padding:5px 12px !important; } /* Com o topo mais baixo, a grade pode ocupar o que sobrou. */ html.ch-compacto #agCalWrap .fc{ height:calc(100vh - 210px) !important; } /* ------------------------------------------------- agenda no celular (<=768px) Mesmo com os tres blocos recolhidos, a grade comecava abaixo da primeira tela em 390x844: cabecalho da pagina + subtitulo + tres barras empilhadas + barra do calendario consumiam a altura toda antes do primeiro horario. Aqui nada e escondido -- so apertado -- e a grade ganha o que sobrou. */ @media (max-width:768px){ /* cabecalho da pagina */ body .fi-header{ margin-bottom:8px !important; } body .fi-header-heading{ font-size:1.1rem !important; line-height:1.2 !important; } body .fi-header-subheading{ font-size:.76rem !important; line-height:1.3 !important; } /* as tres barras recolhidas */ #agTopo{ gap:6px !important; margin-bottom:8px !important; } #agTopo .agcol{ padding:6px 11px !important; border-radius:10px !important; } #agTopo .agcol-h{ min-height:0 !important; gap:7px !important; } #agTopo .agcol-mini{ font-size:.72rem !important; } /* barra do FullCalendar */ #agCalWrap .fc .fc-toolbar{ margin-bottom:6px !important; gap:5px !important; } #agCalWrap .fc .fc-toolbar-title{ font-size:1rem !important; } #agCalWrap .fc .fc-button{ padding:5px 9px !important; font-size:.8rem !important; } /* grade mais densa: mais horarios por tela, sem trocar o intervalo dos slots. As meia-marcacoes perdem o rotulo, que no celular so fazia ruido. */ #agCalWrap .fc .fc-timegrid-slot{ height:1.55em !important; } #agCalWrap .fc .fc-timegrid-slot-label-cushion{ padding:0 4px !important; } #agCalWrap .fc .fc-col-header-cell-cushion{ padding:5px 3px !important; font-size:.72rem !important; } #agCalWrap .fc .fc-scrollgrid-section-sticky > *{ top:52px !important; } }