/* ==========================================================================
   Lista New Line Solutions — temă de brand peste Vikunja
   --------------------------------------------------------------------------
   Injectat în <head> de nginx (vezi /etc/nginx/sites-available/vikunja), după
   bundle-urile aplicației, ca să câștige la cascadă fără specificitate forțată.

   Sursele: paleta și rolurile din "Brandbook NLS" + fonturile self-hostate de
   pe www.newlinesolutions.ro. Vikunja își construiește tema din variabile CSS
   (:root pentru temă deschisă, :root.dark pentru cea închisă), deci aici se
   rescriu variabilele, nu componentele — asta supraviețuiește actualizărilor.

   Roluri de culoare, exact cum sunt definite în brandbook:
     #293a40  titluri, text principal      #6d8087  text secundar
     #2f7fb8  albastru mediu, accente      #4bb0e6  linkuri, numere mari
     #31a9ad  accente, subtitluri          #ff3e55  linii de separare, accente RARE
     #cbe8e9 / #dcf1f2 / #f4fafb  panouri  #47606a  gri-ardezie secundar
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Fonturi — aceleași fișiere ca pe site.
   Declarațiile le oglindesc pe cele din /assets/fonts-local.css: același fișier
   e declarat la două greutăți (fișierele 400 și 600 sunt identice pe origine —
   e o variabilă de greutate), iar latin-ext e obligatoriu pentru diacriticele
   românești (ă â î ș ț), altfel browserul cade pe un font substitut doar la
   cuvintele cu diacritice.
   -------------------------------------------------------------------------- */
