/*
Theme Name: iNove TNG
Theme URI: https://imranchaudhry.com/inove-tng
Description: A faithful modern recreation of the classic iNove theme (2009) by mg12/NeoEase. Two-column fixed-width layout with right sidebar, original image sprites, and the authentic iNove colour palette — rebuilt for WordPress 6.x by Imran Chaudhry.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.9
Author: Imran Chaudhry
Author URI: https://imranchaudhry.com
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: inove-tng
Tags: blog, two-columns, right-sidebar, custom-menu, custom-logo, featured-images, translation-ready, accessibility-ready

== Bundled third-party resources ==

iNove 1.4.6 images (img/ directory)
Copyright: mg12 / NeoEase
Source: https://www.neoease.com
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* ============================================================
   CSS CUSTOM PROPERTIES  (iNove colour palette)
   ============================================================ */
:root {
	--color-body-bg:        #BEC3C6;
	--color-container-bg:   #FFFFFF;
	--color-header-from:    #3C4158;
	--color-header-to:      #252B3A;
	--color-nav-bg:         #FFFFFF;
	--color-nav-border:     #A6A6A6;
	--color-nav-text:       #382E1F;
	--color-nav-hover-bg:   #EDEFF0;
	--color-nav-active-bg:  #E0E0DB;
	--color-content-bg:     #FFFFFF;
	--color-sidebar-bg:     #F7F7F7;
	--color-sep:            #A6A6A6;
	--color-text:           #555555;
	--color-heading:        #4C4C4C;
	--color-link:           #2970A6;
	--color-border:         #CCCCCC;
	--color-border-dark:    #A6A6A6;
	--color-box-head-bg:    #E3E4E6;
	--color-box-body-bg:    #F4F5F7;
	--color-meta-bg:        #EDEFF0;
	--color-footer-bg:      #E8E8E4;
	--color-footer-text:    #2A2A2A;
	--color-submit-bg:      #B4D666;
	--color-submit-border:  #81B840;
	--color-submit-hover:   #98C64C;
	--color-notice-text:    #006600;
	--color-error-bg:       #EDEFF0;

	--font-body:   Verdana, "Bitstream Vera Sans", Tahoma, Helvetica, sans-serif;
	--font-head:   Arial, "Helvetica Neue", Helvetica, sans-serif;
	--font-size:   12px;

	--container-width: 936px;
	--main-width:      635px;   /* 605 content + 15px padding each side */
	--sidebar-width:   301px;
}

/* ============================================================
   0. RESET
   ============================================================ */
*,
*::before,
*::after {
	box-sizing: border-box;
}

body, div, dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, blockquote, p {
	margin: 0;
	padding: 0;
}

abbr[title],
acronym[title] {
	border-bottom: thin dotted;
	cursor: help;
}

img {
	border: 0;
	max-width: 100%;
	height: auto;
}

/* ============================================================
   1. DOCUMENT / BODY
   ============================================================ */
html {
	font-size: var(--font-size);
	scroll-behavior: smooth;
}

body {
	background: #BEC3C6 url(img/bg.jpg) repeat-x;
	color: var(--color-text);
	font-family: var(--font-body);
	font-size: var(--font-size);
	line-height: 1.5;
}

/* ============================================================
   2. TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-head);
	font-weight: bold;
	letter-spacing: -0.05em;
	color: var(--color-heading);
}

h1 { font-size: 200%; }
h2 { font-size: 170%; }
h3 { font-size: 150%; }
h4 { font-size: 130%; }
h5 { font-size: 110%; }
h6 { font-size: 100%; }

p { margin-bottom: 10px; }

small { font-size: 10px; }

a {
	color: var(--color-link);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

blockquote,
pre {
	background: #F4F5F7 url(img/blockquote.gif) 3px 3px no-repeat;
	border: 1px dashed var(--color-border);
	padding: 8px 12px 8px 36px;
	margin: 5px 0;
}

/* ============================================================
   3. HELPER / UTILITY CLASSES  (original iNove kept)
   ============================================================ */
