/* The Discord button in every menu and on the start page (30 okt, Oskar's wish). Discord's own colour, so it is recognised at once.
   It also has the class "apply" in the menus, so the phone layout keeps it like Ansök (it shrinks to just the logo there). */
.links a.discord.apply, .btn.discord { display: inline-flex; align-items: center; gap: 7px; background: #5865f2; color: #fff; border-radius: 99px;
	padding: 6px 13px; text-decoration: none; transition: filter 0.15s, transform 0.15s; }
.links a.discord.apply:hover, .btn.discord:hover { filter: brightness(1.15); color: #fff; transform: translateY(-1px); }
.discord svg { width: 18px; height: 18px; fill: currentColor; flex-shrink: 0; }
.btn.discord { padding: 14px 26px; border-radius: 10px; box-shadow: 0 8px 30px rgba(88, 101, 242, 0.35); }
.btn.discord svg { width: 20px; height: 20px; }
.links { align-items: center; }
.links a, .links button { white-space: nowrap; }
/* the start page's menu also holds the Online box, so there the button is just the logo until the screen is really wide */
@media (max-width: 1400px) { nav:has(.pill) .links a.discord.apply { padding: 6px 9px; } nav:has(.pill) .links a.discord.apply span { display: none; } }
@media (max-width: 600px) {
	.links a.discord.apply { padding: 4px 6px; } .links a.discord.apply span { display: none; }
	.links a.discord.apply svg { width: 16px; height: 16px; }
	.links:has(a.discord) { gap: 12px !important; }
	/* no room for the name of the page you are already on — Discord and Ansök / Logga ut matter more */
	.links:has(a.discord) a.on { display: none; }
}
@media (max-width: 400px) { .links:has(a.discord) a, .links:has(a.discord) button { letter-spacing: 0.03em; } .links:has(a.discord) { gap: 9px !important; } }