/**
 * Feira Social — overlay de marca para o painel do cliente (/painel/, tema "united")
 * Mesmo padrão dos overlays de /admin e /administration: arquivo próprio,
 * linkado por último, nunca edita o tema original (bootstrap.css / style.css).
 * Paleta neutra (preto, nunca azulado) + gradiente Instagram + DM Sans/Sora.
 */

@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url("../../../fonts/dm-sans-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Sora";
  font-style: normal;
  font-weight: 700 800;
  font-display: swap;
  src: url("../../../fonts/sora-latin.woff2") format("woff2");
}

:root {
  --gf-radius: 20px;
  --gf-radius-sm: 12px;
  --gf-accent: #c13584;
  --gf-accent-2: #e1306c;
  --gf-purple: #833ab4;
  --gf-gradient: linear-gradient(135deg, #833ab4 0%, #c13584 50%, #e1306c 100%);
  --gf-bg: #0a0a0a;
  --gf-surface: #121212;
  --gf-surface-2: #1a1a1a;
  --gf-border: rgba(255, 255, 255, 0.1);
  --gf-text: #f4f4f5;
  --gf-muted: #a7b0c0;
}

html body {
  font-family: "DM Sans", system-ui, sans-serif !important;
  background: var(--gf-bg) !important;
  color: var(--gf-text) !important;
}

html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .navbar-brand {
  font-family: "Sora", "DM Sans", sans-serif !important;
  color: var(--gf-text) !important;
}

html body a {
  color: var(--gf-accent-2);
}
html body a:hover,
html body a:focus {
  color: var(--gf-accent);
}

/* ── Navbar ── */
html body .navbar-default {
  background: var(--gf-surface) !important;
  border-color: var(--gf-border) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}
html body .navbar-default .navbar-brand,
html body .navbar-default .navbar-text {
  color: var(--gf-text) !important;
}
html body .navbar-default .navbar-nav > li > a {
  color: var(--gf-muted) !important;
  font-weight: 500;
}
html body .navbar-default .navbar-nav > li > a:hover,
html body .navbar-default .navbar-nav > li > a:focus {
  color: var(--gf-text) !important;
  background: rgba(225, 48, 108, 0.1) !important;
}
html body .navbar-default .navbar-nav > .active > a,
html body .navbar-default .navbar-nav > .active > a:hover,
html body .navbar-default .navbar-nav > .active > a:focus {
  color: var(--gf-text) !important;
  background: rgba(225, 48, 108, 0.14) !important;
  box-shadow: inset 3px 0 0 var(--gf-accent-2);
}
html body .navbar-default .navbar-nav > li > a .badge {
  background: var(--gf-gradient) !important;
  color: #fff !important;
}
html body .navbar-toggle {
  border-color: var(--gf-border) !important;
}
html body .navbar-toggle .icon-bar {
  background: var(--gf-text) !important;
}
html body .navbar-collapse {
  border-color: var(--gf-border) !important;
}

/* ── Cards / wells ── */
html body .well,
html body .panel {
  background: var(--gf-surface) !important;
  border: 1px solid var(--gf-border) !important;
  border-radius: var(--gf-radius) !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
  color: var(--gf-text);
}
html body .panel-heading {
  background: var(--gf-surface-2) !important;
  border-color: var(--gf-border) !important;
  border-radius: var(--gf-radius) var(--gf-radius) 0 0 !important;
  color: var(--gf-text) !important;
}
html body .panel-footer {
  background: var(--gf-surface-2) !important;
  border-color: var(--gf-border) !important;
}

/* ── Forms ── */
html body .form-control {
  background: var(--gf-surface-2) !important;
  border: 1px solid var(--gf-border) !important;
  color: var(--gf-text) !important;
  border-radius: var(--gf-radius-sm) !important;
  box-shadow: none !important;
}
html body .form-control:focus {
  border-color: var(--gf-accent-2) !important;
  box-shadow: 0 0 0 3px rgba(225, 48, 108, 0.2) !important;
}
html body .form-control::placeholder {
  color: var(--gf-muted);
  opacity: 1;
}
html body label,
html body .control-label {
  color: var(--gf-text) !important;
}
html body select.form-control option {
  background: var(--gf-surface-2);
  color: var(--gf-text);
}
html body .input-group-addon {
  background: var(--gf-surface-2) !important;
  border-color: var(--gf-border) !important;
  color: var(--gf-muted) !important;
}

/* ── Buttons ── */
html body .btn {
  border-radius: var(--gf-radius-sm) !important;
  font-weight: 600;
}
html body .btn-primary,
html body .btn-primary.click {
  background: var(--gf-gradient) !important;
  border: none !important;
  color: #fff !important;
}
html body .btn-primary:hover,
html body .btn-primary:focus {
  filter: brightness(1.08);
  color: #fff !important;
}
html body .btn-default {
  background: var(--gf-surface-2) !important;
  border: 1px solid var(--gf-border) !important;
  color: var(--gf-text) !important;
}
html body .btn-default:hover,
html body .btn-default:focus {
  background: rgba(225, 48, 108, 0.14) !important;
  border-color: var(--gf-accent-2) !important;
  color: var(--gf-text) !important;
}
html body .btn-success {
  background: #1fb37a !important;
  border: none !important;
}
html body .btn-danger {
  background: #e1306c !important;
  border: none !important;
}

/* ── Tables ── */
html body .table {
  color: var(--gf-text) !important;
  background: transparent;
}
html body .table > thead > tr > th {
  border-bottom: 1px solid var(--gf-border) !important;
  color: var(--gf-muted) !important;
  font-weight: 600;
}
html body .table > tbody > tr > td,
html body .table > tbody > tr > th {
  border-top: 1px solid var(--gf-border) !important;
}
html body .table-striped > tbody > tr:nth-of-type(odd) {
  background: var(--gf-surface-2) !important;
}
html body .table-hover > tbody > tr:hover {
  background: rgba(225, 48, 108, 0.08) !important;
}

/* ── Badges / labels ── */
html body .badge {
  background: var(--gf-gradient) !important;
  color: #fff !important;
  font-weight: 600;
}
html body .label-default {
  background: var(--gf-surface-2) !important;
  color: var(--gf-muted) !important;
}

/* ── Alerts ── */
html body .alert {
  border-radius: var(--gf-radius-sm) !important;
  border: 1px solid transparent !important;
}
html body .alert-success {
  background: rgba(31, 179, 122, 0.14) !important;
  border-color: rgba(31, 179, 122, 0.35) !important;
  color: #6fe3bb !important;
}
html body .alert-danger {
  background: rgba(225, 48, 108, 0.14) !important;
  border-color: rgba(225, 48, 108, 0.35) !important;
  color: #ff9cbe !important;
}
html body .alert-warning {
  background: rgba(226, 169, 38, 0.14) !important;
  border-color: rgba(226, 169, 38, 0.35) !important;
  color: #f2c766 !important;
}
html body .alert-info {
  background: rgba(131, 58, 164, 0.16) !important;
  border-color: rgba(131, 58, 164, 0.4) !important;
  color: #cfa9e6 !important;
}

/* ── Nav tabs ── */
html body .nav-tabs {
  border-bottom-color: var(--gf-border) !important;
}
html body .nav-tabs > li > a {
  color: var(--gf-muted) !important;
  border-radius: var(--gf-radius-sm) var(--gf-radius-sm) 0 0 !important;
}
html body .nav-tabs > li.active > a,
html body .nav-tabs > li.active > a:hover,
html body .nav-tabs > li.active > a:focus {
  background: var(--gf-surface-2) !important;
  border-color: var(--gf-border) !important;
  color: var(--gf-text) !important;
  box-shadow: inset 0 -2px 0 var(--gf-accent-2);
}

/* ── Dropdowns ── */
html body .dropdown-menu {
  background: var(--gf-surface-2) !important;
  border: 1px solid var(--gf-border) !important;
  border-radius: var(--gf-radius-sm) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
}
html body .dropdown-menu > li > a {
  color: var(--gf-text) !important;
}
html body .dropdown-menu > li > a:hover,
html body .dropdown-menu > li > a:focus {
  background: rgba(225, 48, 108, 0.14) !important;
  color: var(--gf-text) !important;
}

/* ── Pagination / list-group / breadcrumb ── */
html body .pagination > li > a,
html body .pagination > li > span {
  background: var(--gf-surface-2) !important;
  border-color: var(--gf-border) !important;
  color: var(--gf-text) !important;
}
html body .pagination > .active > a {
  background: var(--gf-gradient) !important;
  border-color: transparent !important;
  color: #fff !important;
}
html body .list-group-item {
  background: var(--gf-surface-2) !important;
  border-color: var(--gf-border) !important;
  color: var(--gf-text) !important;
}
html body .breadcrumb {
  background: var(--gf-surface-2) !important;
  border-radius: var(--gf-radius-sm) !important;
}

/* ── Modal ── */
html body .modal-content {
  background: var(--gf-surface) !important;
  border-radius: var(--gf-radius) !important;
  border: 1px solid var(--gf-border) !important;
  color: var(--gf-text);
}
html body .modal-header,
html body .modal-footer {
  border-color: var(--gf-border) !important;
}

/* ── Scrollbar ── */
html body ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
html body ::-webkit-scrollbar-track {
  background: var(--gf-bg);
}
html body ::-webkit-scrollbar-thumb {
  background: var(--gf-surface-2);
  border-radius: 10px;
}

/* ── Balance badge no navbar (saldo do cliente) ── */
html body .navbar-nav .badge {
  font-size: 13px;
  padding: 5px 10px;
}