.alignleft {
	float: left;
	text-align: left;
	margin-right: 10px;
}

.alignright {
	float: right;
	text-align: right;
	margin-left: 10px;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.fixed,
.clear,
.clearfix::after {
	clear: both;
}

.clearfix::after {
	content: "";
	display: block;
}

.floatleft  { float: left; }
.floatright { float: right; }

img.sided {
	background: #FFF;
	border: 2px solid #CCC;
	padding: 3px;
}

a:hover img.sided {
	border-color: var(--color-border-dark);
}

/* ============================================================
   4. WORDPRESS CORE CLASSES
   ============================================================ */

/* Required WordPress classes */
.sticky {
	border-left: 3px solid var(--color-link);
	padding-left: 12px;
}

.bypostauthor > .comment .info {
	border-left: 2px solid var(--color-link);
}

.gallery-caption {
	display: block;
	font-size: 11px;
	color: #888;
	padding: 2px 5px 0;
	text-align: center;
}

.wp-caption {
	background: #F7F7F7;
	border: 1px solid var(--color-border);
	padding: 5px 0;
	margin-bottom: 5px;
	text-align: center;
	max-width: 100%;
}

.wp-caption img {
	margin: 0 5px;
}

.wp-caption-text {
	text-align: center;
	padding: 3px 5px 0;
}

.more-link {
	font-size: 11px;
}

.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	clip: auto;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

.skip-link:focus {
	clip: auto;
	height: auto;
	overflow: visible;
	position: fixed;
	width: auto;
	z-index: 100000;
}

/* ============================================================
   5. PAGE LAYOUT  (#wrap → #container)
   ============================================================ */
#wrap {
	background: url(img/light.gif) center top no-repeat;
	padding: 20px 0;
}

#container {
	margin: 0 auto;
	width: var(--container-width);
	background: var(--color-container-bg);
}

/* ============================================================
   6. HEADER
   ============================================================ */
#header {
	background: url(img/header.jpg) 0 0 no-repeat;
	height: 90px;
	border-bottom: 1px solid var(--color-nav-border);
	overflow: hidden;
	position: relative;
}

#caption {
	padding: 22px 30px 0;
	float: left;
}

#title a {
	text-decoration: none;
	color: #FFFFFF;
	font-family: "Trajan Pro", "Palatino Linotype", Georgia, serif;
	font-size: 22px;
	font-weight: bold;
	letter-spacing: 0;
	display: block;
	line-height: 1.2;
}

#title a:hover {
	text-decoration: none;
	color: #D8E8FF;
}

#tagline {
	color: #FFFFFF;
	border-top: 1px solid rgba(255,255,255,0.5);
	font-size: 10px;
	float: left;
	padding: 2px 3px;
	margin-top: 4px;
	opacity: 0.85;
}

#header .banner {
	float: right;
	padding: 15px 15px 0;
	color: #999;
}

/* ============================================================
   7. NAVIGATION BAR
   ============================================================ */
#navigation {
	background: var(--color-nav-bg);
	border-bottom: 1px solid var(--color-nav-border);
	overflow: hidden;          /* clearfix */
}

/* Menu list */
#menus {
	float: left;
	margin: 0;
	padding: 0;
	list-style: none;
}

#menus li {
	display: inline;
	list-style: none;
	float: left;
}

#menus li a {
	display: block;
	float: left;
	color: var(--color-nav-text);
	height: 31px;
	line-height: 31px;
	padding: 0 20px;
	margin-left: -10px;
	text-decoration: none;
	font-size: 11px;
	background: transparent url(img/menu.gif) no-repeat;
	position: relative;
	z-index: 1;
}

#menus li a:hover,
#menus li a.current {
	background-position: 0 -31px;
	color: #1A1A10;
	text-decoration: none;
}

