/* staticfiles/header/css/custom.css */

/* Import fonts from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;700&display=swap');

/* PyLadiesKL Custom Color Scheme - Override DaisyUI Theme */
:root {
  /* PyLadiesKL Color Palette */
  --pyladies-primary: #DC3E4B;      /* Main reddish-pink from the logo background */
  --pyladies-secondary: #E11C47;    /* Darker red accent from the flower */
  --pyladies-accent: #A13C47;       /* Dark red/maroon from the shirt and cityscape */
  --pyladies-dark: #643842;         /* Deep muted dark shade for contrast */
  --pyladies-light: #F7D4DA;        /* Light pink from the inner circle */
  
  /* Override DaisyUI Theme Variables */
  --p: 352 75% 55%; /* Primary - converted from #DC3E4B */
  --pf: 352 85% 48%; /* Primary focus - darker */
  --pc: 0 0% 100%; /* Primary content (text on primary) */
  
  --s: 347 78% 50%; /* Secondary - converted from #E11C47 */
  --sf: 347 88% 43%; /* Secondary focus */
  --sc: 0 0% 100%; /* Secondary content */
  
  --a: 352 45% 45%; /* Accent - converted from #A13C47 */
  --af: 352 55% 38%; /* Accent focus */
  --ac: 0 0% 100%; /* Accent content */
  
  --n: 342 18% 30%; /* Neutral - converted from #643842 */
  --nf: 342 28% 23%; /* Neutral focus */
  --nc: 0 0% 100%; /* Neutral content */
  
  --b1: 0 0% 100%; /* Base-100 - white */
  --b2: 352 50% 95%; /* Base-200 - very light pink */
  --b3: 352 40% 90%; /* Base-300 - light pink */
  --bc: 342 18% 30%; /* Base content - dark text */
  
  /* Override background colors */
  --b1: 0 0% 100% !important; /* Force white background */
  --in: 352 75% 55% !important; /* Info */
  --su: 120 60% 50% !important; /* Success */
  --wa: 45 100% 50% !important; /* Warning */
  --er: 0 80% 50% !important; /* Error */
}

/* Set the font family for body and headings */
body {
  font-family: 'Quicksand', sans-serif;
}

/* Example of applying the script font to a specific class, like a logo or main title */
.logo-text {
  font-family: 'Dancing Script', cursive;
  font-weight: 700; /* Bolder weight for emphasis */
}

/* Dark theme overrides */
[data-theme="dark"] {
  --b1: 342 18% 15% !important; /* Dark background */
  --b2: 342 18% 20% !important;
  --b3: 342 18% 25% !important;
  --bc: 352 50% 95% !important; /* Light text on dark */
}

/* Force override DaisyUI components */
.btn {
  background-color: hsl(var(--p)) !important;
  border-color: hsl(var(--p)) !important;
  color: hsl(var(--pc)) !important;
}

.btn:hover {
  background-color: hsl(var(--pf)) !important;
  border-color: hsl(var(--pf)) !important;
}

/* Override card backgrounds */
.card {
  background-color: hsl(var(--b1)) !important;
  color: hsl(var(--bc)) !important;
}

/* Override navbar/menu backgrounds */
.navbar, .menu {
  background-color: hsl(var(--b1)) !important;
}

/* Override modal backgrounds */
.modal {
  background-color: hsl(var(--b1)) !important;
}

.modal-box {
  background-color: hsl(var(--b1)) !important;
  color: hsl(var(--bc)) !important;
}

/* Committee card styles */
.card {
  background: linear-gradient(135deg, #FFFFFF 0%, #FEF7F8 100%) !important;
  border: 1px solid var(--pyladies-light) !important;
  border-radius: 1rem !important;
}

.card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 20px 40px rgba(220, 62, 75, 0.15) !important;
}

/* Social icon styles */
.fab, .fas {
  transition: all 0.3s ease !important;
}

.fab:hover, .fas:hover {
  transform: scale(1.2) !important;
}

/* Ensure links are clickable */
a {
  position: relative !important;
  z-index: 10 !important;
}

/* Mission list styles */
.fa-heart, .fa-code, .fa-handshake, .fa-rocket {
  color: var(--pyladies-primary) !important;
}

/* Override the specific purple color utility classes */
.text-\[\#615FFF\], .text-indigo-400, .text-purple-400 {
  color: var(--pyladies-primary) !important;
}

.bg-indigo-500, .bg-purple-500, .bg-primary {
  background-color: var(--pyladies-primary) !important;
}

/* Nuclear option - override any dark backgrounds */
.bg-base-100, .bg-base-200, .bg-base-300 {
  background-color: hsl(var(--b1)) !important;
}

/* Specific override for dark purple backgrounds */
.bg-gray-900,
.bg-slate-900,
.bg-neutral,
.bg-gray-800 {
  background-color: var(--pyladies-dark) !important;
}

/* Force white background on body and main containers */
body, .main-container, .container {
  background-color: hsl(var(--b1)) !important;
  color: hsl(var(--bc)) !important;
}