﻿.register-box {
    width: 860px !important;
}

.needs-validation .input-validation-error:not([type="checkbox"]) {
    border-color: #e73546;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.needs-validation .input-validation-error:focus {
    border-color: #e73546;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(231, 53, 70, 0.6);
    outline: 0 none;
}

.needs-validation .field-validation-error {
    display: block !important;
}

.needs-validation .valid:not([type="checkbox"]) {
    border-color: #198754;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.needs-validation .valid:focus {
    border-color: #198754;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(25, 135, 84, 0.6);
    outline: 0 none;
}


.color-red {
    color: red;
}

.required-label::after {
    content: '*';
    color: red;
    margin-left: 4px;
}

.strength-meter {
    height: 10px;
    width: 100%;
    border-radius: 5px;
    margin-top: 5px;
}

    .strength-meter span {
        display: block;
        height: 100%;
        border-radius: 5px;
    }

    .strength-meter .weak {
        background-color: red;
    }

    .strength-meter .medium {
        background-color: orange;
    }

    .strength-meter .strong {
        background-color: green;
    }

.modal-header {
    justify-content: space-between;
}



.input-group-text {
    height: 100%;
    border-radius: 4px 0px 0px 4px;
}

/*table.dataTable {
    min-height: 200px;  
}
*/
/*table.dataTable.no-footer {
        height: auto;*/ /* Ensure the height is responsive */
/*}*/

.nav-link.disabled {
    pointer-events: none;
    opacity: 0.9; /* Adjust opacity to indicate it's disabled */
}

.bdrGrey {
    border: 0.025rem solid #808080;
    padding: 1rem;
    border-radius: 0.5rem;
}

.img-gallery {
    overflow: auto;
    max-height: 520px;
}

    .img-gallery div {
        position: relative;
        margin: 5px;
    }

.imgSingle img {
    max-height: 200px;
    padding: 2px;
}

.imgSingle:hover img {
    opacity: 0.2;
}

.imgSingle a {
    position: absolute;
    display: none;
    bottom: 40%;
    left: 30%;
}

.imgSingle:hover a {
    display: block;
}

.readOnly {
    background: white !important;
}

ul.checktree li:not(:last-child) {
    border-bottom: 0.6px solid lightgrey; /* Adds a line after each <li> except the last one */
    padding-top: 10px;
    padding-bottom: 10px;
}

ul.grid-list {
    display: grid; /* Use grid layout */
    grid-template-columns: repeat(3, 1fr); /* Create 3 equal columns */
    gap: 10px; /* Space between items */
    list-style-type: none;
    padding: 0;
    margin: 0;
    max-height: 200px; /* Set a max height for the ul */
    overflow-y: auto; /* Enable vertical scrolling when content overflows */
}

    ul.grid-list li {
        padding: 10px;
        background-color: #f0f0f0;
        border-radius: 5px;
    }


/* Styling the list group container */
.autoSearchResult {
    max-height: 200px; /* Set a max height for scrolling */
    overflow-y: auto; /* Enable vertical scrolling */
    position: absolute; /* Position it below the input field */
    /*width: 100%;*/ /* Match the width of the input */
    z-index: 1000; /* Ensure it's above other content */
    border: 1px solid #ccc; /* Border around the suggestions */
    border-radius: 4px; /* Rounded corners */
    background-color: white; /* White background for dropdown */
}

/* Styling individual list items */
.list-group-item {
    cursor: pointer; /* Pointer cursor for clickable items */
    transition: background-color 0.3s ease;
}

    /* Hover effect for list items */
    .list-group-item:hover {
        background-color: #f8f9fa; /* Lighter background on hover */
        color: #007bff; /* Blue text color on hover */
    }

    /* Active item when clicked */
    .list-group-item.active {
        background-color: #007bff;
        color: white;
    }

