/*
Theme Name: SDNN Public Theme
Theme URI: https://example.com/sdnn-theme
Author: Builder.io Fusion
Author URI: https://www.builder.io/
Description: WordPress theme mirroring the SDNN public frontend with Elementor customization support.
Version: 1.0.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sdnn
*/

/* CSS variables adapted from app index.css */
:root {
  --button-outline: rgba(0,0,0, .10);
  --badge-outline: rgba(0,0,0, .05);
  --opaque-button-border-intensity: -8;
  --elevate-1: rgba(0,0,0, .03);
  --elevate-2: rgba(0,0,0, .08);

  --background: 0 0% 98%;
  --foreground: 220 15% 12%;
  --border: 220 10% 88%;

  --card: 0 0% 100%;
  --card-foreground: 220 15% 12%;
  --card-border: 220 8% 92%;

  --popover: 0 0% 100%;
  --popover-foreground: 220 15% 12%;
  --popover-border: 220 10% 88%;

  --primary: 210 95% 58%;
  --primary-foreground: 0 0% 100%;
  --secondary: 220 8% 92%;
  --secondary-foreground: 220 15% 12%;
  --muted: 220 10% 94%;
  --muted-foreground: 220 10% 40%;
  --accent: 220 12% 92%;
  --accent-foreground: 220 15% 12%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;
  --input: 220 13% 75%;
  --ring: 210 95% 58%;
  --font-sans: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --font-serif: Merriweather, Georgia, serif;
  --font-mono: 'Roboto Mono', Menlo, monospace;
  --radius: .5rem;
}

.dark {
  --button-outline: rgba(255,255,255, .10);
  --badge-outline: rgba(255,255,255, .05);
  --opaque-button-border-intensity: 9;
  --elevate-1: rgba(255,255,255, .04);
  --elevate-2: rgba(255,255,255, .09);
  --background: 220 15% 10%;
  --foreground: 0 0% 98%;
  --border: 220 12% 18%;
  --card: 220 15% 14%;
  --card-foreground: 0 0% 98%;
  --card-border: 220 12% 20%;
  --popover: 220 15% 14%;
  --popover-foreground: 0 0% 98%;
  --popover-border: 220 12% 20%;
  --primary: 210 95% 58%;
  --primary-foreground: 0 0% 100%;
  --secondary: 220 10% 24%;
  --secondary-foreground: 0 0% 98%;
  --muted: 220 12% 20%;
  --muted-foreground: 0 0% 70%;
  --accent: 220 14% 22%;
  --accent-foreground: 0 0% 98%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;
  --input: 220 12% 35%;
}

html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; border-color: hsl(var(--border)); }
body {
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  margin: 0;
}

/* Utility mappings to match custom Tailwind tokens used in the app */
.bg-background { background-color: hsl(var(--background)) !important; }
.text-foreground { color: hsl(var(--foreground)) !important; }
.text-muted-foreground { color: hsl(var(--muted-foreground)) !important; }
.bg-primary { background-color: hsl(var(--primary)) !important; }
.text-primary-foreground { color: hsl(var(--primary-foreground)) !important; }
.bg-secondary { background-color: hsl(var(--secondary)) !important; }
.text-secondary-foreground { color: hsl(var(--secondary-foreground)) !important; }
.bg-card { background-color: hsl(var(--card)) !important; }
.text-card-foreground { color: hsl(var(--card-foreground)) !important; }
.border-border { border-color: hsl(var(--border)) !important; }

/* Elevation helpers */
.hover-elevate, .active-elevate, .hover-elevate-2, .active-elevate-2 { position: relative; z-index: 0; }
.hover-elevate::after, .active-elevate::after, .hover-elevate-2::after, .active-elevate-2::after {
  content: ""; pointer-events: none; position: absolute; inset: 0; border-radius: inherit; z-index: 1;
}
.hover-elevate:hover::after, .active-elevate:active::after { background-color: var(--elevate-1); }
.hover-elevate-2:hover::after, .active-elevate-2:active::after { background-color: var(--elevate-2); }

/* Badge styles */
.sdnn-badge { display: inline-flex; align-items: center; gap: .25rem; padding: .25rem .5rem; border-radius: 9999px; font-size: .75rem; line-height: 1rem; border: 1px solid var(--badge-outline); }
.sdnn-badge--default { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); border-color: hsl(var(--primary)); }
.sdnn-badge--secondary { background: hsl(var(--secondary)); color: hsl(var(--secondary-foreground)); border-color: hsl(var(--badge-outline)); }

/* Prose base (light weight) to improve article readability if typography plugin missing) */
.prose { font-family: var(--font-serif); }
.prose img { max-width: 100%; height: auto; }

/* Search cancel button hide (optional) */
input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; height: 0; width: 0; }
