/*
Theme Name: Alex Mercer Portfolio
Theme URI: https://alexmercer.dev
Author: Alex Mercer
Description: Companion theme for the Alex Mercer Elementor portfolio templates. Provides dark background, typography, and global styles. Requires Elementor (free).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: am
*/

/* ── GLOBAL DARK FOUNDATION ── */
:root {
  --e-global-color-primary:   #00f5c4;
  --e-global-color-secondary: #0066ff;
  --e-global-color-text:      rgba(255,255,255,0.45);
  --e-global-color-accent:    #00f5c4;
  --e-global-typography-primary-font-family:   'Syne';
  --e-global-typography-secondary-font-family: 'DM Sans';
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  background: #080808 !important;
  color: #ffffff;
  font-family: 'DM Sans', sans-serif;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* Force dark bg on every Elementor wrapper */
.elementor-page,
.elementor-section-wrap,
.e-con,
.elementor-section,
.elementor-top-section {
  background-color: #080808;
}

/* Transparent column backgrounds */
.elementor-column-wrap,
.elementor-widget-wrap {
  background: transparent !important;
}

/* Fix Elementor's default white widget backgrounds */
.elementor-widget-text-editor,
.elementor-widget-heading,
.elementor-widget-button {
  background: transparent !important;
}

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: #080808; }
::-webkit-scrollbar-thumb { background: #00f5c4; border-radius: 2px; }

/* ── TYPOGRAPHY ── */
h1,h2,h3,h4,h5,h6 {
  font-family: 'Syne', sans-serif;
  color: #ffffff;
  letter-spacing: -0.03em;
  line-height: 1.08;
}
p { color: rgba(255,255,255,0.45); line-height: 1.75; }
a { color: #00f5c4; text-decoration: none; transition: color 0.2s; }
a:hover { color: #00ddb0; }

/* ── ELEMENTOR ACCORDION (FAQ) ── */
.elementor-accordion-item { border-color: rgba(255,255,255,0.07) !important; }
.elementor-tab-title { background: #111111 !important; }
.elementor-tab-content { background: #111111 !important; color: rgba(255,255,255,0.45) !important; }

/* ── ELEMENTOR ICON LIST ── */
.elementor-icon-list-text { color: #ffffff !important; }

/* ── ELEMENTOR FORM ── */
.elementor-field-group label { color: rgba(255,255,255,0.45) !important; text-transform: uppercase; letter-spacing: 0.09em; font-size: 11px; }
.elementor-field { background: #111111 !important; border-color: rgba(255,255,255,0.07) !important; color: #ffffff !important; border-radius: 2px !important; }
.elementor-field:focus { border-color: rgba(0,245,196,0.4) !important; outline: none; }
.elementor-field::placeholder { color: rgba(255,255,255,0.16) !important; }
.elementor-field-type-submit .elementor-button { width: 100% !important; }
.elementor-message.elementor-message-success { background: rgba(0,245,196,0.08); border: 1px solid rgba(0,245,196,0.2); color: #00f5c4; padding: 12px 16px; border-radius: 2px; }

/* ── ELEMENTOR COUNTER ── */
.elementor-counter-number-wrapper { font-family: 'Syne', sans-serif !important; }
.elementor-counter-title { font-family: 'DM Sans', sans-serif !important; }

/* ── ELEMENTOR DIVIDER ── */
.elementor-divider-separator { border-color: rgba(255,255,255,0.07) !important; }

/* ── ELEMENTOR TESTIMONIAL ── */
.elementor-testimonial-content { font-style: italic; }
.elementor-testimonial-name { font-family: 'Syne', sans-serif !important; font-weight: 600 !important; }

/* ── NAV / HEADER (if using Elementor Header) ── */
.am-nav-wrap {
  position: sticky; top: 0; z-index: 9999;
  background: rgba(8,8,8,0.85);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255,255,255,0.07);
}

/* ── SECTION GAP FIX ── */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 1400px;
}

/* ── MOBILE FIXES ── */
@media (max-width: 768px) {
  body { cursor: auto !important; }
  .elementor-section { padding-left: 20px !important; padding-right: 20px !important; }
}