/** * GeoIBRAM - Fix global para páginas Início em mobile/PWA * * Corrige: * 1. Títulos dos cards sem contraste (brancos sobre fundo branco) * 2. Layout dos cards em 2 colunas no mobile * 3. Espaçamento entre seções no mobile * 4. Visibilidade garantida em todos os perfis (browser + PWA standalone) * * @package GeoIBRAM_Theme * @version 1.0.0 */ /* ================================================ TÍTULOS LEGÍVEIS EM TODOS OS DISPOSITIVOS Aplica para TODOS os perfis nas páginas Início ================================================ */ /* Forçar texto escuro nos títulos dos cards de navegação - TODOS os perfis */ .cidadao-inicio-cards-grid .card-nav-title, .produtor-inicio-cards-grid .card-nav-title, .apicultor-inicio-cards-grid .card-nav-title, .operador-inicio-cards-grid .card-nav-title, .associacoes-inicio-cards-grid .card-nav-title, .instituicao-inicio-cards-grid .card-nav-title, [class*="inicio-cards-grid"] .card-nav-title, [class*="inicio-cards-grid"] h3, [class*="inicio-cards-grid"] .apicultor-inicio-card-title, [class*="inicio-cards-grid"] .produtor-inicio-card-title, [class*="inicio-cards-grid"] .operador-inicio-card-title, .geoibram-inicio-content-wrapper .card-nav-title, .geoibram-inicio-content-wrapper [class*="cards-grid"] h3, .geoibram-inicio-content-wrapper .apicultor-inicio-card-title, .geoibram-inicio-content-wrapper .produtor-inicio-card-title { color: #111827 !important; -webkit-text-fill-color: #111827 !important; } /* Títulos dos cards de boas-vindas */ .cidadao-card-welcome-title, .produtor-card-welcome-title, .apicultor-card-welcome-title, .operador-drone-card-welcome-title, .associacoes-inicio-card-welcome-title, [class*="card-welcome-title"] { color: #1f2937 !important; -webkit-text-fill-color: #1f2937 !important; } /* Subtítulos dos cards de boas-vindas */ .cidadao-card-welcome-subtitle, .produtor-card-welcome-subtitle, .apicultor-card-welcome-subtitle, .operador-drone-card-welcome-subtitle, .associacoes-inicio-card-welcome-subtitle, [class*="card-welcome-subtitle"] { color: #4b5563 !important; -webkit-text-fill-color: #4b5563 !important; } /* Labels dos cards de controle */ .cidadao-control-card-label, .produtor-control-card-label, .apicultor-control-card-label, [class*="control-card-label"] { color: #1f2937 !important; -webkit-text-fill-color: #1f2937 !important; } /* Sublabels dos cards de controle */ .cidadao-control-card-sublabel, .produtor-control-card-sublabel, .apicultor-control-card-sublabel, [class*="control-card-sublabel"] { color: #6b7280 !important; -webkit-text-fill-color: #6b7280 !important; } /* Títulos das seções (Controles do App, etc.) */ .cidadao-app-controls-title, .produtor-app-controls-title, .apicultor-app-controls-title, [class*="app-controls-title"] { color: #374151 !important; -webkit-text-fill-color: #374151 !important; } /* ================================================ PWA STANDALONE MODE Garantir que o PWA exiba os mesmos estilos ================================================ */ @media all and (display-mode: standalone) { .card-nav-title, [class*="inicio-cards-grid"] h3, [class*="inicio-cards-grid"] .card-nav-title { color: #111827 !important; -webkit-text-fill-color: #111827 !important; } [class*="card-welcome-title"] { color: #1f2937 !important; -webkit-text-fill-color: #1f2937 !important; } [class*="card-welcome-subtitle"] { color: #4b5563 !important; -webkit-text-fill-color: #4b5563 !important; } [class*="control-card-label"] { color: #1f2937 !important; -webkit-text-fill-color: #1f2937 !important; } [class*="control-card-sublabel"] { color: #6b7280 !important; -webkit-text-fill-color: #6b7280 !important; } /* Garantir bg-white real nos cards em PWA */ .geoibram-inicio-content-wrapper [class*="cards-grid"] a, .geoibram-inicio-content-wrapper [class*="cards-grid"] > a { background-color: #ffffff !important; } } /* ================================================ MOBILE: ESPAÇAMENTO ENTRE SEÇÕES REDUZIDO Seções não ficam tão distantes no celular ================================================ */ @media (max-width: 768px) { /* Reduzir espaço entre seções de 1.5rem (space-y-6) para 1rem no mobile */ .geoibram-inicio-content-wrapper .w-full.space-y-6 > * + * { margin-top: 1rem !important; } /* Card de boas-vindas: padding menor no mobile */ .cidadao-card-welcome-header, .produtor-card-welcome-header, .apicultor-card-welcome-header, [class*="card-welcome-header"] { padding: 14px 16px !important; } /* Cards de controle: padding mais compacto no mobile */ .cidadao-control-card, .produtor-control-card, [class*="control-card"] { padding: 20px 12px !important; } /* Ícone do card de controle: menor no mobile */ .cidadao-control-card-icon, .produtor-control-card-icon, [class*="control-card-icon"] { width: 48px !important; height: 48px !important; margin-bottom: 10px !important; } .cidadao-control-card-icon svg, .produtor-control-card-icon svg, [class*="control-card-icon"] svg { width: 24px !important; height: 24px !important; } /* Label e sublabel menores no mobile */ .cidadao-control-card-label, .produtor-control-card-label, [class*="control-card-label"] { font-size: 13px !important; } .cidadao-control-card-sublabel, .produtor-control-card-sublabel, [class*="control-card-sublabel"] { font-size: 11px !important; } } /* ================================================ MOBILE: GRID DOS CARDS DE NAVEGAÇÃO 2 colunas iguais, sem overflow ================================================ */ @media (max-width: 1023px) { /* Grid dos cards de navegação: sempre 2 colunas */ .cidadao-inicio-cards-grid, .produtor-inicio-cards-grid, .apicultor-inicio-cards-grid, .operador-inicio-cards-grid, .associacoes-inicio-cards-grid, [class*="inicio-cards-grid"] { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; width: 100% !important; } /* Garantir que os filhos do grid não transbordem */ [class*="inicio-cards-grid"] > a, [class*="inicio-cards-grid"] > div { min-width: 0 !important; overflow: hidden !important; } /* Ícone dos cards de navegação: tamanho adequado no mobile */ [class*="inicio-cards-grid"] .w-14.h-14 { width: 2.75rem !important; height: 2.75rem !important; } [class*="inicio-cards-grid"] .w-7.h-7 { width: 1.4rem !important; height: 1.4rem !important; } /* Texto dos cards de navegação */ [class*="inicio-cards-grid"] .card-nav-title, [class*="inicio-cards-grid"] h3 { font-size: 0.8125rem !important; line-height: 1.3 !important; color: #111827 !important; -webkit-text-fill-color: #111827 !important; } [class*="inicio-cards-grid"] p.text-xs, [class*="inicio-cards-grid"] p.text-sm { font-size: 0.6875rem !important; line-height: 1.3 !important; color: #6b7280 !important; -webkit-text-fill-color: #6b7280 !important; } /* Reduzir padding dos cards de navegação no mobile */ [class*="inicio-cards-grid"] > a, [class*="inicio-cards-grid"] > div { padding: 12px 8px !important; } /* Grid dos controles: 2 colunas no mobile */ .cidadao-app-controls-grid-modern, .produtor-app-controls-grid-modern, .apicultor-app-controls-grid-modern, [class*="app-controls-grid-modern"] { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; } } /* ================================================ CARDS BLOQUEADOS (perfil incompleto) Visíveis mas com estado de bloqueio visível ================================================ */ .card-nav-locked { opacity: 0.6; cursor: not-allowed; position: relative; } .card-nav-locked::after { content: '🔒'; position: absolute; top: 6px; right: 6px; font-size: 12px; opacity: 0.8; } /* ================================================ GARANTIA EXTRA: texto não-branco em nenhum card de navegação da página Início em qualquer tema ================================================ */ /* Cobrir todos os estilos inline que poderiam ser sobrescritos */ html body .geoibram-pagina-inicio-cidadao .cidadao-inicio-cards-grid .card-nav-title, html body .geoibram-pagina-inicio-cidadao .cidadao-inicio-cards-grid h3.card-nav-title, html body .geoibram-pagina-inicio-produtor .produtor-inicio-cards-grid .card-nav-title, html body .geoibram-pagina-inicio-produtor .produtor-inicio-cards-grid h3.card-nav-title, html body .geoibram-pagina-inicio-apicultor .apicultor-inicio-cards-grid .card-nav-title, html body .geoibram-pagina-inicio-apicultor .apicultor-inicio-cards-grid h3.card-nav-title, html body .geoibram-pagina-inicio-operador .operador-inicio-cards-grid .card-nav-title, html body .geoibram-pagina-inicio-operador .operador-inicio-cards-grid h3.card-nav-title, html body .geoibram-pagina-inicio-associacoes .associacoes-inicio-cards-grid .card-nav-title, html body .geoibram-pagina-inicio-associacoes .associacoes-inicio-cards-grid h3.card-nav-title { color: #111827 !important; -webkit-text-fill-color: #111827 !important; text-shadow: none !important; }