/* =====================================================================================================================
   CAMADA RESPONSIVA DO DRGESTAO (17/10/2026, Simone) - POR ADESAO, pagina a pagina
   ---------------------------------------------------------------------------------------------------------------------
   Como uma pagina adere: <!-- #Include virtual="/Start10/MeuWebGestor_Start/css/responsivo.asp" --> dentro do <head>.
   O include traz a meta viewport, este CSS e o jscript/responsivo.js, que marca o <html> com:
       rsp            = a pagina aderiu a camada
       rsp-celular    = tela com menos de 600px
       rsp-tablet     = de 600 a 1023px
       rsp-desktop    = 1024px ou mais
   Os cortes sao os do Quasar (os mesmos da myApps e do DocG) e sao os OFICIAIS do sistema - nao inventar outros.

   As 2 travas que garantem que nada muda fora do que foi pedido:
     1. TODA regra comeca com .rsp  -> pagina que nao aderiu nao tem a classe e nao muda, mesmo que carregue este arquivo;
     2. TODA regra fica dentro de um @media abaixo de 1024px -> no computador nada muda.
   Regra especifica de UMA tela fica no <style> dela, com o mesmo cuidado (.rsp + @media). Aqui so' o que serve a todas.
   ===================================================================================================================== */

/* ------------------------------------------------------------------------------------------- celular e tablet (< 1024) */
@media (max-width: 1023.98px) {
	/* empilha os filhos, um embaixo do outro, cada um com a largura toda (a "coluna unica") */
	.rsp .rsp-coluna { display: flex !important; flex-direction: column !important; }
	.rsp .rsp-coluna > * { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box; }
	/* um elemento com largura fixa (ex.: 270px) passa a ocupar a largura toda */
	.rsp .rsp-largura-total { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box; }
	/* some no celular e no tablet (aparece so' no computador) */
	.rsp .rsp-so-desktop { display: none !important; }
}

/* ------------------------------------------------------------------------------------------------------ celular (< 600) */
@media (max-width: 599.98px) {
	/* some so' no celular */
	.rsp .rsp-esconde-celular { display: none !important; }
}
