/**
  * Plugin Name:  Simply Supper
  * Plugin URI:   http://simplysupper.ca/
  * Description: Styles for the Simply Supper plugin
  * Author:      James Murgatroyd Communicaitons
  * Author URI:  http://jamesmurgatroyd.com
  * Version:     1.0.0
**/
/**
 * Generic utility styles etc.
**/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
--------------------------------------------------------------*/
@font-face {
  font-family: 'Simply Supper';
  src:  url('../fonts/simply-supper.eot?a381s0');
  src:  url('../fonts/simply-supper.eot?a381s0#iefix') format('embedded-opentype'),
    url('../fonts/simply-supper.ttf?a381s0') format('truetype'),
    url('../fonts/simply-supper.woff?a381s0') format('woff'),
    url('../fonts/simply-supper.svg?a381s0#simply-supper') format('svg');
  font-weight: normal;
  font-style: normal;
}

#ss-calendar{ display: none; }

body {
  font-family: 'Open Sans', sans-serif;
  color: #494949;
}
h1{
  color: #a51e22 ;
  font-family: 'Open Sans', sans-serif;
  font-size: 2em;
  font-weight: 400;
}
h2{
  font-size: 32px;
  line-height: 22px;
  font-weight: 400;
  line-height: 1.2em
}
h3{
  font-size: 18px;
  line-height: 22px;
  font-weight: 400;
}
h4{
  font-size: 18px;
  line-height: 22px;
  font-weight: 400;
}
p{
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}
p.big-text{
  font-size: 20px;
  line-height: 28px;
  font-weight: 400;
}
p b,
p strong {
  font-size: 16px;
  line-height: 24px;
  font-weight: 800;
  color: #494949;
}
p a{
  color: #a51e22;
}

p.ss-form-into{
  max-width: 35em;
  margin-bottom: 20px;
}

label{
  line-height: 1.5em;
}
.red{
  color: #a51e22;
}
.green{
  color: #28ac9e;
}
    
.ss-tab {
  display: none;
}
.ss-order-wrapper {
/*   border: 1px solid #eaeced; */
  border-radius: 5px;
  box-sizing: border-box;
  overflow: hidden;
  box-shadow: #141111;
/*   padding: 30px; */
  margin: 0;
  position: relative;

}

.ss-order-form ,
.ss-login-wrapper {
  display: flex;
}
.ss-login{
  width: 100%;
}
.lost-pw{
  margin-top: 20px;
}
fieldset {
  border: none;
  flex: 1 1 auto;
  width: 100%;
}
#ss-order-form h4{
  font-size: 1em;
  font-weight: 800;
}


.ss-order-wrapper input, 
.ss-order-wrapper input[type="text"], 
.ss-order-wrapper input[type="password"], 
.ss-order-wrapper input[type="file"], 
.ss-order-wrapper input[type="datetime"], 
.ss-order-wrapper input[type="datetime-local"], 
.ss-order-wrapper input[type="date"], 
.ss-order-wrapper input[type="month"], 
.ss-order-wrapper input[type="time"], 
.ss-order-wrapper input[type="week"], 
.ss-order-wrapper input[type="number"], 
.ss-order-wrapper input[type="email"], 
.ss-order-wrapper input[type="url"], 
.ss-order-wrapper input[type="search"], 
.ss-order-wrapper input[type="tel"], 
.ss-order-wrapper input[type="color"], 
.ss-order-wrapper .faux-file {
  display: inline-block;
  padding: 0 8px;
  vertical-align: middle;
  background: #fff;
  min-width: 50px;
/*   max-width: 635px; */
  width: 100%;
  min-height: 36px;
  width: 100%;
  height: 3em;
  border-radius: 0;
  transition: all 0.2s ease-in-out 0s;
  outline: none !important;
  border: 1px solid #a51e22 !important;
  padding: 0 0 0 1em;
  margin:  0 0 1em 0;
  color: #a51e22 !important;
}
input.btn-primary,
input[type="submit"] {
  background: #a51e22 !important;
  color: #fff !important;
}

