/*****************************************************************/
/* Admin Page Styles */
/*****************************************************************/
.admin-page-header {
    /*margin-top: 80px;*/
    font-family: Roboto-Thin;
    font-size: 24px;
    /*margin-bottom: 10px;*/
    padding: 5px;
    /*border-radius: 5px 5px;*/
    padding-bottom: 10px;
    text-align: center;
    background-color: #3A3A3A;
    color: white;
    border-radius: 5px 5px;
}

.admin-section-header {
    background-color: #f7f5f4;
    color: #666666;
    font-family: Roboto-Light;
    font-size: 16px;
    /*font-family: GreatVibes;
    font-size: 22px;*/
    border-radius: 5px 5px 5px 5px;
    padding: 5px;
    /*margin-left: 10px;*/
    margin-bottom: 5px;
}

.admin-card-container {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem; /* or use margin on .admin-card if you prefer */
    justify-content: start; /* or center, or space-between depending on your design */
    margin-top: 1rem;
}

.admin-card {
    flex: 0 1 160px; /* Adjust width as needed */
    box-sizing: border-box;
}

.admin-image {

}

.admin-img-card {
    width: 140px; /*140*/
    height: 150px; /*150*/
    text-align: center;
    padding: 10px;
    font-size: 16px;/*14*/
    line-height:1.4;
    /*margin-top: 5px;*/
    border-radius: 5px 5px;
    border: 1px solid #E5E5E5;
    transition: .3s;
}

    .admin-img-card:hover {
        background-color: #f7f5f4;
        border:1px solid #666666;
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        /*transform: rotate(-5deg);
        transform: scale(1.1) translate(5%, 5%);
        */
        transition: .3s;
    }

/*************************/
/* Admin Icon Styles     */
/*************************/

.about-us-icon {
    margin-top: 8px;
    width: 70px;
    height: 70px;
}

.admin-icon {
    width: 70px;
    height: 70px;
}

.business-settings {
    margin-top:3px;
    width: 75px;
    height: 75px;
}

.category-icon {
    width: 70px;
    height: 70px;
}

.flavors-icon {
    margin-top: 10px;
    width: 80px;
    height: 71px;
}

.fillings-icon {
    
    width: 68px;
    height: 80px;
}

.header-icon {
    margin-top: 10px;
    width: 65px;
    height: 65px;
}

.home-icon {
    width: 75px;
    height: 75px;
}

.manage-orders-icon {
    width: 70px;
    height: 70px;
}

.size-icon {
    width: 64px;
    height: 70px;
}

.square-icon {
    margin-top: 10px;
    width: 70px;
    height: 70px;
}

.terms-icon {
    margin-top:10px;
    width: 70px;
    height: 70px;
}

/*************************/
/* Admin Card Styles     */
/*************************/
.admin-card-ahref {
    color: #666666;
    text-decoration: none;
}

    .admin-card-ahref:hover {
        color: #666666;
        text-decoration: none;
    }

/*****************************************************************/
/* Products Styles */
/*****************************************************************/
.manage-products-header {
    font-family: Roboto-Thin;
    font-size: 30px;
    /*margin-bottom: 5px;*/
    padding: 5px;
    text-align: center;
    /*margin-top: -50px;*/
    color: #8BC242;
    font-weight: bold;
    /*border-radius: 5px 5px;*/
}

.manage-meals-img-card {
    /*max-width: 1100px;*/
    padding: 10px;
    font-size: 12px;
    /*margin-top: 5px;*/
    border-radius: 5px 5px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    /*transition: .2s;*/
}

.manage-alerts {
    /*max-width: 1100px;*/
    padding: 10px;
    font-size: 14px;
    /*margin-top: 5px;*/
    border-radius: 5px 5px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    /*transition: .2s;*/
}

.meal-form {
    max-width: 1400px;
}

.admin-categories-label {
    font-size: 14px;
    line-height: 1.3;
    /*background-color:#333;*/
    color: white;
    padding: 5px;
}

.admin-main-categories {
    float: left;
    padding: 5px;
    border-radius: 5px 5px;
    border: 1px solid silver;
    width: 315px;
    background-color: #464646;
}

.product-add-btn {
    float: left;
    padding: 5px;
    margin-left:5px;
}

.admin-categories-ddl {
    /*display: block;*/
    /*background-color: #A6AEB7;*/
    background-color: #F1F3F5;
    color: black;
    width: 150px;
    padding: 4px 8px;
    font-size: 14px;
    line-height: 1.3;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

.add-btns-float-left {
    float:left;
}

.prod-admin-add-btn {
    margin-right:10px;
}

.shortlist-color {
    color: blue;
}

.shortlist-categories {
    padding: 5px;
    border-radius: 5px 5px;
    border: 1px solid silver;
    width: 315px;
    background-color: #464646;
}

.return-to-masterlist {
    background-color: #9D0000;
    color: white;
}

    .return-to-masterlist:hover {
        background-color: #9D0000;
        color: white;
    }

.admin-form-modal-dialog {
    margin-top: 70px;
    max-width: 1000px;
    z-index: 2000 !important;
}

.prod-form-modal-dialog {
    margin-top: 70px;
    max-width: 800px;
    z-index: 2000 !important;
}

.meal-form-modal-header {
    background-color: darkgreen;
    color: white;
}

.modal-header-style {
    background-color: #F2F4F7;
    color: #333;
    height: 55px;
}

.results-modal-logo {
    /*padding-bottom: 3px;*/
    /*border-radius: 5px 5px;*/
    height: 53px;
    width: 53px;
}

.results-message {
    font-family: Roboto-Light;
    font-size: 16px;
}

.modal-top-margin {
    margin-top: 70px;
    z-index: 2000 !important;
}

.meal-form-close {
    color: white;
}

.form-categories {
    padding: 5px;
    border-radius: 5px 5px;
    border: 1px solid silver;
    width: 200px;
}

.prod-form-200w {
    width:200px;
}

.product-edit-current-img {
    max-height: 150px;
    padding: 5px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; /* smooth inertial scroll on iOS */
}

/* Hide SubCategory column when the table has .hide-subcat */
#th-subcat { /* your header already has this id */
}

    #th-subcat.closest('table') {
    }
