/*
Theme Name: TechQor Super Lite Theme
Theme URI: https://techqor.in
Template: genesis
Author: Krishna Sharma
Author URI: https://www.techqor.in
Text Domain: techqor-super-lite
Description: The industry standard for Premium WordPress Themes.
Tags: one-column, two-columns, three-columns, left-sidebar, right-sidebar, custom-menu, featured-images, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, accessibility-ready
Version: 1.0.0
*/




/* CSS Reset-ish */
*,
*::before,
*::after { box-sizing: border-box; }

/* =====================================
   GLOBAL TYPOGRAPHY SYSTEM (Theme-wide)
   (Fonts are loaded via functions.php enqueue)
===================================== */
:root{
  --tq-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --tq-font-heading: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}

html, body{
  font-family: var(--tq-font-body);
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.widget-title,
.tq-page-title,
.tq-section-title{
  font-family: var(--tq-font-heading);
  letter-spacing: -0.02em;
}

/* =====================================
   Tokens + Dark Mode (No design change)
   - Fixed braces (container jump issue)
===================================== */
:root{
  --tq-header-h: 50px; /* yaha sirf ek baar change */

  /* Light (default) */
  --tq-bg: #ffffff;
  --tq-surface: #ffffff;

  --tq-text: #1e293b;
  --tq-heading: #404040;
  --tq-p: #334155;
  --tq-muted: #64748b;
  --tq-muted-2: #475569;
  --tq-footer: #6b7280;

  --tq-primary: #209cee;
  --tq-primary-dark: #1e40af;

  --tq-link: var(--tq-primary);
  --tq-link-hover: var(--tq-primary-dark);

  --tq-border: #e5e7eb;
  --tq-border-soft: rgba(0,0,0,0.06);

  --tq-code-bg: #f3f4f6;

  --tq-shadow-hover: 0 15px 30px rgba(0,0,0,.08);
}

/* ✅ FIXED: System dark ONLY when user has NOT chosen a theme */
@media (prefers-color-scheme: dark){
  html:not([data-theme]){
    --tq-bg: #07090d;         /* page background (near-black) */
    --tq-surface: #0c1018;    /* cards/sections */

    --tq-text: #e9eef7;       /* main text */
    --tq-heading: #f6f8ff;    /* headings */
    --tq-p: #b7c0d1;          /* paragraph */
    --tq-muted: #8a94a8;      /* meta */
    --tq-muted-2: #9aa4b8;    /* sidebar-ish */
    --tq-footer: #8a94a8;

    --tq-primary: #6d7dff;
    --tq-primary-dark: #9aa6ff;

    --tq-link: var(--tq-primary);
    --tq-link-hover: #c7ceff;

    --tq-border: rgba(255,255,255,0.10);
    --tq-border-soft: rgba(255,255,255,0.07);

    --tq-code-bg: rgba(255,255,255,0.06);

    --tq-shadow-hover: 0 18px 50px rgba(0,0,0,.55);
  }
}

/* Manual override support (agar tum JS se class/attr lagao) */
html[data-theme="dark"],
body.tq-dark{
  --tq-bg: #07090d;
  --tq-surface: #0c1018;

  --tq-text: #e9eef7;
  --tq-heading: #f6f8ff;
  --tq-p: #b7c0d1;
  --tq-muted: #8a94a8;
  --tq-muted-2: #9aa4b8;
  --tq-footer: #8a94a8;

  --tq-primary: #6d7dff;
  --tq-primary-dark: #9aa6ff;

  --tq-link: var(--tq-primary);
  --tq-link-hover: #c7ceff;

  --tq-border: rgba(255,255,255,0.10);
  --tq-border-soft: rgba(255,255,255,0.07);

  --tq-code-bg: rgba(255,255,255,0.06);

  --tq-shadow-hover: 0 18px 50px rgba(0,0,0,.55);
}

/* ✅ ADDED: Manual override FORCE LIGHT (this makes toggle truly switch to light) */
html[data-theme="light"],
body.tq-light{
  --tq-bg: #ffffff;
  --tq-surface: #ffffff;

  --tq-text: #1e293b;
  --tq-heading: #404040;
  --tq-p: #334155;
  --tq-muted: #64748b;
  --tq-muted-2: #475569;
  --tq-footer: #6b7280;

  --tq-primary: #209cee;
  --tq-primary-dark: #1e40af;

  --tq-link: var(--tq-primary);
  --tq-link-hover: var(--tq-primary-dark);

  --tq-border: #e5e7eb;
  --tq-border-soft: rgba(0,0,0,0.06);

  --tq-code-bg: #f3f4f6;

  --tq-shadow-hover: 0 15px 30px rgba(0,0,0,.08);
} /* ✅ important closing brace (container jump fix) */

.site-inner{
  padding-top: var(--tq-header-h);
}

body.admin-bar .tq-header{ top: 32px; }
body.admin-bar .site-inner{
  padding-top: calc(var(--tq-header-h) + 32px);
}
@media (max-width: 782px){
  body.admin-bar .tq-header{ top: 46px; }
  body.admin-bar .site-inner{
    padding-top: calc(var(--tq-header-h) + 46px);
  }
}

img {
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 18px;
}

/* Keep one link rule */
a { color: var(--tq-link); text-decoration: none; }
a:hover { text-decoration: underline; color: var(--tq-link-hover); }

/* =====================================
   Genesis Layout: Content + Sidebar
===================================== */
.content-sidebar-wrap{
  display: flex;
  gap: 30px;
  align-items: flex-start;
}

.content{
  flex: 1 1 auto;
  min-width: 0;
}

.sidebar{
  flex: 0 0 320px;
  width: 320px;
}

.sidebar-content .content-sidebar-wrap{
  flex-direction: row-reverse;
}

.full-width-content .content-sidebar-wrap{
  display: block;
}
.full-width-content .sidebar{
  display: none;
}

@media (max-width: 980px){
  .content-sidebar-wrap{
    flex-direction: column;
  }
  .sidebar{
    width: 100%;
    flex: 0 0 auto;
  }
}

/* ===============================
   MINIMAL CLEAN BLOG STYLE
================================ */
body {
  font-family: var(--tq-font-body);
  font-size: 17px;
  line-height: 1.8;
  color: var(--tq-text);
  background: var(--tq-bg);
}

/* =====================================
   Dark: container background = body background
   (same color everywhere)
===================================== */

/* ✅ FIXED: System dark applies only if user has NOT chosen theme */
@media (prefers-color-scheme: dark){
  html:not([data-theme]){
    --tq-surface: var(--tq-bg); /* ✅ container same as body */
  }
}

/* Manual dark */
html[data-theme="dark"],
body.tq-dark{
  --tq-surface: var(--tq-bg);  /* ✅ container same as body */
}

/* Manual light (optional but safe) */
html[data-theme="light"],
body.tq-light{
  --tq-surface: var(--tq-bg);
}

/* =========================
   Fix: Admin Bar overlap with sticky header
========================= */
body.admin-bar .tq-header{ top: 32px; }
@media (max-width: 782px){
  body.admin-bar .tq-header{ top: 46px; }
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--tq-font-heading);
  font-weight: 700;
  color: var(--tq-heading);
  line-height: 1.25;
  letter-spacing: -0.4px;
  margin-bottom: 16px;
}

