Estil corporatiu (css)

/* ===========================
Tema HelpDesk – CSS listo para WordPress
Pegar en: Apariencia > Personalizar > CSS adicional
Prefijo: .helpdesk-theme
=========================== */

/* Variables de color */
.helpdesk-theme {
–hd-bg: #07101a;
–hd-bg-2: #041018;
–hd-text: #dfe7ea;
–hd-accent: #7fffd4;
–hd-accent-2: #ff6b6b;
–hd-muted: #9aa6ad;
–hd-card-bg: rgba(255,255,255,0.02);
–hd-border: rgba(127,127,127,0.08);
–hd-shadow: rgba(2,6,23,0.6);
}

/* Reset ligero dentro del scope para evitar conflictos */
.helpdesk-theme * { box-sizing: border-box; }

/* Fondo y tipografía globales (solo dentro del scope) */
.helpdesk-theme body,
.helpdesk-theme .helpdesk-root {
background: linear-gradient(180deg, var(–hd-bg) 0%, var(–hd-bg-2) 100%);
color: var(–hd-text);
font-family: “Inter”, “Segoe UI”, Roboto, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
padding: 22px;
}

/* Contenedor principal tipo tarjeta */
.helpdesk-theme .helpdesk-card {
max-width: 960px;
margin: 24px auto;
background: var(–hd-card-bg);
border: 1px solid var(–hd-border);
padding: 26px;
border-radius: 12px;
box-shadow: 0 6px 18px var(–hd-shadow);
}

/* Título principal */
.helpdesk-theme .helpdesk-title {
font-size: 2.1rem;
text-align: center;
color: var(–hd-accent);
letter-spacing: 0.6px;
text-shadow:
0 0 6px rgba(127,255,212,0.12),
0 0 18px rgba(127,255,212,0.06);
margin: 6px 0 18px;
-webkit-text-stroke: 0.6px rgba(0,0,0,0.25);
}

/* Subtítulos */
.helpdesk-theme h2,
.helpdesk-theme .helpdesk-subtitle {
color: var(–hd-accent-2);
font-size: 1.05rem;
margin: 12px 0;
}

/* Botones estilizados (enlaces o botones) */
.helpdesk-theme .helpdesk-btn {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 10px 18px;
margin: 8px 6px;
color: var(–hd-bg);
background: linear-gradient

Colores utilitzats en la fulla d’estils alternativa

Variables principals (de :root)

• –bg: #07101a — fons fosc (blau fosc).
• –text: #dfe7ea — text clar.
• –accent: #7fffd4 — verd marí suau (accent principal).
• –accent-2: #ff6b6b — vermell/rosat per accents i advertències.
• –muted: #9aa6ad — gris suau per textos secundaris.

Gradients i fons

• linear-gradient(180deg, var(--bg) 0%, #041018 100%) → #041018 com a to secundari del fons.
• Botó principal: linear-gradient(90deg, var(--accent), #4fe1c1) → #4fe1c1 (verd marí clar).
• Botó alternatiu: linear-gradient(90deg, var(--accent-2), #ff8a8a) → #ff8a8a (vermell clar).

Blancs i transparències usats per efectes

• rgba(255,255,255,0.02) — lleu vel per fons de blocs.
• rgba(255,255,255,0.03) — línia de separació subtil.
• rgba(127,127,127,0.08) — vora suau del contenidor.

Efectes glow i ombres (valors RGBA)

• rgba(127,255,212,0.12) — glow suau del títol i ombra de botó.
• rgba(127,255,212,0.06) — glow més difuminat.
• rgba(127,255,212,0.08) — outline de focus i ombra addicional.
• rgba(127,255,212,0.12) — ombra més intensa en hover.
• rgba(2,6,23,0.6) — ombra profunda del contenidor.
• rgba(0,0,0,0.25) — traç negre suau al text (text stroke).

hem fet servir aquests colors, perquè són adequats per a una web de la LAN Party