/* Theme nền section */
.dark-section {
  background-color: #1a202c; /* nền tối */
  color: #f1f1f1;
  transition: background-color 0.3s ease;
}

.light-section {
  background-color: rgb(248 250 252); /* nền sáng */
  transition: background-color 0.3s ease;
  border-color: #e5e7eb;
}

/* Card mặc định */
.card {
  background-color: #2d3748; /* màu tối mặc định */
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 15px;
}

/* Khi theme sáng → card trong suốt */
.light-section .card {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
}
.light-section .card .icon{
  background-color: transparent;
}
.light-section .ticket *:not(.tbl-head,button):not(.tbl-head *)
{
    background:transparent;
    color: #000;
}
.light-section .chart-wrap
{
    background-color: #ffffff;
    border: none;
    box-shadow: none;
}
.light-section :is(.info, h4, span) {
  color: #000 !important;
}
/*theme feedback*/
.light-section .feedback
{
  background-color: transparent;
  color: black;
}
.light-section .feedback .tbl-head-fb
{
  background-color: rgb(241 245 249);
}
/*Theme ticket*/
.light-section .nav-filter
{
  border: 1px solid #e2e8f0;
}
.light-section .nav-filter p
{
  font-weight: bold;
}
.light-section .nav-filter button
{
  border-color: #e2e8f0;
  background: #e2e8f0;
  color: #000;
}
.light-section .tbl-ticket
{
  border: 1px solid #e2e8f0;
}
.light-section .tbl-head 
{
  background-color: rgb(241 245 249) !important;
}
.light-section .recent-ticket .info
{
  border-color: #e2e8f0;
}
.recent-ticket
{
  color: #e2e8f0 !important;
}
/*Theme feedback*/
.light-section .feedback
{
  background-color: #ffffff;
  margin: 20px;
  border: 1px solid #e5e7eb;
  padding: 0;
}
/* Theme KPI */
.light-section .KPI
{
  background-color: transparent;
  color: black;
  margin: 20px;
  border: 1px solid #e5e7eb;
  padding: 0;
}
.light-section .KPI .tbl-head-kpi
{
  background-color: rgb(241 245 249);
}
/*Theme chat*/
.light-section .chat
{
  background-color: transparent;
  color: #000;
  border: 1px solid #e2e8f0;
  margin: 20px;
}
.light-section .chat .chat-item:is(h6,p)
{
  background-color: transparent;
}
.light-section .chat .chat-item:focus
{
  background-color:#bcd5e0;
}
/*Theme footer*/
footer
{
  background-color: rgb(248 250 252);
}