.list-container {
    display: grid;
    grid-template-columns: 1fr; /* default: 1 column */
    gap: 20px;
    max-width: 1200px;
    margin: 20px auto;
    font-family: sans-serif;
}

@media (min-width: 768px) {
    .list-container {
        grid-template-columns: repeat(2, 1fr); /* 2 columns on medium+ screens */
    }
}

.group {
    display: flex;
    flex-direction: column;
    border: 1px solid #ddd;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    background-color: #fff;
}

/* Header stays flush with the box */
.group-header {
    padding: 12px 16px;
    background-color: #d5efff;
    font-weight: bold;
    font-size: 16px;
    border-bottom: 1px solid #ddd;
}

.group-info {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 2fr));
    gap: 20px;
    padding: 12px 16px;
}

/* Grid aligns internally, doesn't push group outward */
.group-items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
    padding: 12px 16px;
}

.item {
    padding: 8px;
    background-color: #fafafa;
    border: 1px solid #eee;
    border-radius: 4px;
    text-align: center;
}

.imgSingle img {
    max-height: 200px;
    padding: 2px;
    border: 1px solid grey;
}

.imgSingle:hover img {
    opacity: 0.2;
}

.imgSingle a {
    position: absolute;
    display: none;
    bottom: 40%;
    left: 30%;
}

.imgSingle:hover a {
    display: block;
}

.custom-infowindow {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    padding: 10px;
    color: #333;
}

    .custom-infowindow h3 {
        margin: 0 0 8px 0;
        font-size: 16px;
        color: #2E8B57;
    }

    .custom-infowindow .info-details {
        font-size: 14px;
        line-height: 1.5;
    }

.custom-dialog {
    font-family: 'Segoe UI', sans-serif;
    color: #333;
    border: 1px solid #ccc;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.dialog-header {
    background-color: #2E8B57;
    color: white;
    padding: 8px 12px;
}

    .dialog-header h3 {
        margin: 0;
        font-size: 16px;
    }

.dialog-body {
    padding: 10px 12px;
    font-size: 14px;
    line-height: 1.5;
}



.dropdown .btn-dropdown {
    width: 100%;
    text-align: left;
    background-color: #fff;
    color: #212529;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    overflow: auto;
    max-height: 80px;
    word-wrap: break-word;
    white-space: normal;
}

.custom-menu {
    white-space: nowrap;
    max-height: 230px; /* Set a max height for scrolling */
    overflow-y: auto; /* Enable vertical scrolling */
    position: absolute; /* Position it below the input field */
    z-index: 9999; /* Ensure it's above other content */
    pointer-events: none;
}

.dropdown-item-search {
    z-index: 9999;
}

.dropdown-item {
    display: flex;
    align-items: center;
    padding: 0.25rem 1.5rem;
}

    .dropdown-item input[type="checkbox"] {
        margin-right: 0.5rem;
    }


.custom-menu label {
    pointer-events: auto;
}


.editable {
    cursor: pointer;
}

    .editable input {
        width: 100%;
        padding: 5px;
        box-sizing: border-box;
    }

.sidebar-menu .nav-link > p > .right {
    position: absolute;
    right: 1rem;
    top: .7rem;
}

table.dataTable thead th.no-sort:after,
table.dataTable thead th.no-sort.sorting:after,
table.dataTable thead th.no-sort.sorting_asc:after,
table.dataTable thead th.no-sort.sorting_desc:after {
    display: none !important;
}

/* Disable click + pointer on no-sort headers */
table.dataTable thead th.no-sort {
    pointer-events: none;
    cursor: default;
}

table.dataTable thead th.sorting:after {
    content: "⇅";
    float: right;
    padding-left: 10px;
    opacity: 0.4;
}

table.dataTable thead th.sorting_asc:after {
    content: "↑";
    float: right;
    padding-left: 10px;
    opacity: 0.7;
}

table.dataTable thead th.sorting_desc:after {
    content: "↓";
    float: right;
    padding-left: 10px;
    opacity: 0.7;
}