/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap');

/* CORE STYLES */
html { padding: 0; margin: 0; }
body { font-family: Lato, Arial, sans; color: var(--default_text_color); background-color: var(--background_color); padding: 0; margin: 0; font-size: 18px;  }
h1 { font-weight: 300; font-size: 38px; }
p { margin: 0; padding: 0; }
input,select,textarea { font-family: Lato, Arial, sans; }
h2 { font-weight: 700; font-size: 20px; }

.center { text-align: center; }
.material-icons:hover { cursor: pointer; }
.button:hover { cursor: pointer; }
.hide,.hidden { display: none; }
.invisible { opacity: 0; }
.show { display: block; }
.show-ib { display: inline-block; }
.show-i { display: inline; }
.tiny .material-icons { font-size: 20px !important; }

/* ERROR HANDLING */
#error_page { padding: 40px 0; text-align: center; }

/* FIRST LOGIN */
#first_login { border: 1px solid #ccc; padding: 20px; margin-top: 20px; text-align: center; background-color: rgba(254,189,63,.5); }
#first_login h3 { margin-top: 0px; }
#first_login a { display: inline-block; padding: 10px 20px; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color); text-align: center; text-decoration: none; }
#first_login a:hover { background-color: var(--button_hover_color); color: var(--button_color); border: 1px solid var(--button_color); }

/* MODAL */
#overlay { display: none; z-index: 999997; position: fixed; top: 0; left: 0; right: 0; bottom: 0;  background-color: rgba(0,0,0,.75); }
#cart #overlay { background-color: rgba(255,255,255,.75); }
#modal { display: none; z-index: 999998; position: absolute; top: 10%; left: 10%; right: 10%; bottom: 10%; background-color: var(--background_color); border-radius: 5px; }
#modal.small { top: 30%; left: 25%; right: 25%; bottom: 30%; }
#processing_message { display: none; z-index: 999999; position: absolute; top: 20%; left: 20%; right: 20%; bottom: 20%; background: transparent; }
#processing_message .loading_helper { display: inline-block; height: 100%; width: 100%; background: transparent url('/img/cart_processing.png') no-repeat center center; }
#modal_controls .close_modal { z-index: 9999999; position: absolute; top: 20px; right: 20px; color: #666; }
#meal_modal_content { display: flex; justify-content: space-between; position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 20px; overflow-y: auto; }
#meal_modal_content h2 { padding: 0; margin: 0 0 20px 0; }
#meal_modal_content h4 { padding: 0; margin: 0 0 10px 0; }
#modal_images { display: flex; flex-basis: 38%; flex-direction: column; justify-content: space-between; }
#modal_images .modal_image { min-width: 100px; min-height: 400px; background-position: center; background-size: cover; border: 2px solid var(--highlight_color); }
#modal_text { display: flex; flex-basis: 60%; flex-direction: column;  }
#modal_text h2 { font-weight: 300; font-size: 28px; }
#modal_text h4 { font-weight: 300; font-size: 20px; }
#dietary_tags img { display: inline-block; width: 64px; height: auto; }

/* HOME */
/* #home #page_block { background: #ccc url('/img/home_bg.jpg') no-repeat left center; background-size: cover; } */

/* WELCOME */
/* #welcome #page_block { background: #ccc url('/img/welcome_bg.jpg') no-repeat top center; background-size: cover; } */
#welcome #page_block { padding: 0; }
#welcome #page_content { background-color: var(--background_color); max-width: 80vw; -webkit-box-shadow: 0px 3px 5px 2px rgba(204,204,204,.5); -moz-box-shadow: 0px 3px 5px 2px rgba(204,204,204,.5); box-shadow: 0px 3px 5px 2px rgba(204,204,204,.5); }
#welcome #page_content .page_pad { padding: 40px 20px }
#welcome #page_content #safety { background-color: #ccc; font-size: 18px; text-align:center; padding: 10px; }
#welcome #page_content #safety a { color: #000; text-decoration: none; }
#welcome #page_content #safety a:hover { color: #666; text-decoration: underline; }
#welcome #page_content #actions { padding: 20px 0;}
#welcome #page_content #actions .button { border-radius: 5px; float: right; padding: 10px 0; min-width: 140px; color: var(--button_text_color); background-color: #ccc; margin-right: 20px; text-decoration: none; text-align: center; }
#welcome #page_content #actions .button.login { background-color: #259b9f; }
#welcome #page_content #actions .button.register { background-color: #a9cf5e; }
#welcome #page_content #actions .button.login:hover { background-color: var(--button_color); }
#welcome #page_content #actions .button.register:hover { background-color: #80bc04; }
/* #welcome #page_content #logo { background: transparent url('/img/ahhyay-logo.png') no-repeat top center; min-height: 300px; } */
#welcome #page_content h1 { margin: 0; padding: 0; }

/* WELCOME MEAL PREVIEW */
#meal_preview_title { background-color: #eee; text-align: center; padding: 40px 0 20px 0; }
#meal_preview_title h2 { padding: 0; margin: 0; font-size: 2em; }
#meal_preview_title p { padding: 20px 0; margin: 0; font-size: 1.2em; }
#meal_preview { display: flex; justify-content: space-evenly; background-color: var(--secondary_background_color); padding-bottom: 40px; }
#meal_preview .meal_preview_item { max-width: 18% }
#meal_preview .meal_preview_image { min-height: 160px; width: 100%; background-size: cover; border: 1px solid var(--outline_color); border-radius: 5px; -webkit-box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); -moz-box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); }
#meal_preview h4 { text-align: center; font-size: .8em; }

