/* ===============================
   Tema escuro — EAFC Marketplace
   Base: #0A0A0A | Acento: #FF6F00
   =============================== */

:root{
  --bg: #0A0A0A;
  --surface: #121212;
  --surface-2: #151515;
  --chip: #1a1a1a;
  --border: #262626;
  --border-soft: #1e1e1e;
  --text: #EAEAEA;
  --text-muted: #A9A9A9;
  --accent: #FF6F00;
  --accent-2: #E56500; /* hover */
  --accent-3: #FF7F1A; /* active */
  --danger-bg: #3c1111;
  --danger-bd: #7a2424;
  --danger-tx: #ffb3b3;
  --info-bg: #16120e; /* acento diluído para alert */
}

/* Ajuda o navegador a renderizar formulários no modo escuro */
.eafcmp-create,
.eafcmp-grid,
.eafcmp-single,
.eafcmp-card,
.eafcmp-table { color-scheme: dark; }

/* Textos e containers */
.eafcmp-single__header,
.eafcmp-single__info,
.eafcmp-create,
.eafcmp-card,
.eafcmp-alert,
.eafcmp-grid,
.eafcmp-table { color: var(--text); }

.eafcmp-create{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
}

.eafcmp-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px;
}

.eafcmp-alert{
  padding:12px;
  border:1px solid var(--border);
  background: var(--info-bg);
  border-radius:8px;
  margin:10px 0;
}

/* Chips / Badges */
.eafcmp-chip{
  display:inline-block;
  padding:4px 8px;
  border-radius:999px;
  background: var(--chip);
  color: var(--text-muted);
  margin-right:6px;
  font-size:12px;
  border:1px solid var(--border-soft);
}

.eafcmp-badge{
  display:inline-block;
  padding:4px 8px;
  border-radius:6px;
  margin-left:8px;
  font-size:12px;
  border:1px solid var(--border);
  background: var(--chip);
  color: var(--text);
}

.eafcmp-badge--sold{
  background: var(--danger-bg);
  color: var(--danger-tx);
  border-color: var(--danger-bd);
}

.eafcmp-badge--mini{
  background:#141a24;
  color:#cbd5e1;
  border:1px solid #1f2937;
  font-size:11px;
  padding:2px 6px;
  border-radius:6px;
}

/* Títulos */
.eafcmp-single__header h1{ 
  margin: 0 0 6px 0; 
  color: var(--text);
}

