/* ── VARIÁVEIS — LIGHT MODE ─────────────────────────────────────────────── */
:root {
  --gf-primary:       #0ea5e9;
  --gf-primary-dark:  #0284c7;
  --gf-secondary:     #10b981;
  --gf-accent:        #f59e0b;
  --gf-danger:        #ef4444;
  --gf-purple:        #8b5cf6;
  --gf-bg:            #f0f9ff;
  --gf-bg-card:       #ffffff;
  --gf-bg-sidebar:    #0f172a;
  --gf-text:          #0f172a;
  --gf-text-muted:    #64748b;
  --gf-border:        #e2e8f0;
  --gf-shadow:        0 1px 3px rgba(0,0,0,.10), 0 1px 2px rgba(0,0,0,.06);
  --gf-shadow-lg:     0 10px 15px -3px rgba(0,0,0,.10), 0 4px 6px -2px rgba(0,0,0,.05);
  --gf-radius:        12px;
  --gf-radius-sm:     8px;
  --gf-transition:    .2s ease;
}

/* ── DARK MODE ──────────────────────────────────────────────────────────── */
.gofish-dark {
  --gf-primary:       #38bdf8;
  --gf-primary-dark:  #0ea5e9;
  --gf-secondary:     #34d399;
  --gf-accent:        #fbbf24;
  --gf-danger:        #f87171;
  --gf-purple:        #a78bfa;
  --gf-bg:            #0f172a;
  --gf-bg-card:       #1e293b;
  --gf-text:          #f1f5f9;
  --gf-text-muted:    #94a3b8;
  --gf-border:        #334155;
  --gf-shadow:        0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);
  --gf-shadow-lg:     0 10px 15px -3px rgba(0,0,0,.4), 0 4px 6px -2px rgba(0,0,0,.3);
}