input.btn-primary:hover,
input[type="submit"]:hover {
  background: #28ac9e !important;
  color: #fff !important;
}
.ss-order-wrapper textarea {
  width: 100%;
  height: 10em;
}
/* Reset Select */
.ss-order-wrapper select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  outline: none;
  box-shadow: none;
  border: 1 solid #a51e22 !important;
  background: #fff;
  background-image: none;
}
/* Custom Select */
.ss-order-wrapper .ss-select {
  position: relative;
  display: block;
  width: 100%;
  border: 0px solid #a51e22 !important;
  height: 3em;
  line-height: 3;
  background: #fff;
  overflow: hidden;
  border-radius: 0;
  margin-bottom: 20px;
}
.ss-order-wrapper select {
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: 0;
  outline: none !important;
  border: 1px solid #a51e22 !important;
  padding: 0 0 0 1em;
  color: #a51e22;
  cursor: pointer;
}
.ss-order-wrapper select::-ms-expand {
  display: none;
}
/* Arrow */
.ss-order-wrapper .ss-select::after {
  content: '\25BC';
   border: 1px solid #a51e22 !important;
   border-left: none !important;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 0 1em;
  background: #fff;
  pointer-events: none;
  color: #a51e22;
}
/* Transition */
.ss-order-wrapper .ss-select:hover::after {
  color: white;
  background: #a51e22;
}
.ss-order-wrapper .ss-select::after {
  -webkit-transition: .25s all ease;
  -o-transition: .25s all ease;
  transition: .25s all ease;
}

#ss-menu-container,
#ss-addon-container,
.addon-section{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  width: 100%;
}

.ss-menu-item {
  display: block;
  padding: 10px 0px;
  margin: 10px 20px 10px 0px;
  width: 100%;
  border-bottom: 1px solid #eaeced;
}
.ss-menu-item-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.ss-menu-item-header{
/*   flex: 1 1 auto; */
  flex: 1;
  margin-bottom: 10px;
  margin-right: 10px;
}
.ss-menu-item-title h4 {
  font-size: 1em;
  font-weight: 800;
  margin-bottom: 0;
}

.ss-menu-item-title h6 { margin: 6px 0 0px 0;}

.ss-tag-list{
  margin: 0;
  padding: 0;
  margin-top: 2px;
  list-style: none;
}
.ss-tag-list li{
  display: inline-block;
  margin: 0;
  padding: 0;
  font-size: 1.5em;
}
.ss-item-types{
  margin: 0;
  padding: 0
}
.ss-item-types .ss-seperator:last-child{
  display: none;
}

.ss-menu-item-title .ss-select{
  width: 90px;
}
#ss-summary-pay-row,
#ss-summary-coupon-row,
#ss-summary-delivery-price {
  display: none;
}
 
#ss-summary-total-row td {
  background-color: #28ac9e !important;
  color: white !important;
}
#ss-steps {
  display: none;
  margin: 40px 0;
}
.ss-coupon-msg,
#ss-login-msg,
#ss-user-msg {
  padding: 10px;
  font-weight: 400;
  margin: 10px 0;
}
.ss-success{
   background-color: #28ac9e;
   color: white;
}
.ss-err{
  background-color:  #a51e22;
  color: white;
}
#signup,
.ss-login{
  padding: 10px;
}
.ss-step {
  display: inline-block;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  border: 3px solid #28ac9e;
  color: #28ac9e;
  text-align: center;
  line-height: 40px;
  font-weight: bold;
  background: #fff;
  position: relative;
}

.ss-step:nth-child(n+2) {
  margin: 0 0 0 100px;
  transform: translate(0, -4px);
}

.ss-step:nth-child(n+2):before {
  width: 75px;
  height: 3px;
  display: block;
  background-color: #28ac9e;
  transform: translate(-95px, 21px);
  content: '';
}

.ss-step:after {
  width: 150px;
  display: block;
  transform: translate(-55px, 3px);
  color: #000;
  content: attr(data-desc);
  font-weight: 400;
  font-size: 13px;
}

.ss-step:first-child:after {
  transform: translate(-55px, -1px);
}

.ss-step.active {
  border-color: #28ac9e;
  color: #fff;
  background-color: #28ac9e !important;
}

