/* FDB shared visual theme: bright food-data palette */
:root {
    color-scheme: light;
    --fdb-bg: #f6fbf3;
    --fdb-bg-2: #eef7ea;
    --fdb-surface: #ffffff;
    --fdb-surface-soft: #f7fcf4;
    --fdb-surface-strong: #eef8e9;
    --fdb-ink: #1f2f28;
    --fdb-text: #2f4138;
    --fdb-muted: #607367;
    --fdb-subtle: #7c8e82;
    --fdb-border: #dbe8d4;
    --fdb-border-strong: #c4dcc0;
    --fdb-primary: #2f8f5b;
    --fdb-primary-dark: #1d6f48;
    --fdb-primary-soft: #dff3df;
    --fdb-teal: #0f9f95;
    --fdb-citrus: #d7901d;
    --fdb-tomato: #d95f45;
    --fdb-blue: #2476a8;
    --fdb-shadow: 0 18px 48px rgba(46, 90, 60, 0.12);
    --fdb-shadow-sm: 0 10px 26px rgba(46, 90, 60, 0.09);
}

html,
body {
    background:
        linear-gradient(90deg, rgba(47, 143, 91, 0.055) 1px, transparent 1px) 0 0 / 44px 44px,
        linear-gradient(0deg, rgba(47, 143, 91, 0.045) 1px, transparent 1px) 0 0 / 44px 44px,
        linear-gradient(180deg, #fbfff7 0%, var(--fdb-bg) 44%, #f8fbf4 100%) !important;
    color: var(--fdb-text) !important;
}

body {
    font-family: 'Inter', 'Noto Sans JP', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    overflow-x: hidden;
}

body[class*="bg-slate"],
body.bg-gray-50,
body.bg-gray-100 {
    background:
        linear-gradient(90deg, rgba(47, 143, 91, 0.055) 1px, transparent 1px) 0 0 / 44px 44px,
        linear-gradient(0deg, rgba(47, 143, 91, 0.045) 1px, transparent 1px) 0 0 / 44px 44px,
        linear-gradient(180deg, #fbfff7 0%, var(--fdb-bg) 44%, #f8fbf4 100%) !important;
    color: var(--fdb-text) !important;
}

::selection {
    background: rgba(47, 143, 91, 0.24);
    color: var(--fdb-ink);
}

a {
    color: var(--fdb-primary-dark);
}

a:hover,
a:focus-visible {
    color: var(--fdb-teal);
}

/* Tailwind-like dark utility remapping */
.text-white,
.text-slate-100,
.text-slate-200,
.text-slate-300,
.text-gray-300 {
    color: var(--fdb-ink) !important;
}

.text-slate-400,
.text-slate-500,
.text-slate-600,
.text-gray-400,
.text-gray-500,
.text-gray-600 {
    color: var(--fdb-muted) !important;
}

.text-slate-700,
.text-gray-700,
.text-gray-800,
.text-gray-900,
.text-black {
    color: var(--fdb-ink) !important;
}

.text-indigo-200,
.text-indigo-300,
.text-indigo-400,
.text-indigo-500,
.text-indigo-600,
.text-blue-600,
.text-blue-700,
.text-blue-800,
.text-link {
    color: var(--fdb-primary-dark) !important;
}

.text-teal-200,
.text-teal-300,
.text-teal-400,
.text-emerald-400,
.text-green-300,
.text-green-400,
.text-green-800 {
    color: var(--fdb-teal) !important;
}

.text-amber-200,
.text-yellow-400,
.text-yellow-800 {
    color: var(--fdb-citrus) !important;
}

.text-red-200,
.text-red-300,
.text-red-400,
.text-red-500,
.text-red-600 {
    color: #b13f31 !important;
}

.bg-slate-800,
.bg-slate-800\/40,
.bg-slate-800\/50,
.bg-slate-800\/60,
.bg-gray-800 {
    background-color: var(--fdb-surface) !important;
}

.bg-slate-900,
.bg-slate-900\/30,
.bg-slate-900\/40,
.bg-slate-900\/50,
.bg-slate-900\/70,
.bg-slate-900\/80,
.bg-slate-950\/30 {
    background-color: var(--fdb-surface-soft) !important;
}

.bg-slate-700,
.bg-gray-600,
.bg-gray-200 {
    background-color: var(--fdb-surface-strong) !important;
}

.bg-white,
.bg-white\/90,
.bg-gray-50,
.bg-gray-100,
.bg-slate-50 {
    background-color: var(--fdb-surface) !important;
}

.bg-indigo-600,
.bg-indigo-900,
.bg-indigo-900\/30,
.bg-indigo-900\/50,
.bg-blue-600,
.bg-blue-700,
.bg-emerald-500,
.bg-teal-900\/50 {
    background-color: var(--fdb-primary) !important;
    color: #ffffff !important;
}

.bg-blue-50 {
    background-color: var(--fdb-primary-soft) !important;
}

[class*="bg-red-900"],
.bg-red-600 {
    background-color: #fff0ec !important;
    color: #a3362a !important;
}

[class*="bg-green-900"] {
    background-color: #e4f6e3 !important;
    color: #1d6f48 !important;
}

[class*="bg-amber"],
[class*="bg-yellow"] {
    background-color: #fff4d8 !important;
    color: #8c5a00 !important;
}

.border-slate-500,
.border-slate-600,
.border-slate-700,
.border-slate-700\/50,
.border-slate-800,
.border-slate-800\/60,
.border-slate-800\/70,
.border-gray-100,
.border-gray-200,
.border-gray-300,
.border-gray-400,
.border-gray-800,
.border-white\/10,
.border-blue-200,
.border-blue-300,
.border-blue-600,
.border-indigo-500\/30,
.border-green-500\/30,
.border-green-600,
.border-amber-700\/40,
.border-yellow-500\/30 {
    border-color: var(--fdb-border) !important;
}

.divide-slate-700 > :not([hidden]) ~ :not([hidden]),
.divide-slate-800 > :not([hidden]) ~ :not([hidden]),
.divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--fdb-border) !important;
}

