/* ============================================================
   Element Plus theme overrides — Gojek green identity
   Brand: primary #00AA13, dark #008A11, pill buttons,
   12px input radius, 16px dialog radius, Inter font.
   ============================================================ */
:root {
  --el-color-primary: #00AA13;
  --el-color-primary-light-3: #4CC455;
  --el-color-primary-light-5: #80D589;
  --el-color-primary-light-7: #B3E5BA;
  --el-color-primary-light-8: #CCEED1;
  --el-color-primary-light-9: #E6F3E8;
  --el-color-primary-dark-2: #008A11;
  --el-border-radius-base: 12px;
  --el-border-radius-small: 8px;
  --el-border-radius-round: 999px;
  --el-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  /* lift EP popups above the app z-index ladder (GPage 100045, admin modal 100050, GDialog tier 100060) */
  --el-index-popper: 100060;
  --el-index-dialog: 100060;
}

/* Buttons = pill */
.el-button {
  --el-button-border-radius: 999px;
  --el-button-font-weight: 600;
}

/* Inputs = 12px radius + green focus ring (focus ring is native EP box-shadow via primary color) */
.el-input__wrapper,
.el-textarea__inner,
.el-select__wrapper {
  border-radius: 12px;
}

/* Small (sm) controls — EP default 24px/12px feels too tiny on admin toolbars.
   Bump to 28px/13px (matches the old bootstrap form-control-sm feel). */
:root { --el-component-size-small: 28px; }
.el-input--small { font-size: 13px; }
.el-input--small .el-input__wrapper { padding: 1px 10px; }
.el-select--small .el-select__wrapper { min-height: 28px; font-size: 13px; line-height: 22px; padding: 2px 10px; }

/* Dialogs = macOS glass sheet */
.el-dialog {
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .22), 0 2px 8px rgba(0, 0, 0, .08);
  padding-top: 0;
}
.el-dialog__header {
  padding: 16px 20px 12px;
  margin-right: 0;
  border-bottom: 1px solid var(--gj-line, #ECEDEF);
}
.el-dialog__title { font-size: 1rem; font-weight: 700; color: var(--gj-ink, #1A1A1A); }
.el-dialog__body { padding: 16px 20px; }
.el-dialog__footer {
  padding: 12px 20px 16px;
  border-top: 1px solid var(--gj-line, #ECEDEF);
}
.el-overlay { backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }

/* Select popper: compact, matches gj textfield look */
.gj-select-popper.el-popper {
  border-radius: 12px;
}
.gj-select-popper .el-select-dropdown__item {
  font-size: .85rem;
  height: 34px;
}

/* Message / notification = radius + green success identity */
.el-message { border-radius: 999px; }

/* Loading spinner inherits brand color */
.el-loading-spinner .circular .path { stroke: var(--el-color-primary); }

/* ---------- Tables: admin density (10px rows, tight padding, uppercase header) ---------- */
.el-table {
  --el-table-border-color: #ECEDEF;
  --el-table-header-bg-color: #FAFAFB;
  --el-table-row-hover-bg-color: #F6FBF6;
  --el-table-header-text-color: #6B7280;
  font-size: 10px;
  background: transparent;
}
.el-table .el-table__header-wrapper th.el-table__cell {
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  padding: 6px 0; white-space: nowrap; background: var(--el-table-header-bg-color);
}
.el-table .el-table__cell { padding: 5px 0; }
.el-table .cell { line-height: 1.35; font-size: 10px; padding: 0 8px; word-break: break-word; }
.el-table .el-table__empty-text { font-size: 11px; color: #6B7280; }
.el-table .el-table__cell .el-button + .el-button { margin-left: 4px; }

/* Public (quota dashboard) tables: same density, slightly softer header */
.public-mac-desktop .el-table .el-table__header-wrapper th.el-table__cell { background: rgba(120,120,128,.06); }

/* Danger row (was .table-danger) — e.g. failed requests in Logs */
.el-table .gj-danger-row, .el-table .gj-danger-row:hover > td.el-table__cell { background: #FDF0F1 !important; }

/* Drag-reorder highlight (was .table-primary) */
.el-table .gj-dragging-row, .el-table .gj-dragging-row:hover > td.el-table__cell { background: color-mix(in srgb, var(--el-color-primary) 12%, #fff) !important; }

/* Editor grids (Models, Pricing): rows of inline inputs */
.el-table.gj-table-editor .el-table__cell { padding: 4px 0; }

/* el-pagination: compact */
.el-pagination { --el-pagination-font-size: 12px; }