/*
Theme Name: Artha365 Custom Theme
Theme URI: https://artha365.com
Author: Artha365 Team
Author URI: https://artha365.com
Description: Dark-first, premium custom WordPress theme for Artha365. Custom-made for Indian SMEs and CAs, supporting dynamic client-side portal features.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: artha365
Domain Path: /languages
*/

/* ──────────────────────────────────────────────
   1. Design System Tokens (CSS Variables)
   ────────────────────────────────────────────── */

:root, [data-theme="dark"] {
    /* Color Palette — HSL (Hue, Saturation, Lightness) */
    --color-bg-base-hsl: 220, 20%, 5%;
    --color-bg-surface-hsl: 220, 20%, 7%;
    --color-bg-elevated-hsl: 220, 18%, 10%;
    
    --color-bg-base: hsl(var(--color-bg-base-hsl));
    --color-bg-surface: hsl(var(--color-bg-surface-hsl));
    --color-bg-elevated: hsl(var(--color-bg-elevated-hsl));
    
    --color-border-hsl: 220, 15%, 14%;
    --color-border: hsl(var(--color-border-hsl));
    --color-border-light: hsla(220, 15%, 20%, 0.5);
    
    --color-text-primary-hsl: 220, 10%, 94%;
    --color-text-secondary-hsl: 220, 10%, 70%;
    --color-text-muted-hsl: 220, 10%, 48%;
    --color-text-dim-hsl: 220, 10%, 34%;
    
    --color-text-primary: hsl(var(--color-text-primary-hsl));
    --color-text-secondary: hsl(var(--color-text-secondary-hsl));
    --color-text-muted: hsl(var(--color-text-muted-hsl));
    --color-text-dim: hsl(var(--color-text-dim-hsl));
    
    /* Accents */
    --color-accent-purple-hsl: 258, 90%, 66%;
    --color-accent-amber-hsl: 38, 92%, 50%;
    --color-accent-green-hsl: 158, 84%, 40%;
    
    --color-accent-purple: hsl(var(--color-accent-purple-hsl));
    --color-accent-amber: hsl(var(--color-accent-amber-hsl));
    --color-accent-green: hsl(var(--color-accent-green-hsl));
    
    /* Dynamic HSL Transparency helpers */
    --color-accent-purple-glow: hsla(var(--color-accent-purple-hsl), 0.15);
    --color-accent-amber-glow: hsla(var(--color-accent-amber-hsl), 0.15);
    --color-accent-green-glow: hsla(var(--color-accent-green-hsl), 0.15);
    
    /* Border Radii */
    --radius-sm: 3px;
    --radius-md: 5px;
    --radius-lg: 6px;
    
    /* Layout Sizes */
    --sidebar-width: 220px;
    --header-height: 48px;
    --status-bar-height: 36px;
    
    /* Grid background helper */
    --grid-line-color: rgba(255, 255, 255, 0.02);
}

[data-theme="light"] {
    /* Light Mode Palette — Inverted values with rich contrast */
    --color-bg-base-hsl: 220, 15%, 97%;
    --color-bg-surface-hsl: 0, 0%, 100%;
    --color-bg-elevated-hsl: 220, 15%, 94%;
    
    --color-bg-base: hsl(var(--color-bg-base-hsl));
    --color-bg-surface: hsl(var(--color-bg-surface-hsl));
    --color-bg-elevated: hsl(var(--color-bg-elevated-hsl));
    
    --color-border-hsl: 220, 15%, 88%;
    --color-border: hsl(var(--color-border-hsl));
    --color-border-light: hsla(220, 15%, 80%, 0.5);
    
    --color-text-primary-hsl: 220, 20%, 10%;
    --color-text-secondary-hsl: 220, 15%, 32%;
    --color-text-muted-hsl: 220, 12%, 48%;
    --color-text-dim-hsl: 220, 10%, 65%;
    
    --color-text-primary: hsl(var(--color-text-primary-hsl));
    --color-text-secondary: hsl(var(--color-text-secondary-hsl));
    --color-text-muted: hsl(var(--color-text-muted-hsl));
    --color-text-dim: hsl(var(--color-text-dim-hsl));
    
    /* Light-tuned Accent variants for readability */
    --color-accent-purple-hsl: 258, 80%, 55%;
    --color-accent-amber-hsl: 38, 92%, 44%;
    --color-accent-green-hsl: 158, 80%, 35%;
    
    --color-accent-purple: hsl(var(--color-accent-purple-hsl));
    --color-accent-amber: hsl(var(--color-accent-amber-hsl));
    --color-accent-green: hsl(var(--color-accent-green-hsl));
    
    --color-accent-purple-glow: hsla(var(--color-accent-purple-hsl), 0.08);
    --color-accent-amber-glow: hsla(var(--color-accent-amber-hsl), 0.08);
    --color-accent-green-glow: hsla(var(--color-accent-green-hsl), 0.08);
    --grid-line-color: rgba(0, 0, 0, 0.015);
}

/* ──────────────────────────────────────────────
   2. Reset & Core HTML Elements
   ────────────────────────────────────────────── */

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

body {
    background-color: var(--color-bg-base);
    color: var(--color-text-primary);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transition: background-color 0.25s ease, color 0.25s ease;
}

a {
    color: var(--color-accent-purple);
    text-decoration: none;
    transition: color 0.15s ease;
}

a:hover {
    color: hsl(var(--color-accent-purple-hsl), 1.2);
}

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