/* Current page / category */
#menus li.current_page_item > a,
#menus li.current-cat > a,
#menus li.current-menu-item > a {
	background-position: 0 -62px;
	color: #1A1A10;
	font-weight: bold;
}

/* Home link: sprite */
#menus li a.home {
	width: 45px;
	padding: 0;
	text-indent: -999em;
	overflow: hidden;
	background-position: 0 -93px;
}

#menus li a.home:hover {
	background-position: 0 -124px;
}

#menus li.current_page_item a.home,
#menus li.current-menu-item a.home {
	background-position: 0 -155px;
}

#menus li a.lastmenu:hover {
	background-position: 0 0;
	cursor: default;
}

/* Submenu */
#menus li ul {
	display: none;
	background: var(--color-box-body-bg);
	border: solid var(--color-nav-border);
	border-width: 1px 1px 0;
	position: absolute;
	z-index: 100;
	top: 31px;
	left: 0;
	min-width: 160px;
}

#menus li {
	position: relative;
}

#menus li:hover > ul {
	display: block;
}

#menus li li {
	float: none;
	margin: 0;
	padding: 0;
}

#menus li li a {
	float: none;
	padding: 7px 18px 7px 10px;
	border-bottom: 1px solid #DDD;
	border-right: none;
	background: none;
	height: auto;
	line-height: 1.45;
	color: #888;
	display: block;
	width: 100%;
}

#menus li li a:hover,
#menus li li a.current {
	background: var(--color-nav-hover-bg);
	color: var(--color-nav-text);
}

/* Dropdown arrow indicator */
#menus li li a.subtitle::after {
	content: " ›";
}

/* Search box – right-floated in the nav bar */
#searchbox {
	float: right;
	margin: 5px 10px 0 0;
	background: url(img/searchbox.gif) no-repeat;
	width: 209px;
	height: 21px;
	padding: 3px 2px;
}

#searchbox .textfield {
	background: none;
	border: 0;
	outline: none;
	width: 185px;
	font-size: 11px;
	font-family: var(--font-body);
	color: var(--color-text);
	padding: 0 2px;
}

#searchbox .textfield::placeholder {
	color: #999;
}

#searchbox .button {
	background: none;
	border: 0;
	width: 18px;
	height: 18px;
	cursor: pointer;
	padding: 0;
	vertical-align: middle;
}

/* ============================================================
   8. CONTENT AREA  (main + sidebar side by side)
   ============================================================ */
#content {
	background: #FFF url(img/sidesep.gif) right repeat-y;
	min-height: 400px;
	overflow: hidden;
}

/* ============================================================
   9. MAIN CONTENT COLUMN
   ============================================================ */
#main {
	width: var(--main-width);
	padding: 13px 15px 15px;
	float: left;
	overflow: hidden;
	background: #FFF url(img/main_shadow.gif) top repeat-x;
}

/* ============================================================
   10. POSTS
   ============================================================ */
#notice {
	color: var(--color-notice-text);
}

#notice a {
	text-decoration: underline;
}

.post {
	padding-bottom: 15px;
}

.post h2 {
	display: block;
	margin-top: 10px;
	border-bottom: 1px solid var(--color-border);
	padding: 0 5px 3px;
	font-size: 16px;
	font-family: Verdana, "Bitstream Vera Sans", sans-serif;
	letter-spacing: 0;
}

.post h2 a.title {
	text-decoration: none;
	color: var(--color-heading);
}

.post h2 a.title:hover {
	color: var(--color-link);
}

/* --- Post meta (info bar) ---------------------------------- */
.post .info {
	margin: 5px;
	font-size: 11px;
}

/* Shared icon-link style */
.post .date,
.post .author,
.post .editpost,
.post .comments,
.post .addcomment,
.post .addlink,
.post .editlinks {
	padding-left: 22px;
	height: 16px;
	line-height: 16px;
	display: block;
	font-size: 11px;
	background: url(img/icons.gif) no-repeat;
}

