/* -------------------------------
 *  Only for light theme
 * ---------------------------------*/
:root {
    /* Header */
    --header-bg: rgb(17 24 39);       /* base-900 */
    --header-border: rgb(31 41 55);   /* base-800 */
    --header-text: rgb(229 231 235);  /* light text */

    /* UL / History */
    --ul-bg: rgb(17 24 39);
    --ul-text: rgb(229 231 235);
    --ul-border: #364153;

    /* Left navbar */
    --sidebar-bg: rgb(17 24 39);
    --sidebar-border: rgb(31 41 55);
    --sidebar-text: rgb(229 231 235);

    /* Hover */
    --hover-text: rgb(255 255 255);

    --lwr-primary-color: #0f719a;
}

@media(max-width: 768px) {
    .add-related,
    .change-related, 
    .delete-related {
        display: none !important; 
    }
}

/* -------------------------------
 *   Light theme styles
 * ---------------------------------*/

/* Header */
html .bg-white.border-b {
    background-color: var(--header-bg);
    border-color: var(--header-border);
    color: var(--header-text);
}

html .bg-white.border-b a {
    color: var(--header-text);
}

html .bg-white.border-b span {
    color: var(--header-text);
}

html .bg-white.border-b a:hover {
    color: var(--hover-text);
}

/* UL / History */
html ul.bg-white.container {
    background-color: var(--ul-bg);
    color: var(--ul-text);
}

html ul.bg-white.container > li {
    border-color: var(--ul-border);
}

html ul.bg-white.container li a {
    color: var(--ul-text);
}

html ul.bg-white.container li a:hover {
    color: var(--hover-text);
}

/* Left navbar */
html .border-b.border-base-200.h-\[65px\] {
    background-color: var(--sidebar-bg);
    border-color: var(--sidebar-border);
    color: var(--sidebar-text);
}

html .border-b.border-base-200.h-\[65px\] a {
    color: var(--sidebar-text);
}

html .border-b.border-base-200.h-\[65px\] a:hover {
    color: var(--hover-text);
}

#main > div:first-child {
    /* не знаю почему шапка перестала прилипать к верху КОСТЫЛЬ */
    position: sticky !important;
    top: 0 !important;
}

#result_list th::before {
    display: none; /* В таблице скраывать чтобы не было отступа когда убрал заголовок на мобилке */
}

#result_list tbody tr th a {
    font-weight: bold;
    color: var(--lwr-primary-color);
}


.lwr-primary-color {
    color: var(--lwr-primary-color) !important;
}


/* Чтобы контейнер не растягивался при использовании select2 */
.flex:has(.select2-container) > *,
.grid:has(.select2-container) > * {
    min-width: 0 !important;
}

.result-list tbody:nth-of-type(even) {
    background-color: #f3f4f6;
}

.dark .result-list tbody:nth-of-type(even) {
    background-color: #141c2c;
}

.lwr-dashboard-grid,
.lwr-dashboard-card {
    min-width: 0;
    max-width: 100%;
}

.lwr-dashboard-chart {
    display: block;
    max-width: 100% !important;
}

.lwr-reminder-menu {
    bottom: calc(100% + 8px);
    top: auto;
}

.lwr-reminder-card-active {
    border-color: rgb(147 197 253);
}

.lwr-reminder-card-overdue {
    border-color: rgb(252 165 165);
}

.dark .lwr-reminder-card-active {
    border-color: rgb(59 130 246 / 0.45);
}

.dark .lwr-reminder-card-overdue {
    border-color: rgb(239 68 68 / 0.55);
}

.lwr-reminder-badge {
    border-radius: var(--border-radius, 0.25rem);
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    height: 1.5rem;
    line-height: 1.5rem;
    margin-right: auto;
    padding-inline: 0.5rem;
    text-transform: uppercase;
    white-space: nowrap;
}

.lwr-reminder-badge-base {
    background: rgb(243 244 246);
    color: rgb(75 85 99);
}

.lwr-reminder-badge-blue {
    background: rgb(219 234 254);
    color: rgb(29 78 216);
}

.dark .lwr-reminder-badge-base {
    background: rgb(107 114 128 / 0.2);
    color: rgb(156 163 175);
}

.dark .lwr-reminder-badge-blue {
    background: rgb(59 130 246 / 0.2);
    color: rgb(96 165 250);
}

@media (max-width: 1023px), (orientation: portrait) and (max-width: 1180px) {
    .lwr-dashboard-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }

    .lwr-dashboard-card {
        width: 100% !important;
        grid-column: auto / span 1 !important;
    }
}