body {
      background-color: #0a0e1a;
      color: #e0e6f0;
    }

    #historyContainer {
      padding: 8px;
    }

    #searchBoxUl {
      background-color: #0d1526;
      border: 1px solid #1e3254;
      border-radius: 6px;
      list-style: none;
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      align-items: center;
      padding: 8px 12px;
      width: 100%;
    }

    #historicTable_wrapper {
      width: 100%;
      overflow-x: auto;
      overflow-y: auto;
      max-height: calc(100vh - 180px);
    }

    #searchBoxUl span {
      font-family: 'Inter', system-ui, sans-serif;
      font-size: 13px;
      background-color: #1a2d45;
      color: #00c8a0;
      border: 1px solid #1e3254;
      border-radius: 5px;
      padding: 4px 10px;
    }

    .dropdown-menu {
      background: #0f1b2d !important;
      border: 1px solid #1e3254 !important;
      height: 300px;
      overflow-y: scroll !important;
    }

    .dropdown-menu .dropdown-item {
      color: #a0b8d0 !important;
      font-size: 12px;
    }

    .dropdown-menu .dropdown-item:hover {
      background: #1a2d45 !important;
      color: #00c8a0 !important;
    }

    #dayPicker {
      display: flex;
      gap: 4px;
      flex-wrap: wrap;
      margin-bottom: 6px;
    }

    #dayPicker .btn-outline-primary {
      border-color: #1e3254 !important;
      color: #a0b8d0 !important;
      background-color: #0f1b2d !important;
      font-size: 12px;
    }

    #dayPicker .btn-outline-primary:hover,
    #dayPicker .btn-outline-primary.active {
      background-color: #1a2d45 !important;
      border-color: #00c8a0 !important;
      color: #00c8a0 !important;
    }

    label {
      margin: 9px;
      color: #a0b8d0;
    }

    .form-control {
      background-color: #0f1b2d !important;
      color: #e0e6f0 !important;
      border: 1px solid #1e3254 !important;
    }

    .form-control:focus {
      border-color: #00c8a0 !important;
      box-shadow: 0 0 0 2px rgba(0,200,160,0.2) !important;
    }

    input[type="date"]::-webkit-calendar-picker-indicator {
      filter: invert(1);
      opacity: 0.7;
      cursor: pointer;
    }

    .btn-primary {
      background-color: #00c8a0 !important;
      border-color: #00c8a0 !important;
      color: #0a0e1a !important;
      font-weight: 600;
    }

    .btn-secondary {
      background: #0f1b2d !important;
      color: #e0e6f0 !important;
      border: 1px solid #1e3254 !important;
    }

    .btn-secondary:hover {
      background: #1a2d45 !important;
      border-color: #00c8a0 !important;
      color: #00c8a0 !important;
    }

    .table {
      color: #e0e6f0 !important;
      border-color: #1e3254 !important;
    }

    .table thead th {
      background-color: #0f1b2d !important;
      color: #00c8a0 !important;
      border-color: #1e3254 !important;
      position: sticky;
      top: 0;
      z-index: 2;
    }

    .table tbody tr:nth-child(odd) td {
      background-color: #0a0e1a !important;
      color: #e0e6f0 !important;
      border-color: #1e3254 !important;
    }

    .table tbody tr:nth-child(even) td {
      background-color: #0d1526 !important;
      color: #e0e6f0 !important;
      border-color: #1e3254 !important;
    }

    .table tbody tr:hover td {
      background-color: #1a2d45 !important;
    }

    #csvDownload {
      color: #00c8a0;
      font-size: 13px;
    }

    #searchBox {
      margin: 2px 0px 2px 0px;
      padding: 5px 0px 5px 0px;
    }

    .hs-searchbox .form-control {
      background: #0a0e1a !important;
      color: #e0e6f0 !important;
      border: 1px solid #1e3254 !important;
      font-size: 12px;
    }

/* ── Light Theme Overrides ── */
html.light-theme body { background-color: #eef6f3; color: #0f172a; }

html.light-theme #searchBoxUl {
    background-color: #ffffff !important;
    border-color: #c5ddd7 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

html.light-theme #searchBoxUl span {
    background-color: #e3f2ee !important;
    color: #007a60 !important;
    border-color: #b8d5cd !important;
}

html.light-theme .dropdown-menu {
    background: #ffffff !important;
    border-color: #c5ddd7 !important;
}
html.light-theme .dropdown-menu .dropdown-item {
    color: #334155 !important;
}
html.light-theme .dropdown-menu .dropdown-item:hover {
    background: #d5ede7 !important;
    color: #007a60 !important;
}

html.light-theme #dayPicker .btn-outline-primary {
    border-color: #b8d5cd !important;
    color: #334155 !important;
    background-color: #ffffff !important;
}
html.light-theme #dayPicker .btn-outline-primary:hover,
html.light-theme #dayPicker .btn-outline-primary.active {
    background-color: #d5ede7 !important;
    border-color: #007a60 !important;
    color: #007a60 !important;
}

