/**
 * All of the CSS for your admin-specific functionality should be
 * included in this file.
 */


 .amiconcontainer {
    display:flex;
    justify-content:flex-start;
    align-items: center;
    width:100%;
    flex-direction: row;
    left: -5px;
    position: relative;

 }
 .amiconbox {
    display:flex;
    justify-content:space-evenly;
    align-items: center;
    width:70px;
    height:100px;
    margin:0px;
    flex-direction: column;
    margin-right:10px;
    cursor: pointer;
 }


.amhandoffbutton {
    display:flex;
    max-width:300px;
    border: 1px solid black;
    margin:4px;
    border-radius:25px;
    padding:4px;
    cursor: pointer;
    height: 50px;
    min-width: 150px;
    justify-content: center;
    align-items: center;
  }
  
  .amuserhandoffslistrow{
   /* cursor: pointer; */
   width: 100%;
   display: flex;
   flex-direction: row;
   justify-content: left;
   align-items: center;
  }
  
  .amhandoffblock {
  display:flex;
  max-width:300px;
  margin:4px;
  padding:4px;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  height: 50px;
  justify-content: center;
  align-items: center;
  min-width: 150px;
  text-overflow: ellipsis;
  word-wrap: break-word;
  word-break: break-word;
  width:200px;
  line-height:15px;
  }
  
  
  .amgreen{
  
    background-color: rgb(13, 91, 72);
    color:#fff;
  }
  
  #amuserhandoffsdatablock {
    width: 100%;
    overflow-y: scroll;
    height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 30px;
    background-color: #eee;
  
  }
  
  .chat-bubble {
    max-width: 80%;
    margin-left: auto;
  /* background-color: #f1f1f1;*/
    background-color: #e1e1e1;
    border-radius: 20px;
    padding: 10px;
    margin-bottom: 10px;
    word-break: break-word;
    min-width: 5%;
    width: fit-content;
    line-height: 1.1;
    font-size: 16px;
    font-size: 14px;
    white-space: pre-line;
    text-transform: unset!important;
    -moz-transition: all 0.7s ease;
    -webkit-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
    opacity:0;
    box-sizing: content-box!important;
  }
  
  .amshowbubble {
    opacity:1!important;
  }
  
  .chat-bubble-response {
    max-width: 80%;
   /* margin-left: auto;*/
    background-color: #bbb;
    border-radius: 20px;
    padding: 10px;
    margin-bottom: 10px;
    word-break: break-word;
    min-width: 5%;
    width: fit-content;
    line-height: 1.1;
    font-size: 16px;
    font-size: 14px;
    white-space: pre-line;
    text-transform: unset!important;
    -moz-transition: all 0.7s ease;
    -webkit-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
    opacity:0;
    box-sizing: border-box!important;
  }
  
  
  
  
  
  .chat-bubble-response img {
        margin-top:10px;
        margin-bottom:10px;
        height: 100px;
        width:100px;
        object-fit: cover;
        border-radius: 10px;
        border: 1px solid #eee;
  }
  
  .chat-bubble-response .amchatimagebox {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: row;
    background-color: #ddd;
    border-radius: 20px;
    margin-top: 10px;
    min-height: 50px;
    /*     margin-bottom: 10px;
  margin-left: 50px;
    margin-right: 50px; */
  }
  
  
  
  .chat-bubble-response a {
  
    text-align: center;
    width: 100%;
    display: block;
    max-height: 112px;
    white-space: break-spaces;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
    color: #eee;
      background: #555;
      border: 1px solid #555;
      width: 200px;
      padding: 3px 6px;
      border-radius: 5px;
      max-width: 200px;
  
  }
  
  
  .amresponseimage {
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    border-radius: 15px;
    background-color: #fff;
    display: block !important;
    margin-top: 10px;
    margin-bottom: 10px;
    height: 100px;
    width: 100px;
   /* object-fit: cover; */
    border-radius: 10px;
    border: 1px solid #eee;
  }
  
  
  .amshowloader {
    opacity:1!important;
  }
  
  
  
  #chatloader.show {
    opacity:1!important;
  }
  
  #chatloader.hide {
    opacity:0!important;
  }
  
  
  .newshopbackground {
      width:100%;
  
      background-color:#fff;
  border-radius:12px;
  box-shadow:rgba(26, 26, 26, 0.07) 0px 1px 0px 0px;
  
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  }
  
  #handoffsselector {
  border-radius:12px;
  width: 90%;
  min-height: 30px;
  padding:5px;
  
  -webkit-appearance: none;
      -moz-appearance: none;
      background: transparent;
        background-image: url("data:image/svg+xml;utf8,<svg fill=\'black\' height=\'24\' viewBox=\'0 0 24 24\' width=\'24\' xmlns=\'http://www.w3.org/2000/svg\'><path d=\'M7 10l5 5 5-5z\'/><path d=\'M0 0h24v24H0z\' fill=\'none\'/></svg>");
      background-repeat: no-repeat;
      background-position-x: 100%;
      background-position-y: 3px;
      padding-left: 10px;
  max-width:400px;
  }
  
  
  #handoffsselector .amhandoffnotresponded {
  
  display:block;
  }
  
  #handoffsselector .amhandoffresponded {
  
    display:none;
  }
  
  #handoffsselectorresponded {
    border-radius:12px;
    width: 90%;
    min-height: 30px;
    padding:5px;
  
    -webkit-appearance: none;
    -moz-appearance: none;
    background: transparent;
    background-image: url("data:image/svg+xml;utf8,<svg fill=\'black\' height=\'24\' viewBox=\'0 0 24 24\' width=\'24\' xmlns=\'http://www.w3.org/2000/svg\'><path d=\'M7 10l5 5 5-5z\'/><path d=\'M0 0h24v24H0z\' fill=\'none\'/></svg>");
    background-repeat: no-repeat;
    background-position-x: 100%;
    background-position-y: 3px;
    padding-left: 10px;
  
    max-width:400px;
    }
  
    #handoffsselectorresponded .amhandoffnotresponded {
  
      display:none;
      }
      
      #handoffsselectorresponded .amhandoffresponded {
        display:block;
       
      }
      
  
  #handoffsselectorlabel {
  
    width: 90%;
    margin-bottom:15px;
    font-weight:300;
    text-align:center;
    font-size: 20px;
    }
  
  
  
  #handoffsselectorlabelresponded {
  
    width: 90%;
    margin-bottom:15px;
    font-weight:300;
    text-align:center;
    font-size: 20px;
    }
  
  
    #handoffsselectornotification {
      display: block;
      position: absolute;
      width: 15px;
      height: 15px;
      background-color: red;
      border-radius: 25px;
      top: 5px;
      right: 5px;
    }
  
    #handoffsmainnotification {
      display: block;
      position: absolute;
      width: 25px;
      height: 25px;
      background-color: red;
      border-radius: 25px;
      top: 5px;
      right: 5px;
      color:#fff;
      padding-top: 2px;
      text-align: center;
    }
  
    #handoffslabel {
  
      width: 90%;
      margin-bottom:25px;
      font-weight:300; 
      text-align:center;
      margin-top:15px;
      font-size: 20px;
      }
  
      .handoffslabel {
  
        width: 90%;
     
        font-weight:300; 
        text-align:center;
      
        }
  
      .newshopbuttoncontainer {
        width:100%;
        display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  margin: 10px;
  flex-wrap: wrap;
  
      }
  
      .newshopbuttons {
  margin-left:5px;
  margin-right:5px;
  margin-top:5px;
      }
  
  
  
  .newshopoutputcontainer {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius:12px;
    width:calc(100% - 80px);
    background-color:#eee;
    margin:20px;
    height: 215px;
    position:relative;
  }
  
  .amhandoffdetails {
  width:100%;
  height:100%;
  padding:15px;
  overflow-y:auto;
  padding-left:30px;
  }
  
  .amhandoffdetailsline {
    margin-bottom:10px;
    display:flex;
    flex-direction:row;
  }
  
  #amhandoffsdatablocktwo {
    width: inherit;
    overflow-y: scroll;
    height: 300px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding: 30px;
    background-color: #eee;
  }

  #amhandoffsdatablocktwo::-webkit-scrollbar { width: 0 !important; }
  #amhandoffsdatablocktwo { overflow: -moz-scrollbars-none; scrollbar-width: none; }
  #amhandoffsdatablocktwo { -ms-overflow-style: none; }

  
  
  /* leave last */
  
  .anymindsettingson {
  
  /*  background-color:#008060;*/
  height:30px;
  }
  
  .anymindsettingsoff {
  
   /* background-color:#abb1ba;*/
   height:30px;
   cursor: pointer;
  }
  
  .anymindhandoffsettingson {
  
    background-color:#2271b1;
    color:#fff;
    border:1px solid #2271b1;
    height:30px;
  }

  .anymindhandoffsettingsoff {
  
    height:30px;
  }
  
  
  @media screen and (max-width: 530px) {
  
    .chat-bubble-response a {
      width:100px;
    }
  
  }

  .storemindloader {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #2271b1;
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
    box-sizing: border-box;
  }
  /* Safari */
  @-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
  }
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }


  .storemindinstructionscontainer div{

    margin-bottom:10px;
  }

  #instructions-content-storemind {
    /* Start hidden */
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    margin-top: 0; /* Collapse margin when hidden */
    padding-top: 0; /* Collapse padding */
    padding-bottom: 0;
    border-width: 0; /* Collapse border */
    box-sizing: border-box; /* Include padding/border in height */

    /* Transition properties for smooth animation */
    transition: max-height 0.4s ease-in-out, opacity 0.4s ease-in-out, margin-top 0.4s ease-in-out, padding-top 0.4s ease-in-out, padding-bottom 0.4s ease-in-out, border-width 0.4s ease-in-out;

    /* --- Define styles for the VISIBLE state within the .open class --- */
}

#instructions-content-storemind.open {
     /* Set high enough max-height for content */
    max-height: 1700px; 
    max-height: fit-content; 
    opacity: 1;

    /* Restore original spacing and border */
    margin-top: 1em;
    padding: 1em;
    border: 1px solid #ccd0d4;
    background: #fff; /* Ensure background is set */
    border-width: 1px; /* Explicitly set width */
}

#storemind-tab-content{

    margin-top:20px;
}
  

@media screen and (max-width: 600px) {
  
    #storemind-layout-header {
      height:100px!important;
    }
  
  }



  #fs_connect .fs-freemium-licensing p {

    font-size: 20px!important;
}


#fs_connect .fs-freemium-licensing {

  background: #2271b1!important;
}


.fs-submenu-item.pricing.upgrade-mode {
  color: #2271b1!important;
}

.fs-submenu-item.pricing.trial-mode {
  color: #2271b1!important;
}

.fs-section.wrap.account {


  margin-top: 70px!important;

}