/* =========================================================
   PRODUCT RECIPES — TOOLBAR
   ========================================================= */

/* SEARCH */
.tuco-rec-search {
    position: relative;
    width: 100%;
}

.tuco-rec-search-icon {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    font-size: 14px;
    color: #263746;
    pointer-events: none;
}

.tuco-rec-search-input {
    height: 42px !important;
    width: 100%;
    padding-left: 40px !important;
    padding-right: 16px !important;

    background: #fbf8f3 !important;
    border: 1px solid #e6ded3 !important;
    border-radius: 12px !important;

    box-shadow: none !important;
}

.tuco-rec-search-input:focus {
    background: #fff !important;
    border-color: #cfc4b6 !important;
}


/* CATEGORY */
.tuco-rec-category-col {
    width: 235px !important;
    flex: 0 0 235px !important;
}

.tuco-rec-category {
    width: 100%;
}

.tuco-rec-category .Select-control {
    height: 42px !important;
    min-height: 42px !important;

    background: #fbf8f3 !important;
    border: 1px solid #e6ded3 !important;
    border-radius: 12px !important;

    box-shadow: none !important;
}

.tuco-rec-category .Select-placeholder,
.tuco-rec-category .Select-value {
    line-height: 40px !important;
    padding-left: 12px !important;
}

.tuco-rec-category .Select-input {
    height: 40px !important;
}


/* MISSING RECIPE — modern pill control */
.tuco-rec-missing-toggle {
    height: 42px;
    display: flex;
    align-items: center;
    padding: 0 !important;
    margin: 0 !important;

    background: transparent !important;
    border: 0 !important;
}

.tuco-rec-missing-toggle .form-check {
    height: 42px;
    margin: 0 !important;

    display: flex;
    align-items: center;
    gap: 9px;

    padding: 0 16px 0 46px !important;

    background: #fbf8f3;
    border: 1px solid #e6ded3;
    border-radius: 999px;

    transition:
        background .15s ease,
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

.tuco-rec-missing-toggle .form-check:hover {
    background: #f5efe7;
    border-color: #d8cec1;
}

.tuco-rec-missing-toggle .form-check-input {
    cursor: pointer;
    margin-top: 0 !important;
}

.tuco-rec-missing-toggle .form-check-label {
    cursor: pointer;
    white-space: nowrap;
    font-size: .9rem;
    font-weight: 500;
    color: #263746;
}


/* COVERAGE */
.tuco-rec-coverage {
    height: 34px;
    display: flex;
    align-items: center;
    border-radius: 999px;
    padding: 0 12px;
    border: 1px solid #e7e0d7;
    font-weight: 500;
}


@media (max-width: 991px) {
    .tuco-rec-category-col {
        width: 235px !important;
        flex: 0 0 235px !important;
    }
}

/* --- Compact mobile-style toggle --- */
.tuco-rec-missing-toggle {
    height: 42px;
    display: flex;
    align-items: center;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

.tuco-rec-missing-toggle .form-check {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 0;
    margin: 0 !important;
    padding-left: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

/* actual switch */
.tuco-rec-missing-toggle .form-check-input {
    width: 32px !important;
    height: 18px !important;
    margin: 0 !important;
    flex: 0 0 32px;

    cursor: pointer;
    border: 0 !important;
    box-shadow: none !important;
    background-color: #d8d8d8;
}

.tuco-rec-missing-toggle .form-check-input:checked {
    background-color: #263746;
}

/* label */
.tuco-rec-missing-toggle .form-check-label {
    margin: 0;
    cursor: pointer;
    white-space: nowrap;

    font-size: .88rem;
    font-weight: 500;
    color: #263746;
}

/* Better mobile-style switch */
.tuco-rec-missing-toggle .form-check-input {
    appearance: none !important;
    -webkit-appearance: none !important;

    width: 36px !important;
    height: 20px !important;
    flex: 0 0 36px;

    margin: 0 !important;
    padding: 0 !important;

    border: 1px solid #d7cfc4 !important;
    border-radius: 999px !important;

    background-color: #ebe5dc !important;
    background-image:
        radial-gradient(
            circle,
            #ffffff 0,
            #ffffff 6.5px,
            transparent 7px
        ) !important;
    background-repeat: no-repeat !important;
    background-size: 18px 18px !important;
    background-position: 1px center !important;

    box-shadow:
        inset 0 1px 2px rgba(20, 30, 40, 0.05),
        0 1px 2px rgba(20, 30, 40, 0.08) !important;

    cursor: pointer;

    transition:
        background-color .18s ease,
        background-position .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.tuco-rec-missing-toggle .form-check-input:checked {
    background-color: #176d68 !important;
    border-color: #176d68 !important;
    background-position: 17px center !important;
}

.tuco-rec-missing-toggle .form-check-input:focus {
    box-shadow:
        0 0 0 3px rgba(23, 109, 104, 0.12) !important;
}

.tuco-rec-missing-toggle .form-check-input:hover {
    border-color: #c6bbae !important;
}

.tuco-rec-missing-toggle .form-check-input:checked:hover {
    background-color: #125e5a !important;
    border-color: #125e5a !important;
}
.tuco-rec-search { width: 50% !important; max-width: 620px; }
.tuco-rec-search-col { width: 650px !important; flex: 0 0 650px !important; } .tuco-rec-search { width: 100% !important; max-width: none !important; }

/* Recipes modal: ingredient creation belongs to Ingredients master data */
#rec-newing-toggle,
#rec-newing-collapse {
    display: none !important;
}


.tuco-rec-selection-alert {
    display: inline-flex;
    align-items: center;
    width: auto;
    border-radius: 10px;
    font-size: .88rem;
    border: 1px solid #ead8a9;
    background: #fff9e9;
    color: #665326;
}


/* =========================================================
   RECIPE DETAIL MODAL
   ========================================================= */

#rec-editor-card .modal-dialog {
    width: calc(100vw - 80px);
    max-width: 1280px;
}

#rec-editor-card .modal-content {
    background: #fff;
    border: 1px solid #e5ddd2;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 18px 55px rgba(0, 0, 0, .14);
}

#rec-editor-card .modal-header {
    padding: 22px 26px 16px;
    background: #fff;
    border-bottom: 0;
}

#rec-editor-card .modal-body {
    padding: 10px 26px 26px;
    background: #fff;
}

.tuco-rec-editor-close {
    color: #777 !important;
    font-size: 20px;
    text-decoration: none !important;
    box-shadow: none !important;
}

.tuco-rec-editor-close:hover {
    color: #222 !important;
}

@media (max-width: 900px) {
    #rec-editor-card .modal-dialog {
        width: calc(100vw - 24px);
        margin: 12px auto;
    }
}