/* These styles are generated from project.scss. */
.partner-brand-img{
    max-width: 122px;
    max-height: 46px;
}
.master-page,html {
    background-color: var(--dcp-darkgrey);
    font-family: "Kokoro-Regular", Helvetica;
    color: var(--dcp-white);

}

.cell-header{
    font-weight: bold;
    margin-right: 2em;
}

.alert-debug {
    color: black;
    background-color: white;
    border-color: #d6e9c6;
}

.alert-error {
    color: #b94a48;
    background-color: #f2dede;
    border-color: #eed3d7;
}

.navbar {
    background-color: var(--dcp-bg-light);
}

.feather {
    width: 16px;
    height: 16px;
    vertical-align: text-bottom;
}

/*
 * Sidebar
 */

.sidebar {
    position: relative;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 100; /* Behind the navbar */
    background-color: var(--dcp-darkgrey2) !important;
    color: var(--dcp-white);
    border: 2px solid var(--dcp-lightcyan2);
    border-radius: 10px;
}

.sidebar-sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 48px; /* Height of navbar */
    height: calc(100vh - 48px);
    padding-top: 0.5rem;
    overflow-x: hidden;
    overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
}

.sidebar .nav-link {
    font-weight: 500;
    color: var(--dcp-white);
}

.sidebar .nav-link .feather {
    margin-right: 4px;
    color: #743030;
}

.sidebar .nav-link.active {
    color: var(--dcp-palered);
    text-decoration: underline;
}

.sidebar .nav-link:hover .feather,
.sidebar .nav-link.active .feather {
    color: inherit;
}

.sidebar-heading {
    font-size: 1.75rem;
    font-weight: bold;
}

.left-nav-item {

    /* background-color: #f6f6f6; */
    margin: 0.25rem;

}

.ul-sub {
    margin-left: 2.5rem;
}

.header-li-p {
    font-size: 1.25rem;

    margin: 0.25rem;
}

.banner {
    background-color: #e9dcdc;
    width: 100%;
}

.banner-2 {
    background-color: #7ec3d2;
    width: 100%;
}

#select_mode_fields {
    display: none;
}

#flat_mode_fields {
    display: none;
}

.table-row-hover > tr {
    transition: background-color 0.3s ease;
    padding: 16px 0; /* Adds vertical padding to rows */
}

.table-row-hover > tr:hover {
    background-color: #f5f5f5; /* Light gray background on hover */
}

.content-wrapper {
    margin: 20px 0;
}

.page-title {
    font-weight: bold;
}

.sub-title {
    font-size: 0.9em;
    color: #888;
    margin-left: 10px;
}

.form-title {
    margin-bottom: 20px;
}

.help-link {
    display: block;
    margin: 10px 0;
    color: #007bff; /* Bootstrap primary color */
    text-decoration: underline;
}

.action-buttons {
    margin-top: 20px;
}

.custom-select {
    border: 1px solid #ced4da;
    border-radius: 25px; /* Rounded corners for a modern look */
    font-size: 16px; /* Increase font size slightly */
    padding: 8px 15px; /* Adjust padding for a better look */
    transition: all 0.3s; /* Smooth transition for hover and focus states */

    /* Optional gradient for a more sophisticated look */
    background: linear-gradient(180deg, #ffffff, #f8f9fa);
}

.custom-select:focus {
    border-color: #80bdff; /* Change border color on focus */
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); /* Add a subtle shadow on focus */
}

.custom-select:hover {
    border-color: #80bdff; /* Change border color on hover */
}

.center {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.delete-form {
    max-width: 500px;
    width: 100%;
    padding: 20px;
}

.form-buttons {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}

.form-group label {
    margin-bottom: 8px;
    color: #333;
    font-weight: 500;
}

.answer-card {
    /* border-color: #e0e0e0; */
    margin-bottom: 30px;
}
.answer-card-title {
    font-size: 1.25rem;
    /* color: #333; */
    margin-bottom: 20px;
}
.answer-card-text {
    color: #555;
}
.answer-text-success {
    color: #28a745 !important;
}
.answer-card-body {
    padding: 20px 25px;
}
.question-set {
  pointer-events: auto;
  opacity: 1;
}
.question-set-first {
  pointer-events: none;
  opacity: 0.5
}
.cloud-question-text {
    overflow: auto;
}

.registration-fields {
    display: none;
}

.login-fields {
    display: none;
}
.uniform-btn {
    width: 100px; /* Or whatever width you prefer */
    height: 60px; /* Or whatever height you prefer */
    /* white-space: nowrap; */
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px; /* Adjust based on your preference */
    display: flex;
    align-items: center;
    justify-content: center;
}

.taster-report-table {
    color: white;
}

.taster-canvas-div {
    background-color: #545454;
    border-radius: 10px;
    border-color:#7ec3d2;
    border-style: solid;
    min-height: 500px;
    min-width: 300px;
}



.graph-canvas {
    width: 100%;
    height: auto;
}

.import-log {
    margin: 5em;
    background: #000;
    color: #0f0;
}

/* Styles for tatser list page */
.taster-card-custom {
    border: 1px solid #ddd; /* Basic border */
    /* transition: transform 0.3s ease, box-shadow 0.3s ease; /\* Smooth transition for hover effects *\/ */
}

.taster-card-custom:hover {
    /* transform: translateY(-5px); /\* Slightly raise the card on hover *\/ */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* Add shadow effect on hover */
}

.taster-card-logo {
    width: 50px;
    height: auto;
    float: left;
}

.taster-card-title {
    float: right;
}

.taster-card-top-section {
    height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.taster-card-top-section::after {
    content: "";
    display: table;
    clear: both;
}

.taster-description {
    height: 60px; /* Fixed height for the description */
    overflow-y: auto; /* Adds a scrollbar if content exceeds the height */
    margin-bottom: 10px; /* Add some space below the description */
    font-size: 0.9em; /* Optional: Adjust the font size if necessary */
}

/* Styles for the scrollbar (optional for better aesthetics) */
.taster-description::-webkit-scrollbar {
    width: 5px;
}

.taster-description::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 2px;
}

.taster-description::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.invitation-form {
    max-width: 600px;
    margin: auto;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.invitation-form button {
    width: 100%;
    margin-top: 20px;
}
.keyword-container {
    display: flex;
    flex-wrap: wrap;
    gap: 15px; /* Adjust the gap as needed */
    max-width: 100%;
}

.keyword-item {
    background-color: #000000; /* Mix of orange and red */
    color: #fff;
    padding: 8px 12px; /* Adjust padding for size */
    margin: 12px;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    border-radius: 10px; /* Add border-radius for rounded corners */
}

.keyword-text {
    margin-right: 5px; /* Add margin to separate text and count */
}

.keyword-canvas-div {
    border-radius: 10px;
    border-color:#7ec3d2;
    border-style: solid;
    min-height: 100px;
    min-width: 300px;
}

.action-buttons a {
    min-width: 35px;
}

.hier-link-text {
    color: white;
}


#reportTextForm {
    display: none;
}

.sidebar h6{
    font-size: 16pt;
}
