/* ==========================================================================
   ToolsMB - Common Styles (assets/common.css)
   Clean, Apple-inspired Design System for 21 Digital Tools
   ========================================================================== */

:root {
  --color-rust: #D96B27;
  --color-rust-hover: #C25B1D;
  --color-rust-subtle: #FAF0E8;
  --color-brand: #1E3F2E;
  --color-brand-light: #28543E;
  --color-canvas: #F6F6F2;
  --color-forest-dark: #131A16;
}

body {
  font-family: "Prompt", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background-color: #F6F6F2;
  color: #1E293B;
  -webkit-font-smoothing: antialiased;
}

/* Glass Header Navigation */
.glass-nav {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* Checkerboard Pattern for Transparent Backgrounds */
.checkerboard {
  background-color: #ffffff;
  background-image:
    linear-gradient(45deg, #e2e8f0 25%, transparent 25%),
    linear-gradient(-45deg, #e2e8f0 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #e2e8f0 75%),
    linear-gradient(-45deg, transparent 75%, #e2e8f0 75%);
  background-size: 20px 20px;
  background-position:
    0 0,
    0 10px,
    10px -10px,
    -10px 0;
}

/* Tool Cards Micro-Interactions */
.tool-card {
  transition: transform 200ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 200ms ease, border-color 150ms ease;
}
.tool-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px -6px rgba(26, 35, 30, 0.09), 0 4px 10px -2px rgba(0, 0, 0, 0.04);
}
.tool-card:active {
  transform: scale(0.99);
}

/* PDF Manager Page Sorter & Drag & Drop Styles */
.pdf-page-card {
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  position: relative;
  transition: transform 180ms ease-out, box-shadow 150ms ease, border-color 150ms ease;
}
.pdf-drag-handle {
  touch-action: none !important;
  color: #94a3b8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  border-radius: 8px;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  transition: color 150ms ease, background-color 150ms ease;
}
.pdf-drag-handle:hover,
.pdf-drag-handle:active,
.pdf-drag-handle:focus-visible {
  color: #D96B27 !important;
  background-color: rgba(217, 107, 39, 0.08);
}
.pdf-drag-handle:focus-visible {
  outline: 2px solid #D96B27;
  outline-offset: 1px;
}
.pdf-drag-handle svg {
  pointer-events: none;
}
.pdf-page-card img {
  -webkit-user-drag: none;
  user-drag: none;
}
.pdf-page-card:focus-visible {
  outline: 2px solid #D96B27;
  outline-offset: 2px;
}
.pdf-page-card.pdf-highlighted {
  border-color: #D96B27 !important;
  box-shadow: 0 0 0 2px rgba(217, 107, 39, 0.4), 0 4px 14px rgba(217, 107, 39, 0.2) !important;
}

@keyframes pdf-rust-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(217, 107, 39, 0.8), 0 4px 14px rgba(217, 107, 39, 0.2);
    transform: scale(1.02);
  }
  50% {
    box-shadow: 0 0 0 6px rgba(217, 107, 39, 0.25), 0 6px 18px rgba(217, 107, 39, 0.3);
    transform: scale(1.03);
  }
  100% {
    box-shadow: 0 0 0 2px rgba(217, 107, 39, 0.4), 0 4px 14px rgba(217, 107, 39, 0.2);
    transform: scale(1);
  }
}
.pdf-page-card.pdf-pulse-anim {
  animation: pdf-rust-pulse 0.45s ease-out 1;
}
.pdf-drag-placeholder {
  opacity: 0.35 !important;
  border: 2px dashed #D96B27 !important;
  background-color: rgba(217, 107, 39, 0.06) !important;
  box-shadow: none !important;
  transition: none !important;
}
.pdf-drag-ghost {
  position: fixed !important;
  z-index: 9999 !important;
  pointer-events: none !important;
  box-shadow: 0 20px 32px -6px rgba(0, 0, 0, 0.32), 0 0 0 2px #D96B27 !important;
  opacity: 0.96;
  cursor: grabbing !important;
  will-change: transform !important;
  transition: none !important;
  margin: 0 !important;
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  .tool-card,
  .pdf-page-card {
    transition: none !important;
  }
  .pdf-page-card.pdf-pulse-anim {
    animation: none !important;
  }
}

