/* Theme Name: Tabweb; Theme URI: https://dashandig.plusle.nl; Author: Tabweb; Author URI: https://dashandig.plusle.nl; Description: A clean, modern WordPress theme with a focus on simplicity and readability.; Version: 1.0.0; Requires at least: 5.0; Tested up to: 6.4; Requires PHP: 7.4; License: GNU General Public License v2 or later; License URI: http://www.gnu.org/licenses/gpl-2.0.html; Text Domain: tabweb; Tags: custom-background, custom-logo, custom-menu, featured-images, translation-ready; */

:root { --color-primary: #0073aa; --color-primary-dark: #005177; --color-text: #333; --color-text-light: #666; --color-text-lighter: #555; --color-text-muted: #aaa; --color-bg: #f9f9f9; --color-bg-light: #fff; --color-bg-dark: #333; --color-border: #eee; --color-border-dark: #ddd; --color-border-darker: #444; --color-border-light: #ccc; --spacing-xs: 0.5rem; --spacing-sm: 1rem; --spacing-md: 1.5rem; --spacing-lg: 2rem; --spacing-xl: 3rem; --spacing-xxl: 4rem; --spacing-xxxl: 6rem; --radius-sm: 0.4rem; --radius-md: 0.8rem; --transition-fast: 0.3s ease; --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1); --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.08); }

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { font-size: 10px; scroll-behavior: smooth; }

body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; line-height: 1.6; color: var(--color-text); background-color: var(--color-bg); }

a { color: var(--color-primary); text-decoration: none; transition: color var(--transition-fast); }

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

img { max-width: 100%; height: auto; display: block; }

.tb-site__container { max-width: 1200px; margin: 0 auto; padding: 0 var(--spacing-lg); }

.tb-site__content-area { display: flex; flex-wrap: wrap; gap: var(--spacing-xxl); padding: var(--spacing-xxl) 0; }

.tb-site__main { flex: 1; min-width: 0; }

.tb-site__sidebar { width: 300px; flex-shrink: 0; }

.tb-header { background: var(--color-bg-light); box-shadow: var(--shadow-sm); padding: var(--spacing-lg) 0; position: sticky; top: 0; z-index: 100; }

.tb-header__inner { display: flex; justify-content: space-between; align-items: center; max-width: 1200px; margin: 0 auto; padding: 0 var(--spacing-lg); }

.tb-header__branding { display: flex; align-items: center; gap: var(--spacing-md); }

.tb-header__logo img { max-height: 60px; width: auto; }

.tb-header__title { font-size: 1.5rem; font-weight: 700; margin: 0; }

.tb-header__title a { color: var(--color-text); }

.tb-header__title a:hover { color: var(--color-primary); }

.tb-header__description { font-size: 0.875rem; color: var(--color-text-light); margin: 0; }

.tb-nav__list { display: flex; list-style: none; gap: var(--spacing-xxl); }

.tb-nav__link { color: var(--color-text); font-weight: 500; padding: var(--spacing-sm) 0; position: relative; }

.tb-nav__link:hover, .tb-nav__link--active { color: var(--color-primary); }

.tb-nav__link:hover::after, .tb-nav__link--active::after { width: 100%; }

.tb-nav__link::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--color-primary); transition: width var(--transition-fast); }

.tb-menu-toggle { display: none; background: none; border: none; font-size: 1.5rem; cursor: pointer; padding: var(--spacing-sm); }

.tb-entry__title { font-size: 1.75rem; margin-bottom: var(--spacing-md); line-height: 1.3; }

.tb-entry__title a { color: var(--color-text); }

.tb-entry__title a:hover { color: var(--color-primary); }

.tb-entry__body { font-size: 1rem; line-height: 1.8; }

.tb-entry__body p { margin-bottom: 1.5em; }

.tb-entry__body h2, .tb-entry__body h3, .tb-entry__body h4 { margin-top: 2em; margin-bottom: 1em; }

.tb-entry__body ul, .tb-entry__body ol { margin: 1.5em 0; padding-left: 2em; }

.tb-entry__body li { margin-bottom: 0.5em; }

.tb-entry__body blockquote { border-left: 4px solid var(--color-primary); padding-left: var(--spacing-lg); margin: 1.5em 0; font-style: italic; color: var(--color-text-lighter); }

.tb-button { display: inline-block; background: var(--color-primary); color: var(--color-bg-light); padding: var(--spacing-sm) var(--spacing-lg); border-radius: var(--radius-sm); margin-top: var(--spacing-md); transition: background var(--transition-fast); }

.tb-button:hover { background: var(--color-primary-dark); color: var(--color-bg-light); }

.tb-footer { background: var(--color-bg-dark); color: var(--color-bg-light); padding: var(--spacing-xxl) 0 var(--spacing-lg); margin-top: var(--spacing-xxl); }

.tb-footer__info { text-align: center; padding-top: var(--spacing-lg); border-top: 1px solid var(--color-border-darker); font-size: 0.875rem; color: var(--color-text-muted); }

.tb-error-404 { text-align: center; padding: var(--spacing-xxxl) var(--spacing-lg); }

.tb-error-404__title { font-size: 6rem; color: var(--color-primary); margin-bottom: var(--spacing-lg); }

.tb-error-404__text { font-size: 1.25rem; color: var(--color-text-light); margin-bottom: var(--spacing-xxl); }

.tb-search-form { display: flex; }

.tb-search-form__field { flex: 1; padding: var(--spacing-sm); border: 1px solid var(--color-border-dark); border-radius: var(--radius-sm) 0 0 var(--radius-sm); font-size: 1rem; }

.tb-search-form__submit { background: var(--color-primary); color: var(--color-bg-light); border: none; padding: var(--spacing-sm) var(--spacing-lg); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; cursor: pointer; transition: background var(--transition-fast); }

.tb-search-form__submit:hover { background: var(--color-primary-dark); }

@media (max-width: 992px) { .tb-site__content-area { flex-direction: column; } .tb-site__sidebar { width: 100%; } }

@media (max-width: 768px) { .tb-header__inner { flex-direction: column; gap: var(--spacing-lg); } .tb-entry__title { font-size: 1.5rem; } .tb-menu-toggle { display: block; } .tb-nav { display: none; width: 100%; } .tb-nav--toggled { display: block; } .tb-nav__list { flex-direction: column; gap: 0; } .tb-nav__item { border-bottom: 1px solid var(--color-border); } .tb-nav__link { display: block; padding: var(--spacing-xl) 0; } }

.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }

.align-left { float: left; margin-right: 1.5em; margin-bottom: 1em; }

.align-right { float: right; margin-left: 1.5em; margin-bottom: 1em; }

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

.wp-caption { max-width: 100%; }

.wp-caption-text { font-size: 0.875rem; color: var(--color-text-light); text-align: center; padding: var(--spacing-lg) 0; }