/* --- Typography & Font Weight --- */
.font-bold {
  font-weight: 700;
}

/* --- Margins, Padding, Grid --- */
.mr-1 {
  margin-right: 0px !important;
}

.p-3 > .name {
  color: #fff !important;
}

.grid-rows-2 {
  grid-template-rows: repeat(4, minmax(0, 1fr)) !important;
}

/* --- Colors, Buttons, Backgrounds --- */
.bg-indigo-600,
.bg-\[\#091e420f\] {
  background-color: #5f5f5f !important;
}

.color__list {
  height: 160px;
}

.btn-indigo {
  background-color: #0069CA !important;
}
.btn-indigo:hover {
  background-color: #0F0D1D !important;
}

.hover\:bg-indigo-500:hover {
  background-color: #656565 !important;
}

.text-indigo-500,
.text-\[\#172b4d\],
.text-\[20px\] {
  color: #fff !important;
}

/* --- Top Bar --- */
.top_bar,
.top_bar {
  background: #000 !important;
}
.layout-app.main .top_bar .t__menu span,
.layout-app.main .top_bar .t__menu svg {
  color: #fff !important;
  fill: #fff !important;
}
.top_bar .top_bar__menu .t__l__wrapper .__creation {
  background-color: #5f5f5f !important;
}

/* --- Sidebar & Navigation --- */
.sidebar {
  background-color: rgba(0,0,0,0.9) !important;
}

.layout-app.main .sidebar.sidebar_wrapper .name,
.layout-app.main .sidebar.sidebar_wrapper .arrow,
.ml-3,
.layout-app.main .sidebar.sidebar_wrapper .text,
.layout-app.main .sidebar.sidebar_wrapper ul.items li a,
.layout-app.main .sidebar.sidebar_wrapper .side_p_list .item,
.layout-app.main .top_bar .t__menu span,
.menu-item .menu-link .menu__name {
  color: #fff !important;
}

.layout-app.main .sidebar.sidebar_wrapper .add__plus svg,
.layout-app.main .sidebar.sidebar_wrapper ul.items li a svg,
.layout-app.main .select_user svg,
.menu__icon,
.fill-current {
  fill: #fff !important;
  color: #fff !important;
}

.menu-item.active .menu-link {
  background-color: #5f5f5f !important;
}

/* --- Layout & Theme --- */
.layout-app.light {
  background-color: #000c !important;
}

.theme-toggle {
  display: none !important;
}

.layout-app.main img.site-logo.color {
  display: none !important;
}
.layout-app.main img.site-logo.white {
  display: block !important;
}

/* --- Workspace & Projects --- */
.workspace__view .project__list .p__item {
  background-color: #757575 !important;
}

/* --- Forms (General & Auth) --- */
form.auth,
form.mt-8.bg-white {
  background: rgba(0,0,0,0.7) !important;
  border-color: #111 !important;
  color: #fff !important;
}

form.auth #remember {
  margin-right: 0.5rem !important;
}

form.auth input,
form.mt-8.bg-white input {
  background: rgba(0,0,0,0.5) !important;
  color: #fff !important;
  border: 1px solid #222 !important;
  caret-color: #fff !important;
}

form.auth input::placeholder,
form.mt-8.bg-white input::placeholder {
  color: #ddd !important;
  opacity: 1;
}

form.mt-8.bg-white label,
form.mt-8.bg-white h2,
form.mt-8.bg-white .form-label,
form.mt-8.bg-white .text-center,
form.mt-8.bg-white .text-xl,
form.mt-8.bg-white .font-bold {
  color: #fff !important;
}

/* --- Login & Auth Backgrounds --- */
body > #app[data-page*='Auth\\/Login'] {
  /* Esto afecta solo el DIV, no el fondo, puedes usarlo así */
}

body:has(#app[data-page*='Auth\\/Login']),
body:has(form.mt-8.bg-white) {
  background-image: url('https://task.viacentral.cl/images/bg/bg.png') !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

/* --- Misc --- */
.menu__icon {
  fill: #fff !important;
}

/* --- Remove Double Semi-colons --- */
.layout-app.main .sidebar.sidebar_wrapper .add__plus svg {
  color: #fff !important;
  fill: #fff !important;
}