/* ── RESET BASE ─────────────────────────────────────────────────────────── */
.gofish-wrap * { box-sizing: border-box; }
.gofish-wrap {
  background: var(--gf-bg);
  color:      var(--gf-text);
  min-height: calc(100vh - 32px);
  padding:    24px 28px;
  transition: background var(--gf-transition), color var(--gf-transition);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ── TOPBAR ─────────────────────────────────────────────────────────────── */
.gf-topbar {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  margin-bottom:   28px;
  gap:             16px;
  flex-wrap:       wrap;
}
.gf-topbar h1 {
  font-size:   1.6rem;
  font-weight: 700;
  color:       var(--gf-text);
  margin:      0;
  display:     flex;
  align-items: center;
  gap:         10px;
}
.gf-topbar h1 .gf-icon {
  background:    var(--gf-primary);
  color:         #fff;
  border-radius: 10px;
  width:         40px; height: 40px;
  display:       flex;
  align-items:   center;
  justify-content: center;
  font-size:     1.3rem;
}
.gf-topbar-actions { display: flex; gap: 10px; align-items: center; }

/* ── DARK MODE TOGGLE ───────────────────────────────────────────────────── */
.gf-theme-toggle {
  background:    var(--gf-bg-card);
  border:        1px solid var(--gf-border);
  border-radius: 20px;
  padding:       6px 14px;
  cursor:        pointer;
  color:         var(--gf-text);
  font-size:     .85rem;
  font-weight:   600;
  display:       flex;
  align-items:   center;
  gap:           6px;
  transition:    all var(--gf-transition);
}
.gf-theme-toggle:hover { border-color: var(--gf-primary); color: var(--gf-primary); }

/* ── CARDS ──────────────────────────────────────────────────────────────── */
.gf-card {
  background:    var(--gf-bg-card);
  border:        1px solid var(--gf-border);
  border-radius: var(--gf-radius);
  padding:       24px;
  box-shadow:    var(--gf-shadow);
  transition:    background var(--gf-transition), border-color var(--gf-transition);
}
.gf-card-title {
  font-size:     1rem;
  font-weight:   700;
  color:         var(--gf-text);
  margin:        0 0 16px;
  display:       flex;
  align-items:   center;
  gap:           8px;
}
.gf-card-title .dot {
  width:         8px; height: 8px;
  border-radius: 50%;
  background:    var(--gf-primary);
  flex-shrink:   0;
}

/* ── KPI GRID ───────────────────────────────────────────────────────────── */
.gf-kpi-grid {
  display:               grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap:                   16px;
  margin-bottom:         24px;
}
.gf-kpi {
  background:    var(--gf-bg-card);
  border:        1px solid var(--gf-border);
  border-radius: var(--gf-radius);
  padding:       20px;
  box-shadow:    var(--gf-shadow);
  position:      relative;
  overflow:      hidden;
  transition:    transform var(--gf-transition), box-shadow var(--gf-transition);
}
.gf-kpi:hover { transform: translateY(-2px); box-shadow: var(--gf-shadow-lg); }
.gf-kpi::before {
  content:    '';
  position:   absolute;
  top:        0; left: 0;
  width:      4px; height: 100%;
  background: var(--kpi-color, var(--gf-primary));
}
.gf-kpi-label {
  font-size:   .78rem;
  font-weight: 600;
  color:       var(--gf-text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 8px;
}
.gf-kpi-value {
  font-size:   2rem;
  font-weight: 800;
  color:       var(--kpi-color, var(--gf-primary));
  line-height: 1;
}
.gf-kpi-sub {
  font-size:  .78rem;
  color:      var(--gf-text-muted);
  margin-top: 4px;
}
.gf-kpi-icon {
  position:    absolute;
  top:         16px; right: 16px;
  font-size:   2rem;
  opacity:     .15;
}

/* KPI color variants */
.gf-kpi.blue   { --kpi-color: var(--gf-primary); }
.gf-kpi.green  { --kpi-color: var(--gf-secondary); }
.gf-kpi.amber  { --kpi-color: var(--gf-accent); }
.gf-kpi.red    { --kpi-color: var(--gf-danger); }
.gf-kpi.purple { --kpi-color: var(--gf-purple); }

/* ── GRID LAYOUTS ───────────────────────────────────────────────────────── */
.gf-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.gf-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px; }

@media (max-width: 900px) {
  .gf-grid-2, .gf-grid-3 { grid-template-columns: 1fr; }
}

/* ── CHART WRAPPER ──────────────────────────────────────────────────────── */
.gf-chart-wrap {
  position: relative;
  height:   280px;
}

/* ── ALERTS ─────────────────────────────────────────────────────────────── */
.gf-alert {
  border-radius: var(--gf-radius-sm);
  padding:       12px 16px;
  font-size:     .88rem;
  font-weight:   500;
  display:       flex;
  align-items:   flex-start;
  gap:           10px;
  margin-bottom: 10px;
}
.gf-alert.warning { background: #fef3c7; color: #92400e; border: 1px solid #fde68a; }
.gf-alert.danger  { background: #fee2e2; color: #991b1b; border: 1px solid #fca5a5; }
.gf-alert.success { background: #d1fae5; color: #065f46; border: 1px solid #6ee7b7; }
.gf-alert.info    { background: #e0f2fe; color: #075985; border: 1px solid #7dd3fc; }
.gofish-dark .gf-alert.warning { background: #451a03; color: #fde68a; border-color: #78350f; }
.gofish-dark .gf-alert.danger  { background: #450a0a; color: #fca5a5; border-color: #7f1d1d; }
.gofish-dark .gf-alert.success { background: #022c22; color: #6ee7b7; border-color: #064e3b; }
.gofish-dark .gf-alert.info    { background: #082f49; color: #7dd3fc; border-color: #0c4a6e; }

/* ── BUTTONS ────────────────────────────────────────────────────────────── */
.gf-btn {
  display:       inline-flex;
  align-items:   center;
  gap:           6px;
  padding:       9px 18px;
  border-radius: var(--gf-radius-sm);
  font-size:     .88rem;
  font-weight:   600;
  cursor:        pointer;
  border:        none;
  transition:    all var(--gf-transition);
  white-space:   nowrap;
}
.gf-btn-primary  { background: var(--gf-primary); color: #fff; }
.gf-btn-primary:hover { background: var(--gf-primary-dark); transform: translateY(-1px); }
.gf-btn-success  { background: var(--gf-secondary); color: #fff; }
.gf-btn-success:hover { opacity: .88; }
.gf-btn-amber    { background: var(--gf-accent); color: #fff; }
.gf-btn-amber:hover { opacity: .88; }
.gf-btn-danger   { background: var(--gf-danger); color: #fff; }
.gf-btn-danger:hover { opacity: .88; }
.gf-btn-outline  { background: transparent; color: var(--gf-text); border: 1.5px solid var(--gf-border); }
.gf-btn-outline:hover { border-color: var(--gf-primary); color: var(--gf-primary); }
.gf-btn-sm { padding: 5px 12px; font-size: .8rem; }
.gf-btn-icon { padding: 7px; border-radius: 6px; }

/* ── FORMS ──────────────────────────────────────────────────────────────── */
.gf-form-grid {
  display:               grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap:                   16px;
  margin-bottom:         20px;
}
.gf-form-group { display: flex; flex-direction: column; gap: 5px; }
.gf-form-group.full { grid-column: 1 / -1; }
.gf-form-group label {
  font-size:   .82rem;
  font-weight: 600;
  color:       var(--gf-text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.gf-form-group input,
.gf-form-group select,
.gf-form-group textarea {
  background:    var(--gf-bg-card);
  border:        1.5px solid var(--gf-border);
  border-radius: var(--gf-radius-sm);
  padding:       9px 12px;
  color:         var(--gf-text);
  font-size:     .9rem;
  transition:    border-color var(--gf-transition);
  width:         100%;
}
.gf-form-group input:focus,
.gf-form-group select:focus,
.gf-form-group textarea:focus {
  outline:       none;
  border-color:  var(--gf-primary);
  box-shadow:    0 0 0 3px rgba(14,165,233,.15);
}
.gf-form-group textarea { resize: vertical; min-height: 80px; }

/* ── TABLES ─────────────────────────────────────────────────────────────── */
.gf-table-wrap { overflow-x: auto; }
table.gf-table {
  width:           100%;
  border-collapse: collapse;
  font-size:       .88rem;
}
.gf-table thead tr {
  background:    linear-gradient(135deg, var(--gf-primary) 0%, var(--gf-primary-dark) 100%);
  color:         #fff;
}
.gf-table thead th {
  padding:     12px 14px;
  font-weight: 600;
  text-align:  left;
  white-space: nowrap;
}
.gf-table tbody tr {
  border-bottom:  1px solid var(--gf-border);
  transition:     background var(--gf-transition);
}
.gf-table tbody tr:hover { background: rgba(14,165,233,.06); }
.gf-table tbody td {
  padding:     11px 14px;
  color:       var(--gf-text);
  vertical-align: middle;
}
.gf-table .gf-actions { display: flex; gap: 6px; }

/* ── BADGES ─────────────────────────────────────────────────────────────── */
.gf-badge {
  display:       inline-block;
  padding:       3px 10px;
  border-radius: 20px;
  font-size:     .75rem;
  font-weight:   700;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.gf-badge-green  { background: #d1fae5; color: #065f46; }
.gf-badge-red    { background: #fee2e2; color: #991b1b; }
.gf-badge-blue   { background: #e0f2fe; color: #075985; }
.gf-badge-amber  { background: #fef3c7; color: #92400e; }
.gf-badge-purple { background: #ede9fe; color: #5b21b6; }
.gofish-dark .gf-badge-green  { background: #022c22; color: #6ee7b7; }
.gofish-dark .gf-badge-red    { background: #450a0a; color: #fca5a5; }
.gofish-dark .gf-badge-blue   { background: #082f49; color: #7dd3fc; }
.gofish-dark .gf-badge-amber  { background: #451a03; color: #fde68a; }
.gofish-dark .gf-badge-purple { background: #2e1065; color: #c4b5fd; }

/* ── MODAL ──────────────────────────────────────────────────────────────── */
.gf-modal-overlay {
  position:   fixed;
  inset:      0;
  background: rgba(0,0,0,.6);
  z-index:    99998;
  display:    flex;
  align-items: center;
  justify-content: center;
  opacity:    0;
  pointer-events: none;
  transition: opacity var(--gf-transition);
}
.gf-modal-overlay.active { opacity: 1; pointer-events: all; }
.gf-modal {
  background:    var(--gf-bg-card);
  border-radius: var(--gf-radius);
  padding:       32px;
  width:         100%;
  max-width:     560px;
  max-height:    90vh;
  overflow-y:    auto;
  box-shadow:    var(--gf-shadow-lg);
  transform:     translateY(20px);
  transition:    transform var(--gf-transition);
  position:      relative;
}
.gf-modal-overlay.active .gf-modal { transform: translateY(0); }
.gf-modal-header {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  margin-bottom:   24px;
}
.gf-modal-title { font-size: 1.15rem; font-weight: 700; color: var(--gf-text); margin: 0; }
.gf-modal-close {
  background:    none;
  border:        none;
  font-size:     1.4rem;
  cursor:        pointer;
  color:         var(--gf-text-muted);
  line-height:   1;
  padding:       4px;
  border-radius: 6px;
}
.gf-modal-close:hover { color: var(--gf-danger); background: rgba(239,68,68,.1); }
.gf-modal-footer { display: flex; gap: 10px; justify-content: flex-end; margin-top: 24px; }

/* ── SECTION HEADER ─────────────────────────────────────────────────────── */
.gf-section-header {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  margin-bottom:   16px;
  flex-wrap:       wrap;
  gap:             10px;
}
.gf-section-title {
  font-size:   1.05rem;
  font-weight: 700;
  color:       var(--gf-text);
  margin:      0;
}

/* ── TABS ───────────────────────────────────────────────────────────────── */
.gf-tabs {
  display:       flex;
  gap:           4px;
  border-bottom: 2px solid var(--gf-border);
  margin-bottom: 20px;
}
.gf-tab {
  padding:       10px 18px;
  font-size:     .88rem;
  font-weight:   600;
  cursor:        pointer;
  border:        none;
  background:    none;
  color:         var(--gf-text-muted);
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition:    all var(--gf-transition);
  border-radius: 6px 6px 0 0;
}
.gf-tab.active { color: var(--gf-primary); border-bottom-color: var(--gf-primary); }
.gf-tab:hover  { color: var(--gf-primary); background: rgba(14,165,233,.06); }
.gf-tab-content { display: none; }
.gf-tab-content.active { display: block; }

/* ── RENDIMENTO BAR ─────────────────────────────────────────────────────── */
.gf-progress {
  background:    var(--gf-border);
  border-radius: 20px;
  height:        10px;
  overflow:      hidden;
  margin-top:    8px;
}
.gf-progress-fill {
  height:        100%;
  border-radius: 20px;
  background:    linear-gradient(90deg, var(--gf-primary), var(--gf-secondary));
  transition:    width .6s ease;
}

/* ── ESTOQUE CARDS ──────────────────────────────────────────────────────── */
.gf-estoque-grid {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  gap:                   16px;
  margin-bottom:         20px;
}
.gf-estoque-card {
  border-radius: var(--gf-radius);
  padding:       20px;
  text-align:    center;
  color:         #fff;
}
.gf-estoque-card.peixe  { background: linear-gradient(135deg, #0ea5e9, #0284c7); }
.gf-estoque-card.sp     { background: linear-gradient(135deg, #10b981, #059669); }
.gf-estoque-card.cp     { background: linear-gradient(135deg, #8b5cf6, #7c3aed); }
.gf-estoque-card .ec-label { font-size: .78rem; font-weight: 600; opacity: .85; text-transform: uppercase; letter-spacing: .05em; }
.gf-estoque-card .ec-value { font-size: 2.2rem; font-weight: 800; margin: 6px 0; }
.gf-estoque-card .ec-unit  { font-size: .82rem; opacity: .8; }

/* ── TOAST ──────────────────────────────────────────────────────────────── */
#gf-toast {
  position:      fixed;
  bottom:        24px; right: 24px;
  background:    var(--gf-bg-card);
  border:        1px solid var(--gf-border);
  border-radius: var(--gf-radius-sm);
  padding:       14px 20px;
  font-size:     .88rem;
  font-weight:   600;
  color:         var(--gf-text);
  box-shadow:    var(--gf-shadow-lg);
  z-index:       99999;
  transform:     translateY(80px);
  opacity:       0;
  transition:    all .3s ease;
  display:       flex;
  align-items:   center;
  gap:           10px;
  min-width:     280px;
}
#gf-toast.show { transform: translateY(0); opacity: 1; }
#gf-toast.success { border-left: 4px solid var(--gf-secondary); }
#gf-toast.error   { border-left: 4px solid var(--gf-danger); }

/* ── EMPTY STATE ────────────────────────────────────────────────────────── */
.gf-empty {
  text-align:  center;
  padding:     48px 24px;
  color:       var(--gf-text-muted);
  font-size:   .95rem;
}
.gf-empty-icon { font-size: 3rem; margin-bottom: 12px; opacity: .4; }

/* ── RELATORIO SUMMARY ──────────────────────────────────────────────────── */
.gf-summary-row {
  display:       flex;
  justify-content: space-between;
  padding:       10px 0;
  border-bottom: 1px solid var(--gf-border);
  font-size:     .9rem;
}
.gf-summary-row:last-child { border-bottom: none; }
.gf-summary-row span:first-child { color: var(--gf-text-muted); }
.gf-summary-row span:last-child  { font-weight: 700; color: var(--gf-text); }
.gf-total-row span { font-size: 1rem !important; color: var(--gf-primary) !important; }

/* ── HEADER GRADIENT ────────────────────────────────────────────────────── */
.gf-page-header {
  background:    linear-gradient(135deg, var(--gf-primary) 0%, #0369a1 100%);
  border-radius: var(--gf-radius);
  padding:       28px 32px;
  margin-bottom: 24px;
  color:         #fff;
  display:       flex;
  align-items:   center;
  gap:           16px;
}
.gf-page-header .ph-icon {
  font-size:   2.5rem;
  background:  rgba(255,255,255,.2);
  border-radius: 12px;
  width:        56px; height: 56px;
  display:      flex;
  align-items:  center;
  justify-content: center;
}
.gf-page-header h2 { margin: 0; font-size: 1.4rem; font-weight: 700; }
.gf-page-header p  { margin: 4px 0 0; opacity: .85; font-size: .9rem; }

/* ── SPINNER ────────────────────────────────────────────────────────────── */
.gf-spinner {
  display:       inline-block;
  width:         18px; height: 18px;
  border:        2px solid rgba(255,255,255,.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation:     gf-spin .6s linear infinite;
}
@keyframes gf-spin { to { transform: rotate(360deg); } }

/* ── REMOVE WP DEFAULT MARGIN ───────────────────────────────────────────── */
.gofish-wrap h1.wp-heading-inline { display: none; }
