/*
Theme Name: GeneratePress Neumorphism
Theme URI: https://yourwebsite.com/
Description: A Neumorphic child theme for GeneratePress with dark mode and custom color controls.
Author: Your Name
Author URI: https://yourwebsite.com/
Template: generatepress
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: generatepress-neumorphism
Tags: neumorphism, dark-mode, accessibility, seo, custom-colors
*/

:root {
  --gpc-base-bg: #f0f0f3;
  --gpc-secondary-bg: #e2e6ec;
  --gpc-neum-light-shadow: #ffffff;
  --gpc-neum-dark-shadow: #d1d9e6;
  --gpc-text-color: #222831;
  --gpc-heading-color: #111111;
  --gpc-transition-speed: 0.3s;
  --gpc-transition-easing: cubic-bezier(0.4, 0, 0.2, 1);
  --gpc-border-radius: 16px;
  --gpc-br-lg: 24px;
  --gpc-br-md: 16px;
  --gpc-br-sm: 8px;
  --gpc-focus-color: #3b82f6;
  --gpc-card-bg: #f8fafc;
  --gpc-card-shadow: 0 4px 8px 0 rgba(31, 41, 55, 0.05);
  --gpc-link-color: #2563eb;
  --gpc-link-hover: #1d4ed8;
  --gpc-muted-text: #6b7280;
  --gpc-container-padding: 2rem;
  --gpc-container-margin-bottom: 2rem;
  --gpc-lead-font-size: 1.25rem;
}

body {
  background-color: var(--gpc-base-bg);
  color: var(--gpc-text-color);
  transition: background-color var(--gpc-transition-speed) var(--gpc-transition-easing), color var(--gpc-transition-speed) var(--gpc-transition-easing);
}

.site-content,
.inside-article,
.widget,
.wp-block-group,
.wp-block-columns {
  background: linear-gradient(145deg, var(--gpc-secondary-bg), var(--gpc-base-bg));
  border-radius: var(--gpc-br-lg);
  box-shadow: 5px 5px 14px var(--gpc-neum-dark-shadow), -5px -5px 14px var(--gpc-neum-light-shadow);
  transition: background var(--gpc-transition-speed) var(--gpc-transition-easing),
    box-shadow var(--gpc-transition-speed) var(--gpc-transition-easing),
    border-radius var(--gpc-transition-speed) var(--gpc-transition-easing);
  padding: var(--gpc-container-padding);
  margin-bottom: var(--gpc-container-margin-bottom);
}

#gpc-dark-mode-toggle {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: 9999;
  width: 3.5rem;
  height: 3.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, var(--gpc-secondary-bg), var(--gpc-base-bg));
  border: none;
  border-radius: var(--gpc-br-lg);
  box-shadow: 5px 5px 14px var(--gpc-neum-dark-shadow), -5px -5px 14px var(--gpc-neum-light-shadow);
  cursor: pointer;
  transition: background var(--gpc-transition-speed) var(--gpc-transition-easing),
    box-shadow var(--gpc-transition-speed) var(--gpc-transition-easing),
    border-radius var(--gpc-transition-speed) var(--gpc-transition-easing);
}
#gpc-dark-mode-toggle:focus {
  outline: 2px solid var(--gpc-focus-color);
  outline-offset: 2px;
}
#gpc-dark-mode-toggle .icon-light {
  display: inline;
}
#gpc-dark-mode-toggle .icon-dark {
  display: none;
}
body.dark-mode #gpc-dark-mode-toggle .icon-light {
  display: none;
}
body.dark-mode #gpc-dark-mode-toggle .icon-dark {
  display: inline;
}