/* Sprite y-offsets for each post meta icon */
.post .author     { background-position: 0 0; }
.post .date       { background-position: 0 -48px; }
.post .editpost   { background-position: 0 -64px; }
.post .comments   { background-position: 0 -96px; }
.post .addcomment { background-position: 0 -112px; }
.post .addlink    { background-position: 0 -176px; }
.post .editlinks  { background-position: 0 -192px; }

.post .date {
	margin-right: 15px;
	float: left;
}

.post .author {
	float: left;
}

.post .editpost {
	margin-left: 15px;
	float: right;
}

.post .comments {
	float: right;
}

.post .addcomment {
	margin-left: 15px;
	float: right;
}

/* Categories / tags icons */
.post .tags,
.post .categories {
	background: url(img/icons.gif) no-repeat;
	width: 16px;
	height: 16px;
	line-height: 16px;
	display: inline-block;
	overflow: hidden;
	text-indent: -999em;
	vertical-align: middle;
	margin-right: 4px;
}

.post .tags       { background-position: 0 -400px; }
.post .categories { background-position: 0 -480px; }

.post .act {
	height: 16px;
	float: right;
}

.post .act span {
	float: left;
	margin-left: 15px;
}

/* --- Post body -------------------------------------------- */
.post .content {
	padding: 5px 0 0 5px;
	line-height: 1.45;
	overflow: hidden;
}

.post .content p {
	margin-bottom: 10px;
}

.post .content h4 {
	color: #006600;
	margin-bottom: 10px;
}

.post .content ul,
.post .content ol {
	padding-bottom: 10px;
}

.post .content ul li,
.post .content ol li {
	list-style-position: inside;
	padding-left: 20px;
}

.post .content table {
	background: #FFF;
	border: 2px solid var(--color-border);
	border-collapse: collapse;
	margin: 5px 0 10px;
}

.post .content th,
.post .content td {
	border: 1px solid var(--color-border);
	padding: 3px 10px;
	text-align: left;
	vertical-align: top;
}

.post .content tr:nth-child(even) td {
	background: #F7F7F7;
}

.post .content th {
	background: var(--color-meta-bg);
}

/* --- Post footer (categories / tags) ---------------------- */
.post .under {
	height: 16px;
	line-height: 16px;
	font-size: 11px;
	margin-bottom: 10px;
}

.post .under span {
	float: left;
	margin-right: 15px;
}

/* --- Post thumbnail --------------------------------------- */
.post .featured-image {
	margin-bottom: 10px;
}

.post .featured-image img {
	width: 100%;
	height: auto;
}

/* ============================================================
   11. BREADCRUMB / POSTPATH
   ============================================================ */
#postpath {
	background: url(img/icons.gif) 0 -320px no-repeat;
	line-height: 16px;
	margin: 5px 0;
	padding-left: 22px;
	font-size: 11px;
	color: #888;
}

#postpath a {
	color: var(--color-link);
}

/* ============================================================
   12. PAGINATION
   ============================================================ */
#pagenavi,
#postnavi {
	border-top: 1px solid var(--color-border);
	margin: 10px -5px 0;
	padding: 10px 5px 0;
	overflow: hidden;
}

#pagenavi {
	font-size: 11px;
}

/* wp-pagenavi plugin styling */
.wp-pagenavi {
	font-size: 11px;
}

.wp-pagenavi a,
.wp-pagenavi span {
	padding: 3px 6px;
	border: 1px solid var(--color-border);
	margin: 0 1px;
	text-decoration: none;
}

.wp-pagenavi a:hover {
	background: var(--color-box-body-bg);
}

.wp-pagenavi span.current {
	background: var(--color-meta-bg);
	border-color: var(--color-border-dark);
	font-weight: bold;
}

#pagenavi .newer a,
#postnavi .prev a {
	background: url(img/icons.gif) 0 -224px no-repeat;
	padding-left: 22px;
	float: left;
	height: 16px;
	line-height: 16px;
}