@font-face {
	font-family: 'Exo 2'; font-style: normal; font-weight: 400; font-display: swap;
	src: url('/branding/fonts/exo2-400-latinext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Exo 2'; font-style: normal; font-weight: 400; font-display: swap;
	src: url('/branding/fonts/exo2-400-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Exo 2'; font-style: normal; font-weight: 600; font-display: swap;
	src: url('/branding/fonts/exo2-600-latinext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Exo 2'; font-style: normal; font-weight: 600; font-display: swap;
	src: url('/branding/fonts/exo2-600-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Playfair Display'; font-style: normal; font-weight: 700; font-display: swap;
	src: url('/branding/fonts/playfair-700-latinext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Playfair Display'; font-style: normal; font-weight: 700; font-display: swap;
	src: url('/branding/fonts/playfair-700-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Playfair Display'; font-style: normal; font-weight: 900; font-display: swap;
	src: url('/branding/fonts/playfair-900-latinext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Playfair Display'; font-style: normal; font-weight: 900; font-display: swap;
	src: url('/branding/fonts/playfair-900-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: 'Share Tech Mono'; font-style: normal; font-weight: 400; font-display: swap;
	src: url('/branding/fonts/sharetechmono-400-latin.woff2') format('woff2');
}

/* --------------------------------------------------------------------------
   2. Paleta — temă deschisă
   -------------------------------------------------------------------------- */
:root {
	/* Culorile de brand, disponibile și pentru regulile de mai jos */
	--nls-teal:      #31a9ad;
	--nls-sky:       #4bb0e6;
	--nls-blue:      #2f7fb8;
	--nls-navy:      #293a40;
	--nls-steel:     #47606a;
	--nls-mute:      #6d8087;
	--nls-turq:      #cbe8e9;
	--nls-turq-soft: #dcf1f2;
	--nls-panel:     #f4fafb;
	--nls-coral:     #ff3e55;
	--nls-line:      #dcebee;

	--family-primary: 'Exo 2', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--family-code: 'Share Tech Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

	/* Primar = albastrul mediu de brand. NU coralul: brandbook-ul îl rezervă
	   pentru „accente rare”, iar pe butoane s-ar confunda cu acțiunile
	   distructive, care în Vikunja sunt tot roșii. */
	--primary-h: 205deg;
	--primary-s: 59%;
	--primary-l: 45%;

	/* Scala de gri, remapată pe ardezia și turcoazul de brand.
	   Luminozitățile rămân apropiate de cele originale, ca să nu se strice
	   rapoartele de contrast pe care se bazează componentele. */
	--grey-50:      #f4fafb;          /* panoul deschis din brandbook */
	--grey-100-hsl: 183, 46%, 91%;    /* #dcf1f2 — fundalul aplicației */
	--grey-200:     #cbe8e9;
	--grey-300:     #a9d5d8;
	--grey-400:     #8ec4c8;
	--grey-500-hsl: 196, 11%, 48%;    /* #6d8087 — text secundar */
	--grey-600:     #47606a;
	--grey-700:     #3a5158;
	--grey-800:     #293a40;          /* text principal */
	--grey-900:     #1a2529;
	/* varianta HSL a aceleiași culori: componentele o folosesc separat, prin
	   hsla(var(--grey-900-hsl), α), pentru placeholder-e și umbre */
	--grey-900-hsl: 196, 22%, 13%;

	--text-muted:       #6d8087;
	--logo-text-color:  #293a40;

	/* Linkurile: albastrul deschis are rolul ăsta explicit în brandbook, dar la
	   2.1:1 pe turcoaz e sub prag pentru text mic, așa că textul de link merge
	   pe albastrul mediu și rămâne #4bb0e6 doar la hover/grafică. */
	--link-h: 205deg;
	--link-s: 59%;
	--link-l: 45%;
}

/* --------------------------------------------------------------------------
   3. Paleta — temă închisă
   Aceleași luminozități ca la Vikunja, dar cu nuanța mutată pe ardezia de
   brand (196°) în loc de albastrul-violet original (215–221°).
   -------------------------------------------------------------------------- */
:root.dark {
	--grey-50-hsl:  196, 28%, 13%;    /* suprafețele de card */
	--grey-100-hsl: 196, 22%, 20%;    /* ≈ #293a40, fundalul aplicației */
	--grey-200:     #33474e;
	--grey-300:     #47606a;          /* steel */
	--grey-400:     #6d8087;          /* mute */
	--grey-500-hsl: 196, 14%, 65%;
	--grey-600:     #a9c0c5;
	--grey-700:     #cbe8e9;
	--grey-800:     #e8f3f4;
	--grey-900-hsl: 190, 30%, 97%;

	/* Pe fundal închis albastrul mediu e prea întunecat; trece pe albastrul
	   deschis de brand, care acolo are contrast bun. */
	--primary-h: 201deg;
	--primary-s: 76%;
	--primary-l: 60%;
	--link-h: 201deg;
	--link-s: 76%;
	--link-l: 60%;

	--text-muted:      #8ba3a9;
	--logo-text-color: #dcf1f2;
	--nls-line:        #33474e;
}

/* --------------------------------------------------------------------------
   4. Tipografie
   Playfair Display doar pe titluri, cum cere brandbook-ul; restul interfeței
   rămâne Exo 2, ca să nu devină greu de citit într-o listă de sarcini.
   -------------------------------------------------------------------------- */
body,
input, textarea, select, button {
	font-family: var(--family-primary);
}

.title,
.card-title,
h1.title, h2.title, h3.title {
	font-family: 'Playfair Display', Georgia, serif;
	font-weight: 700;
	letter-spacing: -0.01em;
}

code, pre, .is-family-code {
	font-family: var(--family-code);
}

/* --------------------------------------------------------------------------
   5. Logo — dublu față de dimensiunea din bundle.
   Regula originală e .logo[data-v-<hash>]{max-block-size:48px;max-inline-size:168px},
   care la un logo de 3294x512 (6.4:1) dădea 168x26 pe ecran. Dublul e 336x52.

   Ținta e structura (.logo-link .logo), nu hash-ul data-v-*, fiindcă hash-ul se
   schimbă la fiecare build al Vikunja.

   IMPORTANT — de ce înălțime FIXĂ și nu max-block-size:
   navbar-ul are min-block-size:4rem, dar se întinde după conținut, iar layout-ul
   are 4rem hardcodat în alte două locuri: sidebar-ul e fixat cu inset-block:4rem 0
   și conținutul are padding-block-start:5.5rem. Dacă logo-ul depășește 4rem, bara
   crește, iar sidebar-ul și conținutul rămân la offset-ul vechi și intră sub ea.
   Cu block-size explicit, înălțimea barei nu mai depinde de cum rezolvă browserul
   cele două constrângeri max-*.
   -------------------------------------------------------------------------- */
.logo-link .logo,
.navbar .logo {
	block-size: 52px !important;
	inline-size: auto !important;
	max-block-size: 52px !important;
	max-inline-size: none !important;
	object-fit: contain !important;
}

/* Pe ecrane mici logo-ul dublat ar împinge butoanele din navbar afară. */
@media (max-width: 768px) {
	.logo-link .logo,
	.navbar .logo {
		block-size: 34px !important;
	}
}

/* --------------------------------------------------------------------------
   6. Curățenie
   -------------------------------------------------------------------------- */

/* „Powered by Vikunja” din subsolul meniului lateral (componenta PoweredByLink,
   singura care folosește clasa asta — verificat în bundle). */
.menu-bottom-link {
	display: none !important;
}

/* --------------------------------------------------------------------------
   7. Structura paginii
   Vikunja dă barei de sus și meniului lateral același background ca paginii
   (var(--site-background)). Cu griul discret din tema originală diferența nu se
   observa; pe turcoazul de brand cele trei zone se topesc una în alta și bara
   nu se mai citește ca bară. Le punem pe suprafața de card — aceeași cu cea a
   conținutului — ca să recapete contur.
   -------------------------------------------------------------------------- */
.navbar {
	background: var(--white) !important;
	box-shadow: 0 1px 4px rgba(41, 58, 64, .08);
	/* Linia corală: rolul pe care brandbook-ul îl dă coralului — „linii de
	   separare, puncte fine, accente rare”. */
	border-block-end: 2px solid var(--nls-coral, #ff3e55);
}

.menu-container {
	background: var(--white) !important;
	border-inline-end: 1px solid var(--nls-line, #dcebee);
}

/* --------------------------------------------------------------------------
   Panoul cu toate etichetele (vezi /branding/nls-etichete.js)
   Câmpul de etichete al Vikunja nu arată nimic până nu tastezi, iar dacă nu
   știi denumirile n-ai de unde începe. Panoul le arată pe toate, grupate.
   -------------------------------------------------------------------------- */
.nls-panou-etichete {
	margin-top: .75rem;
	padding: .85rem .95rem;
	background: var(--grey-50, #f4fafb);
	border: 1px solid var(--grey-200, #cbe8e9);
	border-radius: 5px;
}
.nls-grup-titlu {
	font-size: .68rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--text-muted, #6d8087);
	margin-bottom: .4rem;
}
.nls-grup-titlu + .nls-grup { margin-bottom: .85rem; }
.nls-grup:last-child { margin-bottom: 0; }
.nls-grup {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
}
.nls-chip {
	font: inherit;
	font-size: .8rem;
	font-weight: 600;
	line-height: 1.2;
	padding: .32rem .7rem;
	border: 0;
	border-radius: 4px;
	cursor: pointer;
	transition: transform .08s ease, filter .08s ease;
}
.nls-chip:hover { filter: brightness(1.08); transform: translateY(-1px); }
.nls-chip:focus-visible {
	outline: 2px solid var(--primary, #2f7fb8);
	outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
	.nls-chip { transition: none; }
	.nls-chip:hover { transform: none; }
}
/* Panoul din caseta de adăugare rapidă stă lipit sub ea. */
.nls-panou-rapid {
	margin-top: .5rem;
	text-align: left;
	max-height: 15rem;
	overflow-y: auto;
}