body.dark-mode {
  --gpc-base-bg: #181a20;
  --gpc-secondary-bg: #23262f;
  --gpc-neum-light-shadow: #23262f;
  --gpc-neum-dark-shadow: #101114;
  --gpc-text-color: #f3f4f6;
  --gpc-heading-color: #ffffff;
  --gpc-transition-speed: 0.3s;
  --gpc-transition-easing: cubic-bezier(0.4, 0, 0.2, 1);
  --gpc-border-radius: 16px;
  --gpc-br-lg: 24px;
  --gpc-br-md: 16px;
  --gpc-br-sm: 8px;
  --gpc-focus-color: #60a5fa;
  --gpc-card-bg: #23262f;
  --gpc-card-shadow: 0 4px 8px 0 rgba(0,0,0,0.25);
  --gpc-link-color: #60a5fa;
  --gpc-link-hover: #3b82f6;
  --gpc-muted-text: #9ca3af;
  --gpc-container-padding: 2rem;
  --gpc-container-margin-bottom: 2rem;
  background-color: var(--gpc-base-bg);
  color: var(--gpc-text-color);
  transition: background-color var(--gpc-transition-speed) var(--gpc-transition-easing), color var(--gpc-transition-speed) var(--gpc-transition-easing);
}
body.dark-mode .site-header,
body.dark-mode .main-navigation,
body.dark-mode .main-navigation ul,
body.dark-mode .top-bar,
body.dark-mode .site-footer {
  background-color: var(--gpc-base-bg);
  color: var(--gpc-text-color);
  box-shadow: 5px 5px 14px var(--gpc-neum-dark-shadow), -5px -5px 14px var(--gpc-neum-light-shadow);
  transition: background-color var(--gpc-transition-speed) var(--gpc-transition-easing),
    color var(--gpc-transition-speed) var(--gpc-transition-easing),
    box-shadow var(--gpc-transition-speed) var(--gpc-transition-easing);
}
body.dark-mode .main-navigation a,
body.dark-mode .main-navigation ul li a,
body.dark-mode .top-bar a,
body.dark-mode .site-header a,
body.dark-mode .site-footer a {
  color: var(--gpc-link-color);
  transition: color var(--gpc-transition-speed) var(--gpc-transition-easing);
}
body.dark-mode .main-navigation a:hover,
body.dark-mode .main-navigation ul li a:hover,
body.dark-mode .top-bar a:hover,
body.dark-mode .site-header a:hover,
body.dark-mode .site-footer a:hover {
  color: var(--gpc-link-hover);
}

body.dark-mode p,
body.dark-mode li,
body.dark-mode span,
body.dark-mode strong,
body.dark-mode em,
body.dark-mode a,
body.dark-mode .entry-content p,
body.dark-mode .entry-content li,
body.dark-mode .widget-content,
body.dark-mode .wp-block-paragraph {
  color: var(--gpc-text-color);
  transition: color var(--gpc-transition-speed) var(--gpc-transition-easing);
}
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode .entry-title,
body.dark-mode .widget-title,
body.dark-mode .wp-block-heading {
  color: var(--gpc-heading-color);
  transition: color var(--gpc-transition-speed) var(--gpc-transition-easing);
}
body.dark-mode a {
  color: var(--gpc-link-color);
  transition: color var(--gpc-transition-speed) var(--gpc-transition-easing);
}
body.dark-mode a:hover {
  color: var(--gpc-link-hover);
} 

.button,
button,
input[type="button"],
input[type="submit"],
.wp-block-button__link {
  background: linear-gradient(145deg, var(--gpc-secondary-bg), var(--gpc-base-bg));
  border: none;
  border-radius: var(--gpc-br-md);
  box-shadow: 5px 5px 14px var(--gpc-neum-dark-shadow), -5px -5px 14px var(--gpc-neum-light-shadow);
  color: var(--gpc-text-color);
  padding: 0.75em 2em;
  font-size: 1rem;
  cursor: pointer;
  transition: background var(--gpc-transition-speed) var(--gpc-transition-easing),
    box-shadow var(--gpc-transition-speed) var(--gpc-transition-easing),
    color var(--gpc-transition-speed) var(--gpc-transition-easing),
    border-radius var(--gpc-transition-speed) var(--gpc-transition-easing);
}
.button:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover {
  box-shadow: inset 3px 3px 8px var(--gpc-neum-dark-shadow), inset -3px -3px 8px var(--gpc-neum-light-shadow);
}
.button:active,
button:active,
input[type="button"]:active,
input[type="submit"]:active,
.wp-block-button__link:active {
  box-shadow: inset 2px 2px 6px var(--gpc-neum-dark-shadow), inset -2px -2px 6px var(--gpc-neum-light-shadow);
}