.shadow-2xl,
.shadow-lg,
.shadow-md,
.shadow,
[class*="shadow-indigo"],
[class*="shadow-black"],
[class*="shadow-red"] {
    box-shadow: var(--fdb-shadow-sm) !important;
}

/* Gradients */
.from-slate-800,
.from-slate-900,
.from-slate-900\/70,
.from-slate-900\/80,
.from-slate-900\/90 {
    --tw-gradient-from: rgba(255, 255, 255, 0.88) !important;
    --tw-gradient-to: rgba(255, 255, 255, 0) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.via-slate-900,
.via-slate-900\/80 {
    --tw-gradient-via: rgba(246, 251, 243, 0.8) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-via), var(--tw-gradient-to) !important;
}

.to-slate-900,
.to-gray-800 {
    --tw-gradient-to: rgba(246, 251, 243, 0.96) !important;
}

.from-indigo-600,
.from-indigo-600\/20 {
    --tw-gradient-from: var(--fdb-primary) !important;
    --tw-gradient-to: rgba(47, 143, 91, 0) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.to-teal-500,
.to-teal-500\/10 {
    --tw-gradient-to: var(--fdb-teal) !important;
}

.bg-gradient-to-r.from-indigo-600,
.bg-gradient-to-br.from-indigo-600 {
    color: #ffffff !important;
}

/* Layout surfaces */
#sidebar,
aside#sidebar,
.sidebar {
    background:
        linear-gradient(180deg, #ffffff 0%, #f4fbef 100%) !important;
    color: var(--fdb-text) !important;
    border-color: var(--fdb-border) !important;
    box-shadow: 10px 0 36px rgba(46, 90, 60, 0.08) !important;
}

.mobile-header,
header.md\:hidden {
    background: rgba(255, 255, 255, 0.94) !important;
    color: var(--fdb-ink) !important;
    border-color: var(--fdb-border) !important;
    box-shadow: 0 8px 26px rgba(46, 90, 60, 0.08) !important;
}

#sidebar h2,
#sidebar h3,
.sidebar h3,
.mobile-header .font-bold,
header.md\:hidden .font-bold {
    color: var(--fdb-ink) !important;
}

#sidebar nav a,
.sidebar a {
    color: var(--fdb-text) !important;
}

#sidebar nav a:hover,
.sidebar a:hover,
.hover\:bg-slate-800:hover,
.hover\:bg-slate-700:hover,
.hover\:bg-gray-100:hover {
    background-color: var(--fdb-surface-strong) !important;
    color: var(--fdb-primary-dark) !important;
}

#sidebar nav a.bg-slate-800,
#sidebar nav a[aria-current="page"],
.sidebar a.current,
.sidebar a.bg-slate-800 {
    background: linear-gradient(135deg, var(--fdb-primary), var(--fdb-teal)) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 22px rgba(47, 143, 91, 0.18) !important;
}

#sidebar nav a.bg-slate-800 svg,
#sidebar nav a[aria-current="page"] svg,
.sidebar a.current svg,
.sidebar a.bg-slate-800 svg {
    color: #ffffff !important;
}

#sidebar nav ul,
.sidebar nav ul,
#sidebar ul,
.sidebar ul {
    list-style: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

#sidebar nav li,
.sidebar nav li {
    list-style: none !important;
}

#sidebar a.text-indigo-400,
.sidebar a.text-indigo-400 {
    color: var(--fdb-primary-dark) !important;
}

main .max-w-5xl,
main .max-w-4xl,
main .max-w-7xl {
    position: relative;
}

section > .bg-slate-800,
section > .bg-slate-800\/40,
section > .bg-slate-800\/50,
section > .bg-slate-800\/60,
section > .bg-slate-900,
section > .bg-slate-900\/30,
section > .bg-slate-900\/40,
section > .bg-slate-900\/50,
section > .bg-gray-50,
section > .bg-gray-100,
details.bg-slate-800,
details.bg-slate-800\/50,
.card,
.section,
.section-panel,
#main {
    background-color: var(--fdb-surface) !important;
    border-color: var(--fdb-border) !important;
    box-shadow: var(--fdb-shadow-sm);
}

#main,
.content-wrap {
    color: var(--fdb-text) !important;
}

#main {
    border: 1px solid var(--fdb-border);
    border-radius: 14px !important;
    box-sizing: border-box !important;
    width: min(980px, calc(100vw - 28px)) !important;
    max-width: 100% !important;
    overflow: hidden;
}

#main * {
    max-width: 100%;
    box-sizing: border-box;
}

