/**
 * Fargene for Oslo Kvinnehelse.
 * Montage AS.
 *
 * `team.css` er en identisk kopi av filen på Oslo Helsestudio, og er
 * skrevet for mørk bunn med hvit tekst. Oslo Kvinnehelse har lys beige
 * bunn. Denne filen bytter bare ut fargevariablene, slik at selve
 * stilarket kan holdes likt mellom nettstedene.
 *
 * Kontrast, målt mot kortflaten #f5ece2 og bunnen #d4cac0:
 *
 *   Tekst #191614 på kortflate ......... 15,8:1   krav 4,5
 *   Dempet tekst, 70 % ................. 6,2:1    krav 4,5
 *   Hvit tekst på knapp #8f6746 ........ 5,0:1    krav 4,5
 *   Kant #996e4c mot kortflate ......... 3,8:1    krav 3,0
 *   Fokusmarkering #191614 mot bunn .... 11,2:1   krav 3,0
 *
 * Knappefargen er merkevarens #996e4c gjort litt mørkere. Den originale
 * gir 4,48:1 mot hvit tekst, altså akkurat under kravet.
 */

.ohs-team,
.ohs-profil {
	--ohs-gronn: #8f6746;   /* handlingsfarge: knapper og aktivt filter */
	--ohs-oransje: #191614; /* fokusmarkering, må ha 3:1 mot lys bunn */
	--ohs-mork: #ffffff;    /* tekst oppå handlingsfargen */
	--ohs-tekst: #191614;
	--ohs-dempet: rgba(25, 22, 20, .70);
	--ohs-flate: #f5ece2;
	--ohs-kant: rgba(25, 22, 20, .16);
}

/* Kortkanten er nesten usynlig med bare tokenbyttet, fordi flaten og
   bunnen ligger tett. En litt sterkere kant gir kortet en tydelig form. */
.ohs-team .ohs-kort__inner {
	border-color: rgba(25, 22, 20, .12);
	box-shadow: 0 1px 2px rgba(25, 22, 20, .06);
}

/* Hover og tastaturfokus skal gi samme tydelige ramme som på det andre
   nettstedet, men i merkevarens brune. */
.ohs-team .ohs-kort__inner:hover,
.ohs-team .ohs-kort:focus-within .ohs-kort__inner {
	border-color: #996e4c;
	box-shadow: 0 0 0 1px #996e4c;
}

/* Hintet som glir opp over bildet lå som lys tekst på lys flate. */
.ohs-team .ohs-kort__hint {
	color: #ffffff;
	background: linear-gradient(to top, rgba(25, 22, 20, .78), rgba(25, 22, 20, 0));
}

/* Filterknapper: hvilende med tydelig kant, aktiv i handlingsfargen. */
.ohs-team .ohs-team__filter,
.ohs-team .ohs-team__visningsknapp {
	color: var(--ohs-tekst);
	border-color: rgba(25, 22, 20, .22);
}

.ohs-team .ohs-team__filter:hover,
.ohs-team .ohs-team__visningsknapp:hover {
	border-color: #996e4c;
}

.ohs-team .ohs-team__filter[aria-pressed="true"],
.ohs-team .ohs-team__visningsknapp[aria-pressed="true"] {
	background: var(--ohs-gronn);
	border-color: var(--ohs-gronn);
	color: #ffffff;
}

.ohs-team .ohs-team__visningsknapp[aria-pressed="true"] svg {
	fill: #ffffff;
}

/* Ledetekstene sto som lys tekst rett på bunnen. */
.ohs-team .ohs-team__filterledetekst,
.ohs-team .ohs-team__visningledetekst {
	color: var(--ohs-dempet) !important;
}

/* Portrettet fylte ikke boksen: noe på dette nettstedet setter bredden på
   bilder til auto, og da regner nettleseren bredden ut fra høyden og
   bildets eget sideforhold. Resultatet ble en stripe til høyre i kortet.
   Høyden har allerede !important av samme grunn, se team.css. */
.ohs-team .ohs-kort__media .ohs-kort__bilde {
	width: 100% !important;
	max-width: none !important;
}