/* Europe Grass huisstijl (huisstijlhandboek v1.0)
   Primair blauw #10314C · primair groen #A0C01B · secundair blauw #24445D · blauwgrijs #8698A6 · lichtgrijs #F3F3F3
   Koppen: Geogrotesque Cyr (fallback Roboto Condensed) · tekst: Roboto */
:root { --eg-blue: #10314c; --eg-green: #a0c01b; --eg-blue2: #24445d; --eg-bluegrey: #8698a6; --eg-light: #f3f3f3; }

/* Typografie */
h1, h2, h3, .kpi strong, .home-welcome h2, .profile h2, .dialogtop h2 { font-family: var(--font-head); font-weight: 700; letter-spacing: 0; color: var(--eg-blue); }
h1 { font-size: 34px; }
.home-welcome h2 { font-weight: 700; }

/* Logo in de zijbalk (diapositief) en op het inlogscherm (kleur) */
aside .brand { font-size: 0; line-height: 0; color: transparent; letter-spacing: 0; padding-top: 58px;
  background: url(brand/logo-liggend-wit.svg) left top / 172px auto no-repeat; min-height: 58px; }
aside .brand span { display: none; }
aside .brand small { display: block; font-size: 9px; line-height: 1.2; letter-spacing: 3px; margin-top: 12px; color: var(--eg-bluegrey); }
.authbox .brand { font-size: 0; line-height: 0; color: transparent; height: 72px; margin-bottom: 20px;
  background: url(brand/logo-liggend.svg) left center / auto 72px no-repeat; }
.authbox .brand span, .authbox .brand small { display: none; }
@media (max-width: 750px) {
  aside .brand { padding-top: 0; min-height: 40px; background-size: auto 40px; }
  aside .brand small { display: none; }
}

/* Kaarten: afgerond en rustig */
.kpi, .card, .profile, .authbox { border-radius: 16px; }
.authbox { box-shadow: 0 8px 30px rgba(16, 49, 76, .08); }

/* Knoppen: groen voor de primaire actie, witte tekst */
button.primary { background: var(--eg-green); color: #fff; font-weight: 700; border-radius: 8px; }
button.primary:hover { background: #8faa18; }
/* Groen spaarzaam: in lijsten met veel acties krijgen de knoppen donkerblauw */
.signal-actions button.primary, .taskitem button.primary, .listitem .actions button.primary { background: var(--eg-blue); }
.signal-actions button.primary:hover, .taskitem button.primary:hover, .listitem .actions button.primary:hover { background: var(--eg-blue2); }

/* Navigatie */
nav button.active { background: var(--eg-green); color: var(--eg-blue); font-weight: 700; }
nav button:not(.active):hover { background: rgba(255, 255, 255, .06); }

/* Formulieren */
input:focus, select:focus, textarea:focus { outline: 2px solid var(--eg-green); outline-offset: 1px; }

/* Prospect-labels: secundair blauw in plaats van paars */
.tag.purple { background: #e3eaf0; color: var(--eg-blue2); }

/* Keuzelijsten: eigen pijltje binnen het kader, breedte past zich aan de tekst aan */
select { -webkit-appearance: none; appearance: none; padding-right: 36px !important; min-width: 0;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%2310314c' stroke-width='1.8'%3E%3Cpath d='m6 8 4 4 4-4'/%3E%3C/svg%3E") no-repeat right 10px center / 16px; }
.filters select { font-size: 13px; }

/* Klikbare lijstregels */
.listitem.clickable { cursor: pointer; border-radius: 10px; }
.listitem.clickable:hover { background: #f7f9fa; }

/* Ruimte onder het logo en een zoekveld waarin de hele tekst past */
@media (min-width: 751px) { aside .brand { margin-bottom: 22px; } }
.toptools #search { width: 320px; max-width: 100%; }