/* Galeria */
.eafcmp-single__gallery{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.eafcmp-img{
  width:100%;
  height:auto;
  border-radius:10px;
  border:1px solid var(--border);
  background:#0f0f0f;
}

/* Grade de listagem */
.eafcmp-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
@media (max-width:900px){ .eafcmp-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px){ .eafcmp-grid{ grid-template-columns:repeat(1,minmax(0,1fr)); } }

.eafcmp-card--listing{ display:flex; flex-direction:column; gap:10px; }
.eafcmp-card__thumb img{
  width:100%;
  height:auto;
  border-radius:10px;
  border:1px solid var(--border);
  background:#0f0f0f;
}
.eafcmp-listing-meta{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.eafcmp-price-mini{ font-weight:700; color:var(--text); }

/* Paginação */
.eafcmp-pagination{ display:flex; gap:6px; margin-top:16px; }
.eafcmp-pagination a{
  padding:6px 10px;
  border:1px solid var(--border);
  border-radius:8px;
  text-decoration:none;
  background: var(--surface-2);
  color: var(--text);
}
.eafcmp-pagination a:hover{ border-color: var(--accent); }
.eafcmp-pagination .is-active{
  background: var(--accent);
  color: #0A0A0A;
  border-color: var(--accent);
}

/* Formulários */
.eafcmp-form-row{ margin-bottom:14px; }
.eafcmp-form-row label{ display:block; margin-bottom:6px; font-weight:600; color:var(--text); }
.eafcmp-inline{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.eafcmp-pill{ padding:6px 10px; border:1px solid var(--border); border-radius:999px; background:var(--chip); color:var(--text); }

/* Inputs, selects, textarea */
.eafcmp-create input[type="text"],
.eafcmp-create input[type="number"],
.eafcmp-create input[type="file"],
.eafcmp-create select,
.eafcmp-create textarea{
  background:#0F0F0F;
  color:var(--text);
  border:1px solid var(--border);
  border-radius:10px;
  padding:10px 12px;
  width:100%;
  outline:none;
}
.eafcmp-create input::placeholder,
.eafcmp-create textarea::placeholder{ color: var(--text-muted); }

.eafcmp-create input:focus,
.eafcmp-create select:focus,
.eafcmp-create textarea:focus{
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(255,111,0,0.25);
}

/* Botões */
.eafcmp-btn{
  display:inline-block;
  padding:10px 16px;
  border-radius:10px;
  border:1px solid var(--border);
  text-decoration:none;
  background: var(--surface-2);
  color: var(--text);
  transition: border-color .15s, background .15s, color .15s, transform .05s;
  cursor:pointer;
}
.eafcmp-btn:hover{ border-color: var(--accent); }
.eafcmp-btn:active{ transform: translateY(1px); }

.eafcmp-btn--buy{
  background: var(--accent);
  color: #0A0A0A;
  border-color: var(--accent);
}
.eafcmp-btn--buy:hover{ background: var(--accent-2); border-color: var(--accent-2); }
.eafcmp-btn--buy:active{ background: var(--accent-3); border-color: var(--accent-3); }

/* Tabela */
.eafcmp-table{ width:100%; border-collapse:collapse; }
.eafcmp-table th, .eafcmp-table td{
  border:1px solid var(--border);
  padding:8px;
  text-align:left;
  color: var(--text);
}
.eafcmp-table th{ background:#0F0F0F; }

/* Câmera / Canvas */
.eafcmp-camera{
  border:1px dashed var(--border);
  border-radius:10px;
  padding:10px;
  position:relative;
  background: #0F0F0F;
}
.eafcmp-camera .eafcmp-open-camera{
  display:inline-block;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:8px;
  background: var(--surface-2);
  color: var(--text);
  text-decoration:none;
}
.eafcmp-camera .eafcmp-open-camera:hover{ border-color: var(--accent); }

.eafcmp-camera video{
  display:none;
  width:100%;
  max-height:280px;
  border-radius:8px;
  margin-top:10px;
  border:1px solid var(--border);
  background:#000;
}
.eafcmp-camera.is-recording video{ display:block; }
.eafcmp-camera canvas{ display:none; }
.eafcmp-camera .eafcmp-snap{ margin-top:10px; }

#img_main, #img_res, #img_coins{
  color: var(--text-muted);
  background:#0F0F0F;
  border:1px solid var(--border);
  border-radius:8px;
  padding:6px;
}

/* Estilo do botão nativo do input file (suporte moderno) */
input[type="file"]::file-selector-button{
  background: var(--surface-2);
  color: var(--text);
  border:1px solid var(--border);
  border-radius:8px;
  padding:6px 10px;
  margin-right:8px;
  cursor:pointer;
}
input[type="file"]::file-selector-button:hover{ border-color: var(--accent); }

/* WebKit legacy */
input[type="file"]::-webkit-file-upload-button{
  background: var(--surface-2);
  color: var(--text);
  border:1px solid var(--border);
  border-radius:8px;
  padding:6px 10px;
  margin-right:8px;
  cursor:pointer;
}

/* Preço / Info */
.eafcmp-price__label{ color: var(--text-muted); }
.eafcmp-price__value{ color: var(--text); font-weight: 800; }

/* Links */
.eafcmp-listing-actions a{ color: var(--text); }
.eafcmp-listing-actions a:hover{ color: var(--text); border-color: var(--accent); }

/* Responsividade */
@media (max-width: 600px){
  .eafcmp-single__gallery{ grid-template-columns:1fr; }
}