/* (no-op, just noting relationship) */

table.hide-subcat [data-col="subcat"] {
    display: none;
}

/*****************************************************************/
/* Toggle Switch & Checkbox Styles */
/*****************************************************************/
.form-check-input.large-switch {
    width: 3rem;
    height: 1.5rem;
    cursor: pointer;
}

    .form-check-input.large-switch:checked {
        background-color: #198754;
        border-color: #198754;
    }

    .form-check-input.large-switch:focus {
        box-shadow: 0 0 0 0.2rem rgba(25, 135, 84, 0.25);
    }

    .form-check-input.large-switch:not(:checked) {
        background-color: #adb5bd; /* light gray or custom off color */
        border-color: #adb5bd;
    }

/*.product-checkbox {
    font-size:18px;
    background-color: white !important;
    border-color: silver !important;
}*/

/*****************************************************************/
/* Active Products List*/
/*****************************************************************/

.active-items-container {
    display:flex;
    flex-wrap:wrap;
    max-width: 1500px;
    /*background-color: #f9f9f9;*/
    padding: 5px;
    border-radius: 5px 5px;
}

.active-item {
    cursor: pointer;
    /*max-width: 312px;*/
    max-width: 216px;
    padding: 10px;
    text-align: center;
    margin-right: 25px;
    margin-bottom: 20px;
    color: #666666;
    background-color: #f7f7f7;
    border-radius: 5px 5px;
    /*box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;*/
    /*border:3px solid transparent;*/
    border: 1px solid #E0E0E0;
    outline: none;
    transition: .3s ease-in-out;
}

    .active-item:hover {
        /*background-color: #5F8A3D;*/
        /*background-color: #507333; Green*/
        background-color: white;
        color:black;
        border-radius: 5px 5px;
        box-shadow: rgba(0, 0, 0, 0.25) 0px 4px 12px;
        /* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;*/
        /*border-color:green;*/
    }

.active-item-img {
    /*width:290px;
    height:290px;*/
    /*width: 220px;
    height: 220px;*/
    width: 195px;
    height: 195px;
    /*width:180px;
    height:180px;*/
    border-bottom: 1px solid lightgrey;
}

.active-item-title {
    font-size: 16px;
    line-height: 1.4;
    line-clamp: 2;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* number of lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    /* keeps space for 2 lines even if short, so card heights match */
    min-height: calc(2 * 1.4em);
}

.ai-fade-in {
    opacity: 0;
    animation: aifadeIn 1.3s ease forwards;
}

@keyframes aifadeIn {
    to {
        opacity: 1;
    }
}

/*****************************************************************/
/* Form Control Styles */
/*****************************************************************/
.form-control {
    font-size: 14px;
    line-height: 1;
}

.col-form-label {
    font-size: 14px;
    line-height: 1;
}

/*****************************************************************/
/* Manage Paid Orders */
/*****************************************************************/
.paid-card-style {
    background-color: #f7f7f7;
    border: 1px solid #dee2e6;
    padding: 0px 10px 10px 10px;
    /*border-radius: 0 0 0.5rem 0.5rem;*/ /*top-left top-right bottom-right bottom-left*/
    border-radius:.5rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.075);
    overflow:hidden;
}

.paid-orders-header {
    font-family: Roboto-Light;
    font-size: 34px;
    color: #333;
    margin-left: 10px;
    margin-bottom: 10px;
}

.roboto-13 {
    font-family: Roboto;
    font-size: 13px;
}

.verify {
    font-family: Roboto;
    font-size: 12px;
    font-weight: bold;
    color: #DF0000;
    padding: 5px;
    border-radius: 5px 5px;
    border: 1px solid #DF0000;
    max-width: 420px;
}

.allergy-info {
    color:red;
    font-weight:bold !important;
}

.paid-label-90 {
    display: inline-block;
    width: 90px;
}

.paid-label-120 {
    display: inline-block;
    width: 120px;
}

.paid-order-item {
    background-color: #E6E6E6;
    color: #333;
    font-family: Roboto-Light;
    font-size: 12px;
    padding: 2px;
    border-radius: 5px 5px;
    /*display: inline-block;*/
}

/*****************************************************************/
/* Business Settings form */
/*****************************************************************/
.business-info-example {
    background-color: #E6E6E6;
    color: #333;
    font-family: Roboto-Light;
    font-size: 12px;
    padding: 4px;
    border-radius: 5px 5px;
    display: inline-block;
}


/*****************************************************************/
/* Add Flavors form */
/*****************************************************************/
.flavor-tiers {
    color: #666666;
    font-family: Roboto-Light;
    font-size: 16px;
}

/*****************************************************************/
/* Add Promo Codes form */
/*****************************************************************/
.existing-codes {
    color: #666666;
    font-family: Roboto-Light;
    font-size: 12px;
}