#pagenavi .older a,
#postnavi .next a {
	background: url(img/icons.gif) 100% -240px no-repeat;
	padding-right: 22px;
	float: right;
	height: 16px;
	line-height: 16px;
}

/* ============================================================
   13. BOX / WIDGET CHROME  (replaces box.gif)
   ============================================================ */
.boxcaption {
	background: #E3E4E6 url(img/box.gif) 0 0 no-repeat;
	padding: 6px 12px;
	border-bottom: 1px solid var(--color-border);
}

.boxcaption h3 {
	font-size: 12px;
	font-family: var(--font-body);
	letter-spacing: 0;
	color: var(--color-heading);
}

.box {
	background: #F4F5F7 url(img/box.gif) 100% 100% no-repeat;
	padding: 8px 12px;
	margin-bottom: 10px;
}

/* Message / error boxes */
.messagebox,
.errorbox {
	background: #EDEFF0 url(img/messagebox.gif) no-repeat;
	padding: 0 12px;
	height: 27px;
	line-height: 27px;
	font-size: 11px;
}

/* ============================================================
   14. SIDEBAR
   ============================================================ */
#sidebar {
	background: #F7F7F7 url(img/sidebar_shadow.gif) top repeat-x;
	width: var(--sidebar-width);
	float: right;
	font-size: 95%;
	line-height: 1.45;
	overflow: hidden;
	padding-top: 8px;
}

#sidebar ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

#sidebar li {
	background: url(img/icons.gif) 0 -560px no-repeat;
	padding-left: 22px;
	list-style: none;
	margin-top: 5px;
	font-size: 12px;
}

/* Widget chrome */
.widget {
	background: url(img/widgetsep.png) bottom no-repeat;
	padding: 10px 15px 16px;
}

.widget:last-child {
	border-bottom: none;
}

.widget h2,
.widget h3 {
	font-size: 13px;
	font-family: var(--font-body);
	letter-spacing: 0;
	color: var(--color-heading);
	margin-bottom: 8px;
	padding-bottom: 4px;
	border-bottom: 1px solid var(--color-border);
}

.widget .content p {
	margin-bottom: 10px;
}

/* Feed subscribe block */
.widget_feeds {
	padding: 5px 15px 15px;
}

#feedrss {
	display: inline-block;
	padding: 3px 8px 3px 24px;
	font-size: 11px;
	text-decoration: none;
	color: var(--color-text);
	background: url(img/feeds.gif) 5px 5px no-repeat;
	margin-right: 6px;
	margin-top: 4px;
}

#feedemail {
	display: inline-block;
	padding: 3px 8px 3px 24px;
	font-size: 11px;
	text-decoration: none;
	color: var(--color-text);
	background: url(img/feeds.gif) 5px -45px no-repeat;
	margin-right: 6px;
	margin-top: 4px;
}

#feedrss:hover,
#feedemail:hover {
	text-decoration: none;
}

/* Tag cloud */
#tag_cloud a {
	line-height: 1.3;
}

/* ============================================================
   15. FOOTER
   ============================================================ */
#footer {
	background: url(img/footer.jpg) 0 0 no-repeat;
	display: block;
	border-top: 1px solid var(--color-border);
	font-size: 11px;
	line-height: 1.45;
	width: 100%;
	padding: 10px 0 8px;
	overflow: hidden;
}

#footer a {
	color: var(--color-footer-text);
}

#footer a:hover {
	text-decoration: underline;
}

#copyright {
	margin-left: 20px;
}

#themeinfo {
	margin-left: 20px;
	color: #888;
}

a#powered {
	display: block;
	float: left;
	margin: 2px 10px 0 10px;
	background: url(img/wp-logo.png) no-repeat;
	width: 92px;
	height: 57px;
	text-indent: -999em;
	overflow: hidden;
}

a#gotop {
	background: url(img/icons.gif) 0 -304px no-repeat;
	float: right;
	height: 16px;
	line-height: 16px;
	display: block;
	padding-left: 20px;
	margin: 2px 15px 0 0;
	text-decoration: none;
	color: var(--color-footer-text);
}