.hero:not(.icon) {
    background:
        radial-gradient(circle at 88% 16%, rgba(15, 159, 149, 0.12), transparent 30%),
        linear-gradient(135deg, #ffffff 0%, #eef8e9 58%, #fff8e8 100%) !important;
    color: var(--fdb-text) !important;
    border: 1px solid var(--fdb-border) !important;
    box-shadow: var(--fdb-shadow-sm) !important;
}

.hero:not(.icon)::before {
    background: radial-gradient(circle, rgba(47, 143, 91, 0.14) 0%, rgba(47, 143, 91, 0) 72%) !important;
}

.hero:not(.icon) *,
.hero:not(.icon) h1,
.hero:not(.icon) h2,
.hero:not(.icon) .hero-title {
    color: var(--fdb-ink) !important;
    letter-spacing: 0 !important;
}

.hero:not(.icon) p,
.hero:not(.icon) .hero-text {
    color: var(--fdb-text) !important;
}

.hero:not(.icon) .hero-project-line {
    color: var(--fdb-primary-dark) !important;
}

.hero:not(.icon) h1 .hero-title-line {
    background: linear-gradient(90deg, var(--fdb-primary-dark), var(--fdb-blue)) !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: none !important;
}

.hero:not(.icon) .eyebrow {
    background: var(--fdb-primary-soft) !important;
    border-color: var(--fdb-border-strong) !important;
    color: var(--fdb-primary-dark) !important;
}

.hero-glow {
    background: rgba(47, 143, 91, 0.13) !important;
}

.rounded-xl,
.rounded-2xl,
.rounded-3xl,
.rounded-lg,
.rounded-md {
    border-color: var(--fdb-border) !important;
}

/* Typography */
h1,
h2,
h3,
h4,
.font-bold,
.font-semibold,
.label {
    color: var(--fdb-ink) !important;
}

header h1,
header h2,
section h1,
section h2 {
    letter-spacing: 0 !important;
}

header.border-b,
[class*="border-b"] {
    border-color: var(--fdb-border) !important;
}

p,
li,
td,
th,
.item {
    color: inherit;
}

li::marker {
    color: var(--fdb-primary) !important;
}

/* Tables and data-heavy regions */
table {
    background: var(--fdb-surface) !important;
    color: var(--fdb-text) !important;
}

thead,
thead[class*="bg-slate"],
#spec-table thead {
    background: #e6f3df !important;
    color: var(--fdb-primary-dark) !important;
}

th,
td {
    border-color: var(--fdb-border) !important;
}

tbody tr:nth-child(even) {
    background-color: rgba(247, 252, 244, 0.72) !important;
}

tbody tr:hover,
tr[class*="hover:bg-slate"]:hover {
    background-color: #ecf7e7 !important;
}

#speclist-scroll,
[class*="overflow-x-auto"][class*="bg-slate"] {
    background: var(--fdb-surface) !important;
    border-color: var(--fdb-border) !important;
    box-shadow: var(--fdb-shadow-sm) !important;
}

.scrollbar-thumb-slate-600 {
    scrollbar-color: var(--fdb-border-strong) var(--fdb-surface-soft);
}

/* Forms and code blocks */
input,
textarea,
select,
pre,
code {
    background-color: var(--fdb-surface-soft) !important;
    color: var(--fdb-ink) !important;
    border-color: var(--fdb-border) !important;
}

