/*
Theme Name: D TAROT
Theme URI: https://dtarot.com
Author: D TAROT
Author URI: https://dtarot.com
Description: D TAROT is a luxury, enchanted-forest themed WordPress custom theme for Vedic Astrology and AI Tarot Readings. Features 1-Card, 3-Card, and 5-Card spreads, 78 Major and Minor Arcana interpretations, authentic Vedic birth chart calculations, daily horoscopes, interactive AI astrologer chat, and multilingual support in Malayalam, English, and Hindi.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Proprietary
License URI: https://dtarot.com/terms
Text Domain: dtarot
Tags: tarot, astrology, vedic-astrology, horoscopes, dark-theme, responsive-layout, translation-ready, full-width-template, custom-colors, custom-menu, featured-images
*/

/* ==========================================================================
   D TAROT — CORE BRAND DESIGN TOKENS (ENCHANTED FOREST BRAND PALETTE)
   ========================================================================== */
:root {
  --dtarot-forest-night: #10251F;
  --dtarot-deep-pine: #172E28;
  --dtarot-enchanted-green: #244237;
  --dtarot-moss-green: #355B48;
  --dtarot-sage-green: #50765B;
  --dtarot-antique-gold: #C5B18A;
  --dtarot-soft-sand: #D6C6A6;
  --dtarot-warm-ivory: #F0E6D2;
  --dtarot-mist-sage: #C2D0C5;
  --dtarot-text-muted: rgba(194, 208, 197, 0.75);

  --dtarot-font-family: 'Anek Latin', 'Anek Malayalam', 'Anek Devanagari', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --dtarot-font-serif: 'Cormorant Garamond', 'Cinzel', serif;
  --dtarot-font-ml: 'Anek Malayalam', 'Anek Latin', sans-serif;
  --dtarot-font-hi: 'Anek Devanagari', 'Anek Latin', sans-serif;

  --dtarot-radius-sm: 8px;
  --dtarot-radius-md: 14px;
  --dtarot-radius-lg: 20px;
  --dtarot-radius-full: 9999px;

  --dtarot-shadow-soft: 0 4px 20px rgba(0, 0, 0, 0.35);
  --dtarot-shadow-gold: 0 0 20px rgba(197, 177, 138, 0.22);
}

/* ==========================================================================
   BASE HTML & RESET
   ========================================================================== */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  font-family: var(--dtarot-font-family);
  background-color: var(--dtarot-forest-night);
  color: var(--dtarot-warm-ivory);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  padding: 0;
  background-color: var(--dtarot-forest-night);
  color: var(--dtarot-warm-ivory);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

#page,
.dtarot-site-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  width: 100%;
}

main.dtarot-main-content {
  flex: 1 0 auto;
  width: 100%;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  color: var(--dtarot-warm-ivory);
  font-family: var(--dtarot-font-family);
  font-weight: 600;
  line-height: 1.25;
  margin-top: 0;
  margin-bottom: 1rem;
}

h1 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -0.02em; }
h2 { font-size: clamp(1.6rem, 3vw, 2.25rem); letter-spacing: -0.015em; }
h3 { font-size: clamp(1.3rem, 2.5vw, 1.75rem); }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.1rem; }
h6 { font-size: 0.95rem; text-transform: uppercase; letter-spacing: 0.05em; }

p {
  color: var(--dtarot-mist-sage);
  margin-top: 0;
  margin-bottom: 1.25rem;
  font-size: 1rem;
}

a {
  color: var(--dtarot-antique-gold);
  text-decoration: none;
  transition: color 0.2s ease, opacity 0.2s ease;
}

a:hover, a:focus {
  color: var(--dtarot-soft-sand);
  text-decoration: none;
}

/* Primary Button Styling — Dark text on Antique Gold as required by brand rules */
.dtarot-btn-gold,
button.dtarot-btn-gold,
a.dtarot-btn-gold {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: var(--dtarot-antique-gold);
  color: #10251F !important;
  font-weight: 600;
  font-size: 0.95rem;
  padding: 0.8rem 1.6rem;
  border-radius: var(--dtarot-radius-full);
  border: 1px solid var(--dtarot-soft-sand);
  cursor: pointer;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4), 0 0 14px rgba(197, 177, 138, 0.3);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
  text-decoration: none;
}

.dtarot-btn-gold:hover,
.dtarot-btn-gold:focus {
  background: var(--dtarot-soft-sand);
  color: #0B1C16 !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5), 0 0 20px rgba(197, 177, 138, 0.45);
}

.dtarot-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: var(--dtarot-deep-pine);
  color: var(--dtarot-warm-ivory);
  font-weight: 500;
  font-size: 0.95rem;
  padding: 0.8rem 1.6rem;
  border-radius: var(--dtarot-radius-full);
  border: 1px solid var(--dtarot-moss-green);
  cursor: pointer;
  transition: all 0.2s ease;
  text-decoration: none;
}

.dtarot-btn-secondary:hover {
  background: var(--dtarot-enchanted-green);
  border-color: var(--dtarot-antique-gold);
  color: #FFFFFF;
}

/* Container */
.dtarot-container {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.dtarot-container-narrow {
  width: 100%;
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

/* WordPress Standard Classes */
.alignwide {
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}

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

.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.alignleft {
  float: left;
  margin-right: 1.5rem;
  margin-bottom: 1.5rem;
}

.alignright {
  float: right;
  margin-left: 1.5rem;
  margin-bottom: 1.5rem;
}

.wp-caption {
  max-width: 100%;
  margin-bottom: 1.5rem;
}

.wp-caption-text {
  font-size: 0.85rem;
  color: var(--dtarot-mist-sage);
  text-align: center;
  margin-top: 0.5rem;
}

.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;
}

.screen-reader-text:focus {
  background-color: var(--dtarot-deep-pine);
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: var(--dtarot-antique-gold);
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

