:root[data-theme="sepia"] {
	--color-bg: #fbf7ed;
	--color-text: #3f2f1c;
	--color-muted: #7a6a58;
	--color-accent: #8B4513;
	--color-border: rgba(63,47,28,0.18);
	--color-surface: #f9f4e6;
	--color-sidebar: #f0e9d8;
	--color-sidebar-context: #f4ede2;
	--color-form-group: #f7f2e8;
}

:root[data-theme="sepia"] #bottom-nav a:hover {
	background-color: rgba(63,47,28,0.06);
}

:root[data-theme="sepia"] #bottom-nav a.is-active {
	background-color: rgba(63,47,28,0.08);
}

:root[data-theme="sepia"] a {
	color: #8B4513;
}

:root[data-theme="sepia"] a:visited {
	color: #A0522D;
}

:root[data-theme="sepia"] a:hover {
	color: #CD853F;
}

/* Buttons (sepia) */
:root[data-theme="sepia"] button:hover,
:root[data-theme="sepia"] input[type="button"]:hover,
:root[data-theme="sepia"] input[type="submit"]:hover,
:root[data-theme="sepia"] input[type="reset"]:hover,
:root[data-theme="sepia"] a[role="button"]:hover {
	background-color: rgba(63,47,28,0.06);
}

:root[data-theme="sepia"] button:active,
:root[data-theme="sepia"] input[type="button"]:active,
:root[data-theme="sepia"] input[type="submit"]:active,
:root[data-theme="sepia"] input[type="reset"]:active,
:root[data-theme="sepia"] a[role="button"]:active {
	background-color: rgba(63,47,28,0.08);
}

/* Form Inputs (sepia) */
:root[data-theme="sepia"] input[type="text"]:hover,
:root[data-theme="sepia"] input[type="email"]:hover,
:root[data-theme="sepia"] input[type="password"]:hover,
:root[data-theme="sepia"] input[type="url"]:hover,
:root[data-theme="sepia"] input[type="search"]:hover,
:root[data-theme="sepia"] input[type="tel"]:hover,
:root[data-theme="sepia"] input[type="number"]:hover,
:root[data-theme="sepia"] input[type="date"]:hover,
:root[data-theme="sepia"] input[type="time"]:hover,
:root[data-theme="sepia"] input[type="datetime-local"]:hover,
:root[data-theme="sepia"] input[type="month"]:hover,
:root[data-theme="sepia"] input[type="week"]:hover,
:root[data-theme="sepia"] textarea:hover,
:root[data-theme="sepia"] select:hover {
	background-color: rgba(63,47,28,0.04);
}

:root[data-theme="sepia"] input[type="color"]:hover {
	opacity: 0.8;
}

:root[data-theme="sepia"] .checkbox-row:hover,
:root[data-theme="sepia"] .radio-row:hover {
	background-color: rgba(63,47,28,0.06);
}

:root[data-theme="sepia"] .btn-primary:hover {
	box-shadow: 0 2px 8px rgba(139, 69, 19, 0.25);
}

:root[data-theme="sepia"] details:hover {
	box-shadow: 0 2px 8px rgba(63, 47, 28, 0.15);
}

:root[data-theme="sepia"] details[open] {
	box-shadow: 0 4px 12px rgba(63, 47, 28, 0.2);
}

/* Tables (sepia) */
:root[data-theme="sepia"] tbody tr:nth-child(even) {
	background-color: rgba(63,47,28,0.04);
}

:root[data-theme="sepia"] tbody tr:hover {
	background-color: rgba(63,47,28,0.06);
}

/* Definition Lists (sepia) */
:root[data-theme="sepia"] dt {
	border-bottom-color: rgba(63, 47, 28, 0.18);
}

:root[data-theme="sepia"] dd {
	background-color: rgba(63, 47, 28, 0.04);
	border-left-color: var(--color-accent);
}

:root[data-theme="sepia"] dd:hover {
	background-color: rgba(63, 47, 28, 0.08);
}

:root[data-theme="sepia"] code {
	background-color: rgba(63, 47, 28, 0.06);
	border-color: rgba(63, 47, 28, 0.18);
}

:root[data-theme="sepia"] pre {
	background-color: rgba(63, 47, 28, 0.06);
	border-color: rgba(63, 47, 28, 0.18);
}

:root[data-theme="sepia"] pre:hover {
	border-color: var(--color-accent);
}