/* ============================================================
   16. COMMENTS
   ============================================================ */
#commentlist {
	background: #FCFCFC;
	border-top: 1px solid var(--color-border);
	border-bottom: 1px solid var(--color-border);
	margin: 0 -15px;
	padding: 0 15px;
}

#commentlist ol,
#commentlist li {
	list-style: none;
}

/* Comment / trackback tab switcher */
#cmtswitcher {
	background: #FFF;
	font-size: 10px;
	padding-top: 5px;
	overflow: hidden;
}

#cmtswitcher a.tab,
#cmtswitcher a.curtab {
	padding: 5px 10px;
	margin-bottom: -1px;
	display: block;
	float: right;
	color: #555;
	text-decoration: none;
}

#cmtswitcher a.tab {
	border: 1px solid #FFF;
	border-bottom-color: var(--color-border);
}

#cmtswitcher a.curtab {
	background: #FCFCFC;
	border: 1px solid var(--color-border);
	border-bottom-color: #FCFCFC;
}

.addcomment {
	background: url(img/icons.gif) 0 -112px no-repeat;
	padding-left: 22px;
	height: 16px;
	line-height: 16px;
	display: block;
	font-size: 11px;
	float: left;
	margin-right: 15px;
	margin-top: 3px;
}

.addtrackback {
	background: url(img/icons.gif) 0 -144px no-repeat;
	padding-left: 22px;
	height: 16px;
	line-height: 16px;
	display: block;
	font-size: 11px;
	float: left;
	margin-right: 15px;
	margin-top: 3px;
}

#thecomments,
#thetrackbacks {
	padding-bottom: 15px;
}

#thecomments .comment,
#thecomments .messagebox {
	margin-top: 15px;
}

/* Individual comment layout */
.comment .author {
	float: left;
	width: 81px;
	text-align: center;
}

.comment .pic {
	background: url(img/commentpoint.png) 100% 33% no-repeat;
	padding-right: 14px;
	margin-top: 10px;
}

.comment .name {
	width: 67px;
	padding-right: 14px;
	font-weight: bold;
	overflow: hidden;
	word-wrap: break-word;
}

.comment .avatar {
	padding: 1px;
	border: 1px solid #999;
	max-width: 67px;
	height: auto;
}

.comment .info {
	background: #EDEFF0 url(img/comment.gif) 0 0 no-repeat;
	float: left;
	padding: 10px 15px 0;
	width: calc(100% - 81px);
}

.comment .date,
.trackback .date {
	float: left;
	font-size: 10px;
}

.comment .act,
.trackback .act {
	float: right;
	font-size: 10px;
}

.comment .content {
	background: url(img/comment.gif) 100% 100% no-repeat;
	margin: 0 -15px;
	padding: 0 15px 10px;
	line-height: 1.45;
	overflow: hidden;
}

.comment .content p {
	margin-top: 10px;
}

.comment .content blockquote p {
	margin-top: 0;
	margin-bottom: 10px;
}

/* Admin comments flip sides */
.admincomment .author {
	float: right;
}

.admincomment .pic {
	background-position: 0% 33%;
}

.admincomment .name {
	padding-right: 0;
	padding-left: 14px;
}

.admincomment .info {
	float: right;
}

#comment_login {
	margin-top: 15px;
}

#thetrackbacks {
	display: none;
}

#thetrackbacks li {
	margin-top: 15px;
}

.trackback {
	background: var(--color-meta-bg);
	padding: 10px 15px 0;
}

.trackback .title {
	background: var(--color-meta-bg);
	padding: 0 15px 10px;
	margin: 0 -15px;
}

/* Comment pagination */
#commentnavi {
	background: #EDEFF0 url(img/box.gif) 0 0 no-repeat;
	padding: 10px 15px;
	font-size: 11px;
}

