/* ================================================================
   Techwave Allocations — Dashboard CSS  v4
   Palette:  Gold #C69C6D · Gold2 #bc9785 · Green #16302F · Carbon #262626
   Theme:    Light · Compact · Elegant
   ================================================================ */


/* ================================================================
   SECTION 1 — ADMIN BACKEND DASHBOARD
   ================================================================ */

/* dashboard_css */

/* ── Outer wrap ──────────────────────────────────────────────── */
.tw-admin-wrap {
  margin: 20px 20px 20px 0;
}

/* ── Main shell ──────────────────────────────────────────────── */
.tw-admin-shell {
  --tw-gold:   #C69C6D;
  --tw-gold2:  #bc9785;
  --tw-green:  #16302F;
  --tw-carbon: #262626;
  --tw-bg:     #f6f3ee;
  --tw-card:   #ffffff;
  --tw-line:   rgba(22,48,47,.09);
  --tw-text:   #1a2b2a;
  --tw-muted:  #6b7570;
  background: #f6f3ee;
  border: 1px solid rgba(22,48,47,.1);
  border-radius: 22px;
  padding: 28px;
  color: #1a2b2a;
  box-shadow: 0 4px 32px rgba(22,48,47,.08);
}

/* ── Top header ──────────────────────────────────────────────── */
.tw-admin-top {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin-bottom: 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(22,48,47,.09);
}

.tw-admin-top h1 {
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
  color: #16302F;
  letter-spacing: -.02em;
  display: flex;
  align-items: center;
  gap: 12px;
}

.tw-admin-top h1::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 24px;
  background: linear-gradient(180deg, #C69C6D 0%, #bc9785 100%);
  border-radius: 999px;
  flex-shrink: 0;
}

.tw-admin-lead {
  margin: 6px 0 0;
  color: #6b7570;
  font-size: 12px;
  max-width: 560px;
  line-height: 1.55;
}

/* Refresh button */
.tw-admin-actions .button.button-primary {
  background: #16302F !important;
  border-color: #16302F !important;
  color: #C69C6D !important;
  border-radius: 999px !important;
  padding: 8px 22px !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  box-shadow: 0 4px 14px rgba(22,48,47,.2) !important;
  text-shadow: none !important;
  height: auto !important;
  line-height: 1.4 !important;
  letter-spacing: .02em;
  transition: opacity .15s ease;
}
.tw-admin-actions .button.button-primary:hover,
.tw-admin-actions .button.button-primary:focus {
  opacity: .85;
  color: #C69C6D !important;
  background: #16302F !important;
}

/* Last-updated badge */
.tw-admin-updated {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(22,48,47,.06);
  color: #16302F;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .04em;
  margin-bottom: 18px;
  border: 1px solid rgba(22,48,47,.1);
}

/* ── KPI grid ────────────────────────────────────────────────── */
.tw-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.tw-kpi-card {
  position: relative;
  padding: 18px 18px 15px;
  background: linear-gradient(145deg, #16302F 0%, #1d3e3b 100%);
  border: 1px solid rgba(198,156,109,.18);
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(22,48,47,.14);
  overflow: hidden;
}

.tw-kpi-card::before {
  content: '';
  position: absolute;
  bottom: -28px;
  right: -28px;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: rgba(198,156,109,.07);
  pointer-events: none;
}

.tw-kpi-icon {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(198,156,109,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: none;
}

.tw-kpi-icon i {
  font-size: 14px;
  color: #C69C6D;
}

.tw-kpi-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.52);
  margin-bottom: 10px;
}

.tw-kpi-value {
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
  color: #ffffff;
  letter-spacing: -.02em;
}

.tw-kpi-meta {
  margin-top: 6px;
  color: rgba(255,255,255,.48);
  font-size: 11px;
  line-height: 1.4;
}

/* ── Two-column layout grid ──────────────────────────────────── */
.tw-layout-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 12px;
}

/* ── Panels ──────────────────────────────────────────────────── */
.tw-admin-metaItem,
.tw-help-card,
.tw-kpi-card,
.tw-panel {
  border-radius: 16px;
}

.tw-panel {
  background: #ffffff;
  border: 1px solid rgba(22,48,47,.08);
  border-radius: 16px;
  padding: 18px 20px;
  box-shadow: 0 2px 12px rgba(22,48,47,.05);
}

.tw-panel-wide {
  grid-column: 1 / -1;
}

.tw-panel--benchAdmin {
  padding: 0;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.tw-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(22,48,47,.07);
}

/* Worldmap panel head — title left, disclaimer right */
.tw-panel-head--worldmap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.tw-wm-disclaimer {
  flex: 0 1 340px;
  font-size: 11px;
  line-height: 1.5;
  color: rgba(22,48,47,.45);
  font-weight: 400;
  margin: 0;
  text-align: right;
}
@media (max-width: 780px) {
  .tw-wm-disclaimer { display: none; }
}

.tw-panel-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: #16302F;
  letter-spacing: -.01em;
}

.tw-panel-head span {
  color: #6b7570;
  font-size: 11px;
}

/* ── Meta info (REST / JSON / Cron) ──────────────────────────── */
.tw-admin-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  margin: 16px 0 14px;
}

.tw-admin-metaItem {
  padding: 14px 16px;
  background: #ffffff;
  border: 1px solid rgba(22,48,47,.08);
  border-radius: 16px;
}

.tw-admin-metaItem span {
  display: block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #6b7570;
  margin-bottom: 6px;
}

.tw-admin-metaItem code {
  display: block;
  word-break: break-all;
  background: rgba(22,48,47,.04);
  color: #16302F;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 11px;
  border: 1px solid rgba(22,48,47,.08);
}

/* ── Portfolio profile grid ──────────────────────────────────── */
.tw-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px;
}

.tw-profile-item {
  position: relative;
  padding: 14px 16px;
  border-radius: 14px;
  background: #f6f3ee;
  border: 1px solid rgba(22,48,47,.08);
  box-shadow: none;
}

.tw-profile-icon {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: rgba(198,156,109,.15);
  display: flex;
  align-items: center;
  justify-content: center;
}

.tw-profile-icon i {
  font-size: 13px;
  color: #C69C6D;
}

.tw-profile-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 700;
  color: #6b7570;
  margin-bottom: 6px;
}

.tw-profile-value {
  font-size: 18px;
  font-weight: 800;
  color: #16302F;
  line-height: 1.2;
  letter-spacing: -.01em;
}

.tw-profile-meta {
  margin-top: 3px;
  font-size: 11px;
  color: #6b7570;
}

/* ── Bar rows — compact list style ───────────────────────────── */
.tw-bars {
  display: grid;
  gap: 0;
}

.tw-bar-row {
  display: grid;
  grid-template-columns: minmax(150px,1fr) minmax(100px,2fr) 72px;
  gap: 10px;
  align-items: center;
  padding: 8px 2px;
  border-bottom: 1px solid rgba(22,48,47,.06);
  transition: background .1s ease;
}

.tw-bar-row:last-child {
  border-bottom: none;
}

.tw-bar-row:hover {
  background: rgba(22,48,47,.02);
}

.tw-bar-meta {
  min-width: 0;
}

