/* Padrão visual aprovado: Mensagem de Punição / Comandos Custom.
   Aplicação restrita às subpáginas AutoMod, Logs Detalhados e Punições Temporárias. */

#spike-page-automod,
#spike-page-logs,
#spike-page-punicoes-temp {
  --spike-ui-bg: #0a0e0b;
  --spike-ui-surface: #111715;
  --spike-ui-surface-raised: #151c19;
  --spike-ui-input: #0a0e0b;
  --spike-ui-border: #303a35;
  --spike-ui-text: #e8eee9;
  --spike-ui-muted: #929b96;
  --spike-ui-green: #00ff88;
  color: var(--spike-ui-text);
}

/* AutoMod Avançado */
#spike-page-automod { --bg: #0a0e0b; --card: #111715; --text: #e8eee9; --text2: #929b96; --green: #00ff88; --border: #303a35; }
#spike-page-automod .am-container { max-width: 900px; color: #e8eee9; }
#spike-page-automod .am-title { color: #00ff88; }
#spike-page-automod .am-card {
  background: linear-gradient(180deg, #111715 0%, #0d1310 100%);
  border: 1px solid #303a35;
  border-radius: 14px;
  color: #e8eee9;
}
#spike-page-automod .am-card h3 { color: #e8eee9; }
#spike-page-automod .am-input-group { margin-top: 18px; }
#spike-page-automod .am-input-group label { color: #aebbb2; margin-bottom: 7px; }
#spike-page-automod .am-input-group input,
#spike-page-automod .am-input-group select,
#spike-page-automod .am-select-trigger {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 0 12px !important;
  border: 1px solid #303a35 !important;
  border-radius: 9px !important;
  background: #0a0e0b !important;
  color: #e8eee9 !important;
  font: inherit;
  font-size: 12px;
  line-height: 1.35;
  text-align: left;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
#spike-page-automod .am-input-group input::placeholder { color: #748279; opacity: 1; }
#spike-page-automod .am-input-group input:hover,
#spike-page-automod .am-input-group select:hover,
#spike-page-automod .am-select-trigger:hover { border-color: #00c96f !important; background: #0b100e !important; }
#spike-page-automod .am-input-group input:focus,
#spike-page-automod .am-input-group select:focus,
#spike-page-automod .am-select-trigger:focus-visible {
  border-color: #00ff88 !important;
  box-shadow: 0 0 0 3px rgba(0,255,136,.12) !important;
  outline: none;
}
#spike-page-automod .am-btn {
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid #00ff88;
  border-radius: 9px;
  background: #00ff88;
  color: #07100d;
}
#spike-page-automod .am-btn:hover:not(:disabled) { opacity: .9; box-shadow: 0 5px 18px rgba(0,255,136,.14); }
#spike-page-automod .am-btn:focus-visible { outline: 2px solid #00ff88; outline-offset: 3px; }
#spike-page-automod .am-word-tag { background: #151c19; border-color: #303a35; }
#spike-page-automod .am-modal { background: #111715; border-color: #303a35; color: #e8eee9; }
#spike-page-automod .am-modal-head { border-color: #303a35; }
#spike-page-automod .am-modal-close,
#spike-page-automod .am-modal-option { background: #0a0e0b; border-color: #303a35; color: #e8eee9; }
#spike-page-automod .am-modal-option:hover,
#spike-page-automod .am-modal-option.selected { background: rgba(0,255,136,.1); border-color: #00ff88; color: #00ff88; }
#spike-page-automod .am-selected-tag { background: #00ff88; color: #07100d; }

