:root {
    --main_color: #192748;
}

/* =============================
   Global Styles
============================= */
body {
    background-color: #e7e7e7 !important;
}

a {
    color: black;
}

#grp-navigation {
    background-image: linear-gradient(#192748, #192748);
}

/* =============================
   Table Styles
============================= */

/* Table background */
.grp-table {
    background-color: #f4f4f4 !important;  /* Light gray background */
}

/* Table headers */
.grp-table thead {
    color: white !important;               /* White text */
}

/* Table rows */
.grp-table tbody tr {
    background-color: #ffffff !important;  /* White rows */
    border-bottom: 1px solid #ccc !important;  /* Light gray separators */
}

/* Alternate row colors */
.grp-table tbody tr:nth-child(even) {
    background-color: #f8f9fa !important;  /* Alternate row background */
}

/* Hover effect */
.grp-table tbody tr:hover {
    background-color: #ffdddd !important;  /* Light red hover */
}

/* Table cells */
.grp-table tbody td {
    padding: 10px !important;
    border: 1px solid #ddd !important;
}

/* Action buttons inside tables */
.grp-table tbody td.grp-actions {
    background-color: #e6e8eb !important;
}

/* =============================
   Collapse & Module Titles
============================= */

/* Default module titles */
.grp-collapse.grp-open > h3.grp-collapse-handler,
.grp-module.grp-dashboard-module > h3.module_title {
    background-image: linear-gradient(#192748, #192748);
    color: white;
    text-shadow: none;
}

/* Module titles with "concreto_cubico" class */
.grp-collapse.grp-open.concreto_cubico > h3.grp-collapse-handler,
.grp-module.grp-dashboard-module.concreto_cubico > h3.module_title {
    background-image: linear-gradient(#f11f1f, #f11f1f);  /* Red background */
    color: white;
    text-shadow: none;
}

/* Collapse headers (H2) */
.grp-collapse.grp-open > h2.grp-collapse-handler {
    background-image: linear-gradient(#192748, #192748);
    color: white;
    text-shadow: none;
}

/* =============================
Filter Styles
============================= */

/* Filter boxes (available & chosen) */
.selector-available, 
.selector-chosen {
    width: 250px !important;
    height: 350px !important;
}

/* Filter horizontal boxes (available & chosen) */
.selector {
    width: 550px;
    max-width: 100% !important;
}

.selector.stacked {
    width: auto;
    max-width: 100% !important;
}

/* Filter input field */
.selector-available .selector-filter input, 
.selector-chosen .selector-filter input {
    width: 80% !important;
}

/* "Select all" & "Remove all" buttons */
.selector-available .selector-chooser, 
.selector-chosen .selector-chooser {
    font-size: 14px;
    margin-top: 10px;
}

/* Stacked selectors */
.selector.stacked ul.selector-chooser {
    margin: 4px 0 0 50%;
}


.selector select[multiple], 
.selector.stacked select[multiple]{
    max-width: 100% !important;
}

/* Stacked selectors with filter input */
.selector.stacked .selector-filter input[type="text"],
.selector .selector-filter input[type="text"] {
    width: 80% !important;
    max-width: 80% !important;
}

/* Highlight chosen options */
.selector.stacked .selector-chosen,
.selector .selector-chosen {
    background: palegreen;
}

/* =============================
   Other Elements
============================= */

/* Related widget wrapper */
.grp-related-widget-wrapper {
    width: auto;
}

/* Footer display in lists */
.list-footer-display {
    width: 90%;
    white-space: normal;  /* Allow line breaks */
}

/* Action icons */
.grp-actions li.grp-add-link {
    background-image: url(../images/spritesheet-1694777276.png);
}

.ql-formats button{
    margin: 0;
}

/* .ql-snow .ql-formats {
    display: block !important;
} */

div.form-row div.django-quill-widget-container {
    width: 1000px;
    height: auto;
}

.ql-toolbar.ql-snow {
    width: 1000px
}

.grp-thead{
    position: sticky;
    top: 62px;
    z-index: 9999;
    background-color: #192748 !important;
    color: white !important;
}