.ss-step.active:before {
  background: linear-gradient(to right, #58bb58 0%, #73b5e8 100%);
}

.ss-step.active:after {
  color: #73b5e8;
}

.ss-step.disabled {
  border-color: #e6e6e6;
  color: #fff;
  background-color: #e6e6e6 !important;
}

.ss-step.disabled:before {
  background: #e6e6e6;
}

.ss-step.disabled:after {
  color: #e6e6e6;
}

.ss-step.done {
  background-color: #58bb58;
  border-color: #58bb58;
  color: white;
}

.ss-step.done:before {
  background-color: #58bb58;
}

/* Show steps on desktop */
@media (min-width: 1025px) {
  #ss-steps {
    display: block;
  }
}

.ss-form-step-footer{
/*   display: flex; */
  text-align: center;
}
.ss-form-btn {
  font-size: 1.2em;
  line-height: 1em;
  font-weight: normal;
  color: #fff;
  border-radius: 0px;
  border: solid 1px #a51e22;
  background: #a51e22;
  padding: 15px 40px;
  transition: .25s all ease;
  margin: 10px 10px 10px 0px;
}
.ss-form-btn:hover{
  background: #28ac9e;
}
.ss-form-btn-prev{
  background: none;
  color: #a51e22;
}

.ss-form-btn:disabled {
  background: #dddddd !important;
}

.ss-coupon-wrapper{
  width: 100%;
}
.ss-coupon {
  display: flex;
  flex-direction: row;
}
.ss-coupon .form-group {
  flex: 1 1 auto;
}
#ss-apply-coupon-code{
  margin: 0px;
  vertical-align: middle;
  font-size: 1em;
  background: #a51e22;
  min-width: 50px;
  max-width: 635px;
  width: 100%;
  min-height: 36px;
  width: 100%;
  height: 3em;
  border-radius: 0;
  transition: all 0.2s ease-in-out 0s;
  outline: none !important;
  border: 1px solid #a51e22 !important;
  padding: 0 0 0 1em;
  color: #fff !important;
}

.emla-checkbox {
  position: relative;
  width: 100%;
  height: 100%;
  margin-top: 1em;
  margin-bottom: 1em;
}

.emla-checkbox input[type=checkbox] {
  position: absolute;
  visibility: hidden;
}

.emla-checkbox input[type=checkbox]+label{
  margin-left: 30px !important;
  transition: all 0.3s;
  color: #494949;
  font-weight: 400;
}
.emla-checkbox input[type=checkbox]:checked+label{
  font-weight: 700;
}
.emla-checkbox input[type=checkbox]+label:before {
    content: " ";
    display: inline-block;
    height: 22px;
    width: 22px;
    border: 2px solid #a51e22;
    position: absolute;
    left: 0;
    top: 0;
    transition: all 0.3s;
}

.emla-checkbox input[type=checkbox]:checked+label:after {
    content: " ";
    display: block;
    height: 14px;
    width: 14px;
    background-color: #a51e22;
    position: absolute;
    left: 4px;
    top: 4px;
    transition: all 0.3s;
}

.emla-checkbox input[type=checkbox]:checked+label:before {
  border-color: #a51e22;
}


.tab-group {
  list-style: none;
  padding: 0;
  margin: 0 0 40px 0;
}
.tab-group:after {
  content: "";
  display: table;
  clear: both;
}
.tab-group li a {
  display: block;
  text-decoration: none;
  padding: 15px;
  background: rgba(160, 179, 176, 0.25);
  color: #a0b3b0;
  font-size: 20px;
  float: left;
  width: 50%;
  text-align: center;
  cursor: pointer;
  -webkit-transition: 0.5s ease;
  transition: 0.5s ease;
}
.tab-group li a:hover {
  background: #179b77;
  color: #ffffff;
}

.tab-group .active a {
  background: #28ac9e;
  color: #ffffff;
}

.tab-content > div:last-child {
  display: none;
}


#ss-package-wrap{
  display: flex;
}

#ss-package-wrap #ss-select-wrap{
  flex: 10 1 auto
}
#ss-package-wrap #ss-package-counter{
 flex: 1 1 auto;
 margin-left: 20px;
 width: 125px; 
}