/* Logs Detalhados */
#spike-page-logs {
  --bg: #0a0e0b; --card: #111715; --text: #e8eee9; --text2: #929b96;
  --green: #00ff88; --blue: #7383ff; --yellow: #f6cf68; --red: #ff5d72; --border: #303a35;
  box-sizing: border-box;
  color: #e8eee9;
}
#spike-page-logs .logs-react { color: #e8eee9; }
#spike-page-logs .title { color: #00ff88; }
#spike-page-logs .filters,
#spike-page-logs .disabled-card,
#spike-page-logs .log-table {
  background: linear-gradient(180deg, #111715 0%, #0d1310 100%);
  border-color: #303a35;
  border-radius: 12px;
}
#spike-page-logs .filters { gap: 12px; }
#spike-page-logs .filters input:not([type="checkbox"]):not([type="radio"]),
#spike-page-logs .filters select,
#spike-page-logs .filters .logs-channel-picker-trigger,
#spike-page-logs .filters .logs-type-picker-trigger {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 0 12px !important;
  border: 1px solid #303a35 !important;
  border-radius: 9px !important;
  background: #0a0e0b !important;
  color: #e8eee9 !important;
  font: inherit;
  font-size: 12px;
  line-height: 1.35;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
#spike-page-logs .filters input::placeholder { color: #748279; opacity: 1; }
#spike-page-logs .filters input:hover,
#spike-page-logs .filters select:hover,
#spike-page-logs .filters .logs-channel-picker-trigger:hover,
#spike-page-logs .filters .logs-type-picker-trigger:hover { border-color: #00c96f !important; background: #0b100e !important; }
#spike-page-logs .filters input:focus,
#spike-page-logs .filters select:focus,
#spike-page-logs .filters .logs-channel-picker-trigger:focus-visible,
#spike-page-logs .filters .logs-type-picker-trigger:focus-visible {
  border-color: #00ff88 !important;
  box-shadow: 0 0 0 3px rgba(0,255,136,.12) !important;
  outline: none;
}
#spike-page-logs .filters button,
#spike-page-logs .btn-perfil {
  min-height: 40px;
  border: 1px solid #00ff88;
  border-radius: 9px;
  background: #00ff88;
  color: #07100d;
  font-weight: 700;
}
#spike-page-logs .filters button:hover,
#spike-page-logs .btn-perfil:hover { filter: brightness(.92); }
#spike-page-logs .drag-btn { min-height: 40px; background: #0d1310; border-color: #303a35; color: #aebbb2; border-radius: 9px; }
#spike-page-logs .log-table { overflow-x: auto; overscroll-behavior-x: contain; }
#spike-page-logs thead { background: #151c19; }
#spike-page-logs th { color: #00ff88; }
#spike-page-logs th, #spike-page-logs td { border-color: #303a35; }
#spike-page-logs tr:hover { background: #151c19; }
#spike-page-logs .disabled-card h2 { color: #f6cf68; }
#spike-page-logs .delete, #spike-page-logs .ban { background: rgba(255,93,114,.13); color: #ff5d72; }
#spike-page-logs .kick { background: rgba(246,207,104,.13); color: #f6cf68; }
#spike-page-logs .join { background: rgba(0,255,136,.12); color: #00ff88; }
#spike-page-logs .leave, #spike-page-logs .edit, #spike-page-logs .role { background: rgba(115,131,255,.14); color: #a5afff; }

/* Punições Temporárias */
#spike-page-punicoes-temp {
  --bg: #0a0e0b; --card: #111715; --card-2: #151c19; --card-3: #0d1310;
  --border: #303a35; --text: #e8eee9; --text-dim: #aebbb2; --green: #00ff88;
  --green-dim: rgba(0,255,136,.12); --discord: #00ff88; --discord-dim: rgba(0,255,136,.12);
  background: #0a0e0b !important;
  color: #e8eee9;
}
#spike-page-punicoes-temp .page-header { background: linear-gradient(135deg, rgba(0,255,136,.07), transparent 55%); border-color: #303a35; }
#spike-page-punicoes-temp .page-header h1 { color: #00ff88; }
#spike-page-punicoes-temp :is(.context-bar > div, .card, .confirmation-summary, .member-suggestions, .modal, .member-list) {
  background-color: #111715;
  border-color: #303a35;
  color: #e8eee9;
}
#spike-page-punicoes-temp .card { background: linear-gradient(180deg, #111715 0%, #0d1310 100%); border-radius: 14px; }
#spike-page-punicoes-temp :is(.field label, .context-bar strong, .page-header .subtitle, .card-header small, .field small, .field-note, .text-dim) { color: #aebbb2; }
#spike-page-punicoes-temp :is(.input, select, textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="color"])) {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 0 12px !important;
  border: 1px solid #303a35 !important;
  border-radius: 9px !important;
  background: #0a0e0b !important;
  color: #e8eee9 !important;
  font: inherit;
  font-size: 12px;
  line-height: 1.4;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