#commentnavi a.page-numbers {
	padding: 5px 7px;
	text-decoration: none;
	border: 1px solid var(--color-meta-bg);
	margin: 0 -2px;
}

#commentnavi a.page-numbers:hover {
	background: #F7F7F7;
	border: 1px solid var(--color-border);
}

#commentnavi span.pages {
	background: url(img/icons.gif) 0 -272px no-repeat;
	padding: 0 7px 0 22px;
	height: 16px;
	line-height: 16px;
	float: left;
}

#commentnavi span.current {
	background: #F7F7F7;
	padding: 5px 7px;
	border: 1px solid #F7F7F7;
	font-weight: bold;
	margin: 0 -2px;
}

/* Comment form */
#respond {
	padding: 10px 0 0;
	font-size: 11px;
}

#respond .row {
	margin-bottom: 5px;
}

input[type="text"],
input[type="email"],
input[type="url"],
textarea {
	background: #FFF url(img/textfield.gif) top repeat-x;
	border: 1px solid var(--color-border-dark);
	padding: 3px 4px;
	font-size: 12px;
	font-family: var(--font-body);
	color: var(--color-text);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
textarea:focus {
	outline: none;
	border-color: var(--color-link);
	box-shadow: 0 0 3px rgba(41,112,166,0.3);
}

#respond .textfield {
	width: 200px;
}

#comment {
	width: 100%;
	max-width: 601px;
}

#submitbox #submit,
#commentform input[type="submit"] {
	padding: 4px 10px;
	background: var(--color-submit-bg);
	border-top: 1px solid var(--color-submit-bg);
	border-right: 1px solid var(--color-submit-border);
	border-bottom: 1px solid var(--color-submit-border);
	border-left: 1px solid var(--color-submit-bg);
	color: var(--color-link);
	font-size: 11px;
	cursor: pointer;
	font-family: var(--font-body);
}

#submitbox #submit:hover,
#commentform input[type="submit"]:hover {
	background: var(--color-submit-hover);
	border-color: #76B33A;
	color: #074A7E;
}

#submitbox .submitbutton {
	float: right;
}

#submitbox a.feed {
	background: url(img/icons.gif) 0 -256px no-repeat;
	padding-left: 22px;
	height: 16px;
	line-height: 16px;
	display: block;
	float: left;
	font-size: 11px;
}

/* ============================================================
   17. CALENDAR WIDGET
   ============================================================ */
.widget_calendar h3 {
	display: none;
}

#wp-calendar {
	width: 100%;
}

#wp-calendar #today {
	background: #E6E6E6;
}

#wp-calendar tbody a {
	font-weight: bold;
}

#wp-calendar caption {
	font-family: var(--font-head);
	font-weight: bold;
	letter-spacing: -0.05em;
	font-size: 150%;
	text-align: left;
	padding-bottom: 5px;
}

#wp-calendar th,
#wp-calendar td {
	text-align: center;
}

#wp-calendar tbody td {
	border: 1px solid var(--color-border);
}

#wp-calendar tbody td.pad {
	border: 0 none;
}

#wp-calendar th {
	background: #999;
	color: #FFF;
}

#wp-calendar td#prev {
	text-align: left;
	padding-top: 5px;
}

#wp-calendar td#next {
	text-align: right;
	padding-top: 5px;
}

/* ============================================================
   18. ONE-COLUMN LAYOUT  (sidebar hidden)
   ============================================================ */
.one-column #content {
	background-image: none;
}

/* Post-body box chrome uses postbox.gif (narrower than box.gif) */
.post .content .boxcaption { background-image: url(img/postbox.gif); }
.post .content .box        { background-image: url(img/postbox.gif); }

.one-column #main {
	width: 100%;
	float: none;
}

.one-column #comment {
	max-width: 100%;
}

.one-column .comment .info {
	width: calc(100% - 81px);
}