#ss-package-wrap #ss-package-counter #ss-total-meal-selected {
  display: block;
  border: solid 1px #a51e22;
  padding: 10px;
  
}
.addon-section{
  width: 100%;
  padding-bottom: 20px;
  margin-bottom: 20px;
/*   border-bottom: 1px solid #494949; */
}
.addon-title{
  width: 100%;
 
}
.addon-title h3{
  color: #a51e22;
  font-weight: 800;
  font-size: 1.4em;
}

#ss-summary-time{ 
  color: #a51e22;
  font-weight: 700;
  font-size:1.1em;
}

.ss-addon-list {
  list-style: none;
  padding: 0px;
  margin: 0px;
}
.ss-addon-list li{
  color: white;
  margin: 10px 0;
}
 
.uael-gf-style .uael-gf-select-custom:after,
.uael-gf-select-custom select:after{ 
 display: none !important
}

#ss-order-summary-table{
  margin: 20px 0;
}
#diet{
  margin-top: 20px;
}
#order-notes{
  margin-bottom: 20px;}

/* Order Form Styles */
.ss-order-wrapper {
    width: 100%;
    margin: 0 auto;
    padding: 20px;
}

.ss-form-step {
    display: none;
    padding: 20px;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.ss-form-step.active {
    display: block;
}

.ss-form-row {
    margin-bottom: 20px;
}

.ss-form-row h3 {
    margin-bottom: 15px;
    color: #333;
}

/* Progress Steps */
/* smartphones, iPhone, portrait 480x320 phones */
@media (min-width:320px) {
  #ss-steps{
    display: none;
  } 
  
}

/* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
@media (min-width:481px) {  }

/* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
@media (min-width:641px) { 
  #ss-order-summary-header{
    flex-direction: row;
  } 
  .ss-order-summary-info{
    width: 70%;
  }

  #ss-credit-widget{ 
    width: 30%;
    }
}

/* tablet, landscape iPad, lo-res laptops ands desktops */
@media (min-width:961px) { 

  .ss-coupon-wrapper{
    width: 50%;
  }

}

/* big landscape tablets, laptops, and desktops */
@media (min-width:1025px) { 
  h1{
   font-size: 3.5em;
  }
  .ss-menu-item {
    width: calc(50% - 20px);;
  }
  #ss-package-wrap #ss-package-counter{
   width: 200px; 
  }
  .session-select,
  .session-select:after,
  #ss-session-select {
    display: none !important;
    
  }


}

/* hi-res laptops and desktops */
@media (min-width:1281px) {  }

/* Calendar Styles */
#calendar-container {
    background: #fff;
    padding: 20px;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

#calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

#calendar-header button {
    background: #e41f3b;
    color: white;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.3s ease;
}

#calendar-header button:hover {
    background: #c41832;
}

#monthAndYear {
    font-size: 1.2em;
    margin: 0;
}

#calendar {
    width: 100%;
    border-collapse: collapse;
}

#calendar th {
    background: #f5f5f5;
    padding: 10px;
    text-align: center;
    font-weight: bold;
}

#calendar td {
    padding: 10px;
    text-align: center;
    border: 1px solid #eee;
    cursor: pointer;
    transition: background 0.3s ease;
}

#calendar td:hover:not(.empty) {
    background: #f9f9f9;
}

#calendar td.selected {
    background: #e41f3b;
    color: white;
}

#calendar td.today {
    background: #f5f5f5;
    font-weight: bold;
}

#calendar td.empty {
    background: #f9f9f9;
    cursor: default;
}

/* Party Code */
#ss-party-code-wrap {
    margin-top: 20px;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 4px;
}

#ss-party-code {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-top: 10px;
}

#ss-calendar {
  margin: 0;
  padding: 0;
  border: 1px solid #e9e9e9;
  width: 100%;
  display: none;
}

table {
  border-collapse: collapse;
  width: 100%;
}
/*
.button-style {
  font-family: "Inconsolata", monospace;
  background-color: #e0f7fa;
  border-radius: 4px;
  color: black;
  border: 1px solid #e0f7fa;
  padding: 10px 24px;
  text-align: center;
  font-size: 16px;
}


.button-style:hover {
  background-color: #26c6da;
  color: white;
}

#previous {
  float: left;
  padding-top: 10px;
}

#next {
  float: right;
  padding-top: 10px;
}
*/

