/* Fidellio overrides for the Pcoded theme (preset-10) — charter v1 (validated 2026-08-24).
   Loaded after style-preset.css in layouts/app.blade.php.
   Never edit style.css or style-preset.css: vendor files, overwritten on
   every theme update.

   Charter principle: the brand yellow (#FFE500) is reserved for the primary
   action (one per screen) and small accents; everything else is neutral,
   using greys tinted with the brand hue (H≈54°). All contrasts >= 4.5:1.

   NOTE: preset-10 rules live under [data-pc-preset=preset-10] (specificity
   0-2-0). Any override targeting a class the preset also styles MUST carry
   the same prefix, or it silently loses regardless of load order. */

:root {
	/* Neutrals */
	--fid-paper: #FAF9F4;
	--fid-card: #FFFFFF;
	--fid-subtle: #F3F2E9;
	--fid-line: #E8E6D8;
	--fid-line-strong: #C9C6B2;
	--fid-ink: #17160E;        /* 17.6:1 on white */
	--fid-ink-soft: #56543F;   /* 7.4:1 */
	--fid-ink-faint: #74715B;  /* 4.7:1 */

	/* Yellow — the 10% */
	--fid-accent: #FFE500;
	--fid-accent-hover: #EBD400;
	--fid-accent-press: #D6C200;
	--fid-accent-pale: #FFF6C8;
	--fid-accent-border: #F0E27A;
	--fid-accent-ink: #6B5D00;       /* 6.6:1 — brand links/text on light bg */
	--fid-accent-ink-hover: #524700;

	/* Semantic: solid text / badge background / badge text */
	--fid-success: #1E7B34; --fid-success-bg: #E7F4EA; --fid-success-ink: #14582A;
	--fid-warning: #8A5A00; --fid-warning-bg: #FBF1DC; --fid-warning-ink: #7A5000;
	--fid-danger: #B3261E;  --fid-danger-bg: #FBECEB;  --fid-danger-ink: #A02018;
	--fid-info: #14607A;    --fid-info-bg: #E4F1F6;    --fid-info-ink: #14607A;
}

/* ============================================================
   Surfaces — T1: large yellow areas go back to neutral
   ============================================================ */

body {
	background-color: var(--fid-paper);
}

/* Auth pages: the preset paints the whole viewport #ffe500. */
.auth-main .auth-wrapper {
	background-color: var(--fid-paper);
}

/* The preset forces a 60px card-body padding on auth cards — on a 375px
   viewport that squeezes the form to ~200px. */
@media (max-width: 575.98px) {
	.auth-main .auth-wrapper.v1 .auth-form .card-body {
		padding: 32px 24px;
	}
}

/* Top chrome: the header followed the grey body bg and looked absent —
   white like the sidebar, with a hairline to bound the content area. */
.pc-header {
	--pc-header-background: var(--fid-card);
	border-bottom: 1px solid var(--fid-line);
}

/* Passive status chip (trial countdown): neutral pale family, the yellow
   stays reserved for actions. */
.trial-chip {
	display: inline-block;
	background: var(--fid-subtle);
	color: var(--fid-ink-soft);
	font-size: 12px;
	font-weight: 600;
	padding: .35rem .75rem;
	border-radius: 999px;
	white-space: nowrap;
}

/* Sidebar items: a touch more breathing room, in line with the airy cards. */
.pc-sidebar .pc-navbar > .pc-item > .pc-link {
	padding-top: 12px;
	padding-bottom: 12px;
}

/* Content width: on large screens the content stretched edge to edge
   (deserted columns, empty band-like cards) — charter grid, content
   capped at 1280px, centered. */
.pc-container .pc-content {
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;
}

/* Welcome banners (campaigns, contests): the preset paints them solid
   yellow — pale bordered yellow instead, like info callouts. */
.bg-fidellio {
	background: var(--fid-accent-pale);
	border: 1px solid var(--fid-accent-border);
}

/* Empty state (charter batch C): shared look for "no data yet" boxes. */
.fid-empty-state {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	border: 1.5px dashed var(--fid-line-strong);
	border-radius: 8px;
	padding: 24px;
	min-height: 240px;
}

/* ============================================================
   Links & text — the preset promotes #ffe500 as the link color
   (1.28:1 on white). Brand links: dark readable yellow.
   Preset prefix required (see NOTE above).
   ============================================================ */

[data-pc-preset=preset-10] {
	/* -rgb pairs must stay raw R,G,B triplets (Bootstrap composes them
	   with an alpha); they mirror --fid-accent-ink / -hover. */
	--bs-link-color: var(--fid-accent-ink);
	--bs-link-color-rgb: 107, 93, 0;
	--bs-link-hover-color: var(--fid-accent-ink-hover);
	--bs-link-hover-color-rgb: 82, 71, 0;
}

.text-primary {
	color: var(--fid-ink) !important;
}

[data-pc-preset=preset-10] .btn-link {
	--bs-btn-color: var(--fid-accent-ink);
	--bs-btn-hover-color: var(--fid-accent-ink-hover);
	--bs-btn-active-color: var(--fid-accent-ink-hover);
	--bs-btn-disabled-color: var(--fid-ink-faint);
}

/* Auth page links: the preset forces them to #707070 (4.0:1, below AA).
   Same grey as the rest of the site. */
