/* Athens Classical Heritage Theme for Astro
 * Mediterranean luxury with timeless elegance
 * Typography: Cormorant (display) + Lato (body)
 * Motifs: Greek classical patterns, marble textures, golden accents
 */

:root[data-theme='athens'],
.athens-theme {
  /* Map PWB variables to Athens-specific aliases */
  --athens-primary: var(--pwb-primary-color, #2C3E50);
  --athens-secondary: var(--pwb-secondary-color, #8B7355);
  --athens-gold: var(--pwb-accent-color, #D4AF37);
  --athens-marble: var(--pwb-background-color, #FAF9F7);
  --athens-charcoal: var(--pwb-text-color, #2D3436);

  /* Typography */
  --font-display: 'Cormorant', Georgia, serif;
  --font-body: 'Lato', 'Helvetica Neue', sans-serif;

  /* Classical proportions */
  --radius: 4px;
  --radius-lg: 8px;

  /* Elegant shadows */
  --shadow-soft: 0 4px 20px -4px rgba(44, 62, 80, 0.08);
  --shadow-elevated: 0 12px 40px -12px rgba(44, 62, 80, 0.15);

  /* Greek key border pattern (as gradient) */
  --greek-key-pattern: linear-gradient(90deg, var(--athens-gold) 2px, transparent 2px);
}

/* Base styles */
.athens-theme {
  font-family: var(--font-body), system-ui, sans-serif;
  color: var(--athens-charcoal);
  background-color: var(--athens-marble);
  -webkit-font-smoothing: antialiased;
}

.athens-theme h1,
.athens-theme h2,
.athens-theme h3,
.athens-theme h4,
.athens-theme h5,
.athens-theme h6 {
  font-family: var(--font-display), Georgia, serif;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.2;
}

.athens-theme .font-display {
  font-family: var(--font-display), Georgia, serif;
}

/* Classical Buttons */
.athens-theme .btn-primary,
.athens-theme .btn-base {
  background: var(--athens-primary);
  color: #ffffff;
  border: 1px solid var(--athens-primary);
  padding: 0.875rem 2.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border-radius: var(--radius);
  transition: all 0.3s ease;
}

.athens-theme .btn-primary:hover,
.athens-theme .btn-base:hover {
  background: var(--athens-gold);
  border-color: var(--athens-gold);
  color: var(--athens-primary);
}

.athens-theme .btn-secondary,
.athens-theme .btn-outline {
  background: transparent;
  color: var(--athens-primary);
  border: 2px solid var(--athens-primary);
  padding: 0.875rem 2.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border-radius: var(--radius);
  transition: all 0.3s ease;
}

.athens-theme .btn-secondary:hover,
.athens-theme .btn-outline:hover {
  background: var(--athens-primary);
  color: #ffffff;
}

/* Classical Cards with subtle borders */
.athens-theme .property-card,
.athens-theme .card {
  background: #ffffff;
  border-radius: var(--radius);
  border: 1px solid rgba(213, 216, 220, 0.5);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
  transition: all 0.4s ease;
}

.athens-theme .property-card:hover,
.athens-theme .card:hover {
  box-shadow: var(--shadow-elevated);
  transform: translateY(-4px);
  border-color: var(--athens-gold);
}

.athens-theme .property-price {
  font-family: var(--font-display), serif;
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--athens-primary);
  letter-spacing: 0.02em;
}

/* Elegant Header */
.athens-theme header,
.athens-theme .navbar {
  background: var(--pwb-header-background-color, var(--athens-primary));
  border-bottom: 3px solid var(--athens-gold);
}

.athens-theme .nav-link {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 400;
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 0.75rem 1.25rem;
  transition: all 0.3s ease;
}

.athens-theme .nav-link:hover {
  color: var(--athens-gold);
}

/* Classical Footer with columns */
.athens-theme footer {
  background: var(--pwb-footer-background-color, #1C2833);
  color: var(--pwb-footer-text-color, #E8E8E8);
  padding: 4rem 0 2rem;
  border-top: 3px solid var(--athens-gold);
}

.athens-theme footer a {
  color: rgba(255, 255, 255, 0.8);
  transition: color 0.3s ease;
}

.athens-theme footer a:hover {
  color: var(--athens-gold);
}

/* Hero with marble texture overlay */
.athens-theme .hero-section,
.athens-theme .pwb-hero {
  position: relative;
  min-height: 80vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.athens-theme .hero-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(44, 62, 80, 0.85) 0%, rgba(28, 40, 51, 0.75) 100%);
}

.athens-theme .hero-title {
  font-family: var(--font-display), serif;
  font-size: 3.5rem;
  font-weight: 500;
  color: #ffffff;
  letter-spacing: 0.05em;
}

.athens-theme .hero-subtitle {
  font-family: var(--font-body);
  font-size: 1.125rem;
  color: rgba(255, 255, 255, 0.8);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* Gold accent decorative elements */
.athens-theme .gold-bar {
  width: 60px;
  height: 3px;
  background: var(--athens-gold);
  margin: 1rem 0;
}

.athens-theme .gold-border-top {
  border-top: 2px solid var(--athens-gold);
}

/* Forms with classical styling */
.athens-theme input,
.athens-theme select,
.athens-theme textarea {
  border: 1px solid #D5D8DC;
  border-radius: var(--radius);
  padding: 0.875rem 1.25rem;
  font-family: var(--font-body);
  transition: all 0.3s ease;
}

.athens-theme input:focus,
.athens-theme select:focus,
.athens-theme textarea:focus {
  border-color: var(--athens-primary);
  box-shadow: 0 0 0 3px rgba(44, 62, 80, 0.1);
  outline: none;
}

/* Utility classes */
.athens-theme .text-gold { color: var(--athens-gold); }
.athens-theme .text-primary { color: var(--athens-primary); }
.athens-theme .bg-marble { background-color: var(--athens-marble); }
.athens-theme .bg-primary { background-color: var(--athens-primary); }
.athens-theme .border-gold { border-color: var(--athens-gold); }

/* Section dividers - Greek key inspired */
.athens-theme .section-divider {
  height: 1px;
  background: linear-gradient(90deg, 
    transparent 0%, 
    var(--athens-gold) 20%, 
    var(--athens-gold) 80%, 
    transparent 100%
  );
  margin: 3rem 0;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .athens-theme .hero-title {
    font-size: 2.5rem;
  }
  .athens-theme .hero-section {
    min-height: 60vh;
  }
}

/* Dark mode variants */
@media (prefers-color-scheme: dark) {
  .pwb-auto-dark.athens-theme {
    --athens-marble: #1a1a1a;
    --athens-charcoal: #e8e8e8;
  }
}

.pwb-dark.athens-theme,
html.pwb-dark .athens-theme {
  --athens-marble: #1a1a1a;
  --athens-charcoal: #e8e8e8;
}
