/* Dashboard Summary - Gradient Style */
/* This file is loaded ONLY when gradient mode is enabled */

.dswp-plugin-container .dashboard-summary .card {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
  border: none !important;
  border-left: none !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
  color: #ffffff !important;
}

.dswp-plugin-container .dashboard-summary .card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: rgba(255, 255, 255, 0.1) !important;
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
  display: block !important;
}

/* Gradient colors for each card */
.dswp-plugin-container .dashboard-summary .card:nth-child(1) {
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%) !important;
}

.dswp-plugin-container .dashboard-summary .card:nth-child(2) {
  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%) !important;
}

.dswp-plugin-container .dashboard-summary .card:nth-child(3) {
  background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%) !important;
}

.dswp-plugin-container .dashboard-summary .card:nth-child(4) {
  background: linear-gradient(135deg, #fa709a 0%, #fee140 100%) !important;
}

.dswp-plugin-container .dashboard-summary .card:nth-child(5) {
  background: linear-gradient(135deg, #30cfd0 0%, #330867 100%) !important;
}

.dswp-plugin-container .dashboard-summary .card:nth-child(6) {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
}

/* White text and icons for gradient mode */
.dswp-plugin-container .dashboard-summary a.card,
.dswp-plugin-container .dashboard-summary a.card:link,
.dswp-plugin-container .dashboard-summary a.card:visited,
.dswp-plugin-container .dashboard-summary a.card:hover,
.dswp-plugin-container .dashboard-summary a.card:active {
  color: #ffffff !important;
}

.dswp-plugin-container .dashboard-summary a.card h2,
.dswp-plugin-container .dashboard-summary a.card .card-value,
.dswp-plugin-container .dashboard-summary a.card .card-content,
.dswp-plugin-container .dashboard-summary a.card * {
  color: #ffffff !important;
}

.dswp-plugin-container .dashboard-summary .card h2 {
  color: rgba(255, 255, 255, 0.9) !important;
}

.dswp-plugin-container .dashboard-summary .card-value {
  color: #ffffff !important;
}

.dswp-plugin-container .dashboard-summary .card p {
  color: #ffffff !important;
}

/* Icon styling for gradient mode */
.dswp-plugin-container .dashboard-summary .card-icon {
  color: rgba(255, 255, 255, 0.95) !important;
  background: rgba(255, 255, 255, 0.2) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(10px) !important;
}

.dswp-plugin-container .dashboard-summary .card-icon.dashicons,
.dswp-plugin-container .dashboard-summary .card-icon.dashicons:before {
  color: rgba(255, 255, 255, 0.95) !important;
}

.dswp-plugin-container .dashboard-summary a.card:hover::before {
  opacity: 1 !important;
}

.dswp-plugin-container .dashboard-summary .card:hover {
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
  transform: translateY(-3px) !important;
}

/* Mobile responsive for gradient mode */
@media only screen and (min-width: 481px) and (max-width: 767px) {
  .dswp-plugin-container .dashboard-summary .card-icon {
    background: rgba(255, 255, 255, 0.2) !important;
    border-radius: 12px !important;
    color: rgba(255, 255, 255, 0.95) !important;
  }

  .dswp-plugin-container .dashboard-summary .card-icon.dashicons {
    color: rgba(255, 255, 255, 0.95) !important;
  }
}

@media only screen and (max-width: 480px) {
  .dswp-plugin-container .dashboard-summary .card-icon {
    background: rgba(255, 255, 255, 0.2) !important;
    border-radius: 10px !important;
    color: rgba(255, 255, 255, 0.95) !important;
  }

  .dswp-plugin-container .dashboard-summary .card-icon.dashicons,
  .dswp-plugin-container .dashboard-summary .card-icon.dashicons:before {
    color: rgba(255, 255, 255, 0.95) !important;
  }
}