/*
Theme Name: Tech Mentor Civic Lab
Theme URI: https://techmentor.xyz
Author: Tech Mentor
Author URI: https://techmentor.xyz
Description: قالب ووردبريس مخصص لمبادرة تك مينتور، مستوحى من معامل الأمان الرقمي المدنية (Civic Tech Labs). يدعم اللغتين العربية والإنجليزية، وتصنيف تنبيهات الأمان (CVEs)، ومعمارية تشفير PGP من طرف العميل لخط المساعدة مع سرعة فائقة وتوافق كامل مع Gutenberg.
Version: 1.0.3
Requires at least: 6.0
Tested up to: 6.7
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: techmentor
Domain Path: /languages
Tags: block-styles, full-site-editing, custom-colors, custom-menu, featured-images, translation-ready, rtl-language-support
*/

:root {
  --tm-paper: #faf8f5;
  --tm-paper-card: #ffffff;
  --tm-ink: #18181b;
  --tm-ink-muted: #52525b;
  --tm-amber: #f59e0b;
  --tm-amber-light: #fef3c7;
  --tm-amber-hover: #d97706;
  --tm-crimson: #e11d48;
  --tm-crimson-light: #ffe4e6;
  --tm-crimson-hover: #be123c;
  --tm-emerald: #10b981;
  --tm-emerald-light: #d1fae5;
  --tm-border-dark: #18181b;
  --tm-border-light: #e4e4e7;
  --tm-font-heading: 'Alexandria', system-ui, -apple-system, sans-serif;
  --tm-font-body: 'IBM Plex Sans Arabic', system-ui, -apple-system, sans-serif;
  --tm-font-mono: 'Space Grotesk', ui-monospace, SFMono-Regular, monospace;
}

/* Base resets & typography */
html {
  box-sizing: border-box;
  scroll-behavior: smooth;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
  margin: 0;
  padding: 0;
  background-color: var(--tm-paper);
  color: var(--tm-ink);
  font-family: var(--tm-font-body);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.font-display {
  font-family: var(--tm-font-heading);
  font-weight: 800;
  line-height: 1.25;
  color: var(--tm-ink);
  margin-top: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

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

/* Neo-Brutalist Utility Classes */
.box-brutal {
  background-color: var(--tm-paper-card);
  border: 2px solid var(--tm-ink);
  box-shadow: 4px 4px 0px 0px var(--tm-ink);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.box-brutal:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0px 0px var(--tm-ink);
}

.box-brutal-static {
  background-color: var(--tm-paper-card);
  border: 2px solid var(--tm-ink);
  box-shadow: 4px 4px 0px 0px var(--tm-ink);
}

.btn-brutal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.65rem 1.25rem;
  font-family: var(--tm-font-heading);
  font-weight: 700;
  font-size: 0.875rem;
  border: 2px solid var(--tm-ink);
  box-shadow: 3px 3px 0px 0px var(--tm-ink);
  cursor: pointer;
  transition: all 0.15s ease;
  text-decoration: none;
}

.btn-brutal:hover {
  transform: translate(-1px, -1px);
  box-shadow: 5px 5px 0px 0px var(--tm-ink);
}

.btn-brutal:active {
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0px 0px var(--tm-ink);
}

.btn-brutal:disabled,
.btn-brutal[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
  box-shadow: 2px 2px 0px 0px var(--tm-ink);
}

.btn-primary {
  background-color: var(--tm-ink);
  color: #ffffff;
}

.btn-primary:hover {
  background-color: #27272a;
  color: #ffffff;
}

.btn-accent {
  background-color: var(--tm-amber);
  color: #000000;
}

.btn-accent:hover {
  background-color: var(--tm-amber-hover);
  color: #ffffff;
}

.btn-danger {
  background-color: var(--tm-crimson);
  color: #ffffff;
}

.btn-danger:hover {
  background-color: var(--tm-crimson-hover);
  color: #ffffff;
}

.btn-white {
  background-color: #ffffff;
  color: var(--tm-ink);
}

.btn-white:hover {
  background-color: #f4f4f5;
}

/* Badges & Tags */
.badge-brutal {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem 0.6rem;
  font-family: var(--tm-font-mono);
  font-size: 0.75rem;
  font-weight: 700;
  border: 1.5px solid var(--tm-ink);
  background-color: var(--tm-paper);
}

.badge-critical {
  background-color: var(--tm-crimson-light);
  color: var(--tm-crimson-hover);
  border-color: var(--tm-crimson);
}

.badge-high {
  background-color: var(--tm-amber-light);
  color: #92400e;
  border-color: var(--tm-amber);
}

.badge-advisory {
  background-color: var(--tm-emerald-light);
  color: #065f46;
  border-color: var(--tm-emerald);
}

/* Accessibility Skip Link */
.skip-link {
  position: absolute;
  top: -100px;
  right: 1rem;
  background: var(--tm-ink);
  color: #ffffff;
  padding: 0.75rem 1.25rem;
  border: 2px solid #ffffff;
  z-index: 9999;
  font-weight: 700;
  transition: top 0.2s ease;
}

.skip-link:focus {
  top: 1rem;
}

/* WordPress Core Elements */
.alignwide {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Gutenberg block styling integration */
.entry-content {
  line-height: 1.8;
  font-size: 1.05rem;
}

.entry-content p {
  margin-bottom: 1.5rem;
}

.entry-content blockquote {
  border-right: 4px solid var(--tm-amber);
  margin: 1.5rem 0;
  padding: 0.75rem 1.5rem;
  background-color: var(--tm-amber-light);
  font-style: italic;
}

.entry-content pre,
.entry-content code {
  font-family: var(--tm-font-mono);
  background-color: #27272a;
  color: #f4f4f5;
  border-radius: 4px;
}

.entry-content pre {
  padding: 1rem;
  overflow-x: auto;
  border: 2px solid var(--tm-ink);
}

.entry-content code {
  padding: 0.2rem 0.4rem;
  font-size: 0.9em;
}

/* Screen reader only */
.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 !important;
  width: 1px;
  word-wrap: normal !important;
}