input[type="text"],
input[type="email"],
textarea,
select {
  background: var(--gpc-base-bg);
  border: none;
  border-radius: var(--gpc-br-sm);
  box-shadow: inset 3px 3px 8px var(--gpc-neum-dark-shadow), inset -3px -3px 8px var(--gpc-neum-light-shadow);
  color: var(--gpc-text-color);
  padding: 0.75em 1em;
  font-size: 1rem;
  transition: background var(--gpc-transition-speed) var(--gpc-transition-easing),
    box-shadow var(--gpc-transition-speed) var(--gpc-transition-easing),
    color var(--gpc-transition-speed) var(--gpc-transition-easing),
    border-radius var(--gpc-transition-speed) var(--gpc-transition-easing);
}
input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus,
select:focus {
  outline: none;
  box-shadow: 0 0 0 3px var(--gpc-focus-color),
    inset 2px 2px 6px var(--gpc-neum-dark-shadow),
    inset -2px -2px 6px var(--gpc-neum-light-shadow);
}

.site-header,
.main-navigation,
.site-info,
.footer-widgets {
  background: linear-gradient(145deg, var(--gpc-secondary-bg), var(--gpc-base-bg));
  border-radius: var(--gpc-br-lg);
  box-shadow: 5px 5px 14px var(--gpc-neum-dark-shadow), -5px -5px 14px var(--gpc-neum-light-shadow);
  transition: background var(--gpc-transition-speed) var(--gpc-transition-easing),
    box-shadow var(--gpc-transition-speed) var(--gpc-transition-easing),
    border-radius var(--gpc-transition-speed) var(--gpc-transition-easing);
}
.main-navigation li a {
  border-radius: var(--gpc-br-sm);
  transition: background var(--gpc-transition-speed) var(--gpc-transition-easing),
    box-shadow var(--gpc-transition-speed) var(--gpc-transition-easing);
}
.main-navigation li a:hover,
.main-navigation li.current-menu-item a {
  background: var(--gpc-secondary-bg);
  box-shadow: 2px 2px 6px var(--gpc-neum-dark-shadow), -2px -2px 6px var(--gpc-neum-light-shadow);
}

/* Utility Classes */
.neum-embossed {
  background: linear-gradient(145deg, var(--gpc-secondary-bg), var(--gpc-base-bg));
  box-shadow: 5px 5px 14px var(--gpc-neum-dark-shadow), -5px -5px 14px var(--gpc-neum-light-shadow);
  border-radius: var(--gpc-br-md);
}
.neum-debossed {
  background: var(--gpc-base-bg);
  box-shadow: inset 3px 3px 8px var(--gpc-neum-dark-shadow), inset -3px -3px 8px var(--gpc-neum-light-shadow);
  border-radius: var(--gpc-br-md);
}
.neum-flat-bg {
  background: var(--gpc-base-bg);
  border-radius: var(--gpc-br-md);
  box-shadow: none;
} 

.lead-sentence {
  font-size: var(--gpc-lead-font-size, 1.25rem);
  font-weight: bold;
  color: var(--gpc-heading-color);
  margin: 1.5rem 0 1.5rem 0;
  line-height: 1.5;
  background: var(--gpc-card-bg);
  border-radius: var(--gpc-br-md);
  box-shadow: 2px 2px 8px var(--gpc-neum-dark-shadow), -2px -2px 8px var(--gpc-neum-light-shadow);
  padding: 1.25rem 1.5rem;
  transition: color var(--gpc-transition-speed) var(--gpc-transition-easing), background var(--gpc-transition-speed) var(--gpc-transition-easing);
}
body.dark-mode .lead-sentence {
  color: var(--gpc-heading-color);
  background: var(--gpc-card-bg);
  box-shadow: 2px 2px 8px var(--gpc-neum-dark-shadow), -2px -2px 8px var(--gpc-neum-light-shadow);
}