/*@import 'init';*/
@yellow:yellow;
@red:red;
@nav-height: 134px;
@desktop: ~'only screen and (max-width:1399px)';
@tablet: ~'only screen and (max-width:991px)';
@mobile: ~'only screen and (max-width:575px)';

/*white: #9899FF;*/
@grey:#d7d7d7;

@green: #34a46c;
@red: #c22026;


.error, .success {
    padding: 16px 0;
    .text {
        font-size: 20px;
        padding: 8px 16px 8px 70px;
        position: relative;
        color: white;
        border-radius: 32px;
        // &::before {
        //     position: absolute;
        //     font-family:'Font Awesome 5 Free';
        //     font-weight: 700;
        //     font-size: 28px;
        //     left: 20px;
        //     top: 0;
        // }
    }
}
.error {
    .text {
        background-color: #eb2f2faa;
        &::before {
            content: '\f057';
        }
    }
}
.success {
    .text {
        background-color: #3c872eaa;
        &::before {
            content: '\f058';
        }
    }
}
/* VALIDATIONS */
.validation-error {
  color:red;
  font-size:16px;
  line-height:1;
}


html {
  scroll-behavior: smooth;
}
body {
  font-family: dincond-regularregular;
  font-weight:400;
  color: black;
  // padding-top: @nav-height;
}
@media only screen and (max-width: 991px) {
    @nav-height: 154px;
    body {
        // padding-top: @nav-height;
    }
}
@media only screen and (max-width: 767px) {
    @nav-height: 58px;
    body {
        // padding-top: @nav-height;
    }
}
.alert {
    font-size: 0.8em;
}
img {
    max-width: 100%;
}
a:hover {
    text-decoration: none;
}
div.dark {
/*  background-image:url('/images/layout/black-texture.jpg');*/
/*  color:white;*/
}
section {
  padding-top:1.75rem;
  padding-bottom:1.75rem;
}
#menu {
    min-height: ~'calc(100vh - 406px)';
}
.btn {
  color:white;
  background-color:black;
  border:1px solid black;
  &:hover {
    color:black;
    background-color:white;
  }
}
#menu-links {
  .btn-category {
    margin-bottom:1.75rem;
    // font-size: 1.2em;
    border: 2px solid white;
    color:white;
    padding-top:.5rem;
    padding-bottom:.5rem;
    span {
      color:white;
    }
    &:hover {
      color:white;
    }
  }
}
.btn-category {
    width: 100%;
    margin-bottom: 10px;
    font-size: 20px;
    font-weight:400;
    text-transform:uppercase;
    background-color: #4B3929;
    color:white;
    border: 2px solid #4B3929;
}
#menu-container {
  border:2px solid #4B3929;
  border-radius:.25rem; 
  padding-top: 1rem;
}
div.cart-container-div {
  border:2px solid #4B3929;
  border-radius:.25rem; 
  background-color: #4B3929;
  color: white;
}
#menu-container {
  background-image:url('/images/layout/black-texture.jpg');
