/* ════════════════════════════════════════════════════════════
   TripChow Admin Design System v1.0
   Primary: #0D523F  ·  Font: Poppins  ·  Radius: 10-14px
   ════════════════════════════════════════════════════════════ */

/* ── Shared base ──────────────────────────────────────────── */
:root {
    --tc-green:    #0D523F;
    --tc-green2:   #0a4232;
    --tc-green3:   #1a7a5a;
    --tc-green-bg: #f0faf4;
    --tc-green-bd: #c3e6d4;
    --tc-radius:   12px;
    --tc-radius-sm: 8px;
    --tc-shadow:   0 1px 8px rgba(0,0,0,.07);
    --tc-shadow-md:0 4px 18px rgba(0,0,0,.10);
    --tc-border:   #e8ecf0;
    --tc-text:     #1a1a2e;
    --tc-muted:    #888;
    --tc-page:     #f0f2f5;
}

/* ── Cards ─────────────────────────────────────────────────── */
.tc-card {
    background:#fff;
    border:1px solid var(--tc-border);
    border-radius:var(--tc-radius);
    box-shadow:var(--tc-shadow);
    overflow:hidden;
}
.tc-card-hdr {
    display:flex; align-items:center; gap:10px;
    padding:13px 18px;
    border-bottom:1px solid #f0f2f5;
    background:#fff;
}
.tc-card-hdr-icon { color:var(--tc-green); font-size:.95rem; }
.tc-card-hdr-title {
    font-size:.88rem; font-weight:600; color:var(--tc-text); margin:0;
}
.tc-card-body { padding:16px 18px; }