html.light-theme label { color: #475569; }

html.light-theme .form-control {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border-color: #b8d5cd !important;
}
html.light-theme .form-control:focus {
    border-color: #007a60 !important;
    box-shadow: 0 0 0 3px rgba(0,122,96,0.12) !important;
}

html.light-theme input[type="date"]::-webkit-calendar-picker-indicator {
    filter: none;
    opacity: 0.5;
}

html.light-theme .btn-primary {
    background-color: #007a60 !important;
    border-color: #007a60 !important;
    color: #ffffff !important;
}

html.light-theme .btn-secondary {
    background: #e5f1ed !important;
    color: #334155 !important;
    border-color: #c5ddd7 !important;
}
html.light-theme .btn-secondary:hover {
    background: #d5ede7 !important;
    border-color: #007a60 !important;
    color: #007a60 !important;
}

html.light-theme .table {
    color: #0f172a !important;
    border-color: #c5ddd7 !important;
}
html.light-theme .table thead th {
    background-color: #e3f2ee !important;
    color: #007a60 !important;
    border-color: #b8d5cd !important;
}
html.light-theme .table tbody tr:nth-child(odd) td {
    background-color: #ffffff !important;
    color: #0f172a !important;
    border-color: #d5e8e3 !important;
}
html.light-theme .table tbody tr:nth-child(even) td {
    background-color: #f3faf8 !important;
    color: #0f172a !important;
    border-color: #d5e8e3 !important;
}
html.light-theme .table tbody tr:hover td { background-color: #d5ede7 !important; }

html.light-theme #csvDownload { color: #007a60; }

html.light-theme .hs-searchbox .form-control {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: #b8d5cd !important;
}

/* ── Graphite Theme Overrides ── */
html.graphite-theme body { background-color: #e8eaed; color: #1a1d21; }

html.graphite-theme #searchBoxUl {
    background-color: #f5f6f7 !important;
    border-color: #bcc1c8 !important;
}

html.graphite-theme #searchBoxUl span {
    background-color: #e2e5e9 !important;
    color: #007a60 !important;
    border-color: #b0b6be !important;
}

html.graphite-theme .dropdown-menu {
    background: #f5f6f7 !important;
    border-color: #bcc1c8 !important;
}
html.graphite-theme .dropdown-menu .dropdown-item { color: #3d4552 !important; }
html.graphite-theme .dropdown-menu .dropdown-item:hover {
    background: #d0d4d9 !important;
    color: #007a60 !important;
}

html.graphite-theme #dayPicker .btn-outline-primary {
    border-color: #b0b6be !important;
    color: #3d4552 !important;
    background-color: #f5f6f7 !important;
}
html.graphite-theme #dayPicker .btn-outline-primary:hover,
html.graphite-theme #dayPicker .btn-outline-primary.active {
    background-color: #d0d4d9 !important;
    border-color: #007a60 !important;
    color: #007a60 !important;
}

html.graphite-theme label { color: #5a6170; }

html.graphite-theme .form-control {
    background-color: #ffffff !important;
    color: #1a1d21 !important;
    border-color: #b0b6be !important;
}
html.graphite-theme .form-control:focus {
    border-color: #007a60 !important;
    box-shadow: 0 0 0 3px rgba(0,122,96,0.12) !important;
}

html.graphite-theme input[type="date"]::-webkit-calendar-picker-indicator {
    filter: none;
    opacity: 0.5;
}

html.graphite-theme .btn-primary {
    background-color: #007a60 !important;
    border-color: #007a60 !important;
    color: #ffffff !important;
}

html.graphite-theme .btn-secondary {
    background: #dde0e4 !important;
    color: #3d4552 !important;
    border-color: #bcc1c8 !important;
}
html.graphite-theme .btn-secondary:hover {
    background: #d0d4d9 !important;
    border-color: #007a60 !important;
    color: #007a60 !important;
}

html.graphite-theme .table {
    color: #1a1d21 !important;
    border-color: #bcc1c8 !important;
}
html.graphite-theme .table thead th {
    background-color: #e2e5e9 !important;
    color: #007a60 !important;
    border-color: #b0b6be !important;
}
html.graphite-theme .table tbody tr:nth-child(odd) td {
    background-color: #f5f6f7 !important;
    color: #1a1d21 !important;
    border-color: #e4e7eb !important;
}
html.graphite-theme .table tbody tr:nth-child(even) td {
    background-color: #eeeff1 !important;
    color: #1a1d21 !important;
    border-color: #e4e7eb !important;
}
html.graphite-theme .table tbody tr:hover td { background-color: #d0d4d9 !important; }

html.graphite-theme #csvDownload { color: #007a60; }

html.graphite-theme .hs-searchbox .form-control {
    background: #ffffff !important;
    color: #1a1d21 !important;
    border-color: #b0b6be !important;
}