/* Tool-specific styling for Meta-Data Remover (pairs with ../css/tools.css) */

/* Container uses existing .wrap from tools.css; keep content width similar to original */
.metadata-remover-container{
  max-width: 1000px;
  margin: 0 auto;
}

/* Intro card */
.metadata-remover-hero{
  display:flex;
  gap:16px;
  align-items:center;
}
.metadata-remover-hero img{
  width:56px;
  height:56px;
  border-radius:12px;
  border:1px solid var(--border-color);
  background: rgba(255,255,255,0.03);
}
.metadata-remover-hero h2{
  margin:0;
  font-size:1.35rem;
}
.metadata-remover-hero p{
  margin:.25rem 0 0;
  color: var(--text-secondary);
}

/* Supported types */
.metadata-remover-supported{
  margin-top: 14px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  padding: 14px;
  background: rgba(255,255,255,0.02);
}
.metadata-remover-supported h4{
  margin:0 0 .35rem;
  color: var(--success, #10b981);
}
.metadata-remover-file-types{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:10px;
}
.metadata-remover-file-type{
  padding:6px 12px;
  border-radius:999px;
  font-size:.9rem;
  background: rgba(16,185,129,.14);
  color: #a7f3d0;
  border: 1px solid rgba(16,185,129,.28);
}

/* Upload area */
.metadata-remover-upload-area{
  border: 2px dashed rgba(56,189,248,.55);
  border-radius: 14px;
  padding: 46px 18px;
  text-align:center;
  margin: 18px 0 18px;
  background: rgba(56,189,248,0.06);
  transition: background .15s ease, border-color .15s ease;
  cursor:pointer;
}
.metadata-remover-upload-area:hover{
  background: rgba(56,189,248,0.10);
}
.metadata-remover-upload-area.dragover{
  border-color: rgba(16,185,129,.75);
  background: rgba(16,185,129,0.08);
}
.metadata-remover-upload-icon{
  font-size: 2.2rem;
  margin-bottom: 8px;
  color: var(--text-secondary);
}
.metadata-remover-file-input{ display:none; }

/* Options */
.metadata-remover-controls{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin: 14px 0 10px;
}
.metadata-remover-option{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--border-color);
  background: rgba(255,255,255,0.02);
  color: var(--text-primary);
}
.metadata-remover-option input{ accent-color: var(--accent, #38bdf8); }

/* Center controls */
.center{
  text-align:center;
  margin: 8px 0 6px;
}
.center .btn{
  margin: 0 6px 8px 0;
}

/* Loading */
.metadata-remover-loading{
  display:none;
  text-align:center;
  padding: 22px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  background: rgba(255,255,255,0.02);
}
.metadata-remover-spinner{
  border: 4px solid rgba(255,255,255,.10);
  border-top: 4px solid var(--accent, #38bdf8);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  margin: 0 auto 12px;
  animation: mr-spin 1s linear infinite;
}
@keyframes mr-spin{ to{ transform: rotate(360deg); } }

/* Results */
.metadata-remover-results{ display:none; margin-top: 18px; }
.metadata-remover-card{
  border: 1px solid var(--border-color);
  border-radius: 14px;
  padding: 16px;
  background: rgba(255,255,255,0.02);
  margin-bottom: 14px;
}
.metadata-remover-card h3{
  margin:0 0 10px;
  display:flex;
  align-items:center;
  gap:8px;
}
.metadata-remover-preview{
  display:flex;
  gap: 16px;
  align-items:center;
  justify-content:center;
  margin: 12px 0;
  flex-wrap: wrap;
}
.metadata-remover-preview img{
  max-width: 200px;
  max-height: 200px;
  border-radius: 10px;
  border: 1px solid var(--border-color);
  background: rgba(255,255,255,0.02);
}

/* Stats */
.metadata-remover-stats{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(160px,1fr));
  gap: 10px;
  margin: 12px 0;
}
.metadata-remover-stat{
  text-align:center;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--border-color);
  background: rgba(255,255,255,0.02);
}
.metadata-remover-stat-number{
  font-size: 1.35rem;
  font-weight: 800;
  color: rgba(231,236,255,0.95);
  display:block;
}
.metadata-remover-stat-label{
  color: var(--text-secondary);
  font-size: .9rem;
}

/* Metadata list */
.metadata-remover-metadata-list{ max-height: 280px; overflow:auto; }
.metadata-remover-metadata-item{
  background: rgba(255,255,255,0.02);
  margin-bottom: 8px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--border-color);
  border-left: 4px solid rgba(239,68,68,.75);
}
.metadata-remover-metadata-key{
  font-weight: 700;
  color: rgba(199,210,254,0.95);
  display:block;
  margin-bottom: 4px;
}
.metadata-remover-metadata-value{
  color: var(--text-secondary);
  font-size: .9rem;
  word-break: break-all;
  font-family: ui-monospace, Menlo, Consolas, monospace;
}

/* Alerts */
.metadata-remover-alert{
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--border-color);
  margin: 10px 0;
}
.metadata-remover-alert.error{
  border-color: rgba(239,68,68,.35);
  background: rgba(239,68,68,.10);
  color: #fecaca;
}
.metadata-remover-alert.warn{
  border-color: rgba(245,158,11,.35);
  background: rgba(245,158,11,.10);
  color: #fde68a;
}

/* Download area */
.metadata-remover-download-area{
  text-align:center;
  margin-top: 12px;
  padding: 14px;
  background: rgba(56,189,248,0.08);
  border: 1px solid var(--border-color);
  border-radius: 12px;
}
.metadata-remover-download-area .small-note{
  margin-top: 8px;
}

/* Fine tune code blocks */
.metadata-remover-container code{
  padding: 1px 6px;
  border-radius: 10px;
  border: 1px solid var(--border-color);
  background: rgba(255,255,255,0.03);
}


/* Spacing helpers for this page */
.metadata-remover-section{ margin-top: 16px; }
.metadata-remover-privacy-note{ margin-top: 14px; }