pre,
code {
    border-radius: 8px;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--fdb-primary) !important;
    box-shadow: 0 0 0 3px rgba(47, 143, 91, 0.16) !important;
    outline: none !important;
}

/* Buttons and primary actions */
.bg-indigo-600,
.bg-blue-600,
.bg-blue-700,
.bg-emerald-500 {
    background: linear-gradient(135deg, var(--fdb-primary), var(--fdb-teal)) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

.hover\:bg-indigo-500:hover,
.hover\:bg-indigo-700:hover,
.hover\:bg-blue-600:hover,
.hover\:bg-blue-700:hover,
.group:hover .group-hover\:bg-indigo-600 {
    background: linear-gradient(135deg, var(--fdb-primary-dark), var(--fdb-teal)) !important;
    color: #ffffff !important;
}

button,
.btn,
[role="button"] {
    letter-spacing: 0 !important;
}

/* Alerts */
.bg-red-900\/20,
.bg-red-900\/50,
.border-red-500\/50,
.border-red-600,
.scaution {
    background-color: #fff0ec !important;
    border-color: #f2b4a7 !important;
    color: #943325 !important;
}

.bg-green-900\/30,
.border-green-500\/30,
.border-green-600 {
    background-color: #e8f7e6 !important;
    border-color: #b7dfb2 !important;
    color: #1d6f48 !important;
}

.bg-amber-500\/10,
.border-amber-700\/40,
.border-yellow-500\/30 {
    background-color: #fff4d8 !important;
    border-color: #f0d28b !important;
    color: #765000 !important;
}

/* Tree view on database index */
.tree ul::before,
.tree li::before {
    background-color: var(--fdb-border-strong) !important;
}

.tree li:last-child::after {
    background-color: var(--fdb-surface) !important;
}

.node-content:hover {
    background-color: var(--fdb-surface-strong) !important;
}

.icon {
    color: var(--fdb-primary) !important;
}

.badge,
[class*="rounded-full"][class*="bg-slate"] {
    background-color: var(--fdb-primary-soft) !important;
    color: var(--fdb-primary-dark) !important;
    border-color: var(--fdb-border-strong) !important;
}

.level-0 > .node-content .label,
.level-1 > .node-content .label,
.level-2 > .node-content .label {
    color: var(--fdb-primary-dark) !important;
}

/* Media cards */
img,
video {
    border-color: var(--fdb-border) !important;
}

video {
    background: #000;
}

/* Keep modal overlays intentionally dark */
.image-modal,
[class*="bg-black"] {
    color: #ffffff;
}

.image-modal[class*="bg-black"],
.image-modal [class*="bg-black"],
.fixed[class*="bg-black"] {
    background-color: rgba(17, 24, 39, 0.86) !important;
}

/* Shared language toggle */
.imd-lang-toggle,
#lang-toggle-group {
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: var(--fdb-border) !important;
    box-shadow: var(--fdb-shadow-sm) !important;
}

.imd-lang-btn,
#lang-ja-btn,
#lang-en-btn {
    color: var(--fdb-text) !important;
}

.imd-lang-btn.is-active,
#lang-ja-btn.active,
#lang-en-btn.active,
#lang-ja-btn[aria-pressed="true"],
#lang-en-btn[aria-pressed="true"] {
    background: var(--fdb-primary) !important;
    color: #ffffff !important;
}

/* Older standalone pages */
.mobile-header .menu-toggle,
.menu-toggle,
#mobile-menu-button,
#close-menu-button {
    color: var(--fdb-ink) !important;
}

.sidebar.open {
    box-shadow: 14px 0 38px rgba(46, 90, 60, 0.18) !important;
}

.menu-overlay.open {
    background: rgba(31, 47, 40, 0.38) !important;
}

[style*="background-color:#444444"],
[style*="background-color: #444444"] {
    background-color: var(--fdb-primary) !important;
    color: #ffffff !important;
}

[style*="background-color:#cccccc"],
[style*="background-color: #cccccc"],
[style*="background-color:#CCCCCC"],
[style*="background-color: #CCCCCC"] {
    background-color: #e6f3df !important;
    color: var(--fdb-ink) !important;
    border-color: var(--fdb-border) !important;
}

[style*="background-color:#fafafa"],
[style*="background-color: #fafafa"],
[style*="background-color:#ffffff"],
[style*="background-color: #ffffff"] {
    background-color: var(--fdb-surface) !important;
}

[style*="color:white"],
[style*="color: white"],
[style*="color:#fff"],
[style*="color: #fff"] {
    color: #ffffff !important;
}

/* Print should stay clean */
@media print {
    html,
    body {
        background: #ffffff !important;
        color: #000000 !important;
    }

    #sidebar,
    .mobile-header,
    .imd-lang-toggle {
        display: none !important;
    }
}
