/* * Optional accent themes (toggle in Settings). * Default tokens live in application.css; this file only overrides when * is set. */ html[data-ui-theme="emerald"] { --color-accent: #34d399; --color-accent-2: #14b8a6; --focus-ring: #2dd4bf; } html[data-ui-theme="emerald"] body { background: radial-gradient(120% 80% at 50% -10%, #134e4a 0%, var(--color-canvas) 55%); } html[data-ui-theme="emerald"] a:hover { color: #6ee7b7; } html[data-ui-theme="emerald"] .flash--notice { background: rgba(52, 211, 153, 0.12); border: 1px solid rgba(52, 211, 153, 0.35); } html[data-ui-theme="emerald"] .tab-bar__link.is-active { background: rgba(52, 211, 153, 0.08); } html[data-ui-theme="emerald"] .input:focus { border-color: rgba(45, 212, 191, 0.65); box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.2); } html[data-ui-theme="emerald"] .btn:focus-visible { outline: 2px solid rgba(45, 212, 191, 0.55); } html[data-ui-theme="emerald"] .banner--info { background: rgba(52, 211, 153, 0.08); border: 1px solid rgba(52, 211, 153, 0.28); } html[data-ui-theme="emerald"] .fab { background: linear-gradient(135deg, #34d399, #14b8a6); box-shadow: 0 10px 28px rgba(52, 211, 153, 0.35); } html[data-ui-theme="emerald"] .quick-log-tool:hover { background: rgba(52, 211, 153, 0.12); border-color: rgba(52, 211, 153, 0.35); } html[data-ui-theme="emerald"] .quick-log-tool.is-active { background: rgba(52, 211, 153, 0.18); border-color: rgba(52, 211, 153, 0.45); color: #f0fdfa; } html[data-ui-theme="emerald"] .quick-log-tool--ai { background: linear-gradient(135deg, rgba(52, 211, 153, 0.22), rgba(20, 184, 166, 0.22)); border-color: rgba(20, 184, 166, 0.55); } html[data-ui-theme="emerald"] .quick-log-tool--ai:hover { background: linear-gradient(135deg, rgba(52, 211, 153, 0.32), rgba(20, 184, 166, 0.32)); border-color: rgba(20, 184, 166, 0.7); } html[data-ui-theme="emerald"] .voice-form--submitting .voice-preview--live { border-color: rgba(52, 211, 153, 0.45); } html[data-ui-theme="emerald"] .intake-card--analyzing { border-color: rgba(52, 211, 153, 0.35); } html[data-ui-theme="emerald"] .pill--lunch { background: rgba(52, 211, 153, 0.15); color: #bbf7d0; } html[data-ui-theme="emerald"] .pill--dinner { background: rgba(20, 184, 166, 0.18); color: #e0e7ff; } html[data-ui-theme="emerald"] .pill--pending { background: rgba(52, 211, 153, 0.15); color: #a5f3fc; } html[data-ui-theme="emerald"] .step-dots li.is-done { background: rgba(52, 211, 153, 0.65); } html[data-ui-theme="emerald"] .portion-slider::-webkit-slider-thumb { background: linear-gradient(135deg, #34d399, #0d9488); } html[data-ui-theme="emerald"] .portion-slider:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 4px rgba(45, 212, 191, 0.25), 0 10px 24px rgba(0, 0, 0, 0.35); } html[data-ui-theme="emerald"] .portion-slider::-moz-range-thumb { background: linear-gradient(135deg, #34d399, #0d9488); } html[data-ui-theme="emerald"] .filter-chip:hover { border-color: rgba(45, 212, 191, 0.35); } html[data-ui-theme="emerald"] .food-show-nutrition__badge { background: rgba(52, 211, 153, 0.14); border: 1px solid rgba(52, 211, 153, 0.35); }