/* Anmeldeseite und Webseiten von Frappe im Artis-Stil (Alpenluft). Nur Farben, Rundungen und Logo.
   Schrift: Inter wie in der Anwendung (bringt Frappe mit). */
/* Tokens der Web-Seiten (Anmeldung, Mein Passwort, Zweiter Faktor). Gleiche Namen wie in artis_theme.css,
   damit ein zweites Erscheinungsbild beides mit denselben Variablen umstellen kann. */
:root {
	--artis-accent: #1e7a5a;
	--artis-accent-hover: #17654a;
	--artis-accent-soft: #e3f3ec;
	--artis-accent-hauch: #f3faf6;
	--artis-accent-ink: #fff;
	--artis-brand: #8ca087;
	--artis-bg: #f3f5f8;
	--artis-surface: #fff;
	--artis-surface-2: #f1f4f8;
	--artis-line: #e3e8ef;
	--artis-line-strong: #cdd5df;
	--artis-ink: #0f172a;
	--artis-ink-2: #475569;
	--artis-ink-3: #64748b;
	--artis-ok: #15803d;      --artis-ok-soft: #dcf5e4;
	--artis-bad: #be123c;     --artis-bad-soft: #ffe4e8;
	--artis-focus-ring: 0 0 0 3px rgba(30, 122, 90, 0.2);
	--artis-schatten-login: 0 1px 2px rgba(15, 23, 42, 0.04), 0 12px 32px -14px rgba(15, 23, 42, 0.18);
	--artis-schatten-karte: 0 1px 2px rgba(15, 23, 42, .04), 0 18px 40px -18px rgba(15, 23, 42, .25);
	--artis-font-zahlen: "Segoe UI", system-ui, sans-serif;
}
/* Erscheinungsbild Romy (nach dem Anmelden, wenn die Person Romy gewählt hat): Petrol, Häuschenpapier, IBM Plex und Source Serif.
   Schriften lokal (OFL), gleiche Dateien wie im Desk (artis_romy.css). */
@font-face { font-family: "IBM Plex Sans"; font-weight: 400; font-display: swap; src: url("/assets/artis_erp/fonts/romy/ibm-plex-sans-latin-400.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 600 700; font-display: swap; src: url("/assets/artis_erp/fonts/romy/ibm-plex-sans-latin-600.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-weight: 500 700; font-display: swap; src: url("/assets/artis_erp/fonts/romy/source-serif-4-latin-600.woff2") format("woff2"); }
html[data-look="romy"] {
	--artis-accent: #1b434b;
	--artis-accent-hover: #133238;
	--artis-accent-soft: #e8f1f1;
	--artis-accent-hauch: #f3f8f8;
	--artis-brand: #1e6b74;
	--artis-bg: #eff4f3;
	--artis-surface-2: #f5f4f0;
	--artis-line: #e4e1da;
	--artis-line-strong: #d0cdc5;
	--artis-ink: #1f2328;
	--artis-ink-2: #5b5f66;
	--artis-ink-3: #686c73;
	--artis-focus-ring: 0 0 0 3px rgba(27, 67, 75, 0.18);
	--artis-schatten-karte: 0 2px 10px rgba(20, 25, 30, 0.07);
	--artis-karo: rgba(27, 67, 75, 0.055);
	--artis-font-web: "IBM Plex Sans", system-ui, sans-serif;
	--artis-font-web-titel: "Source Serif 4", Georgia, serif;
}
html[data-look="romy"] body { font-family: var(--artis-font-web);
	background-image: linear-gradient(var(--artis-karo) 1px, transparent 1px), linear-gradient(90deg, var(--artis-karo) 1px, transparent 1px); background-size: 20px 20px; }
html[data-look="romy"] .sa { border-radius: 3px; border-top-color: var(--artis-accent); }
html[data-look="romy"] .sa h1 { font-family: var(--artis-font-web-titel); font-weight: 600; color: var(--artis-accent); letter-spacing: 0; }
html[data-look="romy"] .sa .logo { border-radius: 7px; background: var(--artis-accent); color: var(--artis-accent-ink); font-family: var(--artis-font-web-titel); }
html[data-look="romy"] .sa .kunden a, html[data-look="romy"] .sa input, html[data-look="romy"] .sa button { border-radius: 3px; }
body { background: var(--artis-bg); color: var(--artis-ink); -webkit-font-smoothing: antialiased; }
.page-card, .for-login .page-card, .login-content .page-card {
	border: 1px solid var(--artis-line);
	border-radius: 16px;
	box-shadow: var(--artis-schatten-login);
	background: var(--artis-surface);
}
.page-card-head h4, .page-card-head h3 { font-weight: 700; letter-spacing: -0.015em; }
.btn-primary, .btn-primary:focus {
	background: var(--artis-accent);
	border-color: var(--artis-accent);
	color: var(--artis-accent-ink);
	border-radius: 10px;
	font-weight: 600;
}
.btn-primary:hover { background: var(--artis-accent-hover); border-color: var(--artis-accent-hover); }
a, a:hover { color: var(--artis-accent); }
.form-control { border-radius: 10px; }
.form-control:focus { border-color: var(--artis-accent); box-shadow: var(--artis-focus-ring); }
.app-logo, .page-card-head img { max-height: 56px; width: auto; }