.entry-title {
  font-size: 46px;
  font-weight: 800;
  margin-bottom: 20px;
}

p {
  margin-bottom: 22px;
  color: var(--tq-p);
}

.tq-post-meta {
  font-size: 14px;
  color: var(--tq-muted);
  margin-bottom: 20px;
}

.sidebar {
  font-size: 15px;
  color: var(--tq-muted-2);
}

blockquote {
  border-left: 4px solid var(--tq-primary);
  padding-left: 18px;
  color: var(--tq-muted-2);
  font-style: italic;
  margin: 24px 0;
}

.entry-content > * {
  margin-bottom: 24px;
}

@media (max-width: 768px) {
  .entry-title { font-size: 30px; }
  body { font-size: 16px; }
}


.site-header .widget,
.site-header .entry,
.site-header a,
.site-header button {
  transition: none !important;
  transform: none !important;
  box-shadow: none !important;
}

/* Main card area */
body .site-inner{
  max-width: 1200px;
  margin: 24px auto;
  background: var(--tq-surface);
  overflow: visible;
}

body .wrap{
  max-width: 1200px;
  margin: 0 auto;
}

.content { min-width: 0; }

.entry,
.page .entry {
  background: var(--tq-surface);
}

.entry-title {
  margin: 0 0 12px;
  font-size: 30px;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.entry-content p { margin: 0 0 16px; }
.entry-content h2, .entry-content h3 { margin: 24px 0 10px; line-height: 1.3; }

.sidebar .widget {
  background: var(--tq-surface);
  border: 1px solid var(--tq-border);
  border-radius: 14px;
  padding: 16px;
  margin-bottom: 16px;
}

.widget-title {
  margin: 0 0 10px;
  font-size: 15px;
  font-weight: 800;
}

/* Footer */
.site-footer {
  border-top: 1px solid var(--tq-border);
  padding: 18px;
  text-align: center;
  color: var(--tq-footer);
  background: var(--tq-surface);
}

/* Headings scale */
h1 { font-size: 36px; }
h2 { font-size: 28px; }
h3 { font-size: 22px; }

.entry-meta {
  font-size: 13px;
  color: var(--tq-muted);
  margin-bottom: 12px;
}

/* Blog Cards Enhancement */
.blog .entry,
.archive .entry {
  transition: all .25s ease;
}

.blog .entry:hover,
.archive .entry:hover {
  transform: translateY(-4px);
  box-shadow: var(--tq-shadow-hover);
}

/* Gutenberg Blocks */
.wp-block-image {
  margin: 18px 0;
}

.wp-block-quote {
  border-left: 4px solid var(--tq-primary);
  padding-left: 16px;
  font-style: italic;
  color: var(--tq-muted);
}

.wp-block-code {
  background: var(--tq-code-bg);
  padding: 14px;
  border-radius: 12px;
  font-family: monospace;
}

.entry-content a {
  color: var(--tq-primary);
  font-weight: 500;
}

.entry-content a:hover {
  color: var(--tq-primary-dark);
}

/* Logo Styling */
.custom-logo {
  max-height: 50px;
  width: auto;
}

.site-header .wrap {
  align-items: center;
}

.title-area {
  display: flex;
  align-items: center;
}

/* ===============================
   MINIMAL SIDEBAR WIDGET CARDS
================================ */
.sidebar{
  padding-left: 20px;
  padding-top: 20px;
}

.sidebar .widget{
  background: var(--tq-surface);
  padding: 18px 18px;
  margin-bottom: 22px;
  border-radius: 14px;
  border: 1px solid var(--tq-border-soft);
  box-shadow: none;
  transition: none;
}

.sidebar .widget:hover{
  transform: none;
  box-shadow: none;
}

.sidebar .widget-title{
  font-family: var(--tq-font-heading);
  font-size: 16px;
  font-weight: 800;
  color: var(--tq-heading);
  margin: 0 0 14px;
  padding-bottom: 10px;
  position: relative;
}

.sidebar .widget-title::after{
  content: "";
  display: block;
  width: 44px;
  height: 2px;
  margin-top: 10px;
  background: var(--tq-primary);
  border-radius: 999px;
  opacity: .9;
}

.sidebar .widget *{
  line-height: 1.7;
}

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

.sidebar ul li{
  padding: 10px 0;
  margin: 0;
  border-bottom: 1px solid var(--tq-border-soft);
}

.sidebar ul li:last-child{
  border-bottom: 0;
  padding-bottom: 0;
}

.sidebar a{
  color: var(--tq-p);
  text-decoration: none;
  font-size: 15px;
}

.sidebar a:hover{
  color: var(--tq-primary);
}

.sidebar p{
  margin: 0 0 12px;
  font-size: 15px;
  color: var(--tq-muted-2);
}
.sidebar p:last-child{
  margin-bottom: 0;
}

.sidebar .widget_recent_entries li a{
  font-weight: 600;
  display: inline-block;
  margin-bottom: 4px;
}

@media (max-width: 980px){
  .sidebar{
    padding-left: 0;
    margin-top: 34px;
  }
}

.tq-dark-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

#tq-dark-icon svg{
  display:block;
}





/* =========================================
   GLOBAL MAX WIDTH = 1100px
   Applies everywhere (header, content, footer)
========================================= */

body{
  margin: 0;
}

/* Main Genesis container */
.site-inner,
.wrap,
.tq-header-wrap,
.tq-footer-inner,
.ti-footer-widgets .wrap{
  max-width: 1150px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
}

/* Remove old 1200px constraints safely */
body .site-inner,
body .wrap{
  max-width: 1150px !important;
}

/* Optional: make sure no section stretches full-width accidentally */
.content-sidebar-wrap{
  max-width: 100%;
}

/* Mobile full width (no side padding overflow issues) */
@media (max-width: 768px){
  .site-inner,
  .wrap,
  .tq-header-wrap,
  .tq-footer-inner{
    padding-left: 16px;
    padding-right: 16px;
  }
}