/* One-column image overrides */
.one-column .boxcaption,
.one-column .box,
.one-column .trackback,
.one-column .trackback .title,
.one-column #commentnavi,
.one-column #related_posts h3,
.one-column #related_posts ul    { background-image: url(img/box_1col.gif); }

.one-column .messagebox,
.one-column .errorbox            { background-image: url(img/messagebox_1col.gif); }

.one-column .post .content .boxcaption,
.one-column .post .content .box  { background-image: url(img/postbox_1col.gif); }

.one-column .comment .info,
.one-column .comment .content    { background-image: url(img/comment_1col.gif); }

/* ============================================================
   19. ARCHIVE HEADER
   ============================================================ */
.archive-header {
	padding: 10px 5px 5px;
	border-bottom: 1px solid var(--color-border);
	margin-bottom: 5px;
}

.archive-title {
	font-size: 16px;
	font-family: var(--font-body);
	letter-spacing: 0;
}

.archive-subtitle {
	font-size: 11px;
	color: #888;
	margin-top: 4px;
}

/* ============================================================
   20. SINGLE POST – BREADCRUMB / POSTNAVI
   ============================================================ */
#postnavi .prev a,
#postnavi .next a {
	font-size: 11px;
	height: 16px;
	line-height: 16px;
}

/* ============================================================
   21. SEARCH RESULTS
   ============================================================ */
.search-results .post h2 a::before {
	content: "» ";
	color: #999;
}

/* ============================================================
   22. 404 PAGE
   ============================================================ */
.error404 #main {
	text-align: center;
	padding: 40px 15px;
}

.error404 h1 {
	font-size: 60px;
	color: #CCC;
}

/* ============================================================
   23. RELATED POSTS
   ============================================================ */
#related_posts {
	padding-bottom: 10px;
}

#related_posts h3 {
	background: #E3E4E6 url(img/box.gif) 0 0 no-repeat;
	font-size: 12px;
	padding: 6px 12px;
	font-family: var(--font-body);
	letter-spacing: 0;
	border-bottom: 1px solid var(--color-border);
}

#related_posts ul {
	background: #F4F5F7 url(img/box.gif) 100% 100% no-repeat;
	padding: 3px 12px 8px;
}

#related_posts ul li {
	list-style: none;
	padding: 3px 5px;
	border-bottom: 1px solid var(--color-box-head-bg);
	line-height: 18px;
}

#related_posts .count {
	font-size: 10px;
}

#related_posts .excerpt {
	color: #999;
	font-size: 11px;
	display: block;
}

/* ============================================================
   24. RESPONSIVE BREAKPOINTS
   ============================================================ */
@media (max-width: 960px) {
	#container {
		width: 100%;
	}

	#main {
		width: 66%;
	}

	#sidebar {
		width: 34%;
	}
}

@media (max-width: 640px) {
	#content {
		background-image: none;
	}

	#main {
		width: 100%;
		float: none;
	}

	#sidebar {
		width: 100%;
		float: none;
		border-top: 1px solid var(--color-border);
	}

	#menus {
		flex-wrap: wrap;
	}

	#menus li a {
		height: auto;
		line-height: 2;
	}

	#searchbox {
		float: none;
		margin: 0;
		background: none;
		width: 100%;
		height: auto;
		padding: 4px 8px;
	}

	#searchbox .textfield {
		width: calc(100% - 24px);
	}
}

/* ============================================================
   25. BLOCK EDITOR COMPATIBILITY  (minimal)
   ============================================================ */
.wp-block-image img {
	height: auto;
	max-width: 100%;
}

.wp-block-quote {
	background: #F4F5F7 url(img/blockquote.gif) 3px 3px no-repeat;
	border: 1px dashed var(--color-border);
	padding: 8px 12px 8px 36px;
	margin: 5px 0;
}

.wp-block-code,
.wp-block-preformatted {
	background: var(--color-box-body-bg);
	border: 1px dashed var(--color-border);
	padding: 8px 12px;
	margin: 5px 0;
	font-size: 11px;
	overflow-x: auto;
}