:root[data-theme="sepia"] address {
	background-color: rgba(63, 47, 28, 0.06);
	border-left-color: var(--color-accent);
}

:root[data-theme="sepia"] address:hover {
	background-color: rgba(63, 47, 28, 0.10);
}

:root[data-theme="sepia"] mark {
	background-color: rgba(245, 158, 11, 0.12);
	color: var(--color-text);
}

:root[data-theme="sepia"] figure img {
	box-shadow: 0 4px 12px rgba(63, 47, 28, 0.15);
}

:root[data-theme="sepia"] figure img:hover {
	box-shadow: 0 8px 24px rgba(63, 47, 28, 0.2);
}

:root[data-theme="sepia"] figcaption {
	background-color: rgba(63, 47, 28, 0.06);
	border-color: rgba(63, 47, 28, 0.18);
}

:root[data-theme="sepia"] figcaption:hover {
	background-color: rgba(63, 47, 28, 0.10);
	border-color: var(--color-accent);
}

:root[data-theme="sepia"] fieldset {
	background-color: var(--color-form-group);
}

/* Range Inputs (sepia) */
:root[data-theme="sepia"] input[type="range"] {
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	height: 32px;
	cursor: pointer;
}

/* WebKit track */
:root[data-theme="sepia"] input[type="range"]::-webkit-slider-runnable-track {
	height: 4px;
	background-color: var(--color-border);
	border-radius: 999px;
}

/* WebKit thumb */
:root[data-theme="sepia"] input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 16px;
	height: 16px;
	margin-top: -6px;
	background-color: var(--color-accent);
	border: 2px solid var(--color-border);
	border-radius: 50%;
	box-shadow: 0 2px 4px rgba(63, 47, 28, 0.15);
}

:root[data-theme="sepia"] input[type="range"]:active::-webkit-slider-thumb {
	box-shadow: 0 4px 12px rgba(63, 47, 28, 0.25);
}

/* Firefox track */
:root[data-theme="sepia"] input[type="range"]::-moz-range-track {
	height: 4px;
	background-color: var(--color-border);
	border-radius: 999px;
}

/* Firefox progress (filled portion) */
:root[data-theme="sepia"] input[type="range"]::-moz-range-progress {
	height: 4px;
	background-color: rgba(139, 69, 19, 0.5);
	border-radius: 999px;
}

/* Firefox thumb */
:root[data-theme="sepia"] input[type="range"]::-moz-range-thumb {
	width: 16px;
	height: 16px;
	background-color: var(--color-accent);
	border: 2px solid var(--color-border);
	border-radius: 50%;
	box-shadow: 0 2px 4px rgba(63, 47, 28, 0.15);
}

/* Disabled state */
:root[data-theme="sepia"] input[type="range"]:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Sidebar Navigation Hover State for Sepia Theme */
:root[data-theme="sepia"] .sidebar-nav a:hover {
	background-color: rgba(63, 47, 28, 0.08);
	color: #CD853F;
}

/* Sidebar Navigation Active State for Sepia Theme */
:root[data-theme="sepia"] .sidebar-nav a.is-active {
	background-color: rgba(139, 69, 19, 0.12);
	color: #8B4513;
	border-right: 3px solid #8B4513;
}

/* Current Item Styling for Sepia Theme */
:root[data-theme="sepia"] .plan-item.current-item {
	background-color: rgba(139, 69, 19, 0.15);
	border-color: rgba(139, 69, 19, 0.5);
	box-shadow: 0 2px 8px rgba(139, 69, 19, 0.25);
}

:root[data-theme="sepia"] .plan-item.current-item .plan-item-word {
	color: #8B4513;
}

:root[data-theme="sepia"] .plan-item.current-item.completed {
	background-color: rgba(34, 197, 94, 0.12);
	border-color: rgba(34, 197, 94, 0.5);
	box-shadow: 0 2px 8px rgba(34, 197, 94, 0.25);
}



/* Logo styling for sepia theme */
:root[data-theme="sepia"] img[src*="/img/logo.png"] {
	filter: invert(0.3) sepia(1) saturate(0.9);
}

/* Sidebar Version Link for Sepia Theme */
:root[data-theme="sepia"] .sidebar-version a {
	color: var(--color-muted);
}

:root[data-theme="sepia"] .sidebar-version a:hover {
	color: var(--color-text);
}

/* Sidebar context background color */
:root[data-theme="sepia"] .sidebar-context {
	background-color: var(--color-sidebar-context);
}