/* Skin Sorana sobre o criarenet (que é sobre o Larry).
   O criarenet já traz cantos retos e toda a estilização por tokens --cn-*;
   aqui se trocam os tokens pela paleta da Sorana (sorana.com.br: azul
   petróleo #04669A da UI, azul claro #3AAAE1 e navy #212C58 do logo,
   neutros frios) e a fonte vira Open Sans (a do site). Cantos permanecem
   retos por decisão do projeto. Levantamento: reports/sorana-branding.md */
@import url('../criarenet/styles.min.css');

:root {
	--cn-primary: #04669a;        /* azul petróleo da UI do site */
	--cn-primary-dark: #212c58;   /* navy do wordmark (barras/rodapé) */
	--cn-primary-alt: #045a88;    /* variação do azul (gradientes) */
	--cn-primary-light: #1a7fb5;  /* derivado p/ hover e topo de gradiente */
	--cn-accent: #3aaae1;         /* azul claro do "S"/GRUPO no logo */
	--cn-accent-strong: #2384b8;  /* azul claro forte (ação primária) */
	--cn-text: #2a2a2a;           /* texto sobre fundo claro (site) */
	--cn-text-muted: #797979;     /* texto secundário (site) */
	--cn-text-soft: #9aa5b1;      /* texto terciário */
	--cn-text-on-dark: #b9c2d8;   /* texto secundário sobre o navy */
	--cn-border: #c9d6e0;         /* bordas de tabela/painel */
	--cn-bg-light: #f4f4f4;       /* fundo neutro do site */
	--cn-bg-blue: #e3eef5;        /* fundo azulado de painel/lista */
	--cn-bg-blue-soft: #f0f6fa;   /* azulado suave */
	--cn-bg-blue-strong: #cfe2ee; /* item selecionado em lista clara */
	--cn-primary-rgb: 4, 102, 154;
	--cn-accent-rgb: 58, 170, 225;
}

/* Open Sans self-hosted (fonte do site da Sorana). Sem CDN. */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(fonts/open-sans-latin-400-normal.woff2) format('woff2');
}
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(fonts/open-sans-latin-600-normal.woff2) format('woff2');
}
body {
	font-family: 'Open Sans', "Segoe UI", Tahoma, Arial, Helvetica, sans-serif;
}

/* Seta do select: mesmo data-URI do criarenet, com o fill no azul */
select:not(.decorated) {
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2304669a'/%3E%3C/svg%3E");
}

/* Mesma ilustração da Criarenet, recolorida nos tons da Sorana */
.watermark {
	background-image: url(images/watermark-sorana.png?v=3);
	background-size: 260px auto;
}

/* Medidor de força de senha do ispconfig3_pass: vira uma barra fina sob o
   campo (sem estilo ele aparece como uma caixa vazia ao lado do input) */
#pass-check {
	display: block;
	width: 186px;
	height: 6px;
	margin-top: 4px;
	border: 1px solid var(--cn-border);
	border-radius: 0;
	background: #fff;
}
#pass-check .ui-progressbar-value {
	border: 0;
	border-radius: 0;
	background: var(--cn-accent);
}

/* Logo da Sorana (245x50, wordmark + GRUPO): na barra navy vai a versão
   branca; um pouco menor que a área para respirar */
#toplogo {
	height: 26px;
	width: auto;
	padding-top: 10px;
}

/* Logo no login: versão colorida sobre fundo claro */
#login-form #logo,
#logo {
	max-width: 240px;
	height: auto;
}

/* Botões Para+/Cc+/Cco+ do painel de contatos do compose: o Larry esconde o
   texto e usa sprite em inglês; aqui o texto (traduzível) volta a aparecer */
#compose-contacts .boxfooter a.listbutton.addto .inner,
#compose-contacts .boxfooter a.listbutton.addcc .inner,
#compose-contacts .boxfooter a.listbutton.addbcc .inner {
	text-indent: 0;
	background-image: none;
	font-weight: bold;
	line-height: 41px;
}