/* GA Icons CSS - Using ga.new.svg merged sprite */

/* New merged SVG icons */
.ga-new-icon {
    display: inline-block;
    background-image: url('ga.new.svg');
    background-repeat: no-repeat;
    background-size: 1000px 1021px;
    width: 69px;
    height: 69px;
}

/* Size variants */
.ga-new-icon.small {
    width: 34px;
    height: 34px;
    background-size: 500px 510px;
}

.ga-new-icon.large {
    width: 138px;
    height: 138px;
    background-size: 2000px 2042px;
}

/* Individual icon positions */
/* Row 1 - y=0 */
.ga-new-icon.grid-blue {
    background-position: 0px 0px;
}
.ga-new-icon.document {
    background-position: -298px 0px;
}
.ga-new-icon.chef {
    background-position: -611px 0px;
}
.ga-new-icon.network {
    background-position: -931px 0px;
}

/* Row 2 - y=193px */
.ga-new-icon.chart {
    background-position: 0px -193px;
}
.ga-new-icon.bus {
    background-position: -298px -193px;
}
.ga-new-icon.clipboard {
    background-position: -611px -193px;
}
.ga-new-icon.tools {
    background-position: -931px -193px;
}

/* Row 3 - y=389px */
.ga-new-icon.user {
    background-position: 0px -389px;
}
.ga-new-icon.leaf {
    background-position: -298px -389px;
}
.ga-new-icon.shield {
    background-position: -611px -389px;
}

/* Default icons show gray background (no modifier needed) */

/* Blue background modifier - use blue icons group (y offset +562px) */
.ga-new-icon.blue.grid-blue {
    background-position: 0px -562px;
}
.ga-new-icon.blue.document {
    background-position: -298px -562px;
}
.ga-new-icon.blue.chef {
    background-position: -611px -562px;
}
.ga-new-icon.blue.network {
    background-position: -931px -562px;
}
.ga-new-icon.blue.chart {
    background-position: 0px -755px; /* -562 + -193 */
}
.ga-new-icon.blue.bus {
    background-position: -298px -755px;
}
.ga-new-icon.blue.clipboard {
    background-position: -611px -755px;
}
.ga-new-icon.blue.tools {
    background-position: -931px -755px;
}
.ga-new-icon.blue.user {
    background-position: 0px -951px; /* -562 + -389 */
}
.ga-new-icon.blue.leaf {
    background-position: -298px -951px;
}
.ga-new-icon.blue.shield {
    background-position: -611px -951px;
}

/* Icon grid layout for showcasing */
.ga-icon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 16px;
  padding: 16px;
}

.ga-icon-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  text-align: center;
}

.ga-icon-item:hover {
  background-color: #f5f5f5;
  border-color: #ccc;
}

.ga-icon-label {
  margin-top: 8px;
  font-size: 12px;
  color: #666;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Print styles */
@media print {
  .ga-icon {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}