/* =========================================================
   ImageToolPro — Tool-Specific Extras
   ========================================================= */

.zoom-row { display: flex; align-items: center; gap: 10px; }
.zoom-value { font-size: 0.78rem; color: var(--text-muted); min-width: 40px; text-align: center; }

.compress-result {
  display: flex; align-items: center; gap: 16px; background: var(--bg-elevated);
  border: 1px solid var(--border-light); border-radius: var(--radius-sm); padding: 12px 14px; margin-top: 14px;
  flex-wrap: wrap;
}
.compress-result .stat { text-align: center; }
.compress-result .stat .label { font-size: 0.72rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.compress-result .stat .value { font-size: 1rem; font-weight: 700; color: var(--text-heading); }
.compress-result .arrow { color: var(--text-muted); }

.limitation-note {
  border-left: 3px solid var(--accent); background: var(--accent-soft); padding: 10px 14px;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0; font-size: 0.85rem; margin: 14px 0;
}

.collage-canvas-wrap { display: flex; align-items: center; justify-content: center; padding: 20px; }

.meme-canvas-wrap { display: flex; align-items: center; justify-content: center; padding: 16px; }

.disabled-format { opacity: 0.5; }

/* Loading spinner for heavier operations (bulk zip, enlarge) */
.spinner {
  width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.35);
  border-top-color: #fff; animation: spin 0.7s linear infinite; display: inline-block;
}
@keyframes spin { to { transform: rotate(360deg); } }

@media print {
  .site-header, .site-footer, .ad-slot, #backToTop { display: none !important; }
}