/**
 * Universal Card Theme - Matches Footer Tint
 * All cards across all pages use these properties for consistency
 * Theme values: rgba(15, 23, 42, 0.55) - matches footer
 * 
 * This file applies the universal slate blue theme to ALL cards on ALL pages
 * Loads after unified-cards.css to override default white card styles
 */

/* ========================================
   UNIVERSAL CARD STYLES - All Pages
   ======================================== */

/* Base card - slate blue background matching footer tint */
/* Applies to ALL cards on ALL pages (unless explicitly white) */
.core-service-card {
  background: rgba(15, 23, 42, 0.78) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.35) !important;
  color: #ffffff !important;
}

.core-service-card:hover {
  background: rgba(15, 23, 42, 0.85) !important;
  border-color: rgba(148, 163, 184, 0.6) !important;
  box-shadow: 0 20px 52px rgba(15, 23, 42, 0.4) !important;
}

/* Card header - slightly lighter slate blue */
.core-service-card__header {
  background: rgba(15, 23, 42, 0.58) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.35) !important;
  background-image: none !important;
}

/* Card content - transparent to show card background */
.core-service-card__content {
  background: transparent !important;
}

/* Card text - white for readability on slate blue cards */
.core-service-card__title,
.core-service-card__blurb,
.core-service-card__eyebrow,
.core-service-card__service-item,
.core-service-card__service-item span,
.core-service-card__estimate-link,
.core-service-card__estimate-text,
.core-service-card__checkmark,
.core-service-card__diamond-icon {
  color: #ffffff !important;
}

.core-service-card__service-item {
  color: #e2e8f0 !important;
}

/* Card buttons - slate blue matching theme */
.core-service-card__learn-more-btn {
  background: rgba(15, 23, 42, 0.9) !important;
  color: #ffffff !important;
  border: 1px solid rgba(148, 163, 184, 0.5) !important;
}

.core-service-card__learn-more-btn:hover {
  background: rgba(15, 23, 42, 1) !important;
  border-color: rgba(148, 163, 184, 0.7) !important;
}

/* Retail cards - same slate blue theme */
.core-services--retail .core-service-card {
  background: rgba(15, 23, 42, 0.78) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.35) !important;
}

.core-services--retail .core-service-card__header {
  background: rgba(15, 23, 42, 0.58) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.35) !important;
}

/* Service highlights cards - same slate blue theme */
.core-services--service-highlights .core-service-card {
  background: rgba(15, 23, 42, 0.78) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.35) !important;
}

.core-services--service-highlights .core-service-card__header {
  background: rgba(15, 23, 42, 0.58) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.35) !important;
}

/* Core services section cards - same slate blue theme */
#core-services .core-service-card {
  background: rgba(15, 23, 42, 0.78) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.35) !important;
}

#core-services .core-service-card__header {
  background: rgba(15, 23, 42, 0.58) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.35) !important;
}

/* Generic card class - apply to all cards */
.card:not(.hero-card):not(.service-card-large):not(.related-service-card):not(.cleaning-package-card) {
  background: rgba(15, 23, 42, 0.78) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.35) !important;
  color: #ffffff !important;
}

.card:not(.hero-card):not(.service-card-large):not(.related-service-card):not(.cleaning-package-card):hover {
  background: rgba(15, 23, 42, 0.85) !important;
  border-color: rgba(148, 163, 184, 0.6) !important;
  box-shadow: 0 20px 52px rgba(15, 23, 42, 0.4) !important;
}

/* Service card class */
.service-card:not(.service-card-large):not(.related-service-card) {
  background: rgba(15, 23, 42, 0.78) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.35) !important;
  color: #ffffff !important;
}

.service-card:not(.service-card-large):not(.related-service-card):hover {
  background: rgba(15, 23, 42, 0.85) !important;
  border-color: rgba(148, 163, 184, 0.6) !important;
  box-shadow: 0 20px 52px rgba(15, 23, 42, 0.4) !important;
}