.auth-main .auth-wrapper.v1 .auth-form a {
	color: var(--fid-ink-soft) !important;
}

.auth-main .auth-wrapper.v1 .auth-form a:hover,
.auth-main .auth-wrapper.v1 .auth-form a:focus {
	color: var(--fid-ink) !important;
}

/* ============================================================
   Buttons — T2/T3/T7: three levels, sentence case
   ============================================================ */

/* The theme forces button labels to uppercase 12px bold (hard rule around
   style.css:22726, which overrides the Bootstrap variable) — a size tuned
   for capitals. In sentence case, bump one step (0.95rem/600) to keep the
   same optical presence. */
.btn {
	text-transform: none;
	font-size: 0.95rem;
	--bs-btn-font-weight: 600;
}

.btn-sm {
	font-size: 0.85rem;
}

/* Icon buttons (table actions): the theme sizes them 40x40 — 44px minimum
   touch target (Fitts's law, charter batch D). */
.btn.btn-icon {
	width: 44px;
	height: 44px;
}

/* Primary (yellow): the preset sends hover to solid black — stay within
   the hue (L−6 hover, L−12 pressed), ink text. One per view. */
[data-pc-preset=preset-10] .btn-primary {
	--bs-btn-color: var(--fid-ink);
	--bs-btn-bg: var(--fid-accent);
	--bs-btn-border-color: var(--fid-accent);
	--bs-btn-hover-color: var(--fid-ink);
	--bs-btn-hover-bg: var(--fid-accent-hover);
	--bs-btn-hover-border-color: var(--fid-accent-hover);
	--bs-btn-active-color: var(--fid-ink);
	--bs-btn-active-bg: var(--fid-accent-press);
	--bs-btn-active-border-color: var(--fid-accent-press);
	--bs-btn-disabled-color: var(--fid-ink-soft);
	--bs-btn-disabled-bg: var(--fid-accent-pale);
	--bs-btn-disabled-border-color: var(--fid-accent-pale);
}

/* Secondary: solid black disappears (it only existed to survive yellow
   backgrounds). All existing .btn-dark become outlines. */
.btn-dark {
	--bs-btn-color: var(--fid-ink);
	--bs-btn-bg: transparent;
	--bs-btn-border-color: var(--fid-line-strong);
	--bs-btn-hover-color: var(--fid-ink);
	--bs-btn-hover-bg: var(--fid-subtle);
	--bs-btn-hover-border-color: var(--fid-line-strong);
	--bs-btn-active-color: var(--fid-ink);
	--bs-btn-active-bg: var(--fid-line);
	--bs-btn-active-border-color: var(--fid-line-strong);
	--bs-btn-disabled-color: var(--fid-ink-faint);
	--bs-btn-disabled-bg: transparent;
	--bs-btn-disabled-border-color: var(--fid-line);
}

/* ============================================================
   Badges — replaces the style.css:7098 hotspot (forced white text
   on warning/success/info): pale background + dark text, everywhere.
   .text-bg-primary needs the preset prefix (preset rule is !important
   at higher specificity).
   ============================================================ */

[data-pc-preset=preset-10] .text-bg-primary {
	color: var(--fid-accent-ink) !important;
	background-color: var(--fid-accent-pale) !important;
}

.text-bg-success {
	color: var(--fid-success-ink) !important;
	background-color: var(--fid-success-bg) !important;
}

.text-bg-warning {
	color: var(--fid-warning-ink) !important;
	background-color: var(--fid-warning-bg) !important;
}

.text-bg-danger {
	color: var(--fid-danger-ink) !important;
	background-color: var(--fid-danger-bg) !important;
}

.text-bg-info {
	color: var(--fid-info-ink) !important;
	background-color: var(--fid-info-bg) !important;
}

/* Neutral state badge (e.g. "waiting" campaign status): keep it in the
   pale family instead of solid dark next to recolored siblings. */
.text-bg-dark {
	color: var(--fid-ink-soft) !important;
	background-color: var(--fid-subtle) !important;
}

.badge.bg-success {
	color: var(--fid-success-ink) !important;
	background-color: var(--fid-success-bg) !important;
}

.badge.bg-warning {
	color: var(--fid-warning-ink) !important;
	background-color: var(--fid-warning-bg) !important;
}

.badge.bg-danger {
	color: var(--fid-danger-ink) !important;
	background-color: var(--fid-danger-bg) !important;
}

.badge.bg-info {
	color: var(--fid-info-ink) !important;
	background-color: var(--fid-info-bg) !important;
}

/* ============================================================
   Theme components already fixed on 08/18 (prudent pass), aligned
   with the charter tokens
   ============================================================ */

/* Progress bars are filled with the brand yellow; Bootstrap puts white
   text on them (unreadable, e.g. the age chart on Statistics). */
.progress-bar {
	color: var(--fid-ink);
	font-weight: 600;
}

/* .analytics-tab tabs (Add points, Invoices, Orders): the theme turns the
   active — and hovered — tab text brand yellow, unreadable on white. The
   yellow underline (::after) already marks the active tab. */
.analytics-tab .nav-item .nav-link {
	color: var(--fid-ink-soft);
}

.analytics-tab .nav-link:hover,
.analytics-tab .nav-item.show .nav-link,
.analytics-tab .nav-link.active {
	color: var(--fid-ink);
}