/* LOGIN */
#login { background: #ccc url('/img/login_bg.jpg') no-repeat top center; background-size: cover; }
#login_form { display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); max-width: 350px; padding: 30px; background-color: var(--button_text_color); box-shadow: #666 0px 0px 10px; border-radius: 10px; }
#login_form h1 { color: var(--button_color); }
.login_image { text-align: center; }
.form_item { padding: 5px 0; }
.form_item label { display: inline-block; font-weight: bold; margin-top: 10px; }
.form_item.hidden { display: none; }
.form_forgotten { text-align: center; margin: 5px 0px 10px 0; }
.form_forgotten  a { color: var(--button_color); text-decoration: none; }
.form_forgotten  a:hover { color: #369; text-decoration: underline; }
.form_create_account { text-align: center; margin-top: 10px; }
.form_create_account  a { color: var(--button_color); text-decoration: none; }
.form_create_account  a:hover { color: #369; text-decoration: underline; }
.login_input { width: 325px !important; padding: 10px; border: 1px solid var(--button_color); }
.login_button { width: 100%; padding: 15px 0; margin-top: 20px; text-align: center; background-color: var(--button_color); color: var(--button_text_color); text-transform: uppercase; font-weight: 700; border: 0; }
.login_button:hover { background-color: #369; cursor: pointer; }
.login_message { padding: 10px; background-color: rgba(217,12,12,.25); border: 1px solid #e00; color: #e00; text-align: center; margin-bottom: 10px; }

/* ORDER LOGIN */
#cart_login { background-color: #eee; border-radius: 10px; padding: 20px; }
#cart_login h2 { text-align: center; }
#cart_login_buttons { display: flex; justify-content: space-around; }
#cart_login_buttons .cart_login_button { background-color: var(--button_text_color); border-radius: 10px; margin: 10px; padding: 20px; }
#cart_login_buttons .cart_login_button h3 { margin-top: 0; }
#cart_login_buttons .cart_login_button a { display: block;  padding: 10px 0; text-decoration: none; text-align: center; border-radius: 10px; }
#cart_login_buttons .cart_login_button a.login { background-color: var(--button_color); border: 2px solid var(--button_color); color: var(--button_text_color); }
#cart_login_buttons .cart_login_button a.register { background-color: #82be09; border: 2px solid #82be09; color: var(--button_text_color); }
#cart_login_buttons .cart_login_button a.login:hover { background-color: var(--button_text_color); color: var(--button_color); }
#cart_login_buttons .cart_login_button a.register:hover { background-color: var(--button_text_color); color: #82be09; }

/* FORGOT */
#forgot { background: #ccc url('/img/forgot_bg.jpg') no-repeat top center; background-size: cover; }
.forgot_message { padding: 10px; background-color: rgba(225,225,225,.25); border: 1px solid #ccc; color: #ccc; text-align: center; margin-bottom: 10px; }
.forgot_message.error { background-color: rgba(217,12,12,.25); border-color:#e00; color: #e00; }
.forgot_message.success { border-color: #3ab4a3; background-color: #c2d6d8; color: #3ab4a3; }

/* REGISTER */
#register { background: #ccc url('/img/register_bg.jpg') no-repeat top center; background-size: cover; }
#register_form { display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); max-width: 750px; min-width: 30%; padding: 30px; background-color: var(--button_text_color); box-shadow: #666 0px 0px 10px; border-radius: 10px; }
#register_form .form_item.center { justify-content: center; }
#register_form .form_item label { width: 120px; }
#register_form .form_item input[type=button] { padding: 10px 20px; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color); }
#register_form h2 { text-align: center; }
#register_form .inline-help { margin-top: 2px; }
#progress_bar ul { list-style: none; display: flex; justify-content: space-between; padding: 0; }
#progress_bar ul li { text-align: center; position: relative; flex-basis: 25%; }
#progress_bar ul li i { font-size: 26px; color: var(--button_color); margin-bottom: 10px; }
#progress_bar ul li .marker { width: 16px; height: 16px; background-color: #ccc; margin: 2px auto; border-radius: 50%; }
#progress_bar ul li.active .marker { background-color: var(--button_color); }
#progress_bar ul li.past .marker { background-color: var(--button_color); }
#progress_bar ul li .marker::after { content: ''; background-color: #ccc; height: 5px; width: 100%; display: block; position: absolute; margin: 0 auto; top: 44px; z-index: -1; }
#progress_bar ul li.past .marker::after { background-color: var(--button_color); }
#progress_bar ul li:last-child .marker::after { content: none; }
#register_message { width: 54%; margin: 0 auto; padding: 6px; text-align: center; border: 1px solid #ccc; background-color: #eee; display: none; margin-bottom: 20px; }
#register_message.error { border-color: red; color: red; background-color: rgb(217,0,0,.25); }
#register_pass_message { display: none; text-align: center; border: 1px solid #ccc; background-color:#eee; width: 54%; margin: 0 auto; padding: 6px; margin-bottom: 10px; }
#register_pass_message.too_short { border-color: red; color: red; background-color: rgba(217,0,0,.25); }
#register_pass_message.weak { border-color: #f62; color: #f62; background-color: rgba(254,189,63,.25); }
#register_pass_message.good { border-color: #078; color: #078; background-color: rgba(0,113,120,.25); }
#register_pass_message.strong { border-color: #683; color: #683; background-color: rgba(93,133,51,.25); }
#register_form .form_item input[type=button].btn_step.disabled { color: #666; border-color: #666; background-color: #ddd; cursor: not-allowed; }
#register_confirm_pass_message { display: none; text-align: center; border: 1px solid #ccc; background-color:#eee; width: 54%; margin: 0 auto; padding: 6px; margin-bottom: 10px; }
#register_confirm_pass_message.passwords_mismatch { border-color: red; color: red; background-color: rgba(217,0,0,.25); }
#register_confirm_pass_message.passwords_match { border-color: #683; color: #683; background-color: rgba(93,133,51,.25); }
#register_form .req { color: #e00; text-align: center; font-size: 12px; }

/* APP */
a .material-icons { color: #000; }
body.app #base { height: 100vh; }
#top_nav { background-color: #eee; position: fixed; z-index: 99999; width: 100%; }
#top_menu { display: flex; width: 96vw; margin: 0 auto; padding: 0; color: #666;}
#top_menu a { font-weight: 300; color: #999; text-decoration: none; text-transform: uppercase;}
.top_menu_nav { list-style: none; padding: 0; margin: 0;  flex: 0 0 50%; }
.top_menu_nav li { display: inline-block; padding: 0; margin: 0; }
.top_menu_nav li a { display: inline-block; padding: 5px 10px; margin: 0; }
#nav_left { text-align: left; }
#nav_right { text-align: right; }
#page_nav { position: fixed; width:100%; background-color: var(--menu_background_color); border-bottom: 1px solid #eee; height: 100px; padding: 40px 10px 10px 10px; z-index: 99998; -webkit-box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); -moz-box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); }
#page_menu { display: flex; justify-content: space-between; color: var(--default_text_color); width: 96vw; margin: 0 auto; position: relative; z-index: 9999; }
#nav { display: flex; min-height: 80px; align-items: center; justify-content: center; }
#nav a { display: inline-block; text-transform: uppercase; color: var(--menu_button_text_color); background-color: var(--menu_button_color); text-decoration: none; padding: 6px 12px; margin: 0 2px; border-radius: 3px; }
#nav a i.material-icons { color: var(--menu_button_text_color); font-size: 1rem; }
#nav a:hover { background-color: var(--menu_button_hover_color); color: var(--menu_button_text_hover_color); }
#nav a:hover i.material-icons { color: var(--menu_button_text_hover_color); }
#nav a.active { color: var(--menu_button_active_text_color); background-color: var(--menu_button_active_color); }
#nav a.prevent { color: #ccc; cursor: not-allowed; }
#page_menu .logo { padding: 10px; background-size: 150px; min-height: 80px; min-width: 180px; background-size: contain; }
#page_menu .logo p { display: inline-block; color: var(--button_text_color); font-weight: 700; font-size: 30px; margin-left: 40px; }
#nav { margin-right: 20px; }
#sub_nav { background: rgba(0,113,120,.5); color: var(--button_text_color); padding: 5px; text-align: right; }
#sub_menu { width: 60vw; margin: 0 auto; }
#sub_menu a { display: inline-block; text-transform: uppercase; color: var(--button_text_color); text-decoration: none; padding: 6px 12px; margin: 0 2px; border-radius: 3px;  }
#page_block { height: 100vh; }
#page_content { width: 98vw; margin: 0 auto; padding-top: 170px; }
#page_content  h1 { color: #666; font-size: 30px; }
#date_switcher { display:flex; justify-content:space-evenly; }
#category_description { background-color: var(--highlight_background_color); padding: 20px; margin-bottom: 10px; text-align: center; font-size: 1.2em; }

/* FORMS */
.form_item { display: flex; padding: 0; margin: 0 0 10px 0; }
.form_item label { display: inline-block; width: 160px; text-align: right; margin-right: 10px; vertical-align: middle; }
.form_item.textarea label { vertical-align: top; }
.form_item input { padding: 10px; }
.form_item select { padding: 10px; }
.form_item input[type=text] { width: 300px; }
.form_item input.small { width: 100px; }
.form_item input[type=password] { width: 300px; }
.form_item input[type=number] { width: 60px; }
.form_item input[type=date] { width: 140px; }
.form_item textarea { padding: 10px; width: 600px; height: 120px; }
.form_item input[type=submit] { padding: 10px 20px; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color);  }
.form_item input[type=submit]:hover { background-color: var(--button_hover_color); color: var(--button_hover_text_color); border: 1px solid var(--button_hover_color); cursor: pointer; }

.meal_tags { display: inline; width: 80vw; }

.form_checkbox { display: inline; margin-right: 10px; }
.form_checkbox input { display: none; }
.form_checkbox label { display: inline-block; border: 1px solid #999; color: #000; font-weight: bold; padding: 5px 10px; margin: 0 10px 10px 0; width: auto; text-align: center; }
.form_checkbox label:hover { background-color: #ddd; cursor: pointer; }
.form_checkbox label.checked { background-color: rgba(0,113,120,.5); }
.form_radio { display: inline; margin-right: 10px; }
.form_radio input { display: none; }
.form_radio label { display: inline-block; border: 1px solid #999; color: #000; font-weight: bold; padding: 8px 16px; margin: 0 10px 10px 0; width: auto; text-align: center; }
.form_radio label:hover { background-color: #ddd; cursor: pointer; }
.form_radio label.checked { background-color: rgba(0,113,120,.5); }
.form_images { position: relative; padding: 10px 0; }
.form_images img { border: 1px solid var(--button_color); }
.form_image { min-width: 100px; display: inline-block; position: relative; margin-right: 10px; }
.form_image_overlay { transition: .5s ease; opacity: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align: center; }
.form_image:hover img { opacity: .5; cursor: pointer; }
.form_image:hover .form_image_overlay { opacity: 1; }
.controls { margin-bottom: 20px; }
.controls a { display: inline-block; padding: 10px 20px; background-color: var(--button_color); color: var(--button_text_color); text-transform: uppercase; text-decoration: none; margin-right: 20px; }
.controls a:hover { background-color: var(--button_hover_color); }

.dataTables_length { margin-bottom: 10px !important; }
.datatable th { text-align: left; background-color: var(--button_hover_color); }
.datatable tr.even { background-color: #eee; }
table.dataTable tfoot th, table.dataTable tfoot td, table.dataTable thead th, table.dataTable thead td { padding: 10px !important; }
.datatable tfoot { background-color: var(--button_hover_color); color: var(--button_text_color); }

#confirm_message { width: 60vw; text-align: center; background-color: rgba(254,189,63,.5); border: 2px dashed #febd3f; margin: 0 auto; padding: 40px; }
#confirm_message h2 { margin-top: 0px; }
#confirm_message a { padding: 10px 20px; margin: 0 15px; text-transform: uppercase; color: var(--button_text_color); text-decoration: none; }
#confirm_message a.confirm { background-color: var(--button_color); }
#confirm_message a.confirm:hover { background-color: var(--button_hover_color); }
#confirm_message a.cancel { background-color: #f06721; }
#confirm_message a.cancel:hover { background-color: #febd3f; }

/* ORDER FOR NOTICE */
#order_for { display: flex; justify-content: center; align-items: center; background-color: var(--highlight_background_color); border: 1px solid #999; margin: 0 auto; padding: 12px; }
#order_for span.data { display: inline-block; border-bottom: 2px dashed #666; }
#order_for span.button { position:relative; top: 6px; display: inline-flex; border: 1px solid var(--button_color); background-color: var(--button_color); padding: 3px 4px 2px 4px; border-radius: 5px; margin: 0 10px; }
#order_for span.button i { color: var(--button_text_color); }

/* DELIVERY TOGGLE */
#delivery_toggle { margin: 0; padding: 0; }
#delivery_toggle .form_radio { margin: 0; }
#delivery_toggle .form_radio label { margin: 0; font-size: 1em; color: #999; border-color: #555; background-color: rgba(0,0,0,.2); box-shadow: inset 0px 0px 6px #888; }
#delivery_toggle .form_radio label.checked { color: #000; border-color: #000; background-color: rgba(0,113,120,.5); box-shadow: inset 0px 0px 3px #333; }
#delivery_toggle .form_radio:first-child label { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
#delivery_toggle .form_radio:last-child label { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }

/* FAQs */
#faq_holder { display: flex; justify-content: space-between; }
.faq_column { flex: 50%; }
.faq_list { list-style-type: none; margin: 0; padding: 0; width: 80%; }
.faq_list li { display: flex; justify-content: space-between; margin-bottom: 10px; padding: 10px; font-weight: 700; background-color: #eee; border: 1px solid #ccc; font-size: 24px; }
.sortable-highlight { background-color: rgba(254,189,63,.25); }
.rotate { transform: rotate(90deg); vertical-align: middle; }
#accordion h3 { font-family: Lato, Arial, sans !important; background: #eee url('/img/icon_plus.png') no-repeat center right; padding-right: 50px; }
#accordion h3 span.ui-icon { display: none; }
#accordion h3:hover { background-color: #ddd; }
#accordion .ui-state-active { border: 1px solid var(--button_color); font-weight: 700; background: var(--button_color) url('/img/icon_minus.png') no-repeat center right; }
#accordion .ui-state-active:hover { background-color: var(--button_color); }
#accordion p { font-family: Lato, Arial, sans !important; line-height: 1.5em; }

/* ORDERING */
#date_change { display: none; }
#type_change { display: none; }
#removed_items { display: none; }
#out_of_stock { display: none; }
.ui-dialog { z-index: 999999 !important; }
#order_dashboard { position: relative; margin-bottom: 20px; }
#order_wrapper { width: 72.5%; display: inline-block; margin-left: 10px; }
#cart_sidebar { width: 25%; border-radius: 5px; background-color: #eee; display: flex; flex-direction: column; flex: 0 0 auto; position: fixed;  top: 150px; right: 20px; bottom: 20px; margin: 20px 0 0 30px; }
#cart_sidebar h3 { display: flex; color: #666; margin: 0; padding-left: 20px; }
#cart_order_date_display { display: flex; justify-content: space-between; align-items: center; padding: 10px 20px ; margin: 10px; background-color: var(--highlight_background_color); }
#cart_order_date_display h3 { padding: 0; margin: 0; font-size: 1em; }
#cart_order_date_display #edit_order_info { border: 1px solid var(--button_color); background-color: var(--button_color); padding: 3px 4px 2px 4px; border-radius: 5px; }
#cart_order_date_display #edit_order_info i { color: var(--button_text_color); }
#cart_order_date_display #edit_order_info:hover { cursor: pointer; background-color: var(--button_text_color); }
#cart_order_date_display #edit_order_info:hover i { color: var(--button_color); }
#cart_wrapper { display: flex; flex-direction: column; padding: 10px; overflow-y:auto; }
#cart_empty { padding: 20px; text-align: center; }
#cart_items { display: flex; flex-grow: 1; margin-bottom: 20px; }
#cart_items table { width: 100%; border-collapse: collapse; }
#cart_items table tr { border-bottom: 1px solid #eee; }
#cart_items table thead tr { border-color: #ccc; }
#cart_items table tbody tr:last-child { border-bottom: 0;}
#cart_items table th { text-align: left; font-size: 16px; padding-bottom: 5px; }
#cart_items table td { font-size: 16px; padding: 5px 0; }
#cart_wrapper .cart_memo { font-size: 16px; }
#cart_totals { display: flex;  flex-direction: column; margin-top: 20px; }
#cart_totals p { text-align: center; line-height: 1.5em; }
#cart_subtotal { text-align: center; margin-bottom: 10px; }
#cart_data_object { display: none; }
#subtotal_label { font-weight: 700; }
#order_top { flex: 4; }
.meals_grid { display: flex; flex-wrap: wrap; align-items: flex-start; align-items: stretch; justify-content: space-evenly; }
.meals_block { padding: 10px; }
.meals_block h2 { font-size: 24px; font-weight: 300; margin: 0; padding: 0 0 10px 10px; }
.meals_block:nth-child(odd) { background-color: #eee; }
.meal_box { background-color: var(--background_color); cursor: pointer; width: 22.5%; border: 1px solid #eee; padding: 10px; margin-bottom: 20px; border-radius: 5px; -webkit-box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); -moz-box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); box-shadow: 0px 3px 5px 2px rgba(204,204,204,.25); }
.meal_box.disabled { background-color: #ccc; }
.meal_box:hover { cursor: pointer; }
.meal_box .meal_image { position: relative; background-position: center center; background-size: cover; min-height: 178px; border-radius: 5px; border: 1px solid var(--highlight_color); }
.meal_box .meal_image .meal_overlay { display: none; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,.5); }
.meal_box .meal_image .meal_overlay.disabled { display: block; }
.meal_box .meal_image .meal_overlay h4 { margin: 25% 0; text-align: center; color: var(--background_color); }
.meal_box:hover .meal_image .meal_overlay { display: block; }
.meal_box h3 { margin: 10px 0; font-weight: 300; color: #666; } /* min-height: 50px; */
.meal_box p { line-height: 1.5em; }
.meal_box .price { font-size: 28px; font-weight: 300; line-height: 1em; color: #666; }
.add_to_cart_block { min-width: 150px; }
.add_to_cart_block input[type=button] { -webkit-appearance: none; padding: 10px 20px; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color); border-radius: 5px; }
.add_to_cart_block input[type=button]:hover { background-color: var(--button_hover_color); color: var(--button_hover_text_color); cursor: pointer; }
.add_to_cart_block input[type=button].disabled { background-color: #ccc; color: #666; border: 1px solid #666; cursor:not-allowed; }
.add_to_cart_block input[type=button].disabled:hover { cursor:not-allowed; }
.add_to_cart_block .dec_quantity { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.add_to_cart_block .inc_quantity { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; }
.cart_actions { margin-top: 20px; display: flex; justify-content: space-between; }
.cart_actions .builder_button { padding: 10px 20px; width: 100%; text-align: center; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color); border-radius: 5px; text-decoration: none; font-size: 13.33px; }
.cart_actions .builder_button:hover { background-color: var(--button_hover_color); color: var(--button_hover_text_color); }
.to_cart, .to_addons, .to_kits { width: 80%; margin: 10px auto; }
.to_cart a, .to_addons a, .to_kits a { display: block; padding: 10px 20px; border-radius: 5px; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color); text-align: center; text-decoration: none; }
.to_cart a:hover, .to_addons a:hover, .to_kits a:hover { background-color: var(--button_hover_color); color: var(--button_color); border: 1px solid var(--button_color); }
.to_cart.prevent a { background-color: #ccc; color: #999; border: 1px solid #999; cursor: not-allowed; }
td.quantity input { width: 20px; padding: 1px; }
td.quantity .ui-button .ui-icon { background-image: url('/img/ui-icons_555555_256x240.png'); }
#cart_message { border: 1px solid red; text-align: center; border-radius: 5px; padding: 10px; color: red; font-size: 16px; }
#cart_items.hide { display: none; }
#checkout_items { width: 60%; margin: 0 auto; }
#checkout_items table { width: 100%; border-collapse: collapse; }
#checkout_items table tr { border-bottom: 1px solid #eee; }
#checkout_items table thead tr { border-color: #ccc; }
#checkout_items table tbody tr:last-child { border-bottom: 0;}
#checkout_items table th { text-align: left; font-size: 12px; padding-bottom: 5px; }
#checkout_items table th, #checkout_items table td { font-size: 16px; padding: 5px 0; }
/* #checkout_items table th:nth-child(2) { padding-right: 20px; }
#checkout_items table td:nth-child(3) { text-align: center; } */
#totals_section { display: flex; margin: 30px 0; justify-content: space-between; align-items: flex-start; }
#totals_section .cart_totals { flex: 1; }
#totals_section #cc_wrapper { flex: 1; }
#totals_section .cart_totals table { width: 100%; }
#totals_section .spacer { width: 6%; }
.date_select { display: inline-block; font-size: 1em; font-weight: 600; color: #444; line-height: 1.2; padding: .3em 1.8em .4em .6em; width: auto; box-sizing: border-box; margin: 0; border: 1px solid #aaa; box-shadow: 0 1px 0 1px rgba(0,0,0,.04); border-radius: 10px; -moz-appearance: none; -webkit-appearance: none; appearance: none; background-color: var(--button_text_color); background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23666666%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),linear-gradient(to bottom, var(--button_text_color) 0%,#e5e5e5 100%); background-repeat: no-repeat, repeat; background-position: right .7em top 50%, 0 0; background-size: .65em auto, 100%; }
.date_select::-ms-expand { display: none; } /* Hide arrow icon in IE browsers */
.date_select:hover { border-color: #888; } /* Hover style */
.date_select:focus { border-color: #aaa; box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7); box-shadow: 0 0 0 3px -moz-mac-focusring; color: #222; outline: none; } /* Focus style */
.date_select option { font-weight:normal; } /* Set options to normal weight */
*[dir="rtl"] .date_select, :root:lang(ar) .date_select, :root:lang(iw) .date_select { background-position: left .7em top 50%, 0 0; padding: .6em .8em .5em 1.4em; } /* Support for rtl text, explicit support for Arabic and Hebrew */
.date_select:disabled, .date_select[aria-disabled=true] { color: graytext; background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22graytext%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),linear-gradient(to bottom, var(--button_text_color) 0%,#e5e5e5 100%); } /* Disabled styles */
.date_select:disabled:hover, .date_select[aria-disabled=true] { border-color: #aaa; }
.meal_tiles { position: absolute; top: 10px; right: 10px; }
.meal_tiles ul { list-style: none; padding: 0; margin: 0; }
.meal_tiles ul li { display: inline-block; padding: 5px; color: var(--default_text_color); background-color: var(--highlight_color); text-align: center; font-size: 10px; border: 1px solid var(--default_text_color); border-radius: 5px; }
.cart_change { background-color: #ccc; }

/* COUPON */
#coupon_code_block { display: flex; align-items:center; padding: 10px; border: 1px solid #ccc; background-color: rgba(0,113,120,.1); border-radius: 5px; }
#coupon_code_block label { flex-grow: 0; font-size: 15px; display: inline-block; margin-right: 10px; font-weight: 700; width: initial; }
#coupon_code { flex-grow: 2; padding: 6px 10px; border: 0; }
#coupon_button { min-width: 115px; flex-grow: 1; display: inline-block; border-radius: 5px; margin-left: 10px; border: 0; border-collapse: collapse; background-color: var(--button_color); color: var(--button_text_color); padding: 6px 10px; }
#coupon_button:hover { background-color: var(--button_hover_color); cursor: pointer; }
#coupon_result { display: none; margin-top: 10px; border: 1px solid #ccc; background-color: #febd3f; text-align: center; font-weight: 700; border-radius: 5px; padding: 10px; }
#coupon_result.error { background-color: #ee3a43; color: var(--button_text_color); }

/* CREDIT CHECKOUT */
#credit_block { margin-top: 10px; padding: 10px; border: 1px solid #ccc; background-color: rgba(254,189,63,.25); border-radius: 5px; }
#credit_block p { font-weight: 600; text-align: center; margin-bottom: 10px; }
#credit_form { display: flex; align-items:center; }
#credit_form label { flex-grow: 0; font-size: 15px; display: inline-block; margin-right: 10px; font-weight: 700; width: initial; }
#store_credit { flex-grow: 2; padding: 6px 10px; border: 0; }
#credit_button { min-width: 115px; flex-grow: 1; display: inline-block; border-radius: 5px; margin-left: 10px; border: 0; border-collapse: collapse; background-color: var(--button_color); color: var(--button_text_color); padding: 6px 10px; }
#credit_button:hover { background-color: var(--button_hover_color); cursor: pointer; }
#credit_result { display: none; margin-top: 10px; border: 1px solid #ccc; background-color: #febd3f; text-align: center; font-weight: 700; border-radius: 5px; padding: 10px; }
#credit_result.error { background-color: #ee3a43; color: var(--button_text_color); }
#noncc_checkout { display: none; margin-top: 10px; text-align: center; }
#noncc_checkout a { display: inline-block; border: 0; border-collapse: collapse; background: var(--button_color); border-radius: 5px; text-decoration: none; font-size: 18px; color: var(--button_text_color); padding: 10px 20px; }
#noncc_checkout a:hover { background-color: var(--button_hover_color); cursor: pointer; }
#credit_type { margin-left: 10px; }

/* INLINE QUANTITY */
.inline-quantity { width: 2em; padding: 10px; border: 1px solid var(--button_color); text-align: center; }
.cc_input { font-family: Lato; border: 1px solid #ccc; border-radius: 5px; padding: 10px; margin: 10px 0 20px 0; }
.payment_button { border: 0; border-collapse: collapse; background: var(--button_color); border-radius: 5px; font-size: 18px; color: var(--button_text_color); padding: 10px 20px; }
.payment_button:hover { cursor: pointer; background-color: var(--button_hover_color); }
#instuctions { margin-bottom: 5px; }
#instuctions label { display: block; margin-bottom: 10px; font-weight: 700; }
#instuctions textarea { width: calc(100% - 10px); height: 50px; border: 1px solid #ccc; border-radius: 5px; padding: 5px; }

/* ORDER MESSAGE */
#order_message { padding: 10px; margin: 0 0 20px 0; width: calc(100% - 20px); }
#payment-result { display: none; }
#payment-result.error { text-align: center; font-weight: 700; padding: 20px; border: 1px solid #d00; margin: 10px 0 20px 0; color: var(--button_text_color); background-color: rgba(217,0,0,.8); }

/* ORDER SUCCESS */
#success_block { display: flex; }
#success_details { flex-basis: 65% }
#success_actions { flex-basis: 33%; margin-left: 2% }
#success_details h2 { margin-top: 0px; }
#order_summary { display: table; border-collapse: collapse; width: 100%; }
#order_summary th { text-align: left; }
#order_summary td { padding: 3px; }
#order_summary td:first-child { width: 65%; }
#order_summary td:nth-child(3) { text-align: center; }
#order_summary tbody td { border-bottom: 1px solid #ccc; }
#order_summary tfoot { border-top: 10px solid var(--button_text_color); }
#order_summary tfoot td:nth-child(2) { font-weight: bold; }
#success_actions .action { display: block; padding: 10px 20px; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color); text-align: center; text-decoration: none; margin-bottom: 10px; }
#success_actions .action:hover { background-color: var(--button_hover_color); color: var(--button_color); border: 1px solid var(--button_color); }
.another { display: block; padding: 10px 20px; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color); text-align: center; text-decoration: none; margin: 0 auto 10px auto; max-width: 50%; }

/* PROFILE BLOCK */
#profile_block { display: flex; }
#profile_details { display: flex; flex-direction: column; flex-basis: 65% }
#profile_actions { flex-basis: 33%; margin-left: 2% }
#profile_details h2 { margin-top: 0px; }
#profile_actions .action { display: block; padding: 10px 20px; font-weight: bold; background-color: var(--button_color); color: var(--button_text_color); border: 1px solid var(--button_color); text-align: center; text-decoration: none; margin-bottom: 10px; }
#profile_actions .action:hover { background-color: var(--button_hover_color); color: var(--button_hover_text_color); border: 1px solid var(--button_hover_color); }

/* PROFILE SETTINGS */
#profile_settings { display: flex; justify-content: space-between; }
.profile_settings_item { margin-right: 10px; cursor: pointer; display: flex; flex-direction: column; background-color: var(--manage_light_button); padding: 20px; border-radius: 10px; }
.profile_settings_item h3 { margin-top: 0; text-align: center; color: var(--button_color); }
.profile_settings_item img { width: 210px; height: 210px; object-fit: fill;}
.profile_settings_item a { display: block; text-align: center; background-color: var(--button_color); color: var(--button_text_color); margin-top: 10px; padding: 10px 20px; text-decoration: none; border: 1px solid var(--button_color); }
.profile_settings_item a:hover { background-color: var(--manage_light_button); color: var(--button_color); border: 1px solid var(--button_color); }
#summary_table tr.even { background-color: var(--secondary_background_color); }

/* PROFILE DIETARY */
#dietary_tags { margin-bottom: 20px; }

/* PASSWORD*/
.new_password span { display: inline-block; margin: 7px 0 0 10px; }
.new_password .short{ font-weight:bold; color:#FF0000; font-size:larger; }
.new_password .weak{ font-weight:bold; color:orange; font-size:larger; }
.new_password .good{ font-weight:bold; color:#2D98F3; font-size:larger; }
.new_password .strong{ font-weight:bold; color: limegreen; font-size:larger; }
#form_message { display: none; border: 1px solid #666; width: 30vw; min-width: 400px; background-color: rgba(254,189,63,.2); text-align: center; padding: 10px; margin-bottom: 20px; }
#login_form #form_message { width: auto !important; min-width: 0px; }
#form_message h3 { margin: 0 0 10px 0; color: #666; }
#form_message p { margin: 0; line-height: 1.6em; color: #666; }

/* REPORT */
#report_table { border-collapse: collapse; }
#report_table th { text-align: left; padding: 5px 2px; background-color: var(--button_hover_color); }
#report_table td { padding: 5px 2px; }
#report_table th:first-child, #report_table td:first-child { padding-left: 6px; }
#report_table th:last-child, #report_table td:last-child { padding-right: 6px; }
#report_table tbody tr:nth-child(even) {background: #CCC}
#report_table th.c, #report_table td.c { text-align: center; }
#report_table th.r, #report_table td.r { text-align: right; }

/* MANAGE COUPONS */
#coupons_block { display: flex; }
#coupons_details { display: flex; flex-direction: column; flex-basis: 65% }

/* START HERE */
#start_here { padding: 20px; margin-top: 40px; border-radius: 10px; border: 1px solid #febd3f; background-color: rgba(254,189,63,.2); margin-bottom: 20px; }
#start_here_image { display: block; margin: -57px auto 0 auto; }
#start_steps { display: flex; margin: 10px 100px; justify-content: space-between; }

/* MISC */
.section { margin-bottom: 30px; }
.section p { font-size: 16px; line-height: 1.6em; }
#message { margin-top: 20px; border: 1px solid #ccc; background-color: #eee; text-align: center; padding: 20px; font-size: 24px; }
#message.success { border-color: #3ab4a3; background-color: #c2d6d8;  }
.inline-help { display: inline-block; margin: 10px 0 0 10px; font-size: 14px; }
.actions a { display: inline-block; margin-right: 10px; }
.actions a:last-child { margin-right: 0px; }
.ui-widget-header .ui-icon { background-image: url('/img/ui-icons_444444_256x240.png'); }

/* STRIPE SETTINGS */
#stripe_toggle { margin: 0; padding: 0; }
#stripe_toggle .form_radio { margin: 0; }
#stripe_toggle .form_radio label { margin: 0; font-size: 1em; color: #999; border-color: #555; background-color: rgba(0,0,0,.2); box-shadow: inset 0px 0px 6px #888; }
#stripe_toggle .form_radio label.checked { color: #000; border-color: #000; background-color: rgba(0,113,120,.5); box-shadow: inset 0px 0px 3px #333; }
#stripe_toggle .form_radio:first-child label { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
#stripe_toggle .form_radio:last-child label { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.stripe_key_icon { cursor: pointer; display: inline-block; position: relative; left: -1px; padding: 10px; background-color: #eee; height: 100%; border: 1px solid rgb(118,118,118); vertical-align: middle; border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.stripe_key_icon i { vertical-align: middle; }

/* REFER A FRIEND */
#referal_form { max-width: 30vw; padding: 20px 0 40px 0; margin: 40px auto; text-align: center; background-color: var(--manage_light_button); border: 1px solid var(--button_color) }
#referal_form .form_item { display: inline-block; margin: 20px auto 0 auto; width: 100%; }
#referal_form .form_item label { display: inline-block; width: auto; }
#referal_form .form_item input[type=email],#referal_form .form_item input[type=text] { margin-right: 10px; width: 20em; }
#refer_toggle { margin: 0; padding: 0; }
#refer_toggle .form_radio { margin: 0; }
#refer_toggle .form_radio label { margin: 0; font-size: 1em; color: #999; border-color: #555; background-color: rgba(0,0,0,.2); box-shadow: inset 0px 0px 6px #888; }
#refer_toggle .form_radio label.checked { color: #000; border-color: #000; background-color: rgba(0,113,120,.5); box-shadow: inset 0px 0px 3px #333; }
#refer_toggle .form_radio:first-child label { border-top-left-radius: 10px; border-bottom-left-radius: 10px; }
#refer_toggle .form_radio:last-child label { border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
.refer_user { border: 1px solid #ccc; background-color: #eee; padding: 20px; }
.refer_user label { width: auto; text-align: left; }
#refer_congrats { border: 1px solid #666; background-color: #c2d6d8; color: #666; margin-top: 20px; padding: 20px; }
#refer_congrats h2 { margin-top: 0; }
.form_item textarea.email_ta { width: 100%; height: 200px; }
 .email_ta_note { text-align: center; font-weight: 600; margin-bottom: 40px; }


/* FORM FLEX */
.form_flex { display: flex; }
.form_flex .form_col_50 { display: flex; flex-direction: column; flex-basis: 50% }

/* TABS */
#tabs.ui-tabs { border: 0; }
#tabs .ui-tabs-nav { background: transparent; border: 0; }
#tabs .ui-tabs-active { background-color: var(--button_text_color); border-color: #ccc; }
#tabs .ui-tabs-active a {color: #454545; }
#tabs .ui-tabs-panel { border: 1px solid #ccc; }

/* FORM FIXES */
.form_item.vert_center input[type=radio],.form_item.vert_center input[type=checkbox] { display: inline-block; margin-top: 14px; }
.form_item.vert_center span { display: inline-block; margin: 9px 10px 0 5px; font-weight: 500; }
.ui-dialog-titlebar-close { visibility: hidden; }

/* CREDIT */
#user_credit { padding: 20px; border: 1px solid #666; background-color: #eee; text-align: center; margin-bottom: 20px; }
#user_credit h3 { margin: 0; padding: 0; color: #666; }
.form_inline { display: block; text-align: center; }
.form_inline input[type=submit] { margin-left: 10px; }
#credit_success { padding: 20px; border: 1px solid #666; background-color: rgba(155,200,68,.25); text-align: center; margin-bottom: 20px; }
#credit_failure { padding: 20px; border: 1px solid #666; background-color: rgba(131,23,23,.25); text-align: center; margin-bottom: 20px; }

/* MENU MODULE */
#menu_navigation { margin: 10px 0 20px 0; padding: 6px 10px; background-color: rgba(51,102,153,0.15); }
#menu_navigation span { display: inline-block; margin-right: 10px; font-weight: bold; }
#menu_navigation a { display: inline-block; margin-right: 10px; padding: 6px 10px; background-color: var(--button_text_color); color: #369; border: 1px solid #369; text-decoration: none; }
#menus { padding: 0; margin: 0; }
#menus .menu_container { padding: 0; margin-bottom: 20px; }
#menus .menu_header { padding: 10px; display: flex; justify-content: space-between; flex-wrap: nowrap; background-color: rgba(0,0,0,.05); }
#menus .menu_header h2 { display: inline; padding: 0; margin: 0; }
#menus .menu_details { padding: 0; margin: 0; border: 1px solid; }
#menus .menu_details .menu_category { padding: 20px; margin: 0; }
#menus .menu_details .menu_category h3 { padding: 0; margin: 0 0 10px 0; font-size: 20px; font-weight: 300; border-bottom: 1px solid; }
#menus .menu_details .menu_category .menu_item { padding: 6px 0; display: flex; justify-content: space-between; flex-wrap: nowrap; border-bottom: 1px dashed #ccc; align-items: center; }
#menus .menu_details .menu_category .menu_item:last-of-type { border-bottom: 0; }
#menus .menu_details .menu_category .menu_item .title { width: 20%; }
#menus .menu_details .menu_category .menu_item .description { width: 50%; }
#menus .menu_details .menu_category .menu_item .price { width: 10%; }
#menus .menu_details .menu_category .menu_item .controls { width: 20%; }

/* ORDER DATE */
#order_date_selector { background-color: var(--highlight_background_color); padding: 20px; margin: 10px 0px; display: flex; justify-content:space-between; align-items: center; }
#order_date_selector .order_type { background-color: var(--button_color); color: var(--button_text_color); padding: 6px 10px; margin: 0; border: 1px solid var(--button_color); border-radius: 5px; font-weight:bold; font-size: 14px; }
#order_date_selector .order_type:hover { background-color: var(--button_hover_color); color: var(--button_hover_text_color); }
#order_date_selector .order_type i { vertical-align: middle; font-size: 22px; }
#order_date_selector span { font-size: 22px; font-weight: bold; }

/* BUILDER STEP */
#builder_wrapper { padding:0; margin: 0; }
#builder_wrapper h2 { font-size:36px; font-weight: 300; margin: 0 0 20px 0; padding: 0; }
/* .store_builder_wrapper { background-color: var(--highlight_background_color); padding: 20px 60px; margin-top: 20px; border-radius: 5px; } */
.store_builder_wrapper.hidden { display: none; }
.store_builder_steps { display: flex; flex-wrap: wrap; }
.store_builder_step { display: flex; flex-direction: column; flex: 0 0 21.5%; padding: 15px; border: 1px solid var(--button_color); border-radius: 5px; margin: 5px; z-index:999!important; }
/* .store_builder_step.selected { background-color: var(--secondary_color); } */
.store_builder_step.selected { background-color: rgba(0,0,0,0.1); }
.store_builder_step.no-stock { background-color: var(--disabled_color); color: var(--disabled_text_color) }
.store_builder_step h3 { margin: 0; padding: 0; }
.store_builder_step p { margin: 5px 0; }
.store_builder_step p.description { padding-bottom: 10px; margin-bottom: auto; }
.store_builder_step a { display: block; cursor: pointer; background-color: var(--button_color); text-align: center; color: var(--button_text_color); padding: 6px 0; border: 1px solid var(--button_color); border-radius: 5px; }
.store_builder_step a.disabled,.store_builder_step a.disabled:hover { background-color: var(--disabled_button_color); color: var(--disabled_button_text_color); border-color: var(--disabled_button_text_color); }
.store_builder_step a:hover { background-color: var(--button_hover_color); color: var(--button_hover_text_color); }
.store_builder_choice { display: flex; position: relative; justify-content: space-between; background-color: var(--highlight_background_color); padding: 20px 60px; margin-top: 20px; border-radius: 5px;}
.store_builder_choice h3 { margin: 0 0 10px 0; padding: 0; }
#builder_totals_cart { display: flex; flex-direction: column; background-color: var(--highlight_background_color); padding: 20px; border-radius: 5px; }
#builder_totals_cart h3 { text-align: center; }
#builder_add_to_cart { display: flex; justify-content: center; margin-top: 20px; }
#builder_add_to_cart .add_to_cart_block { text-align: center; }
#builder_add_to_cart .add_to_cart_block input.add_built_item_to_cart { width: 100%; }
#builder_total_container { display: flex; justify-content: center; align-items:center; }
#builder_total { font-size: 36px; margin-left: 6px; }
#builder_choices_section h2 { font-size: 28px; }
#builder_choices_section p { margin-bottom: 6px; }
#builder_choices_section p:last-of-type { margin-bottom: 0; }
.store_builder_step .meal_image { position: relative; background-position: center center; background-size: cover; min-height: 178px; border-radius: 5px; border: 1px solid var(--button_color); }
.store_builder_step.no-stock .meal_image { filter: grayscale(100%); opacity: .5; }
#store_builder_container { background-color: var(--highlight_background_color); padding: 2rem; margin-top: 20px; border-radius: 5px; }
#store_builder_container,#store_builder_container_bottom { position: relative; }
#builder_next_step, #builder_next_step_bottom { position: relative; display: flex; justify-content: space-between; align-items: center; z-index: 999; }
#builder_next_step { margin-bottom: 1rem; }
#builder_next_step .button, #builder_next_step_bottom .button { cursor: pointer; background-color: var(--button_color); text-align: center; padding: 0 10px; border-radius: 5px; height: 100%; }
#builder_next_step .button i,#builder_next_step_bottom .button i { font-size: 36px; color: var(--button_text_color); padding: 0; margin: 0; }
#builder_next_step .button:hover, #builder_next_step_bottom .button:hover { background-color: var(--button_hover_color); color: var(--button_hover_text_color); }
#builder_next_step .button.disabled { background-color: #666; cursor: not-allowed!important; }
#builder_next_step .button.disabled i { color: #999; cursor: not-allowed!important; }
#builder_next_step #prev_step_link, #builder_next_step_bottom #prev_step_link_bottom { display: flex; align-items: center; }
#builder_next_step #next_step_link, #builder_next_step_bottom #next_step_link_bottom { display: flex; align-items: center; }
#build_another { text-align: center; }
#build_another a { display: inline-block; padding: 10px 10px 0 10px; text-decoration: none; color:var(--button_color); }
.step_quantity_controls { display: flex; justify-content: space-between; }
.step_quantity_controls .step_quan { cursor: pointer; background-color: var(--button_color); text-align: center; color: var(--button_text_color); font-size: 18px; font-weight: 700; padding: 6px 20px; border: 1px solid var(--button_color); border-radius: 5px; }
.step_quantity_controls .step_value { border: 1px solid var(--button_color); border-radius: 5px; text-align: center; }
#steps_indicator { display: flex; justify-content: center; gap: 1.5rem; }
.steps_marker { background-color: rgba(0,0,0,.25); border-radius: 20px; width: 16px; height: 16px; }
.steps_marker.active { background-color: rgba(0,0,0,.5); }

/* DATE FORM */
#date_type_form_container { padding: 20px 30px; }
#date_type_form_container h1,#date_type_form_container h2 { margin: 0; }
#date_type_items { display: flex; justify-content: center; margin: 40px 0; }
.date_type_item { background-color: var(--highlight_background_color); padding: 20px; border-radius: 5px; width:40%; margin: 0 10px; }
#date_type_buttons { display: flex; justify-content: space-evenly; }
#date_type_buttons .button { width: 36%; -webkit-appearance: none; }
#date_type_form_container .button { padding: 10px 20px; background-color: var(--button_color); color:var(--button_text_color); border: 1px solid var(--button_color); border-radius: 5px; }
#date_type_form_container .button:hover { background-color: var(--button_hover_color); color:var(--button_hover_text_color); }
#date_type_form_container .button:disabled { border:1px solid var(--disabled_button_color); background-color: var(--disabled_button_color); color:var(--disabled_button_text_color); cursor:not-allowed; }
#default_date_type.button { background-color: var(--alt_button_color); border: 1px solid var(--alt_button_color); }
#default_date_type.button:hover { background-color: var(--alt_button_hover_color); color:var(--alt_button_hover_text_color) }

#order_type_select_container { display: flex; justify-content: space-evenly; margin-top: 20px; }
.order_type_select_item label { font-size: 16px; display: inline-block; background-color: var(--disabled_button_color); padding: 10px 20px; border: 1px solid; border-radius: 5px; }
.order_type_select_item input[type="radio"] { opacity: 0; position: fixed; width: 0; }
.order_type_select_item input[type="radio"]:checked + label { background-color:var(--button_color); border-color: var(--button_color); color: var(--button_text_color); }
#order_date_select_container { margin-top: 20px; }
.order_date_select_item select { padding: 10px 20px; font-size: 16px; border-radius: 5px; border-color:var(--button_color); }
#order_date_select_container .order_date_select_item { text-align: center; }