/* ── Gradient banner ───────────────────────────────────────── */
.tc-banner {
    background:linear-gradient(135deg,#073828 0%,var(--tc-green) 50%,var(--tc-green3) 100%);
    color:#fff; border-radius:var(--tc-radius); padding:20px 24px;
    margin-bottom:16px; position:relative; overflow:hidden;
}
.tc-banner::before {
    content:''; position:absolute; top:-50px; right:-50px;
    width:180px; height:180px; border-radius:50%;
    background:rgba(255,255,255,.06); pointer-events:none;
}
.tc-banner-pill {
    display:inline-flex; align-items:center; gap:5px;
    background:rgba(255,255,255,.14); padding:3px 11px;
    border-radius:50px; font-size:.7rem; font-weight:500;
    margin:3px 4px 0 0;
}

/* ── Stat cards ────────────────────────────────────────────── */
.tc-stat {
    border-radius:14px; padding:18px 20px; color:#fff;
    display:flex; align-items:center; justify-content:space-between;
    position:relative; overflow:hidden;
    transition:transform .2s, box-shadow .2s;
}
.tc-stat:hover { transform:translateY(-3px); box-shadow:var(--tc-shadow-md)!important; }
.tc-stat::after {
    content:''; position:absolute; right:-14px; bottom:-14px;
    width:75px; height:75px; border-radius:50%;
    background:rgba(255,255,255,.09);
}
.tc-stat-icon { font-size:1.9rem; opacity:.22; z-index:1; }
.tc-stat-val  { font-size:1.7rem; font-weight:700; line-height:1; }
.tc-stat-lbl  { font-size:.67rem; font-weight:500; text-transform:uppercase;
    letter-spacing:.1em; opacity:.8; margin-top:4px; }

/* ── Buttons ───────────────────────────────────────────────── */
.tc-btn {
    display:inline-flex; align-items:center; gap:6px;
    border:none; border-radius:var(--tc-radius-sm); padding:7px 16px;
    font-size:.8rem; font-weight:600; cursor:pointer;
    transition:all .15s; text-decoration:none; font-family:inherit;
    letter-spacing:.01em;
}
.tc-btn:hover { text-decoration:none; }
.tc-btn-primary { background:var(--tc-green); color:#fff; }
.tc-btn-primary:hover { background:var(--tc-green2); color:#fff; }
.tc-btn-light { background:var(--tc-green-bg); color:var(--tc-green); border:1px solid var(--tc-green-bd); }
.tc-btn-light:hover { background:var(--tc-green); color:#fff; }
.tc-btn-outline { background:#fff; color:var(--tc-green); border:1.5px solid var(--tc-green); }
.tc-btn-outline:hover { background:var(--tc-green); color:#fff; }
.tc-btn-danger { background:#fff1f2; color:#be123c; border:1px solid #fecdd3; }
.tc-btn-danger:hover { background:#be123c; color:#fff; }
.tc-btn-ghost { background:rgba(255,255,255,.13); color:#fff; border:1px solid rgba(255,255,255,.25); }
.tc-btn-ghost:hover { background:rgba(255,255,255,.22); color:#fff; }
.tc-btn-sm { padding:5px 12px; font-size:.74rem; border-radius:7px; }
.tc-btn-lg { padding:10px 22px; font-size:.88rem; }

/* ── Styled input group ────────────────────────────────────── */
.tc-input-wrap {
    border:1.5px solid var(--tc-border); border-radius:var(--tc-radius-sm);
    display:flex; align-items:stretch; overflow:hidden;
    transition:border-color .15s;
}
.tc-input-wrap:focus-within { border-color:var(--tc-green); }
.tc-input-prefix {
    background:#f8fafc; padding:0 12px;
    display:flex; align-items:center;
    font-size:.78rem; font-weight:500; color:#999;
    border-right:1.5px solid var(--tc-border); white-space:nowrap; flex-shrink:0;
}
.tc-input-wrap input,
.tc-input-wrap select,
.tc-input-wrap textarea {
    border:none; outline:none; padding:8px 11px;
    width:100%; font-family:inherit; font-size:.83rem;
    background:#fff; color:var(--tc-text);
}

/* ── Labels ────────────────────────────────────────────────── */
.tc-label {
    font-size:.68rem; font-weight:500; text-transform:uppercase;
    letter-spacing:.08em; color:var(--tc-muted); margin-bottom:5px; display:block;
}

/* ── KV row ────────────────────────────────────────────────── */
.tc-kv { display:flex; justify-content:space-between; align-items:flex-start;
    padding:7px 0; font-size:.82rem; border-bottom:1px solid #f5f5f5; gap:10px; }
.tc-kv:last-child { border-bottom:none; }
.tc-kv .lbl { color:#999; display:flex; align-items:center; gap:5px; flex-shrink:0; }
.tc-kv .val { font-weight:500; color:var(--tc-text); text-align:right; }

/* ── Total bar ─────────────────────────────────────────────── */
.tc-total-bar {
    background:linear-gradient(135deg,var(--tc-green),var(--tc-green3));
    color:#fff; border-radius:10px; padding:11px 16px;
    display:flex; justify-content:space-between; align-items:center;
    font-size:.9rem; font-weight:700; margin-top:10px;
}

/* ── Badges ────────────────────────────────────────────────── */
.tc-badge {
    display:inline-flex; align-items:center; gap:4px;
    padding:3px 9px; border-radius:50px; font-size:.7rem; font-weight:500;
}
.tc-badge-green  { background:var(--tc-green-bg); color:var(--tc-green); border:1px solid var(--tc-green-bd); }
.tc-badge-red    { background:#fff1f2; color:#be123c; border:1px solid #fecdd3; }
.tc-badge-blue   { background:#eff6ff; color:#1e40af; border:1px solid #bfdbfe; }
.tc-badge-orange { background:#fff7ed; color:#9a3412; border:1px solid #fed7aa; }
.tc-badge-grey   { background:#f9fafb; color:#6b7280; border:1px solid #e5e7eb; }
.tc-badge-purple { background:#fdf4ff; color:#7e22ce; border:1px solid #e9d5ff; }

/* ── Timer badge ───────────────────────────────────────────── */
.tc-timer { display:inline-flex; align-items:center; gap:5px;
    padding:3px 10px; border-radius:50px; font-size:.72rem; font-weight:500; }
.tc-timer-green  { background:var(--tc-green-bg); color:var(--tc-green); border:1px solid var(--tc-green-bd); }
.tc-timer-yellow { background:#fffbeb; color:#92400e; border:1px solid #fde68a; }
.tc-timer-orange { background:#fff7ed; color:#9a3412; border:1px solid #fed7aa; }
.tc-timer-red    { background:#fff1f2; color:#991b1b; border:1px solid #fecaa0;
    animation:tcPulse 1.4s ease-in-out infinite; }
@keyframes tcPulse { 0%,100%{opacity:1} 50%{opacity:.65} }

/* ── Avatar ────────────────────────────────────────────────── */
.tc-avatar {
    border-radius:50%; display:flex; align-items:center;
    justify-content:center; font-weight:700; color:#fff; flex-shrink:0;
    background:linear-gradient(135deg,var(--tc-green),var(--tc-green3));
}

/* ── Modal header ──────────────────────────────────────────── */
.tc-modal-hdr {
    background:var(--tc-green); padding:16px 22px;
    display:flex; align-items:center; justify-content:space-between;
}
.tc-modal-hdr h6 { color:#fff; font-weight:600; font-size:.9rem; margin:0; }
.tc-modal-hdr .close { color:#fff; opacity:.8; }

/* ── Warning panels ────────────────────────────────────────── */
.tc-warn { display:flex; align-items:flex-start; gap:9px;
    border-radius:8px; padding:10px 14px; font-size:.78rem; }
.tc-warn-yellow { background:#fffbeb; border:1px solid #fde68a; color:#92400e; }
.tc-warn-red    { background:#fff1f2; border:1px solid #fecdd3; color:#be123c; }

/* ── Table polish ──────────────────────────────────────────── */
.tc-table-wrap .fixed-table-container table thead th {
    background:#f8fafc; color:#475569;
    font-size:.72rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em;
    border-bottom:2px solid #e2e8f0; border-top:none; padding:11px 13px;
}
.tc-table-wrap .fixed-table-container table tbody td {
    font-size:.82rem; padding:10px 13px;
    border-top:1px solid #f1f5f9; vertical-align:middle;
}
.tc-table-wrap .fixed-table-container table tbody tr { transition:background .12s; }