.tw-bar-title {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.tw-bar-title > div:last-child {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.tw-bar-name {
  display: block;
  font-weight: 700;
  color: #16302F;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}

.tw-bar-ticker {
  display: block;
  font-size: 10px;
  color: #6b7570;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  line-height: 1.2;
}

.tw-bar-track {
  height: 4px;
  border-radius: 999px;
  background: rgba(22,48,47,.08);
  overflow: hidden;
  position: relative;
}

.tw-bar-track span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #16302F 0%, #C69C6D 100%);
}

.tw-bar-value {
  text-align: right;
  font-weight: 800;
  color: #16302F;
  font-size: 12px;
}

/* ── Detailed positions table — compact, divider style ───────── */
.tw-table-wrap {
  overflow: auto;
}

.tw-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

.tw-table thead th {
  text-align: left;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: #6b7570;
  padding: 0 12px 10px;
  font-weight: 700;
  border-bottom: 2px solid rgba(22,48,47,.08);
}

.tw-table tbody td {
  padding: 9px 12px;
  background: transparent;
  border-bottom: 1px solid rgba(22,48,47,.06);
  color: #1a2b2a;
  font-size: 12px;
  vertical-align: middle;
  transition: background .1s ease;
}

.tw-table tbody tr:hover td {
  background: rgba(22,48,47,.025);
}

/* Remove all the individual cell borders and radius from old card-style */
.tw-table tbody td:first-child {
  border-left: none;
  border-radius: 0;
}

.tw-table tbody td:last-child {
  border-right: none;
  border-radius: 0;
}

/* ── Company logo — ROUND ────────────────────────────────────── */
.tw-logo {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex: 0 0 28px;
  background: #f0ece4;
  border: 1px solid rgba(22,48,47,.1);
}

.tw-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
}

.tw-logo-fallback {
  width: 100%;
  height: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 10px;
  color: #16302F;
  background: rgba(22,48,47,.08);
}

/* ── Table company cell ──────────────────────────────────────── */
.tw-table-company,
.tw-bar-title {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.tw-table-company > div,
.tw-bar-title > div:last-child {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.tw-table-company strong,
.tw-bar-name {
  display: block;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  color: #16302F;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tw-table-company span,
.tw-bar-ticker {
  display: block;
  font-size: 10px;
  line-height: 1.2;
  color: #6b7570;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tw-alloc-table tbody td:first-child {
  min-width: 220px;
}

/* ── Help / shortcodes section ───────────────────────────────── */
.tw-admin-help {
  margin-top: 18px;
}

.tw-admin-help h2 {
  font-size: 10px;
  font-weight: 700;
  color: #6b7570;
  text-transform: uppercase;
  letter-spacing: .1em;
  margin: 0 0 10px;
}

.tw-help-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 8px;
}

.tw-help-card {
  padding: 13px 15px;
  background: #ffffff;
  border: 1px solid rgba(22,48,47,.08);
  border-radius: 14px;
  font-size: 12px;
  color: #6b7570;
}

.tw-help-card strong {
  display: block;
  color: #16302F;
  font-weight: 700;
  margin-bottom: 6px;
  font-size: 12px;
}

.tw-help-card code {
  display: block;
  background: rgba(22,48,47,.04);
  color: #16302F;
  padding: 5px 8px;
  border-radius: 6px;
  margin-top: 4px;
  word-break: break-all;
  font-size: 11px;
  border: 1px solid rgba(22,48,47,.08);
}

/* ── Responsive — admin ──────────────────────────────────────── */
@media (max-width:1400px) {
  .tw-kpi-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width:1200px) {
  .tw-kpi-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .tw-layout-grid { grid-template-columns: 1fr; }
  .tw-admin-meta, .tw-help-grid { grid-template-columns: 1fr; }
}
@media (max-width:782px) {
  .tw-admin-top { flex-direction: column; }
  .tw-kpi-grid, .tw-profile-grid { grid-template-columns: 1fr; }
  .tw-bar-row { grid-template-columns: 1fr; }
  .tw-bar-value { text-align: left; }
  .tw-admin-shell { padding: 16px; border-radius: 16px; }
}


/* ================================================================
   SECTION 2 — FRONTEND DASHBOARD SHORTCODE
   ================================================================ */

/* frontend_dashboard_css */

.tw-alloc-dashboard {
  --tw-green:  #16302F;
  --tw-gold:   #C69C6D;
  --tw-gold2:  #bc9785;
  --tw-cream:  #f6f3ee;
  --tw-card:   #ffffff;
  --tw-line:   rgba(22,48,47,.08);
  --tw-muted:  #6b7570;
  color: #16302F;
}

.tw-alloc-dashboard * {
  box-sizing: border-box;
}

.tw-alloc-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  padding: 28px 30px;
  border-radius: 22px;
  background: linear-gradient(135deg, #16302F 0%, #1d413e 55%, #274c49 100%);
  color: #fff;
  box-shadow: 0 10px 36px rgba(22,48,47,.18);
}

.tw-alloc-kicker {
  display: inline-block;
  padding: 5px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.1);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.tw-alloc-hero h2 {
  margin: 0;
  font-size: 32px;
  line-height: 1.05;
  color: #fff;
  font-weight: 800;
  letter-spacing: -.02em;
}

.tw-alloc-updated {
  margin-top: 8px;
  color: rgba(255,255,255,.68);
  font-size: 12px;
}

.tw-alloc-chip {
  padding: 12px 18px;
  border-radius: 999px;
  background: rgba(198,156,109,.16);
  color: #C69C6D;
  font-weight: 800;
  white-space: nowrap;
  border: 1px solid rgba(198,156,109,.26);
  font-size: 13px;
}

.tw-alloc-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 10px;
  margin: 14px 0;
}

.tw-stat-card,
.tw-panel {
  background: var(--tw-card);
  border: 1px solid var(--tw-line);
  border-radius: 18px;
  box-shadow: 0 2px 12px rgba(22,48,47,.06);
}

.tw-stat-card {
  position: relative;
  padding: 18px;
  background: linear-gradient(145deg, #16302F 0%, #1c3d3a 100%);
  border-color: rgba(198,156,109,.14);
  box-shadow: 0 8px 24px rgba(22,48,47,.16);
}

.tw-stat-card.is-warn {
  background: linear-gradient(145deg, #a07b3c 0%, #C69C6D 100%);
}

.tw-stat-card.is-bad {
  background: linear-gradient(145deg, #8f2f2f 0%, #c15555 100%);
}

.tw-stat-icon {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(198,156,109,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: none;
}

.tw-stat-icon i {
  font-size: 14px;
  color: #C69C6D;
}

.tw-stat-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .1em;
  font-weight: 700;
  color: rgba(255,255,255,.58);
  margin-bottom: 8px;
}

.tw-stat-value {
  font-size: 22px;
  font-weight: 800;
  line-height: 1.08;
  color: #fff;
  letter-spacing: -.02em;
}

.tw-stat-meta {
  margin-top: 6px;
  color: rgba(255,255,255,.65);
  font-size: 11px;
}

.tw-stat-meter {
  margin-top: 8px;
  height: 3px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  overflow: hidden;
}
.tw-stat-meter span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #C69C6D;
}

.tw-alloc-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 12px;
  margin-bottom: 12px;
}

.tw-panel {
  padding: 18px 20px;
}

.tw-panel--table { margin-top: 0; }

.tw-panel__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--tw-line);
}

.tw-panel__head h3 {
  margin: 0;
  font-size: 16px;
  line-height: 1.1;
  color: #16302F;
  font-weight: 800;
  letter-spacing: -.01em;
}

.tw-panel__head span {
  color: var(--tw-muted);
  font-size: 11px;
}

/* Frontend profile items — warm light */
.tw-profile-item {
  position: relative;
  padding: 14px 16px;
  border-radius: 14px;
  background: #f6f3ee;
  border: 1px solid rgba(22,48,47,.08);
  box-shadow: none;
}

/* Frontend table */
.tw-alloc-dashboard .tw-table { border-collapse: collapse; border-spacing: 0; }
.tw-alloc-dashboard .tw-table thead th { color: var(--tw-muted); border-bottom: 2px solid rgba(22,48,47,.08); }
.tw-alloc-dashboard .tw-table tbody td {
  background: transparent;
  color: #16302F;
  border-bottom: 1px solid rgba(22,48,47,.06);
  border-top: none; border-left: none; border-right: none;
  border-radius: 0;
}
.tw-alloc-dashboard .tw-table tbody td:first-child { border-left: none; border-radius: 0; }
.tw-alloc-dashboard .tw-table tbody td:last-child  { border-right: none; border-radius: 0; }
.tw-alloc-dashboard .tw-table tbody tr:hover td    { background: rgba(22,48,47,.025); }

.tw-alloc-dashboard .tw-table-company strong { color: #16302F; }
.tw-alloc-dashboard .tw-table-company span   { color: var(--tw-muted); }
.tw-alloc-dashboard .tw-logo { background: #f0ece4; border-color: rgba(22,48,47,.1); border-radius: 999px; }
.tw-alloc-dashboard .tw-logo-fallback { color: #16302F; background: rgba(22,48,47,.07); }
.tw-alloc-dashboard .tw-bar-name   { color: #16302F; }
.tw-alloc-dashboard .tw-bar-ticker { color: var(--tw-muted); }
.tw-alloc-dashboard .tw-bar-track  { background: rgba(22,48,47,.08); }
.tw-alloc-dashboard .tw-bar-value  { color: #16302F; }

@media (max-width:1024px) {
  .tw-alloc-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .tw-alloc-grid  { grid-template-columns: 1fr; }
  .tw-profile-grid { grid-template-columns: 1fr; }
}
@media (max-width:767px) {
  .tw-alloc-hero { flex-direction: column; }
  .tw-alloc-hero h2 { font-size: 26px; }
  .tw-alloc-chip { white-space: normal; }
  .tw-alloc-cards { grid-template-columns: 1fr; }
  .tw-bar-row { grid-template-columns: 1fr; }
  .tw-bar-value { text-align: left; }
}


/* ================================================================
   SECTION 3 — BENCHMARK & RISK MODULE
   (light warm palette — looks good on both light admin and frontend)
   ================================================================ */

/* benchmark_module_css */

.tw-panel--benchAdmin {
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

.tw-bench-module {
  --tw-bg:     #f6f3ee;
  --tw-card:   #ffffff;
  --tw-card-2: #faf8f4;
  --tw-line:   rgba(22,48,47,.09);
  --tw-text:   #16302F;
  --tw-muted:  #6b7570;
  --tw-gold:   #C69C6D;
  --tw-green:  #16302F;
  --tw-grey:   #a8b3af;
  background: #f6f3ee;
  border: 1px solid rgba(22,48,47,.09);
  border-radius: 22px;
  padding: 22px;
  box-shadow: 0 2px 16px rgba(22,48,47,.07);
  margin: 14px 0;
}

.tw-bench-head,
.tw-risk-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 16px;
}

.tw-bench-head h3,
.tw-risk-head h3 {
  margin: 0;
  font-size: 16px;
  line-height: 1.1;
  color: var(--tw-text);
  font-weight: 800;
  letter-spacing: -.01em;
}

.tw-bench-head span,
.tw-risk-head span {
  display: block;
  margin-top: 4px;
  color: var(--tw-muted);
  font-size: 12px;
}

.tw-bench-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.tw-bench-periods {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.tw-bench-period {
  appearance: none;
  border: 1px solid rgba(22,48,47,.1);
  background: #ffffff;
  color: var(--tw-text);
  padding: 7px 13px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 12px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(22,48,47,.06);
}

.tw-bench-period.is-active {
  background: var(--tw-green);
  color: #fff;
  border-color: var(--tw-green);
  box-shadow: 0 4px 12px rgba(22,48,47,.14);
}

.tw-bench-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border-radius: 999px;
  background: #C69C6D;
  color: #ffffff;
  font-weight: 800;
  font-size: 12px;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(198,156,109,.22);
}

.tw-bench-summary {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.tw-bench-stat,
.tw-mini-metric {
  background: #ffffff;
  border: 1px solid rgba(22,48,47,.08);
  border-radius: 18px;
  padding: 15px 18px;
  box-shadow: 0 2px 10px rgba(22,48,47,.05);
}

.tw-bench-stat span,
.tw-mini-metric span {
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 700;
  color: var(--tw-muted);
  margin-bottom: 8px;
}

.tw-bench-stat strong,
.tw-mini-metric strong {
  display: block;
  font-size: 26px;
  font-weight: 800;
  line-height: 1.05;
  color: var(--tw-text);
  letter-spacing: -.02em;
}

.tw-mini-metric strong { font-size: 22px; }

.tw-bench-stat strong.is-pos     { background: rgba(46,125,50,.1);  color: #2E7D32; padding: 10px 14px; border-radius: 999px; display: inline-flex; }
.tw-bench-stat strong.is-neg     { background: rgba(211,47,47,.1);  color: #D32F2F; padding: 10px 14px; border-radius: 999px; display: inline-flex; }
.tw-bench-stat strong.is-neutral { background: rgba(22,48,47,.06);  color: var(--tw-text); padding: 10px 14px; border-radius: 999px; display: inline-flex; }
.tw-mini-metric strong.is-pos    { color: #2f7a45; }
.tw-mini-metric strong.is-neg    { color: #b25745; }
.tw-mini-metric strong.is-neutral { color: var(--tw-text); }

.tw-bench-stat small {
  display: block;
  margin-top: 8px;
  color: var(--tw-muted);
  font-size: 11px;
}

.tw-bench-chart-card {
  background: #ffffff;
  border: 1px solid rgba(22,48,47,.08);
  border-radius: 20px;
  padding: 16px;
  box-shadow: 0 2px 12px rgba(22,48,47,.06);
  margin-bottom: 20px;
}

/* Logo — round everywhere */
.tw-logo {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex: 0 0 28px;
  background: #f0ece4;
  border: 1px solid rgba(22,48,47,.1);
}

.tw-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
}

.tw-logo-fallback {
  width: 100%;
  height: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 10px;
  color: #16302F;
  background: rgba(22,48,47,.08);
}

.tw-table-company {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.tw-table-company > div:last-child {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.tw-table-company strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  color: #16302F;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tw-table-company span {
  display: block;
  font-size: 10px;
  color: #6b7570;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  line-height: 1.1;
}

.tw-alloc-table tbody td:first-child {
  min-width: 240px;
}

.tw-bench-chart-legend {
  display: flex;
  gap: 16px;
  align-items: center;
  color: var(--tw-text);
  font-weight: 700;
  font-size: 12px;
  margin-bottom: 10px;
}

.tw-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  margin-right: 6px;
  vertical-align: middle;
}

.tw-dot--tech { background: #C69C6D; }
.tw-dot--ndx  { background: #a8b3af; }

.tw-bench-chart {
  position: relative;
  min-height: 320px;
  border-radius: 16px;
  overflow: hidden;
  background: #ffffff;
  border: 1px solid rgba(22,48,47,.07);
}

.tw-bench-chart svg {
  display: block;
  width: 100%;
  height: 320px;
}

.tw-bench-axis     { fill: #7b8480; font-size: 11px; font-weight: 700; }
.tw-bench-axis--x  { fill: #7b8480; font-size: 11px; font-weight: 700; letter-spacing: .02em; }

.tw-bench-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 260px;
  color: #7b8480;
  font-weight: 700;
  font-size: 12px;
}

.tw-bench-tooltip {
  position: absolute;
  z-index: 4;
  min-width: 164px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid rgba(22,48,47,.1);
  box-shadow: 0 10px 30px rgba(22,48,47,.12);
  color: #16302F;
  pointer-events: none;
}

.tw-bench-tooltip-date {
  font-size: 10px;
  font-weight: 800;
  color: #16302F;
  margin-bottom: 7px;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.tw-bench-tooltip-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 12px;
  margin-top: 4px;
}

.tw-bench-tooltip-row span   { color: #6b7570; }
.tw-bench-tooltip-row strong { color: #16302F; font-weight: 800; }
.tw-bench-tooltip-row strong.is-pos  { color: #2E7D32; }
.tw-bench-tooltip-row strong.is-neg  { color: #D32F2F; }
.tw-bench-tooltip-row strong.is-neutral { color: #16302F; }

.tw-bench-extra {
  display: none !important;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 10px;
  margin: 4px 0 16px;
}

.tw-risk-module { margin-top: 8px; }

.tw-risk-module--standalone {
  background: var(--tw-bg);
  border: 1px solid rgba(22,48,47,.09);
  border-radius: 20px;
  padding: 20px;
  box-shadow: 0 2px 14px rgba(22,48,47,.06);
}

.tw-risk-table-wrap { overflow: auto; }

.tw-risk-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

.tw-risk-table thead th {
  text-align: left;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--tw-muted);
  padding: 0 12px 8px;
  font-weight: 700;
  border-bottom: 2px solid rgba(22,48,47,.08);
}

.tw-risk-table tbody td {
  padding: 10px 12px;
  background: transparent;
  border-bottom: 1px solid rgba(22,48,47,.07);
  vertical-align: middle;
}

.tw-risk-table tbody tr:last-child td { border-bottom: none; }

.tw-risk-table tbody td:first-child {
  border-left: none;
  border-radius: 0;
}

.tw-risk-table tbody td:last-child {
  border-right: none;
  border-radius: 0;
}

.tw-metric-emph {
  font-size: 14px;
  font-weight: 800;
  color: var(--tw-text);
  line-height: 1.1;
}

.tw-risk-note {
  margin-top: 3px;
  color: var(--tw-muted);
  font-size: 11px;
}

.tw-risk-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 90px;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
}

.tw-risk-pill.is-good    { background: #E6F4EA; color: #2E7D32; }
.tw-risk-pill.is-bad     { background: #FDECEA; color: #D32F2F; }
.tw-risk-pill.is-neutral { background: rgba(22,48,47,.06); color: #5a6660; }

.tw-risk-info {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: #16302F;
  color: #fff;
  font-weight: 800;
  font-size: 11px;
  border: 0;
  cursor: help;
  box-shadow: 0 3px 10px rgba(22,48,47,.16);
}

.tw-risk-info::after {
  content: attr(data-tooltip);
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  min-width: 200px;
  max-width: 260px;
  padding: 9px 11px;
  border-radius: 10px;
  background: #16302F;
  color: #fff;
  font-size: 11px;
  line-height: 1.5;
  font-weight: 600;
  box-shadow: 0 8px 24px rgba(0,0,0,.16);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
}

.tw-risk-info:hover::after,
.tw-risk-info:focus-visible::after {
  opacity: 1;
  visibility: visible;
}

@media (max-width:1024px) {
  .tw-bench-summary, .tw-bench-extra { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:767px) {
  .tw-bench-module, .tw-risk-module--standalone { padding: 16px; border-radius: 16px; }
  .tw-bench-head, .tw-risk-head { flex-direction: column; }
  .tw-bench-summary, .tw-bench-extra { grid-template-columns: 1fr; }
  .tw-bench-chart, .tw-bench-chart svg { height: 260px; min-height: 260px; }
  .tw-metric-emph { font-size: 13px; }
  .tw-risk-pill { font-size: 12px; min-width: 78px; }
}

/* ── Dark variant for frontend dark sections ─────────────────── */
.tw-bench-module.tw-dark {
  --tw-bg:     rgba(255,255,255,.06);
  --tw-card:   rgba(255,255,255,.08);
  --tw-card-2: rgba(255,255,255,.10);
  --tw-line:   rgba(255,255,255,.10);
  --tw-text:   #ffffff;
  --tw-muted:  rgba(255,255,255,.72);
  --tw-green:  #16302F;
  --tw-grey:   rgba(255,255,255,.52);
  background: #16302F;
  border: 0;
  color: #fff;
  box-shadow: 0 18px 44px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.06);
}

.tw-bench-module.tw-dark .tw-bench-head h3,
.tw-bench-module.tw-dark .tw-risk-head h3,
.tw-bench-module.tw-dark .tw-bench-chart-legend,
.tw-bench-module.tw-dark .tw-bench-tooltip-date,
.tw-bench-module.tw-dark .tw-bench-tooltip-row strong,
.tw-bench-module.tw-dark .tw-metric-emph { color: #fff; }

.tw-bench-module.tw-dark .tw-bench-head span,
.tw-bench-module.tw-dark .tw-risk-head span,
.tw-bench-module.tw-dark .tw-bench-axis,
.tw-bench-module.tw-dark .tw-bench-axis--x,
.tw-bench-module.tw-dark .tw-bench-empty,
.tw-bench-module.tw-dark .tw-risk-note,
.tw-bench-module.tw-dark .tw-bench-tooltip-row span,
.tw-bench-module.tw-dark .tw-bench-stat span,
.tw-bench-module.tw-dark .tw-mini-metric span,
.tw-bench-module.tw-dark .tw-bench-stat small,
.tw-bench-module.tw-dark .tw-risk-table thead th { color: rgba(255,255,255,.68); }

.tw-bench-module.tw-dark .tw-bench-period { background: rgba(255,255,255,.10); color: #fff; border: 1px solid rgba(255,255,255,.10); }
.tw-bench-module.tw-dark .tw-bench-period.is-active { background: #fff; color: #16302F; border-color: #fff; }
.tw-bench-module.tw-dark .tw-bench-badge { background: #C69C6D; color: #ffffff; }
.tw-bench-module.tw-dark .tw-bench-stat,
.tw-bench-module.tw-dark .tw-mini-metric,
.tw-bench-module.tw-dark .tw-bench-chart-card,
.tw-bench-module.tw-dark .tw-risk-module,
.tw-bench-module.tw-dark .tw-risk-table tbody td { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.10); box-shadow: none; color: #fff; }
.tw-bench-module.tw-dark .tw-bench-chart { background: rgba(255,255,255,.03); border-color: rgba(255,255,255,.08); }
.tw-bench-module.tw-dark .tw-risk-info { background: #fff; color: #16302F; }
.tw-bench-module.tw-dark .tw-risk-info::after { background: #fff; color: #16302F; }
.tw-bench-module.tw-dark .tw-bench-tooltip { background: #1d3e3c; color: #fff; border: 1px solid rgba(255,255,255,.10); }
.tw-bench-module.tw-dark .tw-bench-tooltip-row strong.is-pos { color: #7BD88D; }
.tw-bench-module.tw-dark .tw-bench-tooltip-row strong.is-neg { color: #FF8A80; }
.tw-bench-module.tw-dark .tw-risk-pill.is-good    { background: rgba(123,216,141,.16); color: #7BD88D; }
.tw-bench-module.tw-dark .tw-risk-pill.is-bad     { background: rgba(255,138,128,.14); color: #FFB199; }
.tw-bench-module.tw-dark .tw-risk-pill.is-neutral { background: rgba(255,255,255,.10); color: #fff; }


/* ================================================================
   SECTION 4 — FRONTEND COUNTRY / REGION MODULE
   ================================================================ */

/* frontend_country_css */

.tw-country-module {
  --tw-bg:   #f6f3ee;
  --tw-card: #ffffff;
  --tw-line: rgba(22,48,47,.09);
  --tw-text: #16302F;
  --tw-muted:#6b7570;
  --tw-gold: #C69C6D;
  background: var(--tw-bg);
  border: 1px solid rgba(22,48,47,.09);
  border-radius: 22px;
  padding: 22px;
  box-shadow: 0 2px 16px rgba(22,48,47,.06);
}

.tw-country-module * { box-sizing: border-box; }

.tw-country-module__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 14px;
}

.tw-country-module__head h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.1;
  color: var(--tw-text);
  font-weight: 800;
  letter-spacing: -.01em;
}

.tw-country-module__head span {
  font-size: 11px;
  color: var(--tw-muted);
}

.tw-country-list {
  display: grid;
  gap: 0;
}

.tw-country-row {
  display: grid;
  grid-template-columns: minmax(140px,1fr) minmax(100px,2fr) 80px;
  gap: 14px;
  align-items: center;
  background: transparent;
  border: none;
  border-bottom: 1px solid rgba(22,48,47,.07);
  padding: 9px 4px;
  box-shadow: none;
  border-radius: 0;
  transition: background .1s ease;
}

.tw-country-row:last-child { border-bottom: none; }
.tw-country-row:hover      { background: rgba(22,48,47,.025); }

.tw-country-meta strong {
  display: block;
  color: var(--tw-text);
  font-size: 13px;
  font-weight: 700;
}

.tw-country-meta span {
  display: block;
  margin-top: 2px;
  color: var(--tw-muted);
  font-size: 11px;
}

.tw-country-track {
  height: 4px;
  border-radius: 999px;
  background: rgba(22,48,47,.08);
  overflow: hidden;
}

.tw-country-track span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #16302F 0%, #C69C6D 100%);
}

.tw-country-value {
  text-align: right;
  font-weight: 800;
  color: var(--tw-text);
  font-size: 13px;
}

.tw-country-table-wrap { overflow: auto; }

.tw-country-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

.tw-country-table thead th {
  text-align: left;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--tw-muted);
  padding: 0 12px 8px;
  font-weight: 700;
  border-bottom: 2px solid rgba(22,48,47,.08);
}

.tw-country-table tbody td {
  padding: 9px 12px;
  background: transparent;
  border-bottom: 1px solid rgba(22,48,47,.06);
  box-shadow: none;
}

.tw-country-table tbody td:first-child { border-left: none; border-radius: 0; }
.tw-country-table tbody td:last-child  { border-right: none; border-radius: 0; }

@media (max-width:767px) {
  .tw-country-module { padding: 16px; border-radius: 16px; }
  .tw-country-module__head { flex-direction: column; align-items: flex-start; }
  .tw-country-row { grid-template-columns: 1fr; }
  .tw-country-value { text-align: left; }
}


/* ================================================================
   SECTION 5 — ADMIN OVERRIDES: benchmark module inside light admin
   (already light → minimal overrides needed, just lock the palette)
   ================================================================ */

.tw-bench-module.tw-dark {
  --tw-bg:     #f6f3ee !important;
  --tw-card:   #ffffff !important;
  --tw-card-2: #ffffff !important;
  --tw-line:   rgba(22,48,47,.09) !important;
  --tw-text:   #16302F !important;
  --tw-muted:  #6b7570 !important;
  --tw-green:  #16302F !important;
  --tw-grey:   #a8b3af !important;
  background: #f6f3ee !important;
  background-image: none !important;
  border: 1px solid rgba(22,48,47,.09) !important;
  border-radius: 20px !important;
  color: #16302F !important;
  box-shadow: 0 2px 14px rgba(22,48,47,.06) !important;
  padding: 20px !important;
}

.tw-bench-module.tw-dark .tw-bench-head h3,
.tw-bench-module.tw-dark .tw-risk-head h3 {
  color: #16302F !important;
  font-size: 15px !important;
}

.tw-bench-module.tw-dark .tw-bench-head > div > span,
.tw-bench-module.tw-dark .tw-bench-head span {
  display: none !important;
}

.tw-bench-module.tw-dark .tw-bench-badge {
  background: #C69C6D !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(198,156,109,.2) !important;
}

.tw-bench-module.tw-dark .tw-bench-period {
  background: #fff !important;
  color: #16302F !important;
  border: 1px solid rgba(22,48,47,.1) !important;
  box-shadow: 0 2px 8px rgba(22,48,47,.06) !important;
}

.tw-bench-module.tw-dark .tw-bench-period.is-active {
  background: #16302F !important;
  color: #fff !important;
  border-color: #16302F !important;
}

.tw-bench-module.tw-dark .tw-bench-stat,
.tw-bench-module.tw-dark .tw-mini-metric,
.tw-bench-module.tw-dark .tw-bench-chart-card,
.tw-bench-module.tw-dark .tw-risk-module,
.tw-bench-module.tw-dark .tw-risk-table tbody td {
  background: #ffffff !important;
  border-color: rgba(22,48,47,.08) !important;
  box-shadow: 0 2px 10px rgba(22,48,47,.05) !important;
  color: #16302F !important;
}

.tw-bench-module.tw-dark .tw-bench-stat span,
.tw-bench-module.tw-dark .tw-mini-metric span,
.tw-bench-module.tw-dark .tw-bench-stat small,
.tw-bench-module.tw-dark .tw-risk-note,
.tw-bench-module.tw-dark .tw-risk-table thead th,
.tw-bench-module.tw-dark .tw-bench-axis,
.tw-bench-module.tw-dark .tw-bench-axis--x,
.tw-bench-module.tw-dark .tw-bench-empty {
  color: #6b7570 !important;
}

.tw-bench-module.tw-dark .tw-bench-stat strong,
.tw-bench-module.tw-dark .tw-mini-metric strong,
.tw-bench-module.tw-dark .tw-metric-emph {
  color: #16302F !important;
}

.tw-bench-module.tw-dark .tw-bench-chart {
  background: #ffffff !important;
  border-color: rgba(22,48,47,.07) !important;
}

.tw-bench-module.tw-dark .tw-bench-chart-legend { color: #16302F !important; }

.tw-bench-module.tw-dark .tw-bench-tooltip {
  background: #ffffff !important;
  color: #16302F !important;
  border: 1px solid rgba(22,48,47,.1) !important;
  box-shadow: 0 10px 28px rgba(22,48,47,.1) !important;
}

.tw-bench-module.tw-dark .tw-bench-tooltip-date,
.tw-bench-module.tw-dark .tw-bench-tooltip-row strong {
  color: #16302F !important;
}

.tw-bench-module.tw-dark .tw-bench-tooltip-row span { color: #6b7570 !important; }
.tw-bench-module.tw-dark .tw-bench-tooltip-row strong.is-pos { color: #2E7D32 !important; }
.tw-bench-module.tw-dark .tw-bench-tooltip-row strong.is-neg { color: #D32F2F !important; }

.tw-bench-module.tw-dark .tw-risk-info {
  background: #16302F !important;
  color: #fff !important;
}

.tw-bench-module.tw-dark .tw-risk-info::after {
  background: #16302F !important;
  color: #fff !important;
}

.tw-bench-module.tw-dark .tw-risk-pill.is-good    { background: #E6F4EA !important; color: #2E7D32 !important; }
.tw-bench-module.tw-dark .tw-risk-pill.is-bad     { background: #FDECEA !important; color: #D32F2F !important; }
.tw-bench-module.tw-dark .tw-risk-pill.is-neutral { background: rgba(22,48,47,.06) !important; color: #5a6660 !important; }

.tw-bench-module.tw-dark .tw-risk-table tbody td:first-child,
.tw-bench-module.tw-dark .tw-risk-table tbody td:last-child {
  border-color: rgba(22,48,47,.08) !important;
}

/* Risk table — compact divider style inside admin */
.tw-bench-module.tw-dark .tw-risk-table {
  border-collapse: collapse !important;
  border-spacing: 0 !important;
}

.tw-bench-module.tw-dark .tw-risk-table tbody td {
  border-radius: 0 !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  border-bottom: 1px solid rgba(22,48,47,.07) !important;
  padding: 10px 12px !important;
}

.tw-bench-module.tw-dark .tw-risk-table tbody tr:last-child td {
  border-bottom: none !important;
}


/* ================================================================
   SECTION 6 — ENHANCED RISK TABLE
   (zebra, row icons, pill, info button)
   ================================================================ */

/* Visual break between benchmark chart and risk table */
.tw-bench-module .tw-risk-module:not(.tw-risk-module--standalone),
.tw-bench-module.tw-dark .tw-risk-module:not(.tw-risk-module--standalone) {
  margin-top: 24px !important;
  padding-top: 22px !important;
  border-top: 2px solid rgba(22,48,47,.09) !important;
  background: transparent !important;
  box-shadow: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: none !important;
  border-radius: 0 !important;
}

/* Risk head gold accent bar */
.tw-risk-head h3::before {
  content: '';
  display: block;
  width: 24px;
  height: 3px;
  background: linear-gradient(90deg, #C69C6D, #bc9785);
  border-radius: 999px;
  margin-bottom: 8px;
}

/* Risk table — full redesign */
.tw-risk-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

.tw-risk-table thead tr {
  border-bottom: 2px solid rgba(22,48,47,.09);
}

.tw-risk-table thead th {
  padding: 0 14px 10px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #6b7570;
  text-align: left;
}

.tw-risk-table thead th:nth-child(2),
.tw-risk-table thead th:nth-child(3) {
  text-align: right;
}

/* Zebra rows */
.tw-risk-table tbody tr.tw-risk-row {
  border-bottom: 1px solid rgba(22,48,47,.06);
  transition: background .1s ease;
}
.tw-risk-table tbody tr.tw-risk-row:last-child {
  border-bottom: none;
}
.tw-risk-table tbody tr.tw-risk-row--alt td {
  background: rgba(22,48,47,.018) !important;
}
.tw-risk-table tbody tr.tw-risk-row:hover td {
  background: rgba(198,156,109,.06) !important;
}

.tw-risk-table tbody td {
  padding: 12px 14px;
  vertical-align: middle;
  background: transparent;
  border: none;
  font-size: 13px;
}

/* Row label with icon */
.tw-risk-row-label {
  display: flex;
  align-items: center;
  gap: 12px;
}

.tw-risk-row-icon {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(22,48,47,.06);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .15s ease;
}

.tw-risk-row:hover .tw-risk-row-icon {
  background: rgba(198,156,109,.14);
}

.tw-risk-row-icon i {
  font-size: 13px;
  color: #16302F;
  transition: color .15s ease;
}

.tw-risk-row:hover .tw-risk-row-icon i {
  color: #C69C6D;
}

.tw-metric-emph {
  font-size: 14px;
  font-weight: 800;
  color: #16302F;
  line-height: 1.1;
}

.tw-risk-note {
  font-size: 11px;
  color: #6b7570;
  margin-top: 2px;
  line-height: 1.35;
  max-width: 340px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Techwave / Nasdaq values right-aligned */
.tw-metric-tech,
.tw-metric-ndx {
  text-align: right;
  display: block;
}

.tw-risk-table tbody td:nth-child(2),
.tw-risk-table tbody td:nth-child(3) {
  text-align: right;
}

/* Risk pill */
.tw-risk-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  padding: 7px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -.01em;
}

.tw-risk-pill.is-good    { background: #E8F5E9; color: #2E7D32; }
.tw-risk-pill.is-bad     { background: #FDECEA; color: #C62828; }
.tw-risk-pill.is-neutral { background: rgba(22,48,47,.07); color: #4a5550; }

/* Info button — icon style */
.tw-risk-info {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background: rgba(22,48,47,.07);
  color: #16302F;
  font-weight: 700;
  font-size: 13px;
  border: 0;
  cursor: help;
  box-shadow: none;
  transition: background .15s ease;
}

.tw-risk-info:hover {
  background: rgba(22,48,47,.13);
}

.tw-risk-info i {
  font-size: 13px;
  pointer-events: none;
}

.tw-risk-info::after {
  content: attr(data-tooltip);
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  min-width: 220px;
  max-width: 280px;
  padding: 10px 13px;
  border-radius: 12px;
  background: #16302F;
  color: #fff;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 500;
  box-shadow: 0 8px 28px rgba(22,48,47,.2);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
  z-index: 10;
  white-space: normal;
}

.tw-risk-info:hover::after,
.tw-risk-info:focus-visible::after {
  opacity: 1;
  visibility: visible;
}

/* Override: risk module inside benchmark module */
.tw-bench-module.tw-dark .tw-risk-row--alt td {
  background: rgba(22,48,47,.025) !important;
}

.tw-bench-module.tw-dark .tw-risk-row-icon {
  background: rgba(22,48,47,.06) !important;
}

.tw-bench-module.tw-dark .tw-risk-row-icon i {
  color: #16302F !important;
}

.tw-bench-module.tw-dark .tw-risk-row:hover .tw-risk-row-icon {
  background: rgba(198,156,109,.14) !important;
}

.tw-bench-module.tw-dark .tw-risk-row:hover .tw-risk-row-icon i {
  color: #C69C6D !important;
}

.tw-bench-module.tw-dark .tw-risk-note {
  color: #6b7570 !important;
}

.tw-bench-module.tw-dark .tw-metric-emph {
  color: #16302F !important;
}

.tw-bench-module.tw-dark .tw-risk-info {
  background: rgba(22,48,47,.07) !important;
  color: #16302F !important;
}

.tw-bench-module.tw-dark .tw-risk-head h3::before {
  background: linear-gradient(90deg, #C69C6D, #bc9785);
}


/* ================================================================
   SECTION 7 — PORTFOLIO TABLE ENHANCEMENTS
   ================================================================ */

/* Zebra rows */
.tw-alloc-table tbody tr.tw-tr-alt td {
  background: rgba(22,48,47,.022);
}

.tw-alloc-table tbody tr:hover td {
  background: rgba(198,156,109,.05) !important;
}

/* Logo — round, slightly smaller */
.tw-alloc-table .tw-logo {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  flex: 0 0 28px;
}

/* Ticker pill */
.tw-ticker-pill {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(22,48,47,.07);
  color: #16302F;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Country cell with flag */
.tw-country-cell {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  color: #1a2b2a;
  font-weight: 600;
  white-space: nowrap;
}

.tw-flag-emoji {
  font-size: 16px;
  line-height: 1;
  flex-shrink: 0;
}

/* ISIN — monospace, muted */
.tw-isin {
  font-family: ui-monospace, 'Cascadia Mono', 'Segoe UI Mono', monospace;
  font-size: 11px;
  color: #6b7570;
  letter-spacing: .02em;
}

/* Weight cell with mini bar */
.tw-weight-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 70px;
}

.tw-weight-num {
  font-size: 12px;
  font-weight: 800;
  color: #16302F;
  line-height: 1;
}

.tw-weight-bar {
  height: 3px;
  border-radius: 999px;
  background: rgba(22,48,47,.1);
  overflow: hidden;
}

.tw-weight-bar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #16302F, #C69C6D);
}

/* Right-aligned value column */
.tw-td-right {
  text-align: right;
}

.tw-td-right strong {
  font-size: 12px;
  font-weight: 700;
  color: #16302F;
}


/* ================================================================
   SECTION 8 — WORLD MAP PANEL
   ================================================================ */

.tw-panel--worldmap {
  /* Inherits .tw-panel styles */
}
/* Remove the gray separator line under the worldmap heading */
.tw-panel--worldmap .tw-panel-head {
  border-bottom: none;
  margin-bottom: 8px;
  padding-bottom: 4px;
}

/* ─── Choropleth world map ─── */
.tw-worldmap-wrap {
  margin-bottom: 18px;
}

/* Split layout: map on left, ranked legend on right.
   Each child gets its OWN border-radius — no overflow tricks needed. */
.tw-worldmap-wrap--split {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  background: transparent;
}
.tw-worldmap-wrap--split .tw-worldmap-container {
  flex: 1 1 0;
  min-width: 0;
  border-radius: 16px 0 0 16px;  /* left corners rounded */
  background: #f4f4f4;
  min-height: 240px;
  overflow: hidden;
}

/* Map area */
.tw-worldmap-container {
  width: 100%;
  background: #f4f4f4;
  border-radius: 16px;
  overflow: hidden;
  min-height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.tw-worldmap-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 40px 0;
  color: #555;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  opacity: .5;
}

.tw-worldmap-svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
}

/* Ocean */
.tw-wm-sphere { fill: #f4f4f4; }

/* Lat/lon grid */
.tw-wm-graticule {
  fill: none;
  stroke: rgba(0,0,0,.04);
  stroke-width: 0.4px;
}

/* Non-allocated countries */
.tw-wm-country-base {
  fill: #d8d8d8;
  stroke: #ffffff;
  stroke-width: 0.4px;
}

/* Allocated countries — all get #bc9785 via inline style in JS */
.tw-wm-country-alloc {
  stroke: #ffffff;
  stroke-width: 0.5px;
  cursor: pointer;
  transition: filter .15s ease;
}
.tw-wm-country-alloc:hover {
  filter: brightness(1.18) drop-shadow(0 2px 8px rgba(188,151,133,.5));
}

/* Country borders */
.tw-wm-borders {
  fill: none;
  stroke: rgba(255,255,255,.65);
  stroke-width: 0.4px;
  pointer-events: none;
}

/* Hover tooltip */
.tw-wm-tooltip {
  position: absolute;
  pointer-events: none;
  background: #1a1a1a;
  border-radius: 8px;
  padding: 7px 13px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  box-shadow: 0 4px 18px rgba(0,0,0,.22);
  z-index: 10;
  white-space: nowrap;
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .12s ease, transform .12s ease;
}
.tw-wm-tooltip.is-visible { opacity: 1; transform: translateY(0); }
.tw-wm-tooltip strong { font-size: 13px; font-weight: 800; color: #bc9785; }
.tw-wm-tooltip span   { font-size: 11px; color: rgba(255,255,255,.72); }
.tw-wm-empty-text     { font-size: 13px; fill: #aaa; }

/* ── Ranked legend sidebar ── */
.tw-worldmap-legend {
  flex: 0 0 196px;
  width: 196px;
  padding: 18px 16px 18px 14px;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  background: #f4f4f4;
  border-left: none;
  border-radius: 0;
}

.tw-wml-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #16302F;
  margin-bottom: 12px;
  flex-shrink: 0;
}

.tw-wml-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(0,0,0,.04);
}
.tw-wml-row:last-child { border-bottom: none; }

.tw-wml-rank {
  font-size: 9px;
  font-weight: 700;
  color: #cccccc;
  width: 12px;
  text-align: right;
  flex-shrink: 0;
}

.tw-wml-info { flex: 1; min-width: 0; }

.tw-wml-name-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 4px;
}

.tw-wml-name {
  font-size: 11px;
  font-weight: 700;
  color: #1a1a1a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 96px;
}

.tw-wml-pct {
  font-size: 11px;
  font-weight: 800;
  color: #bc9785;
  white-space: nowrap;
  flex-shrink: 0;
}

.tw-wml-bar { display: none; }

/* Emoji flag — plain, no circle */
.tw-wml-flag-wrap {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  font-size: 15px;
  line-height: 1;
}
.tw-wml-flag-empty {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  display: inline-block;
}

/* Responsive */
@media (max-width: 680px) {
.tw-worldmap-wrap--split { flex-direction: column; }
  .tw-worldmap-wrap--split .tw-worldmap-container { border-radius: 16px 16px 0 0; }
  .tw-worldmap-legend { flex: none; width: 100%; border-left: none; border-top: none; max-height: none; border-radius: 0; }
}

/* Country strip below the SVG map */
.tw-wm-country-strip {
  display: grid;
  gap: 0;
  border-top: 1px solid rgba(22,48,47,.08);
  padding-top: 14px;
}

.tw-wm-country-row {
  display: grid;
  grid-template-columns: 24px 1fr 3fr 60px;
  align-items: center;
  gap: 10px;
  padding: 7px 4px;
  border-bottom: 1px solid rgba(22,48,47,.05);
  transition: background .1s ease;
}

.tw-wm-country-row:last-child { border-bottom: none; }

.tw-wm-country-row:hover {
  background: rgba(22,48,47,.025);
  border-radius: 8px;
}

.tw-wm-flag { font-size: 18px; line-height: 1; text-align: center; }

.tw-wm-country-name {
  font-size: 12px;
  font-weight: 700;
  color: #16302F;
}

.tw-wm-country-track {
  height: 4px;
  border-radius: 999px;
  background: rgba(22,48,47,.08);
  overflow: hidden;
}

.tw-wm-country-track span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #16302F, #C69C6D);
}

.tw-wm-country-pct {
  font-size: 12px;
  font-weight: 800;
  color: #16302F;
  text-align: right;
}

@media (max-width: 600px) {
  .tw-wm-country-row { grid-template-columns: 24px 1fr 60px; }
  .tw-wm-country-track { display: none; }
}

/* ── Risk Table Light (standalone shortcode) ─────────────────────────────── */

/* Card wrapper — own standalone look */
.tw-panel--risk-table {
  background: #ffffff;
  border: 1px solid rgba(22,48,47,.08);
  border-radius: 20px;
  padding: 20px 22px 22px;
  box-shadow: 0 2px 12px rgba(22,48,47,.06);
  color: #16302F;
}

/* Header row: icon+title left, period buttons right */
.tw-rmt-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 16px;
  padding-bottom: 0;
  border-bottom: none;
}
.tw-rmt-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #16302F;
  display: flex;
  align-items: center;
  gap: 10px;
}
.tw-rmt-head h2 > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #C69C6D;
}
.tw-rmt-head h2 > span > svg {
  display: block;
  fill: #ffffff;
  width: 20px;
  height: 20px;
  overflow: visible;
}

/* Period buttons */
.tw-rmt-periods {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.tw-rmt-period {
  padding: 6px 16px;
  border-radius: 999px;
  border: 1px solid rgba(22,48,47,.15);
  background: transparent;
  color: rgba(22,48,47,.55);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  text-transform: none;
  letter-spacing: normal;
  transition: background .15s, color .15s, border-color .15s;
}
.tw-rmt-period.is-active,
.tw-rmt-period:hover {
  background: #16302F;
  color: #ffffff;
  border-color: #16302F;
}
/* "Benchmark (2026)" pill — always beige */
.tw-rmt-period[data-rmt-period="launch"],
.tw-rmt-period[data-rmt-period="launch"].is-active,
.tw-rmt-period[data-rmt-period="launch"]:hover {
  background: #C69C6D;
  color: #ffffff;
  border-color: #C69C6D;
  font-weight: 700;
}

/* Table container */
.tw-rmt-wrap {
  border-radius: 14px;
  border: 1px solid rgba(22,48,47,.08);
  overflow: hidden;
}
.tw-rmt {
  width: 100%;
  border-collapse: collapse;
}

/* Dark header */
.tw-rmt thead tr { background: #16302F; }
.tw-rmt thead th {
  padding: 12px 16px;
  color: #ffffff;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  text-align: left;
}
.tw-rmt-th-icon { width: 56px; padding-right: 4px; }
.tw-rmt-th-c    { text-align: center !important; }
.tw-rmt-th-info { width: 52px; text-align: right !important; padding-right: 12px; }
.tw-rmt-td-r    { text-align: right; }
/* Desktop: vis fuldt navn, skjul kort navn */
.tw-rmt-th-short { display: none; }
.tw-rmt-th-full  { display: inline; }

/* Zebra stripes — set on td directly so theme CSS cannot override */
.tw-rmt tbody tr:nth-child(odd)  td { background: #f9f9f9 !important; }
.tw-rmt tbody tr:nth-child(even) td { background: #f1f1f1 !important; }
.tw-rmt tbody tr:last-child { border-bottom: none; }
.tw-rmt tbody td {
  padding: 12px 16px;
  font-size: 12px;
  color: #16302F;
  vertical-align: middle;
  border-bottom: 2px solid #ffffff !important;
}
.tw-rmt tbody td:first-child { width: 56px; padding-right: 4px; }

/* Row icons: gold circle, white icon */
.tw-rmt-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #C69C6D;
  color: #ffffff;
  flex-shrink: 0;
}
.tw-rmt-label { font-weight: 600; }
.tw-rmt-val   { text-align: center; font-weight: 600; color: #16302F; }
.tw-rmt-val-l { text-align: left;   font-weight: 600; color: #16302F; }
.tw-rmt-val-c { text-align: center; font-weight: 600; color: #16302F; }
.tw-rmt-td-info { text-align: right; padding-right: 10px; width: 52px; }

/* Difference pill */
.tw-rmt-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 11px;
  white-space: nowrap;
  font-weight: 700;
}
.tw-rmt-pill.is-good    { background: rgba(22,128,72,.10); color: #168048; }
.tw-rmt-pill.is-bad     { background: rgba(200,50,50,.10); color: #c02828; }
.tw-rmt-pill.is-neutral { background: rgba(22,48,47,.08);  color: #16302F; }

/* Info button — round, dark green, white italic i */
.tw-rmt-info-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #16302F;
  color: #ffffff;
  border: 0;
  cursor: help;
  font-size: 13px;
  font-weight: 800;
  font-style: italic;
  line-height: 1;
  transition: background .15s ease;
  flex-shrink: 0;
}
.tw-rmt-info-btn:hover { background: #1e4a47; }
.tw-rmt-info-btn::after {
  content: attr(data-tooltip);
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%);
  min-width: 210px;
  max-width: 270px;
  padding: 10px 13px;
  border-radius: 12px;
  background: #16302F;
  color: #ffffff;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: normal;
  box-shadow: 0 8px 28px rgba(22,48,47,.22);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
  z-index: 20;
  white-space: normal;
}
.tw-rmt-info-btn:hover::after,
.tw-rmt-info-btn:focus-visible::after {
  opacity: 1;
  visibility: visible;
}

/* ── Tablet (≤ 768px): let komprimering ─────────────────── */
@media (max-width: 768px) {
  .tw-rmt-head { flex-wrap: wrap; gap: 10px; }
  .tw-rmt-head h2 { font-size: 16px; }
  .tw-rmt-periods { flex-wrap: wrap; }
  .tw-rmt thead th { padding: 10px 10px; font-size: 10px; }
  .tw-rmt tbody td { padding: 10px 10px; }
  .tw-rmt-pill { min-width: 64px; font-size: 12px; }
}

/* ── Mobil (≤ 540px): fjern logo/ikon-kolonne, behold Nasdaq 100 ── */
@media (max-width: 540px) {
  .tw-panel--risk-table { padding: 14px 10px 14px; }
  .tw-rmt-head h2 { font-size: 14px; }
  .tw-rmt-head h2 > span { width: 32px !important; height: 32px !important; }

  /* Skjul ikon-kolonne (1. th/td) — frigiver ~56px til indhold */
  .tw-rmt thead th:nth-child(1),
  .tw-rmt tbody td:nth-child(1) { display: none !important; }

  /* Mindre font og padding — alle 4 indholdskolonner vises */
  .tw-rmt thead th { padding: 8px 6px; font-size: 9px; letter-spacing: .03em; }
  .tw-rmt tbody td { padding: 9px 6px; font-size: 12px; }
  .tw-rmt-pill { min-width: 52px; font-size: 11px; padding: 4px 7px; }
  .tw-rmt-td-info { padding-right: 6px !important; width: 36px !important; }
  .tw-rmt-info-btn { width: 24px !important; height: 24px !important; font-size: 11px !important; }

  /* Abbrevierede kolonnenavne på mobil */
  .tw-rmt-th-full  { display: none; }
  .tw-rmt-th-short { display: inline; }

  /* Horisontal scroll som nødfallback */
  .tw-rmt-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ── Lille mobil (≤ 380px): skjul også Info ─────────────── */
@media (max-width: 380px) {
  .tw-rmt thead th:nth-child(6),
  .tw-rmt tbody td:nth-child(6) { display: none !important; }
  .tw-rmt thead th { font-size: 8px; padding: 7px 4px; }
  .tw-rmt tbody td { font-size: 11px; padding: 8px 4px; }
}
