/* =========================================================
   Cookout Nutrition Calculator Pro
   Version: 1.0
========================================================= */

#cookout-calculator{
    max-width:1200px;
    margin:40px auto;
    background:#fff;
    border-radius:18px;
    padding:35px;
    box-shadow:0 12px 35px rgba(0,0,0,.08);
    font-family:Arial, Helvetica, sans-serif;
}

.cnc-header{
    text-align:center;
    margin-bottom:35px;
}

.cnc-header h2{
    margin:0;
    font-size:34px;
    color:#c1121f;
    font-weight:700;
}

.cnc-header p{
    margin-top:10px;
    color:#666;
    font-size:16px;
}

/* ==========================
   Builder
========================== */

.cnc-builder{
    display:grid;
    grid-template-columns:1fr 1fr auto;
    gap:20px;
    margin-bottom:35px;
    align-items:end;
}

.cnc-select label{
    display:block;
    margin-bottom:8px;
    font-weight:600;
    color:#333;
}

.cnc-select select{
    width:100%;
    height:52px;
    border:2px solid #ececec;
    border-radius:10px;
    padding:0 15px;
    font-size:15px;
    background:#fff;
    transition:.3s;
}

.cnc-select select:focus{
    outline:none;
    border-color:#c1121f;
}

#cnc-add{
    height:52px;
    padding:0 28px;
    border:none;
    border-radius:10px;
    background:#c1121f;
    color:#fff;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    transition:.3s;
}

#cnc-add:hover{
    background:#8d0f18;
}

/* ==========================
Meal Box
========================== */

#cnc-meal{
    background:#fafafa;
    border-radius:15px;
    padding:25px;
    margin-bottom:30px;
    border:1px solid #ececec;
}

#cnc-meal h3{
    margin-top:0;
    color:#222;
}

#cnc-meal-items{

    min-height:150px;

}

.cnc-item{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:14px;

    border-bottom:1px solid #ececec;

}

.cnc-remove{

    color:#c1121f;

    cursor:pointer;

    font-weight:bold;

}

/* ==========================
Summary
========================== */

.cnc-summary{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:20px;

}

.cnc-summary div{

    background:#fff;

    border:1px solid #ececec;

    border-radius:12px;

    padding:20px;

    text-align:center;

    box-shadow:0 5px 15px rgba(0,0,0,.05);

}

.cnc-summary span{

    display:block;

    margin-top:8px;

    font-size:24px;

    font-weight:bold;

    color:#c1121f;

}

/* ==========================
Responsive
========================== */

@media(max-width:992px){

.cnc-builder{

grid-template-columns:1fr;

}

.cnc-summary{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:600px){

#cookout-calculator{

padding:20px;

}

.cnc-summary{

grid-template-columns:1fr;

}

.cnc-header h2{

font-size:26px;

}

}
.cnc-score{

margin-top:20px;

font-size:18px;

font-weight:bold;

text-align:center;

color:#c1121f;

}

.cnc-food-info h4{

margin:0;

font-size:18px;

}

.cnc-food-info p{

margin:8px 0 0;

font-size:14px;

color:#666;

}

.cnc-remove{

background:#c1121f;

border:none;

color:#fff;

padding:8px 14px;

border-radius:8px;

cursor:pointer;

}

.cnc-remove:hover{

background:#8d0f18;

}