﻿

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 2000;
}

#blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

#components-reconnect-modal{
    z-index: 2000 !important;
}

#reconnect-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 100; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(255,255,255); /* Fallback color */
    background-color: rgba(255,255,255,0.7); /* White w/ opacity */

    color: #000000;
    border: 1px solid #888;
    padding-top: 27px;
    font-size: 25px;
    font-weight: bold;
    text-align: center;
}

.body {
    height: 100%;
    overflow: auto;
}

.header {
    min-height: auto;
}

main.container-fluid {
    height: 100%;
    overflow: auto;
    padding-top: calc(var(--cui-gutter-x) * 0.5);
    padding-bottom: calc(var(--cui-gutter-x) * 0.5);
}

body {
    /* Colori di UfficioWeb */
    --cui-blue: #007bff;
    --cui-indigo: #6610f2;
    --cui-purple: #6f42c1;
    --cui-pink: #e83e8c;
    --cui-red: #dc3545;
    --cui-orange: #fd7e14;
    --cui-yellow: #ffc107;
    --cui-green: #28a745;
    --cui-teal: #20c997;
    --cui-cyan: #17a2b8;
    --cui-white: #fff;
    --cui-gray: #6c757d;
    --cui-gray-dark: #343a40;
    --cui-primary: #337ab7;
    --cui-secondary: #CCCCCC;
    --cui-success: #28a745;
    --cui-info: #17a2b8;
    --cui-warning: #ffc107;
    --cui-danger: #dc3545;
    --cui-light: #f8f9fa;
    --cui-dark: #343a40;
    --cui-primary-rgb: 51, 122, 183;
    --cui-secondary-rgb: 204, 204, 204;
    --cui-success-rgb: 40, 167, 69;
    --cui-info-rgb: 23, 162, 184;
    --cui-warning-rgb: 255, 193, 7;
    --cui-danger-rgb: 220, 53, 69;
    --cui-light-rgb: 248, 249, 250;
    --cui-dark-rgb: 52, 58, 64;
    --cui-white-rgb: 255, 255, 255;
}

.btn-primary {
    --cui-btn-bg: var(--cui-primary);
}

.btn-secondary {
    --cui-btn-bg: var(--cui-secondary);
}

/* 
    il css d-md-down-none manca sulla nuova versione di coreui  
    creata classe custom per mantenere la funzionalità
*/
@media (max-width: 991.98px) {
    .d-custom-md-down-none {
        display: none !important;
    }
}


.gluten-free-svg {
    display: inline-block;
    height: 24px;
    width: 24px;
    background-image: url(../images/gluten-free-icon.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

.vegetarian-svg {
    display: inline-block;
    height: 24px;
    width: 24px;
    background-image: url(../images/vegetarian-icon.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

.vegan-svg {
    display: inline-block;
    height: 24px;
    width: 24px;
    background-image: url(../images/vegan-icon.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

.chili-svg {
    display: inline-block;
    height: 24px;
    width: 24px;
    background-image: url(../images/chili-icon.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

.allergies-svg {
    display: inline-block;
    height: 24px;
    width: 24px;
    background-image: url(../images/allergies-icon.svg);
    background-repeat: no-repeat;
    background-size: contain;
}


/* Place holder per QuillJS */
.ql-placeholder > .ql-picker-label::before {
    content: attr(data-title);
    margin-right: 1.5em;
}

.ql-placeholder > .ql-picker-options > .ql-picker-item::before {
    content: attr(data-title);
}

.ql-editor {
    min-height: 200px;
}


.graph-description-subtitle {
    color: #666;
    font-size: 14px;
    margin-left: 8px;
    margin-right: 8px;
    margin-bottom: 10px
}