/*
Theme Name:     Perphyl Child
Theme URI:      https://perphyl.com
Template:       hello-elementor
Author:         Perphyl
Version:        1.0.0
Description:    Child theme for Perphyl with brand colors and dark mode support
Text Domain:    perphyl-child
*/

:root {
  --primary-dark: #285181;
  --primary-blue: #0065CC;
  --accent-orange: #F38C00;
  --text-dark: #1e2937;
  --text-light: #e2e8f0;
  --bg-light: #ffffff;
  --bg-dark: #0f172a;
}

/* Dark Mode */
body.dark-mode {
  --primary-dark: #1a3a5e;
  --primary-blue: #0080ff;
  --accent-orange: #ff9f1c;
  --text-dark: #e2e8f0;
  --text-light: #cbd5e1;
  --bg-light: #0f172a;
  --bg-dark: #0f172a;
}

body.dark-mode {
  background-color: var(--bg-dark) !important;
  color: var(--text-light) !important;
}

/* Force dark mode on Elementor sections */
body.dark-mode .elementor-section,
body.dark-mode .elementor-container,
body.dark-mode .elementor-widget-container {
  background-color: var(--bg-dark) !important;
  color: var(--text-light) !important;
}

/* Smooth transition for dark mode */
* {
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Optional: Improve button styling with brand colors */
.elementor-button {
  transition: all 0.3s ease;
}

.elementor-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(243, 140, 0, 0.3);
}

/* Make sure logo scales nicely */
.custom-logo {
  max-height: 60px;
  width: auto;
}