/* ==========================================================
   Shared Button System
   ----------------------------------------------------------
   Keep all site buttons visually consistent. Use semantic
   classes to choose the colour by function:
   .primary / .btn-primary  = main action
   .success / .btn-success  = start/enable/save/restore positive
   .warning / .btn-warning  = restart/update/validate/caution
   .danger / .btn-danger    = stop/delete/ban/destructive
   .ghost / .btn-ghost      = secondary/cancel/close/view
   .info / .btn-info        = neutral information/download/map
   .small / .btn-sm         = compact table/action buttons
   ========================================================== */

:root {
  --btn-radius: var(--radius, 12px);
  --btn-font-size: 13px;
  --btn-small-font-size: 12px;
  --btn-pad-y: 10px;
  --btn-pad-x: 16px;
  --btn-small-pad-y: 7px;
  --btn-small-pad-x: 11px;
}

button,
.btn,
.button,
.button-link,
a.btn,
a.button-link,
input[type="button"],
input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  padding: var(--btn-pad-y) var(--btn-pad-x);
  border: 1px solid rgba(249,115,22,.35);
  border-radius: var(--btn-radius);
  background: linear-gradient(135deg, var(--orange, #f97316), var(--orange2, #c2590e));
  color: #130800;
  font-family: inherit;
  font-size: var(--btn-font-size);
  font-weight: 800;
  letter-spacing: .25px;
  line-height: 1.1;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(0,0,0,.18);
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease, border-color .16s ease, color .16s ease, background .16s ease;
}

button:hover,
.btn:hover,
.button:hover,
.button-link:hover,
a.btn:hover,
a.button-link:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: var(--glow-orange, 0 0 18px rgba(249,115,22,.35));
}

button:active,
.btn:active,
.button:active,
.button-link:active,
a.btn:active,
a.button-link:active,
input[type="button"]:active,
input[type="submit"]:active {
  transform: translateY(0);
  filter: brightness(.95);
}

button:disabled,
.btn:disabled,
.button:disabled,
.button-link.disabled,
a.btn.disabled,
input[type="button"]:disabled,
input[type="submit"]:disabled {
  opacity: .55;
  cursor: not-allowed;
  filter: grayscale(.35);
  transform: none;
  box-shadow: none;
}

/* Sizes */
.small,
.btn-sm,
button.small,
button.btn-sm,
.button-link.small,
a.button-link.small,
a.btn-sm {
  min-height: 32px;
  padding: var(--btn-small-pad-y) var(--btn-small-pad-x);
  font-size: var(--btn-small-font-size);
}