.resultMonthAndYear {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  line-height: 40px;
  background-color: #28ac9e;
}

th {
  border: 1px solid #e9e9e9;
  background-color: #fff;
  color: #494949;
}

td {
  border: 1px solid #e9e9e9;
  text-align: center;
  padding: 24px;
  width: 25px;
  background-color: #fff !important;
}
.pastDay {
  background-color: #fff !important;
}
.currentDay {
  background-color: #cccccc !important;
  color: #494949 ;
}
.availableDay{
  background-color:  #fff !important;
}

.ss-order-card {
  padding: 20px;
  margin: 5px 0;
  background: white;
}

.cal-block {
  background-color:  #28ac9e;
  border: 1px solid  #28ac9e;
  border-radius: 5px;
  color: #fff;
  padding: 5px;
  margin: 0px;
  margin-bottom: 2px;
  cursor: pointer;
}

.cal-block:hover {
  background-color: #067462;
}

.cal-block.selected {
  background-color: #931b2e;
}
.ss-cal-info{
  font-size: 1.2em;
  display: inline-block;
 
}
.ss-icon {
  font-family: "Simply Supper", Sans-serif !important;
  display: inline-block;
  font-size: 1.2em;
  padding: 0;
  margin: 0;
  margin-right: 6px;
}

[class*="ss-icon icon-"] {
     font-family: "Simply Supper", Sans-serif !important;
  display: inline-block;
  font-size: 1.2em;
  padding: 0;
  margin: 0;
  margin-right: 6px;
}

.icon-DairyFree:before {
  content: "\e900";
  color: #25a99c;
}
.icon-DairyFreeOption:before {
  content: "\e901";
  color: #25a99c;
}
.icon-EggFree:before {
  content: "\e902";
  color: #25a99c;
}
.icon-EggFreeOption:before {
  content: "\e903";
  color: #25a99c;
}

.icon-Veg:before {
  content: "\e911";
  color: #25a99c;
}
.icon-VegOption:before {
  content: "\e912";
  color: #25a99c;
}


.icon-GlutenFree:before {
  content: "\e904";
  color: #25a99c;
}
.icon-GlutenFreeOption:before {
  content: "\e905";
  color: #25a99c;
}
.icon-Delivery:before {
  content: "\e906";
  color: #4a494a;
}
.cal-block .ss-icon-DeliveryTruck,
.icon-DeliveryTruck:before {
  content: "\e907";
  color: #25a99c;
}
.icon-Fresh2Go:before {
  content: "\e908";
  color: #4a494a;
}
.icon-LowCarb:before {
  content: "\e909";
  color: #25a99c;
}
.icon-pickup:before {
  content: "\e90a";
  color: #25a99c;
}
.icon-Ready2Go:before {
  content: "\e90b";
  color: #4a494a;
}
.icon-SimplySolo:before {
  content: "\e90c";
  color: #4a494a;
}
.icon-Solo:before {
  content: "\e90e";
  color: #25a99c;
}
.icon-Solo2:before {
  content: "\e90e";
}
.icon-WeMake:before {
  content: "\e90f";
  color: #4a494a;
}
.icon-YouMake:before {
  content: "\e910";
  color: #4a494a;
}

.ss-active-icon{
  
}
.ss-active-icon{
/*   background: #e5e5e5; */
}
.ss-active-icon h2,
.ss-active-icon h3 {
  color: #a51e22 !important;
}
.hide * {
  display: none !important;
 
}

.cal-block{
  text-align: center;
}
.cal-block .ss-icon-DeliveryTruck:before {
  content: "\e907";
  color: #fff;
  font-size: 2.5em;
}

.cal-block .ss-icon-pickup:before {
  content: "\e90a";
  color: #fff;
  font-size: 2.5em;
}

.cal-block .ss-icon-Solo2:before {
  content: "\e90e";
  color: #fff;
  font-size: 2.5em;
}

.txt-right{
  text-align: right;
}

table {
  margin-bottom: 0px; 
}

body.order-type-PickupSpecial #ss-credit-widget,
body.order-type-PickupSpecial .ss-coupon-wrapper{
 display:  none !important;  
}
