/* * Gruvbox theme polish. * * Core colour tokens live in 00-base.css. This file adds the warmer, grounded * Gruvbox-specific surface treatment without changing layout behavior. */ :root[data-theme="gruvbox"] .site-header { border-bottom-color: rgba(250, 189, 47, 0.2); backdrop-filter: blur(16px) saturate(130%); -webkit-backdrop-filter: blur(16px) saturate(130%); } :root[data-theme="gruvbox"] .brand-mark { background: linear-gradient(135deg, #d79921, #fe8019); color: #1d2021; box-shadow: 0 8px 22px rgba(254, 128, 25, 0.22); } :root[data-theme="gruvbox"] .card, :root[data-theme="gruvbox"] .app-sidebar, :root[data-theme="gruvbox"] .storage-card, :root[data-theme="gruvbox"] .storage-op-card, :root[data-theme="gruvbox"] .metric-card, :root[data-theme="gruvbox"] .logs-filter-card { background: color-mix(in srgb, var(--card) 92%, #1d2021); border-color: rgba(235, 219, 178, 0.16); } :root[data-theme="gruvbox"] .admin-shell .app-sidebar { border-color: rgba(250, 189, 47, 0.32); background: linear-gradient(180deg, rgba(215, 153, 33, 0.12), rgba(40, 40, 40, 0.94)); } :root[data-theme="gruvbox"] .admin-shell .sidebar-link.is-active { border-color: rgba(250, 189, 47, 0.36); background: rgba(215, 153, 33, 0.14); } :root[data-theme="gruvbox"] .admin-shell .kicker, :root[data-theme="gruvbox"] .kicker { color: #fabd2f; } :root[data-theme="gruvbox"] h1 { color: #fbf1c7; } :root[data-theme="gruvbox"] .button-primary, :root[data-theme="gruvbox"] .button.is-active { border-color: rgba(250, 189, 47, 0.3); background: linear-gradient(135deg, #d79921, #fabd2f); color: #1d2021; box-shadow: 0 10px 24px rgba(215, 153, 33, 0.2); } :root[data-theme="gruvbox"] .button-primary:hover { background: linear-gradient(135deg, #fabd2f, #fe8019); } :root[data-theme="gruvbox"] .button-outline, :root[data-theme="gruvbox"] .button-ghost:hover, :root[data-theme="gruvbox"] .button-outline:hover { border-color: rgba(235, 219, 178, 0.2); } :root[data-theme="gruvbox"] .badge-active, :root[data-theme="gruvbox"] .storage-detail-test.is-ok > span:last-child { color: #b8bb26; } :root[data-theme="gruvbox"] .badge-disabled, :root[data-theme="gruvbox"] .storage-detail-test.is-err > span:last-child, :root[data-theme="gruvbox"] .form-error { color: #fb4934; } :root[data-theme="gruvbox"] input:focus, :root[data-theme="gruvbox"] select:focus, :root[data-theme="gruvbox"] textarea:focus { border-color: #fe8019; box-shadow: 0 0 0 3px rgba(254, 128, 25, 0.18); } :root[data-theme="gruvbox"] ::selection { background: #d79921; color: #1d2021; }