/* Colour variants */
.primary,
.btn-primary,
button.primary,
button.btn-primary {
  background: linear-gradient(135deg, var(--orange, #f97316), var(--orange2, #c2590e));
  border-color: rgba(249,115,22,.42);
  color: #130800;
}

.success,
.btn-success,
button.success,
button.btn-success {
  background: linear-gradient(135deg, #34d399, #059669);
  border-color: rgba(52,211,153,.42);
  color: #03140d;
}
.success:hover,
.btn-success:hover,
button.success:hover,
button.btn-success:hover { box-shadow: 0 0 18px rgba(52,211,153,.32); }

.warning,
.btn-warning,
button.warning,
button.btn-warning {
  background: linear-gradient(135deg, #fbbf24, #d97706);
  border-color: rgba(251,191,36,.44);
  color: #1a1000;
}
.warning:hover,
.btn-warning:hover,
button.warning:hover,
button.btn-warning:hover { box-shadow: 0 0 18px rgba(251,191,36,.32); }

.danger,
.btn-danger,
button.danger,
button.btn-danger {
  background: linear-gradient(135deg, var(--red, #ef4444), #991b1b);
  border-color: rgba(239,68,68,.45);
  color: #fff;
}
.danger:hover,
.btn-danger:hover,
button.danger:hover,
button.btn-danger:hover { box-shadow: var(--glow-red, 0 0 18px rgba(239,68,68,.35)); }

.info,
.btn-info,
button.info,
button.btn-info {
  background: linear-gradient(135deg, #38bdf8, #2563eb);
  border-color: rgba(56,189,248,.42);
  color: #03101d;
}
.info:hover,
.btn-info:hover,
button.info:hover,
button.btn-info:hover { box-shadow: 0 0 18px rgba(56,189,248,.32); }

.ghost,
.btn-ghost,
button.ghost,
button.btn-ghost,
.secondary,
.btn-secondary,
button.secondary,
button.btn-secondary,
.log-view-btn,
#log-view-close {
  background: var(--panel3, #151922);
  border-color: var(--border2, rgba(255,255,255,.13));
  color: var(--text-dim, #b8c0cc);
  box-shadow: none;
}
.ghost:hover,
.btn-ghost:hover,
button.ghost:hover,
button.btn-ghost:hover,
.secondary:hover,
.btn-secondary:hover,
button.secondary:hover,
button.btn-secondary:hover,
.log-view-btn:hover,
#log-view-close:hover {
  border-color: var(--orange, #f97316);
  color: var(--orange, #f97316);
  box-shadow: none;
}

/* Soft aliases already used in older pages */
.btn-danger-soft,
button.btn-danger-soft { background: rgba(239,68,68,.13); border-color: rgba(239,68,68,.45); color: #fecaca; box-shadow: none; }
.btn-success-soft,
button.btn-success-soft { background: rgba(52,211,153,.13); border-color: rgba(52,211,153,.45); color: #bbf7d0; box-shadow: none; }
.btn-warning-soft,
button.btn-warning-soft { background: rgba(251,191,36,.13); border-color: rgba(251,191,36,.45); color: #fde68a; box-shadow: none; }

/* Action-specific defaults for existing markup */
button[data-action="start"],
button[data-st-action="restore_backup"],
button[data-st-action="commandline_save"],
#saveServerConfigBtn,
#modsUploadBtn,
.add-user-submit { }

button[data-action="stop"],
button[data-action="kill"],
button[data-st-action="restart_warning"],
button[data-file-delete],
.log-delete-btn,
.connection-delete,
.ip-api-delete,
.setting-mod-delete-btn,
#logs-delete-all { background: linear-gradient(135deg, var(--red, #ef4444), #991b1b); border-color: rgba(239,68,68,.45); color: #fff; }

button[data-action="restart"],
button[data-st-action="update_server"],
button[data-st-action="switch_branch"],
button[data-st-action="validate_server"],
#enableWebMapBtn,
#validateServerConfigBtn { background: linear-gradient(135deg, #fbbf24, #d97706); border-color: rgba(251,191,36,.44); color: #1a1000; }

button[data-st-action="nexus_lookup"],
button[data-file-edit],
button[data-file-rename],
.players-map-pick-btn,
#players-refresh,
#players-info,
#players-ban-list,
#players-refresh-items,
#logs-refresh,
#ip-api-refresh,
#connections-refresh,
#connections-scan-server,
.button-link { background: var(--panel3, #151922); border-color: var(--border2, rgba(255,255,255,.13)); color: var(--text-dim, #b8c0cc); box-shadow: none; }

/* Table/action buttons should not stretch oddly */
td button,
td .button-link,
.log-actions button,
.log-actions .button-link,
.player-action-card button {
  margin: 2px;
}

/* Preserve special login/topbar buttons but make them consistent with radius/weight */
.btn-login,
.btn-topbar-logout,
.pw-toggle,
.captcha-refresh {
  border-radius: var(--btn-radius);
  font-weight: 800;
}

/* Fix for browsers that do not support CSS composes: explicit success styling */
button[data-action="start"],
button[data-st-action="restore_backup"],
button[data-st-action="commandline_save"],
#saveServerConfigBtn,
#modsUploadBtn,
.add-user-submit {
  background: linear-gradient(135deg, #34d399, #059669);
  border-color: rgba(52,211,153,.42);
  color: #03140d;
}

@media (max-width: 700px) {
  button,
  .btn,
  .button,
  .button-link,
  a.btn,
  a.button-link {
    min-height: 36px;
    padding: 9px 12px;
    font-size: 12px;
  }
}

/* Server tools progress bar */
.server-tools-progress{margin:10px 0 14px 0;}
.server-tools-progress-track{height:16px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden;border:1px solid rgba(255,255,255,.18);}
.server-tools-progress-fill{height:100%;width:0%;border-radius:999px;background:linear-gradient(90deg,#3aa0ff,#45d483);transition:width .3s ease;}
.server-tools-progress.failed .server-tools-progress-fill{background:linear-gradient(90deg,#ffb23a,#ff4d4d);}
.server-tools-progress-label{font-size:.9rem;margin-top:6px;opacity:.85;}

/* Steam Management button variants */
.btn-steam-validate,
button.btn-steam-validate {
  background: linear-gradient(135deg, #38bdf8, #2563eb);
  border-color: rgba(56,189,248,.48);
  color: #03101d;
}
.btn-steam-validate:hover,
button.btn-steam-validate:hover { box-shadow: 0 0 18px rgba(56,189,248,.34); }

.btn-steam-update,
button.btn-steam-update {
  background: linear-gradient(135deg, #fbbf24, #d97706);
  border-color: rgba(251,191,36,.48);
  color: #1a1000;
}
.btn-steam-update:hover,
button.btn-steam-update:hover { box-shadow: 0 0 18px rgba(251,191,36,.34); }

.btn-steam-branch,
button.btn-steam-branch {
  background: linear-gradient(135deg, #a78bfa, #6d28d9);
  border-color: rgba(167,139,250,.48);
  color: #fff;
}
.btn-steam-branch:hover,
button.btn-steam-branch:hover { box-shadow: 0 0 18px rgba(167,139,250,.34); }

/* File Manager table buttons and unknown file type styling */
.file-manager-table .fm-action-cell .btn,
.file-manager-table .fm-action-cell button {
  min-height: 30px;
  padding: 6px 10px;
  font-size: 11px;
}

.file-manager-table .fm-type-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 9px;
  border: 1px solid var(--border2, rgba(255,255,255,.13));
  border-radius: 999px;
  background: var(--panel3, #151922);
  color: var(--text-dim, #b8c0cc);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .2px;
  text-transform: uppercase;
  white-space: nowrap;
}
.file-manager-table .fm-type-folder { color: #bfdbfe; border-color: rgba(96,165,250,.36); background: rgba(37,99,235,.14); }
.file-manager-table .fm-type-zip { color: #fde68a; border-color: rgba(251,191,36,.42); background: rgba(217,119,6,.16); }
.file-manager-table .fm-type-file { color: #bbf7d0; border-color: rgba(52,211,153,.32); background: rgba(5,150,105,.13); }
.file-manager-table .fm-type-unknown,
.btn-unknown,
button.btn-unknown {
  color: #e5e7eb;
  border-color: rgba(148,163,184,.44);
  background: linear-gradient(135deg, #475569, #1f2937);
  box-shadow: none;
}
.btn-unknown:hover,
button.btn-unknown:hover {
  color: #fff;
  border-color: rgba(203,213,225,.58);
  box-shadow: 0 0 18px rgba(148,163,184,.22);
}

/* File Manager parent folder/back icon button */
.fm-back-link {
  font-weight: 700;
  min-width: 88px;
}
