/* ── Tipografia de marca: Nunito (amigável/arredondada, hospedada local p/ offline) ── */ @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 400; font-display: swap; src: url('../assets/fonts/nunito-400.woff2') format('woff2'); } @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 500; font-display: swap; src: url('../assets/fonts/nunito-500.woff2') format('woff2'); } @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 600; font-display: swap; src: url('../assets/fonts/nunito-600.woff2') format('woff2'); } @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 700; font-display: swap; src: url('../assets/fonts/nunito-700.woff2') format('woff2'); } @font-face { font-family: 'Nunito'; font-style: normal; font-weight: 800; font-display: swap; src: url('../assets/fonts/nunito-800.woff2') format('woff2'); } :root { /* ── Cores principais (TEMA NEUTRO — padrão para novas usuárias) ── Azul clínico + cinza. Os nomes das variáveis (--gold/--lavender) são mantidos por compatibilidade; aqui carregam os valores neutros. O tema dourado/lavanda da Ana Paula vive em [data-theme="ap"] abaixo. */ --gold: #2D7DC4; /* primária — azul Alveo (alinhada à logo) */ --gold-dark: #2362A0; --gold-light: #9CC3EA; --gold-pale: #E9F2FB; --lavender: #7E93B8; /* secundária — azul-ardósia */ --lavender-dark: #5E739B; --lavender-light: #EAEFF6; /* ── Acento de marca (turquesa da logo) ── */ --accent: #1FC8C8; --accent-dark: #14A0A0; --accent-pale: #E3F7F7; /* ── Azul-marinho da wordmark — títulos com cara de marca ── */ --navy: #1B2A4A; /* ── Gradiente assinatura (turquesa→azul, igual a logo/login) ── */ --brand-gradient: linear-gradient(135deg, #1FC8C8 0%, #2E86E0 55%, #3A6BE0 100%); /* Fundo suave do header de marca — eco das ondas do login */ --brand-header-bg: linear-gradient(180deg, #E8F1FC 0%, #F5F8FA 100%); /* Fundo do app inteiro — gradiente suave (eco do login), aplicado em .page */ --app-bg: linear-gradient(180deg, #E8F1FC 0%, #F2F7FC 45%, #ECF2FB 100%); /* Ondas suaves no topo do header (eco do login) */ --wave-1: #DCEAFA; --wave-2: #CCDFF6; /* Listra alternada do calendário (zebra) — visível mas suave */ --cal-stripe: #EAEFF6; /* Header das abas secundárias — faixa tonal clara + cor da onda na base */ --ph-bg: linear-gradient(180deg, #D6E7FA 0%, #C8DDF6 100%); --ph-wave-fill: #E9F1FC; --cream: #F5F8FA; --white: #FFFFFF; --text-dark: #1E2A30; --text-muted: #6A7A83; --border: #E1E8EC; --danger: #C0392B; --danger-pale: #FDECEA; --success: #27AE60; --success-pale: #E8F8EF; /* ── Tipografia ── */ --font: 'Nunito', -apple-system, 'SF Pro Display', 'Helvetica Neue', Arial, sans-serif; --text-xs: 11px; --text-sm: 13px; --text-base: 16px; --text-md: 18px; --text-lg: 22px; --text-xl: 28px; /* ── Espaçamento ── */ --sp-xs: 4px; --sp-sm: 8px; --sp-md: 16px; --sp-lg: 24px; --sp-xl: 32px; /* ── Bordas ── */ --r-sm: 10px; --r-md: 14px; --r-lg: 14px; --r-xl: 24px; /* Sombra de marca para botões primários (profundidade sutil) */ --btn-shadow: 0 4px 13px rgba(45, 125, 196, 0.30); /* ── Sombras (neutras, levemente mais definidas) ── */ --shadow-sm: 0 1px 2px rgba(30, 42, 48, 0.10); --shadow-md: 0 2px 8px rgba(30, 42, 48, 0.10); /* ── Safe area (iPhone) ── */ --safe-top: env(safe-area-inset-top); --safe-bottom: env(safe-area-inset-bottom); } /* ═══════════════════════════════════════════════════════════════════ TEMA ANA PAULA (dourado + lavanda) — aplicado via data-theme="ap" no após o login, quando profile.theme === 'ap'. Preserva a identidade visual original da Ana Paula. ═══════════════════════════════════════════════════════════════════ */ [data-theme="ap"] { --gold: #B8962A; --gold-dark: #8A6E1A; --gold-light: #D4B86A; --gold-pale: #F5EDE0; --lavender: #C4A8DC; --lavender-dark: #9B7DBE; --lavender-light: #EDE5F5; /* Acento / navy / gradientes de marca no tom dourado da Ana Paula */ --accent: #C4A8DC; --accent-dark: #9B7DBE; --accent-pale: #EDE5F5; --navy: #2C1F0E; --brand-gradient: linear-gradient(135deg, #D4B86A 0%, #B8962A 55%, #8A6E1A 100%); --brand-header-bg: linear-gradient(180deg, #F7F0E2 0%, #FAF7F2 100%); --app-bg: linear-gradient(180deg, #F7F0E2 0%, #FBF7F1 45%, #F6EFE4 100%); --wave-1: #F1E6CD; --wave-2: #E9D9B8; --cal-stripe: #F3ECDC; --ph-bg: linear-gradient(180deg, #F1E6CD 0%, #E4D2AE 100%); --ph-wave-fill: #F7F0E2; --cream: #FAF7F2; --text-dark: #2C1F0E; --text-muted: #8A7560; --border: #EAE0D0; /* Ana Paula preserva o visual original (sombras + raio dos cards) */ --r-lg: 16px; --shadow-sm: 0 1px 3px rgba(44, 31, 14, 0.07); --shadow-md: 0 4px 12px rgba(44, 31, 14, 0.09); --btn-shadow: 0 4px 13px rgba(184, 150, 42, 0.28); }