#spike-page-punicoes-temp textarea,
#spike-page-punicoes-temp .textarea { min-height: 88px; padding: 10px 12px !important; resize: vertical; }
#spike-page-punicoes-temp .member-input { width: auto; min-height: 36px; padding: 6px 4px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
#spike-page-punicoes-temp .member-input:focus { border: 0 !important; box-shadow: none !important; }
#spike-page-punicoes-temp .selected-users { min-height: 52px; background: #0a0e0b; border-color: #303a35; border-radius: 9px; }
#spike-page-punicoes-temp .selected-users:focus-within { border-color: #00ff88; box-shadow: 0 0 0 3px rgba(0,255,136,.12); }
#spike-page-punicoes-temp :is(.input, select, textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="color"]))::placeholder { color: #748279; opacity: 1; }
#spike-page-punicoes-temp :is(.input, select, textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="color"])):hover { border-color: #00c96f !important; background-color: #0b100e !important; }
#spike-page-punicoes-temp :is(.input, select, textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="color"])):focus {
  border-color: #00ff88 !important;
  box-shadow: 0 0 0 3px rgba(0,255,136,.12) !important;
  outline: none !important;
}
#spike-page-punicoes-temp :is(.input, select, textarea, input):disabled { opacity: .55; cursor: not-allowed; }
#spike-page-punicoes-temp .field { margin-bottom: 22px; }
#spike-page-punicoes-temp .field label { margin-bottom: 8px; }
#spike-page-punicoes-temp :is(.btn:not(.danger):not(.warn), .btn-primary, .primary-btn) {
  border-color: #00ff88;
  border-radius: 9px;
  background: #00ff88;
  color: #07100d;
}
#spike-page-punicoes-temp .btn.secondary { border-color: #303a35; background: #151c19; color: #e8eee9; }
#spike-page-punicoes-temp .btn:focus-visible { outline: 2px solid #00ff88; outline-offset: 3px; }
#spike-page-punicoes-temp .modal { border-radius: 14px; }
#spike-page-punicoes-temp .modal h2 { color: #e8eee9; }
#spike-page-punicoes-temp .modal-backdrop { background: rgba(0,0,0,.72); }

@media (max-width: 640px) {
  #spike-page-automod .am-container { padding: 16px 14px calc(124px + env(safe-area-inset-bottom)); }
  #spike-page-automod .am-card { padding: 16px; border-radius: 12px; }
  #spike-page-automod .am-input-group input,
  #spike-page-automod .am-input-group select,
  #spike-page-automod .am-select-trigger,
  #spike-page-automod .am-btn { min-height: 44px; }
  #spike-page-logs .logs-react { padding: 14px; }
  #spike-page-logs .filters input:not([type="checkbox"]):not([type="radio"]),
  #spike-page-logs .filters select,
  #spike-page-logs .filters .logs-channel-picker-trigger,
  #spike-page-logs .filters .logs-type-picker-trigger,
  #spike-page-logs .filters button,
  #spike-page-logs .btn-perfil { min-height: 44px; }
  #spike-page-logs .filters { padding: 13px; gap: 10px; }
  #spike-page-logs .log-table { border-radius: 10px; }
  #spike-page-punicoes-temp .container { padding: 16px 14px calc(24px + env(safe-area-inset-bottom)); }
  #spike-page-punicoes-temp .card { padding: 18px 16px; }
  #spike-page-punicoes-temp :is(.input, select, input:not([type="checkbox"]):not([type="radio"]):not([type="color"])) { min-height: 44px; }
  #spike-page-punicoes-temp textarea, #spike-page-punicoes-temp .textarea { min-height: 96px; }
  #spike-page-punicoes-temp .modal { padding: 20px 16px; max-height: calc(100dvh - 24px); }
  #spike-page-punicoes-temp .form-actions, #spike-page-punicoes-temp .modal-actions { gap: 8px; }
}