/*  color:black;*/
}
.btn-outline-secondary {
    width: auto;
}
.btn.submit-item-form {
    height: 100%;
    background-color: #4B3929;
    color: #efdaba;
    border: 2px solid #4B3929;
    font-family: dincond-regularregular; 
    font-size: 20px;
    float: right;
}
.input-group {
  height: 100%;
}
div.inner-container div.input-group input[type="number"] {
  height: 100%;
}
div.inner-container {
  padding-bottom:0.5rem;
  border-bottom:2px dashed #4B3929;
    .body {
      height:0;
      overflow:hidden;
      &.active {
        height:auto;
      }
      .btn {
/*        color: @yellow !important;*/
/*        background-color: @red !important;*/
      }
    }
    h3 {
      i {
        color: #4B3929;
      }
    }
    .title {
      position:relative;
      i {
        position:absolute;
        right:0;
        top:50%;
        transform:translateY(-50%);
      }
    }
}
.description {
/*    font-family: 'Cormorant Garamond', serif;*/
    font-size:18px;
    padding-right:32px;
    text-transform:initial;
}
input, select {
    font-family: 'Open Sans', sans-serif;
    max-width:100%;
}
select {
  margin-bottom:1rem;
}
// .category-title { 
//   border-bottom: none;
// }
.category-title, .item-title {
    text-transform: uppercase;
    font-weight: 400;
    text-decoration: none;
}
div.inner-container h3 span.item-title {
  color: #4B3929;
}
.category-title {
  font-size:46px;
  font-weight: 700 !important;
  a {
      font-family: dincond-regularregular;
      position: relative;
      display: inline-block;
      &::after {
          content: '';
          position: absolute;
          bottom: 0;
          left: 0;
          right: 0;
          height: 3px;
          // background-color: @red;
      }
  }
}
hr {
  border-top:4px solid white;
  margin-bottom:0;
}
.item-title, .item-price {
  font-size:24px;
}
.item-title {
    font-weight: 700;
}
.item-price {
/*    color: @red;*/
}
div.category-border p {
  font-size: 20px;
}
div.category-border h2.category-title a {
    scroll-margin-top: ~'calc(@{nav-height} + 15px)';
}
div#menu-container .menu-item {
    .title {
/*        padding-top: 13px;*/
        .fa-plus-circle, .fa-minus-circle {
          font-size:40px;
        }
        h3:hover {
            a, .fa-plus-circle, .fa-minus-circle {
                color: @red;
                text-decoration:none;
            }
        }
    }
    .input-group button {
        background-color: #4B3929;
        color: #efdaba;
    }
    .regular-input select {
        border-color: @green;
    }   
}
div.cart-container-div {
/*    color: @red;*/
    padding-top: 15px;
    top: ~'calc(@{nav-height} + 15px)';
    
    /*max-height: ~'calc(100vh - 200px)';
    overflow-y: scroll;
    overflow-x: hidden;*/
    
    input, select {
        border-color: white;
        padding: 4px 8px;
    }
    select {
      padding-top:8px;
      padding-bottom:8px;
    }
    label {
        text-transform: inherit;
        font-size: 1em;
    }
    table#table-cart.table-sm {
        thead th#num-items {
            font-size: 18px;
            // font-family:'Anton', sans-serif;
            font-weight:400;
            color: white;
        }
        tbody tr {
            &.total-row td {
                color: white;
            }
            td,
            td.price,
            td.item-name {
                color: white;
            }
        }
    }
    #checkout-button {
        background: #efdaba;
        border-color: #efdaba;
        color: black;
        font-size: 20px;
        &:hover {
            color: #efdaba;
            background: #4B3929;
        }
    }
}
.category-selector {
    top: ~'calc(@{nav-height} + 15px)';
}
#ajax-cart {
    text-transform: uppercase;
    color: white;
    font-size: 20px;
    label {
      width: 100%;
    }
    #select-type {
      width: 100%;
    }
    .timepicker {
      width: 100%;
    }
}
#ajax-cart select, #ajax-cart input {
  font-family: dincond-regularregular;
}
.top-line-hours {
    border-top: 2px dotted white;
    margin: 0 15px;
}
.hour {
  float: right;
}
.hours-list {
  list-style: none;
  font-size: 20px;
  padding: .5rem;
}
h4 {
  font-size:1.3rem;
}
#go-cart {
    display: none;
    position: sticky;
    z-index: 10;
    top: 125px;
    width: 100px;
/*    left: ~'calc(100vw - 100px)';*/
/*    background-color: @red;*/
/*    color: @yellow;*/
    font-size:30px;
    text-align: center;
    border-radius: 32px;
    margin-right: -15px;
    margin-left: auto;
    margin-bottom: 25px;
    background-color:white;
    padding-bottom:5px;
}
#ajax-cart {
    scroll-margin-top: 180px;
}
#powered {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
    color: white;
    img {
        width: 100px;
        height: auto;
    }
}
#cart .order-summary {
    a.btn-danger {
        margin-right: .5rem;
    }
}
/* checkout */
.small-text {
/*    font-size: 0.9em;*/
    font-weight: lighter;
}

@media @desktop {
    .btn-category {
        font-size:1.2em;
    }
}
@media @tablet {
    #menu-container {
        .image {
            height: 500px;
            img {
                height: 100%;
            }
        }
    }
    section {
        padding-top: 32px;
    }
    #go-cart {
        display: block;
    }
    div.category-border h2.category-title a {
        scroll-margin-top: 110px;
    }
}
@media @mobile {
    #menu-container .image {
        height: 300px;
    }
    .btn.submit-item-form {
        width: 100%;
        line-height: 1;
    }
    #go-cart {
        top: 100px;
        font-size: 1.3em;
        margin-right: 0;
        margin-bottom: 15px;
        width: 70px;        
    }
    #ajax-cart, 
    div.category-border h2.category-title a {
        scroll-margin-top: 120px;
    }
    #cart .order-summary {
        a.btn-danger {
/*            margin-bottom: .5rem;*/
        }
    }
    .category-title {
      font-size:22px;
    }
    .item-title, .item-price {
      font-size:18px;
    }
    div#menu-container .menu-item .title .fa-plus-circle, 
    div#menu-container .menu-item .title .fa-minus-circle {
      font-size: 30px;
    }
    div.cart-container-div {
      margin:1rem -10px 0;
    }
}
h1 {
  font-size:40px;
}
h2 {
  font-size:27px;
}
h3 {
  font-size:22px;
}
@media only screen and (max-width:575px) {
  h1 {
    font-size:26px;
    font-weight:700;
  }
  h2 {
    font-size:22px;
    font-weight:700;
  }
  h3 {
    font-size:18px;
  }
  
}