/*
Theme Name: Divineesoft Blogs
Theme URI: https://divineesoft.com
Author: Muhammad Arslan Mustafa
Author URI: https://www.marslanmustafa.com, marslanmustafa391@gmail.com
Description: A premium, highly customizable, and high-performance blog theme built for DivineeSoft Technology.
Version: 1.0.0
Text Domain: divineesoft-blogs
*/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

:root {
  --radius: 0.625rem;
  --font-montserrat: 'Montserrat', sans-serif;

  /* Background Colors */
  --background: #FFFFFF;
  --foreground: #2D3E50;
  /* Body text */

  --card: #FFFFFF;
  --card-foreground: #2D3E50;

  --popover: #FFFFFF;
  --popover-foreground: #2D3E50;

  /* Primary - DivineeSoft Blue */
  --primary: #4A90D9;
  --primary-foreground: #FFFFFF;

  /* Secondary - DivineeSoft Teal */
  --secondary: #2BC4B4;
  --secondary-foreground: #FFFFFF;

  --muted: #F4FBFF;
  /* Ice Blue */
  --muted-foreground: #6B7C93;

  /* Accent - DivineeSoft Bright Cyan */
  --accent: #00E5CC;
  --accent-foreground: #0B1A2E;

  --destructive: #EF4444;

  --border: #D8E8F5;
  /* Light Border */
  --input: #D8E8F5;
  --ring: #4A90D9;
  /* Blue Border */
}

.dark {
  /* Background Colors */
  --background: #0B1A2E;
  /* Dark Navy */
  --foreground: #FFFFFF;
  /* Text on dark bg */

  --card: #112236;
  /* Cards on dark bg */
  --card-foreground: #FFFFFF;

  --popover: #112236;
  --popover-foreground: #FFFFFF;

  /* Primary - DivineeSoft Blue */
  --primary: #4A90D9;
  --primary-foreground: #FFFFFF;

  /* Secondary - DivineeSoft Teal */
  --secondary: #2BC4B4;
  --secondary-foreground: #FFFFFF;

  --muted: #1E3A5F;
  /* Borders / muted on dark bg */
  --muted-foreground: #A0B4C8;

  /* Accent - DivineeSoft Bright Cyan */
  --accent: #00E5CC;
  --accent-foreground: #0B1A2E;

  --destructive: #EF4444;

  --border: #1E3A5F;
  /* Dark Border */
  --input: #1E3A5F;
  --ring: #00E5CC;
  /* Accent Border on focus */
}

/* Base Styles & Utility overrides for smooth transitions */
* {
  font-family: var(--font-montserrat), ui-sans-serif, system-ui, sans-serif;
  scroll-behavior: smooth;
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

body {
  background-color: var(--background);
  color: var(--foreground);
}

html:not(.dark) body,
html:not(.dark) main {
  background-color: #FFFFFF !important;
  color: #2D3E50 !important;
}

html.dark body,
html.dark main {
  background-color: #0B1A2E !important;
  color: #FFFFFF !important;
}

html:not(.dark) .bg-background,
html:not(.dark) .bg-card,
html:not(.dark) .blog-filter-control,
html:not(.dark) .blog-category-select,
html:not(.dark) .blog-category-select option,
html:not(.dark) .blog-pagination {
  background-color: #FFFFFF !important;
}

html.dark .bg-background,
html.dark .bg-card,
html.dark .blog-filter-control,
html.dark .blog-category-select,
html.dark .blog-category-select option,
html.dark .blog-pagination {
  background-color: #0B1A2E !important;
}

html:not(.dark) .text-foreground,
html:not(.dark) .blog-filter-control,
html:not(.dark) .blog-category-select,
html:not(.dark) .blog-category-select option {
  color: #2D3E50 !important;
}

html.dark .text-foreground,
html.dark .blog-filter-control,
html.dark .blog-category-select,
html.dark .blog-category-select option {
  color: #FFFFFF !important;
}

html.dark .bg-card {
  background-color: #112236 !important;
}

html.dark footer,
html:not(.dark) footer {
  background-color: #020817 !important;
  color: #A0B4C8 !important;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(74, 144, 217, 0.4);
  border-radius: 9999px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(74, 144, 217, 0.6);
}

/* Base Headings & typography */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.25;
}

/* Tailwind configuration triggers and initial styles */
.prose {
  color: var(--foreground);
  line-height: 1.75;
}

.prose h1,
.prose h2,
.prose h3 {
  color: var(--foreground);
  margin-top: 1.5em;
  margin-bottom: 0.5em;
}

.prose p {
  margin-bottom: 1.25em;
}

.prose a {
  color: var(--primary);
  text-decoration: underline;
  font-weight: 600;
}

.prose a:hover {
  color: var(--secondary);
}

.prose ul,
.prose ol {
  margin-left: 1.5em;
  margin-bottom: 1.25em;
  list-style-type: decimal;
}

.prose ul {
  list-style-type: disc;
}

.prose li {
  margin-bottom: 0.5em;
}

.prose blockquote {
  border-left: 4px solid var(--secondary);
  padding-left: 1.25em;
  font-style: italic;
  color: var(--muted-foreground);
  margin: 1.5em 0;
}