/* Minimal, clean styling */
.tn-wrap { max-width: 1100px; margin: 0 auto; padding: 16px; }
.tn-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 992px) { .tn-grid-2 { grid-template-columns: 1fr 1fr; } .tn-grid-3 { grid-template-columns: repeat(3, 1fr); } }
.tn-card { background: #022902; border: 1px solid #e5e7eb; border-radius: 12px; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.tn-card h3 { margin: 0; font-size: 18px; }
.tn-card .tn-hd { padding: 14px 16px; border-bottom: 1px solid #000; font-weight: 600; }
.tn-card .tn-bd { padding: 16px; }
.tn-row { display: flex; gap: 12px; align-items: center; }
.tn-col { display: flex; flex-direction: column; gap: 6px; }
.tn-input { width: 80%; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 8px; }
.tn-input[disabled] { background: #f1f5f9; color: #64748b; }
.tn-btn { display:inline-flex; align-items:center; justify-content:center; padding:10px 16px; border-radius:10px; border:1px solid #0ea5e9; background:#0ea5e9; color:#fff; cursor:pointer; font-weight:600; }
.tn-btn[disabled] { opacity:.6; cursor:not-allowed; }
.tn-note { font-size: 12px; color: #ffffff; }

.tn-badges { display:flex; flex-wrap:wrap; gap:8px; }
.tn-badge { font-size:12px; padding:4px 8px; border-radius:9999px; background:#e2e8f0; color:#0f172a; display:inline-block; }
.tn-badge.green { background:#dcfce7; color:#166534; }
.tn-badge.blue { background:#dbeafe; color:#1e40af; }
.tn-badge.yellow { background:#fef9c3; color:#92400e; }
.tn-badge.red { background:#fee2e2; color:#991b1b; }
.tn-badge.gray { background:#e5e7eb; color:#374151; }

.tn-kpi { background:#f8fafc; border:1px solid #e2e8f0; border-radius:10px; padding:12px; }
.tn-kpi .kpi-title { font-size:12px; color:#475569; }
.tn-kpi .kpi-value { font-weight:700; font-size:18px; color:#0f172a; }

.tn-alert { border-left:4px solid; padding:12px; border-radius:10px; }
.tn-alert.green { background:#000000; border-left-color:#22c55e; }
.tn-alert.yellow { background:#000000; border-left-color:#eab308; }
.tn-alert.red { background:#000000; border-left-color:#ef4444; }
.tn-center { text-align:center; }
.tn-muted { color:#ffffff !important; }