/* Precedência explícita sobre as regras globais de campos do dashboard. */
#spike-page-automod .am-input-group input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
#spike-page-automod .am-input-group select:not([type="checkbox"]):not([type="radio"]):not([type="color"]) {
  border: 1px solid #303a35 !important;
  border-radius: 9px !important;
  background: #0a0e0b !important;
  color: #e8eee9 !important;
}
#spike-page-automod .am-input-group input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
#spike-page-automod .am-input-group select:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus {
  border-color: #00ff88 !important;
  box-shadow: 0 0 0 3px rgba(0,255,136,.12) !important;
}
#spike-page-logs .filters input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
#spike-page-logs .filters select:not([type="checkbox"]):not([type="radio"]):not([type="color"]) {
  border: 1px solid #303a35 !important;
  border-radius: 9px !important;
  background: #0a0e0b !important;
  color: #e8eee9 !important;
}
#spike-page-logs .filters input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
#spike-page-logs .filters select:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus {
  border-color: #00ff88 !important;
  box-shadow: 0 0 0 3px rgba(0,255,136,.12) !important;
}
#spike-page-punicoes-temp .field input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
#spike-page-punicoes-temp .field select:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
#spike-page-punicoes-temp .field textarea,
#spike-page-punicoes-temp .modal input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
#spike-page-punicoes-temp .modal select:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
#spike-page-punicoes-temp .modal textarea {
  border: 1px solid #303a35 !important;
  border-radius: 9px !important;
  background: #0a0e0b !important;
  color: #e8eee9 !important;
}
#spike-page-punicoes-temp .field input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
#spike-page-punicoes-temp .field select:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
#spike-page-punicoes-temp .field textarea:focus,
#spike-page-punicoes-temp .modal input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
#spike-page-punicoes-temp .modal select:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus,
#spike-page-punicoes-temp .modal textarea:focus {
  border-color: #00ff88 !important;
  box-shadow: 0 0 0 3px rgba(0,255,136,.12) !important;
  outline: none !important;
}
#spike-page-punicoes-temp .member-picker input.member-input:not([type="checkbox"]):not([type="radio"]):not([type="color"]) {
  width: auto !important;
  min-height: 36px !important;
  padding: 6px 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#spike-page-punicoes-temp .member-picker input.member-input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):focus {
  border: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 640px) {
  #spike-page-automod .am-input-group input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  #spike-page-automod .am-input-group select:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  #spike-page-automod .am-select-trigger { min-height: 44px !important; }
  #spike-page-logs .filters input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  #spike-page-logs .filters select:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  #spike-page-logs .filters .logs-channel-picker-trigger,
  #spike-page-logs .filters .logs-type-picker-trigger { min-height: 44px !important; }
  #spike-page-punicoes-temp .field input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  #spike-page-punicoes-temp .field select:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  #spike-page-punicoes-temp .field textarea,
  #spike-page-punicoes-temp .modal input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  #spike-page-punicoes-temp .modal select:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
  #spike-page-punicoes-temp .modal textarea { min-height: 44px !important; }
  #spike-page-punicoes-temp .field textarea,
  #spike-page-punicoes-temp .modal textarea { min-height: 96px !important; }
}