body {
    font-family: 'Open Sans', sans-serif;
    padding-top: 0;
    overflow-y: unset !important;
}

.gohilite
{
  color: #ffaa00;
}

.secheading 
{
  color: white;
  font-size: 1.5rem;
}

h1 {
  font-weight: 700;
  font-family: 'Asap Condensed';
}

h2 {
    font-weight: 700;
    font-family: 'Asap Condensed';
}

h3 {
    font-family: 'Asap Condensed';
    font-size: 1.56rem;
    font-weight: normal;
}

h4 {
    font-family: 'Asap Condensed';
}

h5 {
    font-family: 'Asap Condensed';
}
@media (min-width: 1500px) {
    .navbar .container-fluid {
        padding-left: 10%;
        padding-right: 10%;
    }
}

a {
  text-decoration: none; /* Removes the underline */
}

/*
#filterBar .ss {
  padding: 0 0.5rem;
}*/

/* fixes for BS5 */
.form-group {
  margin-bottom: 1rem;
}
.custom-select {
  display: block;
  width: 100%;
  padding: 0.375rem 1.75rem 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  /*background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='none' stroke='%23343a40' d='M2 0L0 2h4L2 0z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px;*/
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  appearance: none;
}


.placeholder
{
  background:#d8d5d5;
}

.tooltip .tooltip-inner {
  font-size: 10px; /* Adjust size as needed */
  padding: 4px 4px; /* Adjust padding if needed */
}


  /* Adjust these values as needed */
  .telephone-bar {
    position: fixed;
    right: 0;
    z-index: 1020;
    bottom: 0;
    width: 100%;
  }
  .telephone-bar .inner {
display: flex;
    justify-content: space-between;
    align-items: centre;
    gap: .75rem; /* optional */
border-top-left-radius: 0.5rem;
    background-color: #000;
    color: #fff;
    font-size: 0.8rem;
    padding: 0.5rem;
  }
  .telephone-bar a {
    color: white;          /* Makes text white */
  }
  
  /* Optional: Keep it white and without underline on hover as well */
  .telephone-bar a:hover {
    color: white;
    text-decoration: none;
  }
  


  @media (min-width: 575px) {
    .telephone-bar .inner {
      display: block;
        float: right;
        width: unset;
    }



}

/* Mobile */
@media (max-width: 576px) {
  .telephone-bar .inner {
    font-size: 0.7rem;
  }
}

.dropdown-header {
  background-color: #e7e7e7;
  font-size: 0.8rem;
  color: black;
}

/*********ICONS**********/

  .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(255,255,255,1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
  }

  .settings-icon {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20height%3D%2224%22%20color%3D%22%23000000%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M15.5%2012C15.5%2013.933%2013.933%2015.5%2012%2015.5C10.067%2015.5%208.5%2013.933%208.5%2012C8.5%2010.067%2010.067%208.5%2012%208.5C13.933%208.5%2015.5%2010.067%2015.5%2012Z%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M21.011%2014.0965C21.5329%2013.9558%2021.7939%2013.8854%2021.8969%2013.7508C22%2013.6163%2022%2013.3998%2022%2012.9669V11.0332C22%2010.6003%2022%2010.3838%2021.8969%2010.2493C21.7938%2010.1147%2021.5329%2010.0443%2021.011%209.90358C19.0606%209.37759%2017.8399%207.33851%2018.3433%205.40087C18.4817%204.86799%2018.5509%204.60156%2018.4848%204.44529C18.4187%204.28902%2018.2291%204.18134%2017.8497%203.96596L16.125%202.98673C15.7528%202.77539%2015.5667%202.66972%2015.3997%202.69222C15.2326%202.71472%2015.0442%202.90273%2014.6672%203.27873C13.208%204.73448%2010.7936%204.73442%209.33434%203.27864C8.95743%202.90263%208.76898%202.71463%208.60193%202.69212C8.43489%202.66962%208.24877%202.77529%207.87653%202.98663L6.15184%203.96587C5.77253%204.18123%205.58287%204.28891%205.51678%204.44515C5.45068%204.6014%205.51987%204.86787%205.65825%205.4008C6.16137%207.3385%204.93972%209.37763%202.98902%209.9036C2.46712%2010.0443%202.20617%2010.1147%202.10308%2010.2492C2%2010.3838%202%2010.6003%202%2011.0332V12.9669C2%2013.3998%202%2013.6163%202.10308%2013.7508C2.20615%2013.8854%202.46711%2013.9558%202.98902%2014.0965C4.9394%2014.6225%206.16008%2016.6616%205.65672%2018.5992C5.51829%2019.1321%205.44907%2019.3985%205.51516%2019.5548C5.58126%2019.7111%205.77092%2019.8188%206.15025%2020.0341L7.87495%2021.0134C8.24721%2021.2247%208.43334%2021.3304%208.6004%2021.3079C8.76746%2021.2854%208.95588%2021.0973%209.33271%2020.7213C10.7927%2019.2644%2013.2088%2019.2643%2014.6689%2020.7212C15.0457%2021.0973%2015.2341%2021.2853%2015.4012%2021.3078C15.5682%2021.3303%2015.7544%2021.2246%2016.1266%2021.0133L17.8513%2020.034C18.2307%2019.8187%2018.4204%2019.711%2018.4864%2019.5547C18.5525%2019.3984%2018.4833%2019.132%2018.3448%2018.5991C17.8412%2016.6616%2019.0609%2014.6226%2021.011%2014.0965Z%22%20stroke%3D%22currentColor%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }

  .admin-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='currentColor' fill='none'%3E%3Cpath d='M20 22.0002V17.0002C20 15.1146 20 14.1718 19.4142 13.586C18.8284 13.0002 17.8856 13.0002 16 13.0002L12 22.0002L8 13.0002C6.11438 13.0002 5.17157 13.0002 4.58579 13.586C4 14.1718 4 15.1146 4 17.0002V22.0002' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M12 15L11.5 19L12 20.5L12.5 19L12 15ZM12 15L11 13H13L12 15Z' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M15.5 6.50012V5.50012C15.5 3.56713 13.933 2.00012 12 2.00012C10.067 2.00012 8.5 3.56713 8.5 5.50012V6.50012C8.5 8.43312 10.067 10.0001 12 10.0001C13.933 10.0001 15.5 8.43312 15.5 6.50012Z' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }


  .signout-icon {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M11 3L10.3374 3.23384C7.75867 4.144 6.46928 4.59908 5.73464 5.63742C5 6.67576 5 8.0431 5 10.7778V13.2222C5 15.9569 5 17.3242 5.73464 18.3626C6.46928 19.4009 7.75867 19.856 10.3374 20.7662L11 21' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M21 12L11 12M21 12C21 11.2998 19.0057 9.99153 18.5 9.5M21 12C21 12.7002 19.0057 14.0085 18.5 14.5' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }

  .icon-gaz {
  display: inline-block;
  width: 18px;
  height: 18px;
  vertical-align: text-bottom;
  /*margin-right: 0.5rem;*//* Adjust spacing as needed */
}

.download-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M12 14.5L12 4.5M12 14.5C11.2998 14.5 9.99153 12.5057 9.5 12M12 14.5C12.7002 14.5 14.0085 12.5057 14.5 12' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M20 16.5C20 18.982 19.482 19.5 17 19.5H7C4.518 19.5 4 18.982 4 16.5' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.profilepage-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M14 8.99988H18' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M14 12.4999H17' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Crect x='2' y='2.99988' width='20' height='18' rx='5' stroke='currentColor' stroke-width='1.5' stroke-linejoin='round' /%3E%3Cpath d='M5 15.9999C6.20831 13.4188 10.7122 13.249 12 15.9999' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M10.5 8.99988C10.5 10.1044 9.60457 10.9999 8.5 10.9999C7.39543 10.9999 6.5 10.1044 6.5 8.99988C6.5 7.89531 7.39543 6.99988 8.5 6.99988C9.60457 6.99988 10.5 7.89531 10.5 8.99988Z' stroke='currentColor' stroke-width='1.5' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}



.managedvo-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='currentColor' fill='none'%3E%3Cpath d='M8.39559 2.55196C9.8705 1.63811 11.1578 2.00638 11.9311 2.59299C12.2482 2.83351 12.4067 2.95378 12.5 2.95378C12.5933 2.95378 12.7518 2.83351 13.0689 2.59299C13.8422 2.00638 15.1295 1.63811 16.6044 2.55196C18.5401 3.75128 18.9781 7.7079 14.5133 11.046C13.6629 11.6818 13.2377 11.9996 12.5 11.9996C11.7623 11.9996 11.3371 11.6818 10.4867 11.046C6.02195 7.7079 6.45994 3.75128 8.39559 2.55196Z' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M4 14H6.39482C6.68897 14 6.97908 14.0663 7.24217 14.1936L9.28415 15.1816C9.54724 15.3089 9.83735 15.3751 10.1315 15.3751H11.1741C12.1825 15.3751 13 16.1662 13 17.142C13 17.1814 12.973 17.2161 12.9338 17.2269L10.3929 17.9295C9.93707 18.0555 9.449 18.0116 9.025 17.8064L6.84211 16.7503' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M13 16.5L17.5928 15.0889C18.407 14.8352 19.2871 15.136 19.7971 15.8423C20.1659 16.3529 20.0157 17.0842 19.4785 17.3942L11.9629 21.7305C11.4849 22.0063 10.9209 22.0736 10.3952 21.9176L4 20.0199' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  height: 30px;
  width: 30px;
}

.managedvo-icon-lv {
  height: 20px;
  width: 18px;
}

.bookmarkadd-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M11 2C7.22876 2 5.34315 2 4.17157 3.12874C3 4.25748 3 6.07416 3 9.70753V17.9808C3 20.2867 3 21.4396 3.77285 21.8523C5.26947 22.6514 8.0768 19.9852 9.41 19.1824C10.1832 18.7168 10.5698 18.484 11 18.484C11.4302 18.484 11.8168 18.7168 12.59 19.1824C13.9232 19.9852 16.7305 22.6514 18.2272 21.8523C19 21.4396 19 20.2867 19 17.9808V12.5' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M3.5 7.00005H10' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M17 10L17 2M13 6H21' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.bookmarkdel-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M11 2C7.22876 2 5.34315 2 4.17157 3.12874C3 4.25748 3 6.07416 3 9.70753V17.9808C3 20.2867 3 21.4396 3.77285 21.8523C5.26947 22.6514 8.0768 19.9852 9.41 19.1824C10.1832 18.7168 10.5698 18.484 11 18.484C11.4302 18.484 11.8168 18.7168 12.59 19.1824C13.9232 19.9852 16.7305 22.6514 18.2272 21.8523C19 21.4396 19 20.2867 19 17.9808V12.5' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M3.5 7H10' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M13 5H21' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.editpencil-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' width='20' height='20' color='currentColor' fill='none'%3E%3Cpath d='M8.17151 19.8284L19.8284 8.17157C20.3736 7.62632 20.6462 7.3537 20.792 7.0596C21.0693 6.50005 21.0693 5.8431 20.792 5.28354C20.6462 4.98945 20.3736 4.71682 19.8284 4.17157C19.2831 3.62632 19.0105 3.3537 18.7164 3.20796C18.1568 2.93068 17.4999 2.93068 16.9403 3.20796C16.6462 3.3537 16.3736 3.62632 15.8284 4.17157L4.17151 15.8284C3.59345 16.4064 3.30442 16.6955 3.15218 17.063C2.99994 17.4305 2.99994 17.8393 2.99994 18.6568V20.9999H5.34308C6.16059 20.9999 6.56934 20.9999 6.93688 20.8477C7.30442 20.6955 7.59345 20.4064 8.17151 19.8284Z' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M12 21H18' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M14.5 5.5L18.5 9.5' stroke='%23141B34' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}


.bookmarkmenu-icon {
  background: transparent;
  border: none;
  padding: 0;
  /* Optionally remove default appearance */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.tickmark-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M5 14.5C5 14.5 6.5 14.5 8.5 18C8.5 18 14.0588 8.83333 19 7' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* Remove focus outline if desired (but consider accessibility) */
.bookmarkmenu-icon:focus {
  outline: none;
  box-shadow: none;
}

.bookmarkmenu-icon
{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M11 2C7.22876 2 5.34315 2 4.17157 3.12874C3 4.25748 3 6.07416 3 9.70753V17.9808C3 20.2867 3 21.4396 3.77285 21.8523C5.26947 22.6514 8.0768 19.9852 9.41 19.1824C10.1832 18.7168 10.5698 18.484 11 18.484C11.4302 18.484 11.8168 18.7168 12.59 19.1824C13.9232 19.9852 16.7305 22.6514 18.2272 21.8523C19 21.4396 19 20.2867 19 17.9808V12.5' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M3.5 7.00005H10' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M17 10L17 2M13 6H21' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3C/svg%3E");
    height: 24px;
    width: 24px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.bookaddlist-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M12.06 21.5124C11.5445 21.8375 11.2868 22 11 22C10.7132 22 10.4554 21.8374 9.94 21.5124L8.02913 20.3073C7.54415 20.0014 7.30166 19.8485 7.03253 19.8397C6.74172 19.8301 6.49493 19.9768 5.97087 20.3073C5.38395 20.6774 4.21687 21.6971 3.46195 21.2108C3 20.9133 3 20.1575 3 18.6458V8.00002C3 5.17158 3 3.75736 3.82699 2.87868C4.65399 2 5.98501 2 8.64706 2H13.3529C16.015 2 17.346 2 18.173 2.87868C19 3.75736 19 5.17158 19 8.00002V12' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M11 11H7' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M17 14V22M21 18L13 18' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3Cpath d='M15 7L7 7' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.listsettings-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Cpath d='M16.5 19.8571V21M16.5 19.8571C15.4878 19.8571 14.5961 19.3521 14.073 18.5852M16.5 19.8571C17.5122 19.8571 18.4039 19.3521 18.927 18.5852M16.5 14.1429C17.5123 14.1429 18.4041 14.648 18.9271 15.415M16.5 14.1429C15.4877 14.1429 14.5959 14.648 14.0729 15.415M16.5 14.1429V13M20 14.7143L18.9271 15.415M13.0004 19.2857L14.073 18.5852M13 14.7143L14.0729 15.415M19.9996 19.2857L18.927 18.5852M18.9271 15.415C19.2364 15.8685 19.4167 16.4136 19.4167 17C19.4167 17.5864 19.2363 18.1316 18.927 18.5852M14.0729 15.415C13.7636 15.8685 13.5833 16.4136 13.5833 17C13.5833 17.5864 13.7637 18.1316 14.073 18.5852' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M4 3H20' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M4 9H20' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3Cpath d='M4 15H9' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.pin-icon {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Cpath d="M3 21L8 16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M13.2585 18.8714C9.51516 18.0215 5.97844 14.4848 5.12853 10.7415C4.99399 10.1489 4.92672 9.85266 5.12161 9.37197C5.3165 8.89129 5.55457 8.74255 6.03071 8.44509C7.10705 7.77265 8.27254 7.55888 9.48209 7.66586C11.1793 7.81598 12.0279 7.89104 12.4512 7.67048C12.8746 7.44991 13.1622 6.93417 13.7376 5.90269L14.4664 4.59604C14.9465 3.73528 15.1866 3.3049 15.7513 3.10202C16.316 2.89913 16.6558 3.02199 17.3355 3.26771C18.9249 3.84236 20.1576 5.07505 20.7323 6.66449C20.978 7.34417 21.1009 7.68401 20.898 8.2487C20.6951 8.8134 20.2647 9.05346 19.4039 9.53358L18.0672 10.2792C17.0376 10.8534 16.5229 11.1406 16.3024 11.568C16.0819 11.9955 16.162 12.8256 16.3221 14.4859C16.4399 15.7068 16.2369 16.88 15.5555 17.9697C15.2577 18.4458 15.1088 18.6839 14.6283 18.8786C14.1477 19.0733 13.8513 19.006 13.2585 18.8714Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.unpin-icon {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Cpath d="M7.5 8C6.95863 8.1281 6.49932 8.14239 5.99268 8.45891C5.07234 9.03388 4.85108 9.71674 5.08821 10.7612C5.94028 14.5139 9.48599 18.0596 13.2388 18.9117C14.2834 19.1489 14.9661 18.928 15.5416 18.0077C15.8411 17.5288 15.8716 17.0081 16 16.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M12 7.79915C12.1776 7.77794 12.3182 7.74034 12.4295 7.68235C13.3997 7.17686 13.9291 5.53361 14.4498 4.60009C14.9311 3.73715 15.1718 3.30567 15.7379 3.10227C16.3041 2.89888 16.6448 3.02205 17.3262 3.26839C18.9197 3.8445 20.1555 5.08032 20.7316 6.6738C20.9779 7.35521 21.1011 7.69591 20.8977 8.26204C20.6943 8.82817 20.2628 9.06884 19.3999 9.55018C18.4608 10.074 16.7954 10.6108 16.2905 11.5898C16.2345 11.6983 16.1978 11.8327 16.1769 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M3 21L8 16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M3 3L21 21" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.listmode-icon {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Cpath d="M2 11.4C2 10.2417 2.24173 10 3.4 10H20.6C21.7583 10 22 10.2417 22 11.4V12.6C22 13.7583 21.7583 14 20.6 14H3.4C2.24173 14 2 13.7583 2 12.6V11.4Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" /%3E%3Cpath d="M2 3.4C2 2.24173 2.24173 2 3.4 2H20.6C21.7583 2 22 2.24173 22 3.4V4.6C22 5.75827 21.7583 6 20.6 6H3.4C2.24173 6 2 5.75827 2 4.6V3.4Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" /%3E%3Cpath d="M2 19.4C2 18.2417 2.24173 18 3.4 18H20.6C21.7583 18 22 18.2417 22 19.4V20.6C22 21.7583 21.7583 22 20.6 22H3.4C2.24173 22 2 21.7583 2 20.6V19.4Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" /%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.gridmode-icon {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Cpath d="M2 18C2 16.4596 2 15.6893 2.34673 15.1235C2.54074 14.8069 2.80693 14.5407 3.12353 14.3467C3.68934 14 4.45956 14 6 14C7.54044 14 8.31066 14 8.87647 14.3467C9.19307 14.5407 9.45926 14.8069 9.65327 15.1235C10 15.6893 10 16.4596 10 18C10 19.5404 10 20.3107 9.65327 20.8765C9.45926 21.1931 9.19307 21.4593 8.87647 21.6533C8.31066 22 7.54044 22 6 22C4.45956 22 3.68934 22 3.12353 21.6533C2.80693 21.4593 2.54074 21.1931 2.34673 20.8765C2 20.3107 2 19.5404 2 18Z" stroke="currentColor" stroke-width="1.5" /%3E%3Cpath d="M14 18C14 16.4596 14 15.6893 14.3467 15.1235C14.5407 14.8069 14.8069 14.5407 15.1235 14.3467C15.6893 14 16.4596 14 18 14C19.5404 14 20.3107 14 20.8765 14.3467C21.1931 14.5407 21.4593 14.8069 21.6533 15.1235C22 15.6893 22 16.4596 22 18C22 19.5404 22 20.3107 21.6533 20.8765C21.4593 21.1931 21.1931 21.4593 20.8765 21.6533C20.3107 22 19.5404 22 18 22C16.4596 22 15.6893 22 15.1235 21.6533C14.8069 21.4593 14.5407 21.1931 14.3467 20.8765C14 20.3107 14 19.5404 14 18Z" stroke="currentColor" stroke-width="1.5" /%3E%3Cpath d="M2 6C2 4.45956 2 3.68934 2.34673 3.12353C2.54074 2.80693 2.80693 2.54074 3.12353 2.34673C3.68934 2 4.45956 2 6 2C7.54044 2 8.31066 2 8.87647 2.34673C9.19307 2.54074 9.45926 2.80693 9.65327 3.12353C10 3.68934 10 4.45956 10 6C10 7.54044 10 8.31066 9.65327 8.87647C9.45926 9.19307 9.19307 9.45926 8.87647 9.65327C8.31066 10 7.54044 10 6 10C4.45956 10 3.68934 10 3.12353 9.65327C2.80693 9.45926 2.54074 9.19307 2.34673 8.87647C2 8.31066 2 7.54044 2 6Z" stroke="currentColor" stroke-width="1.5" /%3E%3Cpath d="M14 6C14 4.45956 14 3.68934 14.3467 3.12353C14.5407 2.80693 14.8069 2.54074 15.1235 2.34673C15.6893 2 16.4596 2 18 2C19.5404 2 20.3107 2 20.8765 2.34673C21.1931 2.54074 21.4593 2.80693 21.6533 3.12353C22 3.68934 22 4.45956 22 6C22 7.54044 22 8.31066 21.6533 8.87647C21.4593 9.19307 21.1931 9.45926 20.8765 9.65327C20.3107 10 19.5404 10 18 10C16.4596 10 15.6893 10 15.1235 9.65327C14.8069 9.45926 14.5407 9.19307 14.3467 8.87647C14 8.31066 14 7.54044 14 6Z" stroke="currentColor" stroke-width="1.5" /%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}


.filter-icon {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Cpath d="M3 7H6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M3 17H9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M18 17L21 17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M15 7L21 7" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M6 7C6 6.06812 6 5.60218 6.15224 5.23463C6.35523 4.74458 6.74458 4.35523 7.23463 4.15224C7.60218 4 8.06812 4 9 4C9.93188 4 10.3978 4 10.7654 4.15224C11.2554 4.35523 11.6448 4.74458 11.8478 5.23463C12 5.60218 12 6.06812 12 7C12 7.93188 12 8.39782 11.8478 8.76537C11.6448 9.25542 11.2554 9.64477 10.7654 9.84776C10.3978 10 9.93188 10 9 10C8.06812 10 7.60218 10 7.23463 9.84776C6.74458 9.64477 6.35523 9.25542 6.15224 8.76537C6 8.39782 6 7.93188 6 7Z" stroke="currentColor" stroke-width="1.5" /%3E%3Cpath d="M12 17C12 16.0681 12 15.6022 12.1522 15.2346C12.3552 14.7446 12.7446 14.3552 13.2346 14.1522C13.6022 14 14.0681 14 15 14C15.9319 14 16.3978 14 16.7654 14.1522C17.2554 14.3552 17.6448 14.7446 17.8478 15.2346C18 15.6022 18 16.0681 18 17C18 17.9319 18 18.3978 17.8478 18.7654C17.6448 19.2554 17.2554 19.6448 16.7654 19.8478C16.3978 20 15.9319 20 15 20C14.0681 20 13.6022 20 13.2346 19.8478C12.7446 19.6448 12.3552 19.2554 12.1522 18.7654C12 18.3978 12 17.9319 12 17Z" stroke="currentColor" stroke-width="1.5" /%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.searchglass-icon 
{
  display: inline-block;
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" fill="none"%3E%3Cpath d="M14 14L16.5 16.5" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /%3E%3Cpath d="M16.4333 18.5252C15.8556 17.9475 15.8556 17.0109 16.4333 16.4333C17.0109 15.8556 17.9475 15.8556 18.5252 16.4333L21.5667 19.4748C22.1444 20.0525 22.1444 20.9891 21.5667 21.5667C20.9891 22.1444 20.0525 22.1444 19.4748 21.5667L16.4333 18.5252Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" /%3E%3Cpath d="M16 9C16 5.13401 12.866 2 9 2C5.13401 2 2 5.13401 2 9C2 12.866 5.13401 16 9 16C12.866 16 16 12.866 16 9Z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /%3E%3C/svg%3E');
}


.icon-gazphone
{
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="15" height="15" color="%23ffffff" fill="none"%3E%3Cpath d="M3.77762 11.9424C2.8296 10.2893 2.37185 8.93948 2.09584 7.57121C1.68762 5.54758 2.62181 3.57081 4.16938 2.30947C4.82345 1.77638 5.57323 1.95852 5.96 2.6524L6.83318 4.21891C7.52529 5.46057 7.87134 6.08139 7.8027 6.73959C7.73407 7.39779 7.26737 7.93386 6.33397 9.00601L3.77762 11.9424ZM3.77762 11.9424C5.69651 15.2883 8.70784 18.3013 12.0576 20.2224M12.0576 20.2224C13.7107 21.1704 15.0605 21.6282 16.4288 21.9042C18.4524 22.3124 20.4292 21.3782 21.6905 19.8306C22.2236 19.1766 22.0415 18.4268 21.3476 18.04L19.7811 17.1668C18.5394 16.4747 17.9186 16.1287 17.2604 16.1973C16.6022 16.2659 16.0661 16.7326 14.994 17.666L12.0576 20.2224Z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /%3E%3C/svg%3E');
}


.icon-gazmail
{
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="15" height="15" color="%23ffffff" fill="none"%3E%3Cpath d="M2 6L8.91302 9.91697C11.4616 11.361 12.5384 11.361 15.087 9.91697L22 6" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /%3E%3Cpath d="M2.01577 13.4756C2.08114 16.5412 2.11383 18.0739 3.24496 19.2094C4.37608 20.3448 5.95033 20.3843 9.09883 20.4634C11.0393 20.5122 12.9607 20.5122 14.9012 20.4634C18.0497 20.3843 19.6239 20.3448 20.7551 19.2094C21.8862 18.0739 21.9189 16.5412 21.9842 13.4756C22.0053 12.4899 22.0053 11.5101 21.9842 10.5244C21.9189 7.45886 21.8862 5.92609 20.7551 4.79066C19.6239 3.65523 18.0497 3.61568 14.9012 3.53657C12.9607 3.48781 11.0393 3.48781 9.09882 3.53656C5.95033 3.61566 4.37608 3.65521 3.24495 4.79065C2.11382 5.92608 2.08114 7.45885 2.01576 10.5244C1.99474 11.5101 1.99475 12.4899 2.01577 13.4756Z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /%3E%3C/svg%3E');
}

.icon-gazphone,
.icon-gazmail {
  display: inline-block;
  width: 15px;
  height: 15px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  vertical-align: -0.3em;
}


.youtube-play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 68px;
  height: 48px;
  background: url('data:image/svg+xml;utf8,<svg width="68" height="48" viewBox="0 0 68 48" xmlns="http://www.w3.org/2000/svg"><path d="M66.52 7.85a8 8 0 00-5.65-5.66C56.66 1 34 1 34 1s-22.66 0-26.87 1.19a8 8 0 00-5.65 5.66A83.33 83.33 0 000 24a83.33 83.33 0 001.48 16.15 8 8 0 005.65 5.66C11.34 47 34 47 34 47s22.66 0 26.87-1.19a8 8 0 005.65-5.66A83.33 83.33 0 0068 24a83.33 83.33 0 00-1.48-16.15z" fill="%23f00"/><path d="M45 24L27 14v20z" fill="%23fff"/></svg>') no-repeat center center;
  background-size: contain;
  transform: translate(-50%, -50%);
  cursor: pointer;
  opacity: 0.9;
  transition: opacity 0.2s ease;
}

.youtube-play-button:hover {
  opacity: 1;
}

.video-wrapper {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
  background: #000;
  overflow: hidden;
}

.video-wrapper iframe,
.youtube-thumb-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
}


#mobilefilterBtn {
  position: fixed;
  top: 170px;
  right: 15px;
  background: #ffffff;
  border: none;
  border-radius: 50%;
  padding: 5px;
  width: 40px;
  height: 40px;
  box-shadow: 0 4px 2px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  z-index: 100;
}

#mobilefilterBtn:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(0,123,255,0.5);
}

#mobilefilterBtn .filter-icon {
  height: 100%;
  width: 100%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

/***************************/

  .list-group-item:hover {
    background-color: #f8f9fa; /* A light shade for highlighting */
    cursor: pointer; /* Indicates interactivity */
  }

.gaznavb a {
    color: #ffffff;
    text-decoration: none;
}

/* This is the account/user dropdown menu: */
/* Remove vertical padding from dropdown menu */
.dropdown-menu {
  padding-top: 3px !important;
  padding-bottom: 3px !important;
}
/* Set font size for dropdown items */
.dropdown-item {
  font-size: 0.8rem;
}
/* Make hover effect more pronounced with a darker grey background */
.dropdown-item:hover,
.dropdown-item:focus {
  background-color: #888888; /* grey */
  color: #fff;             /* White text for contrast */
}


#gcLoginBtn.dropdown-toggle::after {
  /* By default, Bootstrap uses border-top-color for the caret */
  border-top-color: #ffaa00 !important; /* replace with your desired colour */
  color:  #ffaa00 !important;
  margin-left: 0;
}

.gaz-search-container {
    position: relative;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}

.gaz-search-container .easy-autocomplete {
    width: 100% !important;
    max-width: 500px;
}

.gaz-search-container .easy-autocomplete input {
    width: 100%;
}

.gaz-search-container .easy-autocomplete-container {
    width: 100% !important;
    max-width: 500px;
}

.gaz-search-input {
    font-size: 1rem;
    height: 30px;
    border-radius: 20px;
    padding-left: 45px;
    border: none;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.gaz-search-icon {
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    color: #ffffff;
}

.btn.bookmark-icon::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23ffaa00" fill="none"%3E%3Cpath d="M4 17.9808V9.70753C4 6.07416 4 4.25748 5.17157 3.12874C6.34315 2 8.22876 2 12 2C15.7712 2 17.6569 2 18.8284 3.12874C20 4.25748 20 6.07416 20 9.70753V17.9808C20 20.2867 20 21.4396 19.2272 21.8523C17.7305 22.6514 14.9232 19.9852 13.59 19.1824C12.8168 18.7168 12.4302 18.484 12 18.484C11.5698 18.484 11.1832 18.7168 10.41 19.1824C9.0768 19.9852 6.26947 22.6514 4.77285 21.8523C4 21.4396 4 20.2867 4 17.9808Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"%3E%3C/path%3E%3Cpath d="M4 7H20" stroke="currentColor" stroke-width="1.5"%3E%3C/path%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: #ffaa00;
  vertical-align: middle;
}
a.btn.bookmark-icon {
  text-decoration: none; /* Remove underline */
  display: inline-flex;  /* Ensures tooltip/spacing plays nicely */
  align-items: center;
  justify-content: center;
}

.btn.shopcart-icon::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23ffaa00" fill="none"%3E%3Cpath d="M8 16L16.7201 15.2733C19.4486 15.046 20.0611 14.45 20.3635 11.7289L21 6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M6 6H22" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"%3E%3C/path%3E%3Ccircle cx="6" cy="20" r="2" stroke="currentColor" stroke-width="1.5"%3E%3C/circle%3E%3Ccircle cx="17" cy="20" r="2" stroke="currentColor" stroke-width="1.5"%3E%3C/circle%3E%3Cpath d="M8 20L15 20" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"%3E%3C/path%3E%3Cpath d="M2 2H2.966C3.91068 2 4.73414 2.62459 4.96326 3.51493L7.93852 15.0765C8.08887 15.6608 7.9602 16.2797 7.58824 16.7616L6.63213 18" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"%3E%3C/path%3E%3C/svg%3E');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  color: #ffaa00;
  vertical-align: middle;
}
a.btn.shopcart-icon {
  text-decoration: none; /* Remove underline */
  display: inline-flex;  /* Ensures tooltip/spacing plays nicely */
  align-items: center;
  justify-content: center;
}


.face-0-unknown, .face-1-angry, .face-2-unhappy, .face-3-flat, .face-4-good, .face-5-reallygood, .face-6-fave {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 24px;
  height: 24px;
}

.face-0-unknown {
 
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Ccircle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8.00897 9H8M16 9H15.991" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E');
}
.face-1-angry {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Ccircle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8 17C8.91212 15.7856 10.3643 15 12 15C13.6357 15 15.0879 15.7856 16 17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M7 9.01067C7 9.01067 8.40944 8.88341 9.19588 9.50798M9.19588 9.50798L8.93275 10.3427C8.82896 10.6719 9.10031 11 9.4764 11C9.87165 11 10.1327 10.6434 9.92918 10.3348C9.74877 10.0612 9.50309 9.75196 9.19588 9.50798ZM17 9.01067C17 9.01067 15.5906 8.88341 14.8041 9.50798M14.8041 9.50798L15.0672 10.3427C15.171 10.6719 14.8997 11 14.5236 11C14.1283 11 13.8673 10.6434 14.0708 10.3348C14.2512 10.0612 14.4969 9.75196 14.8041 9.50798Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E');
}
.face-2-unhappy {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Ccircle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8 17C8.91212 15.7856 10.3643 15 12 15C13.6357 15 15.0879 15.7856 16 17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8.00897 9H8M16 9H15.991" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E');
}
.face-3-flat {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Ccircle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8.00897 9H8M16 9H15.991" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M9 16H15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E');
}
.face-4-good {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Ccircle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8 15C8.91212 16.2144 10.3643 17 12 17C13.6357 17 15.0879 16.2144 16 15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8.00897 9L8 9M16 9L15.991 9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E');
}
.face-5-reallygood {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Ccircle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8 15C8.91212 16.2144 10.3643 17 12 17C13.6357 17 15.0879 16.2144 16 15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M15 8C15 8 14 9 14 10C14.75 9 16.25 9 17 10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M9 8C9 8 10 9 10 10C9.25 9 7.75 9 7 10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3C/svg%3E');
}
.face-6-fave {
  background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="%23000000" fill="none"%3E%3Cpath d="M12.5 2.01228C12.3344 2.00413 12.1677 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12C22 11.1368 21.8906 10.299 21.685 9.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M8 15C8.91212 16.2144 10.3643 17 12 17C13.6357 17 15.0879 16.2144 16 15" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M10 9.5H8.70711C8.25435 9.5 7.82014 9.67986 7.5 10M14 9.5H15.2929C15.7456 9.5 16.1799 9.67986 16.5 10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" /%3E%3Cpath d="M15.8881 2.33117C16.8267 1.78287 17.6459 2.00383 18.138 2.35579C18.3398 2.50011 18.4406 2.57227 18.5 2.57227C18.5594 2.57227 18.6602 2.50011 18.862 2.35579C19.3541 2.00383 20.1733 1.78287 21.1119 2.33117C22.3437 3.05077 22.6224 5.42474 19.7812 7.42757C19.24 7.80905 18.9694 7.99979 18.5 7.99979C18.0306 7.99979 17.76 7.80905 17.2188 7.42757C14.3776 5.42474 14.6563 3.05077 15.8881 2.33117Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" /%3E%3C/svg%3E');
}

.face-rating-group {
  display: flex;
  justify-content: center; /* centres icons horizontally */
  align-items: center;
  gap: 8px; /* even spacing between icons */
  flex-wrap: wrap; /* allows wrapping on small screens */
  padding: 8px 0;
  text-align: center;
}

.face-icon {
  display: inline-block; /* This is key */
  border: 2px solid transparent;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
  transition: border-color 0.2s ease, background-color 0.2s ease;
  padding: 0;
}

.face-icon:hover {
  border-color: #cccccc;
}

.face-icon.selected {
  border-width: 3px;
  background-color: #ff660066;
}

.voice-rating-trigger {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  margin-left: 0.75rem;
  margin-bottom: 0;
}

.voice-rating-trigger:hover,
.voice-rating-trigger:focus {
  border-color: #999999;
  outline: none;
}

.voice-rating-trigger.rating-shared,
.artist-tab-icon.rating-shared {
  filter: grayscale(1);
  opacity: 0.4;
}

.voice-market-trigger,
.voice-market-icon-standard,
.voice-market-icon-premium {
  display: inline-block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.voice-market-trigger {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin-left: 0.4rem;
  margin-bottom: 0;
  padding: 0;
  border: 0;
  background-color: transparent;
  cursor: pointer;
  transition: filter 0.2s ease, transform 0.2s ease;
}

.voice-market-trigger:hover,
.voice-market-trigger:focus {
  filter: brightness(1.08);
  outline: none;
  transform: translateY(-1px);
}

.voice-market-trigger {
  display: none;
}

.artist-tab-icon.voice-market-icon-standard,
.artist-tab-icon.voice-market-icon-premium {
  display: none;
}

.voice-market-tab-container {
  display: none;
}

body.show-radio-market-icons .voice-market-trigger {
  display: inline-block;
}

body.show-radio-market-icons .artist-tab-icon.voice-market-icon-standard,
body.show-radio-market-icons .artist-tab-icon.voice-market-icon-premium {
  display: inline-block;
}

body.show-radio-market-icons .voice-market-tab-container {
  display: inline-block;
}

.voice-rating-modal .modal-body {
  padding-top: 1rem;
}

.voice-rating-modal .face-rating-group {
  justify-content: flex-start;
}

.editcomments.typing {
  color: #007bff; /* Bootstrap primary blue */
}

.comment-status {
  transition: opacity 0.2s ease;
}

.page-wrapper {
    /*overflow-x: hidden;*/ /* Prevent horizontal scrolling */
    /*position: relative;*/ /* Necessary for child positioning context */
    width: 100%;
  }

  .modal-open {
    padding-right: 0 !important;
  }

  /* Style for the spinner overlay */
#spinner-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(211, 211, 211, 0.5); /* semi-transparent grey */
  z-index: 9999; /* make sure it's above other content */
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: auto; /* this allows the overlay to block clicks */
}

  /* voice card shhhtuff */


 .embla__slide {
    flex: 0 0 260px;
    min-width: 0;
    padding: 0px;
    margin-right: 10px;
}


 .gazlist {
    flex: 0 0 100%;
  }

  .category-results-cta-slide {
    /*padding-right: 10px;*/
    box-sizing: border-box;
  }

  .category-results-cta-card {
    min-width: 0;
    width: 100%;
    background: #f8f8f8;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }

  .category-results-cta-body {
    color: #4b5563;
    font-size: 0.85rem;
    line-height: 1.5;
  }

  .category-results-cta-footer {
    margin-top: auto;
    margin-bottom: 19px;
    padding: 0.8rem 1rem;
    background: linear-gradient(to right, #e3e3e3 80%, rgba(255,255,255,0));
  }

  .icon-layer {
    display: inline-block;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


    .avatar-outer {
/* Outer blue circle */
width: 108px;                /* Outer circle diameter */
height: 108px;
border-radius: 50%;
background-color: #539dff;   /* Blue ring colour */
display: flex;
align-items: center;
justify-content: center;
}






.preview-button {
    background-color: #007bff;
    color: #fff;
    border: none;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.preview-button:hover {
    background-color: #0056b3;
}

  @keyframes pulsate {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.6;
    }
    50% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.6;
    }
    }




  .gazcard .img {
    position: relative;
    background: #539dff;
    height: 108px;
    width: 108px;
    border-radius: 50%;
    margin-bottom: 10px;
    flex: 0 0 108px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.gazcardf .img {
    background: #ff5353;
}

.gazcard .img img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
    border: 4px solid #fff;
}


.gazcard h2 {
    font-weight: 500;
    font-size: 1.56rem;
    
}
.gazcard span {
    color: #6A6D78;
    font-size: 1.1rem;
}



.gazcard {
    display: flex;
    flex-direction: column; /* Stack child elements vertically */
    justify-content: flex-start; /* Align items to the top */
    align-items: center; /* Center-align content horizontally */
    padding-top: 10px; /* Space between top of card and content */
    position: relative; /* To position elements inside the card */
    height: 480px;
}

.list-voicecard
{
  height: auto;
  flex-direction: row !important; /* Stack child elements vertically */
  justify-content: unset; /* Align items to the top */
  align-items: start !important; /* Center-align content horizontally */
  padding-top: unset; /* Space between top of card and content */
  position: unset; /* To position elements inside the card */
  width: 100%;
  padding: 6px;
}

/*.embla__container :where(.gazcard, .img) {
display: flex;
justify-content: center;
align-items: center;
}*/

/* New (apply only to .gazcard) */
.embla__container .gazcard {
display: flex;
flex-direction: column;
align-items: center;
}


.gazcard .imgplay {
  position: relative;
  cursor: pointer;

  &.noplaying::before {
  position: absolute;
  z-index: 2;
  filter: invert(100%);
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
  content: "";
  background: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22currentColor%22%20class%3D%22bi%20bi-play-fill%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22m11.596%208.697-6.363%203.692c-.54.313-1.233-.066-1.233-.697V4.308c0-.63.692-1.01%201.233-.696l6.363%203.692a.802.802%200%200%201%200%201.393%22/%3E%3C/svg%3E);
  background-size: contain;
  background-repeat: no-repeat;
  width: 80px;
  height: 80px;
  opacity: 0.6;
  text-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5);
  }

  &.playing::before {
  position: absolute;
  z-index: 2;
  filter: invert(100%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16' color='%23000000' fill='%23000000'%3E%3Cpath d='M4 7C4 5.58579 4 4.87868 4.43934 4.43934C4.87868 4 5.58579 4 7 4C8.41421 4 9.12132 4 9.56066 4.43934C10 4.87868 10 5.58579 10 7V17C10 18.4142 10 19.1213 9.56066 19.5607C9.12132 20 8.41421 20 7 20C5.58579 20 4.87868 20 4.43934 19.5607C4 19.1213 4 18.4142 4 17V7Z' stroke='currentColor' stroke-width='1' fill='currentColor'/%3E%3Cpath d='M14 7C14 5.58579 14 4.87868 14.4393 4.43934C14.8787 4 15.5858 4 17 4C18.4142 4 19.1213 4 19.5607 4.43934C20 4.87868 20 5.58579 20 7V17C20 18.4142 20 19.1213 19.5607 19.5607C19.1213 20 18.4142 20 17 20C15.5858 20 14.8787 20 14.4393 19.5607C14 19.1213 14 18.4142 14 17V7Z' stroke='currentColor' stroke-width='1.5' fill='currentColor'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  width: 60px;
  height: 60px;
  opacity: 0.6;
  text-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5);
  animation: pulsate 3s infinite ease-in-out;
  }

  &.loading::before {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  content: "";
  /* Inline SVG for an animated spinner; adjust as needed */
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 50 50' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='25' cy='25' r='20' fill='none' stroke='%23ffffff' stroke-width='5' stroke-dasharray='31.415, 31.415' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 25 25' to='360 25 25' dur='1s' repeatCount='indefinite'/%3E%3C/circle%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  width: 60px;
  height: 60px;
  opacity: 0.8;
  animation: pulsate 3s infinite ease-in-out;
  }

  &:hover::before {
  color: #eee;
  opacity: 1;
  }
}

    .gazcard .img {
      margin-top: 0; /* Reset margin if any exists */
      margin-bottom: 10px; /* Space below the image */
      position: relative; /* Default positioning for the image */
      top: 0; /* Align the image at the top of the card */
  }

  .gazcard .img img {
      display: block; /* Ensures the image behaves like a block */
      margin: 0 auto; /* Center the image horizontally */
      max-width: 100%; /* Prevent overflow */
      
  }


  .gcvoicedesc {
      padding: 5px 15px;
      font-size: 0.85rem;
      text-align: justify;
      line-height: 1.4;
      flex: 1 1 auto;         /* Let it grow/shrink to fill available vertical space */
      overflow-y: auto;       /* If the content exceeds the available space, scroll */
      max-height: 190px;      /* Or whichever max suits you */
      min-height: 190px;  /* So we will always be 200px */
      width: 100%;            /* Ensure it uses the full card width if desired */
      text-align: center;     /* or justify, up to you */
      margin-top: 10px;       /* Some breathing room above */
      /* rest of your existing styling */
      -ms-overflow-style: none; /* IE 10+ */
      scrollbar-width: none; /* Firefox */
  }
      /* For WebKit browsers (Chrome, Safari, etc.) */
  .gcvoicedesc::-webkit-scrollbar {
  display: none;
  }



  /* Ensure list items are positioned relative so the pseudo-element can be positioned absolutely */
  .gcvoicedesc .list-group-item {
  position: relative;
  /* Optional: add transition for a smoother effect */
  transition: background-color 0.2s ease;
  }

  /* On hover, change background and add the play icon */
  .gcvoicedesc .list-group-item:hover {
  background-color: #f0f0f0; /* or whichever color you prefer */
  }

  .gcvoicedesc .list-group-item:hover::after {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' color='%23000000' fill='none'%3E%3Ccircle cx='12' cy='12' r='10' stroke='currentColor' stroke-width='1.5' /%3E%3Cpath d='M9.5 11.1998V12.8002C9.5 14.3195 9.5 15.0791 9.95576 15.3862C10.4115 15.6932 11.0348 15.3535 12.2815 14.6741L13.7497 13.8738C15.2499 13.0562 16 12.6474 16 12C16 11.3526 15.2499 10.9438 13.7497 10.1262L12.2815 9.32594C11.0348 8.6465 10.4115 8.30678 9.95576 8.61382C9.5 8.92086 9.5 9.6805 9.5 11.1998Z' fill='currentColor' /%3E%3C/svg%3E");
  /*background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000000' width='16' height='16'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E") no-repeat center center;*/
  background-size: contain;

  /* Position the icon at the right side of the list item */
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  }


  .gazbadge
  {
    margin-top: 0.4em !important;
    font-size: 70% !important;
    border-radius: 0.2rem !important;
  }

  /* General Card Styling */
  .gazcard {
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      /*padding: 20px;*/
      position: relative;
      background: #fff;
      border-radius: 8px;
      box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
  }

  /* Top-Right Button */
  .newdemosforcard {
    position: absolute;
    top: 0px;
    right: 5px;
    padding: 5px;
    border-radius: 50%;
    z-index: 1;
  }
   .newvoiceforcard {
    position: absolute;
    top: 0px;
    left: 5px;
    padding: 5px;
    border-radius: 50%;
    z-index: 2;
  }


  .gazcard .img img {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      object-fit: cover;
      border: 4px solid #fff;
  }

  /* Name and Subheading */
  .card-header {
      width: 100%;
      background: linear-gradient(to right, #88e6ff 80%, rgba(249, 249, 249, 0));
      /*margin-left: -40px;*/
      padding: 10px 0;
      text-align: center;
      margin-top: 5px;
  }

  /* Override color */
  .card-headerf {
      background: linear-gradient(to right, #ffcaca 80%, rgba(249, 249, 249, 0));
  }

  /*
  .artist-name {
      font-size: 1.25rem;
      font-weight: bold;
      margin: 0;
  }*/

  .artist-subheading {
      font-size: 1.1rem;
      color: #6a6d78; /* A lighter color for the subheading */
      margin: 5px 0 0;
      font-family: 'Asap Condensed';
  }

  .featured-3 {
    position: relative;
    margin-top: -40rem;
    font-size: 0.85rem;
}


  .artist-tab-icon1 {

    background-image: url('data:image/svg+xml,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 stroke%3D%22%23180098%22 stroke-width%3D%221.5%22 stroke-linejoin%3D%22round%22%3E%3Cpath d%3D%22M9 22L9.00192 17.9976C9.00236 17.067 9.00258 16.6017 9.15462 16.2347C9.35774 15.7443 9.74746 15.3547 10.2379 15.1519C10.6051 15 11.0704 15 12.001 15V15C12.9319 15 13.3974 15 13.7647 15.152C14.2553 15.355 14.645 15.7447 14.848 16.2353C15 16.6026 15 17.0681 15 17.999V22%22%3E%3C/path%3E%3Cpath d%3D%22M7.08848 4.76243L6.08847 5.54298C4.57181 6.72681 3.81348 7.31873 3.40674 8.15333C3 8.98792 3 9.95205 3 11.8803V13.9715C3 17.7562 3 19.6485 4.17157 20.8243C5.34315 22 7.22876 22 11 22H13C16.7712 22 18.6569 22 19.8284 20.8243C21 19.6485 21 17.7562 21 13.9715V11.8803C21 9.95205 21 8.98792 20.5933 8.15333C20.1865 7.31873 19.4282 6.72681 17.9115 5.54298L16.9115 4.76243C14.5521 2.92081 13.3724 2 12 2C10.6276 2 9.44787 2.92081 7.08848 4.76243Z%22%3E%3C/path%3E%3C/svg%3E');

    }


    .artist-tab-icon2 {

    background-image: url('data:image/svg+xml,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 stroke%3D%22%23180098%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%3E%3Cpath d%3D%22M9 3V21%22/%3E%3Cpath d%3D%22M6 7V17%22/%3E%3Cpath d%3D%22M12 6V18%22/%3E%3Cpath d%3D%22M15 9L15 15%22/%3E%3Cpath d%3D%22M18 7L18 17%22/%3E%3Cpath d%3D%22M21 11L21 13%22/%3E%3Cpath d%3D%22M3 11L3 13%22/%3E%3C/svg%3E');

    }

    .artist-tab-icon3 {

    background-image: url('data:image/svg+xml,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 stroke%3D%22%23180098%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%3E%3Cpath d%3D%22M20 14.0052V10.6606C20 9.84276 20 9.43383 19.8478 9.06613C19.6955 8.69843 19.4065 8.40927 18.8284 7.83096L14.0919 3.09236C13.593 2.59325 13.3436 2.3437 13.0345 2.19583C12.9702 2.16508 12.9044 2.13778 12.8372 2.11406C12.5141 2 12.1614 2 11.4558 2C8.21082 2 6.58831 2 5.48933 2.88646C5.26731 3.06554 5.06508 3.26787 4.88607 3.48998C4 4.58943 4 6.21265 4 9.45908V14.0052C4 17.7781 4 19.6645 5.17157 20.8366C6.11466 21.7801 7.52043 21.9641 10 22M13 2.50022V3.00043C13 5.83009 13 7.24492 13.8787 8.12398C14.7574 9.00304 16.1716 9.00304 19 9.00304H19.5%22/%3E%3Cpath d%3D%22M15.5088 14.8215C15.6913 14.3928 16.3087 14.3928 16.4912 14.8215L17.3329 16.7988L19.509 16.9692C19.9822 17.0063 20.1733 17.5879 19.8118 17.8905L18.1566 19.2758L18.6635 21.3521C18.7741 21.8049 18.2743 22.1639 17.8696 21.9224L16 20.8067L14.1304 21.9224C13.7257 22.1639 13.2259 21.8049 13.3365 21.3521L13.8434 19.2758L12.1882 17.8905C11.8267 17.5879 12.0178 17.0063 12.491 16.9692L14.6671 16.7988L15.5088 14.8215Z%22/%3E%3C/svg%3E');

    }

    .artist-tab-icon4 {

    background-image: url('data:image/svg+xml,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 stroke%3D%22%23180098%22 stroke-width%3D%221.5%22 stroke-linecap%3D%22round%22 stroke-linejoin%3D%22round%22%3E%3Cpath d%3D%22M11.9959 12H12.0049%22 stroke-width%3D%222%22/%3E%3Cpath d%3D%22M15.9998 12H16.0088%22 stroke-width%3D%222%22/%3E%3Cpath d%3D%22M7.99981 12H8.00879%22 stroke-width%3D%222%22/%3E%3Cpath d%3D%22M22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C17.5228 22 22 17.5228 22 12Z%22 stroke-width%3D%221.5%22/%3E%3C/svg%3E');

    }

    /*
    .artist-tab-icon.selected {
    border: 2px solid #180098;
    border-radius: 50%;
    }
    */


    .artist-tab-icon {
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    cursor: pointer;
    /* So any outline or background is a circle */
    padding: 4px; /* Some padding so the circle is visible */
    transition: 0.3s ease;
    /* Optionally define a default background for the icon, e.g. transparent or white */
    }

    .voice-market-icon-standard {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='none'%3E%3Cpath fill='%230073ff' d='M14.6 1.55c.249.331.181.802-.15 1.05L12.25 4.25h1.3c1.837 0 3.283 0 4.425.137 1.168.14 2.115.433 2.9 1.091.234.197.45.413.647.647.658.785.951 1.732 1.091 2.9.137 1.142.137 2.588.137 4.425v.1c0 1.837 0 3.283-.137 4.425-.14 1.168-.433 2.115-1.091 2.9a4.534 4.534 0 0 1-.647.647c-.785.658-1.732.951-2.9 1.091-1.142.137-2.588.137-4.425.137h-3.1c-1.837 0-3.283 0-4.425-.137-1.168-.14-2.116-.433-2.9-1.091a4.54 4.54 0 0 1-.647-.647c-.658-.785-.951-1.732-1.091-2.9C1.25 16.833 1.25 15.387 1.25 13.55v-.1c0-1.837 0-3.283.137-4.425.14-1.168.433-2.115 1.091-2.9.197-.234.413-.45.647-.647.784-.658 1.732-.951 2.9-1.091 1-.12 2.223-.136 3.733-.137L13.55 1.4c.331-.248.801-.181 1.05.15ZM4.09 6.627c-.168.141-.322.295-.463.463-.394.47-.628 1.09-.751 2.114-.125 1.042-.126 2.398-.126 4.296 0 1.898.001 3.254.126 4.296.123 1.024.357 1.644.751 2.114.141.168.295.322.463.463.47.394 1.09.628 2.114.751 1.042.125 2.398.126 4.296.126h3c1.898 0 3.254-.001 4.296-.126 1.024-.123 1.644-.357 2.114-.751.168-.141.322-.295.463-.463.394-.47.628-1.09.751-2.114.125-1.042.126-2.398.126-4.296 0-1.898-.001-3.254-.126-4.296-.123-1.024-.357-1.644-.751-2.114a3.043 3.043 0 0 0-.463-.463c-.47-.394-1.09-.628-2.114-.751-1.042-.125-2.398-.126-4.296-.126h-3c-1.898 0-3.254.001-4.296.126-1.024.123-1.644.357-2.114.751ZM14.5 9.25c2.347 0 4.25 1.903 4.25 4.25s-1.903 4.25-4.25 4.25-4.25-1.903-4.25-4.25 1.903-4.25 4.25-4.25Zm-2.75 4.25c0 1.519 1.231 2.75 2.75 2.75s2.75-1.231 2.75-2.75-1.231-2.75-2.75-2.75-2.75 1.231-2.75 2.75ZM6 11.25h1a.75.75 0 0 1 0 1.5H6a.75.75 0 0 1 0-1.5Zm0 3h1a.75.75 0 0 1 0 1.5H6a.75.75 0 0 1 0-1.5Z'/%3E%3C/svg%3E");
    }

    .voice-market-icon-premium {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20' fill='none'%3E%3Cpath fill='%23d90429' d='M14.6 1.55c.249.331.181.802-.15 1.05L12.25 4.25h1.3c1.837 0 3.283 0 4.425.137 1.168.14 2.115.433 2.9 1.091.234.197.45.413.647.647.658.785.951 1.732 1.091 2.9.137 1.142.137 2.588.137 4.425s0 3.283-.137 4.425c-.14 1.168-.433 2.115-1.091 2.9-.197.234-.413.45-.647.647-.785.658-1.732.951-2.9 1.091-1.142.137-2.588.137-4.425.137h-3.1c-1.837 0-3.283 0-4.425-.137-1.168-.14-2.116-.433-2.9-1.091a4.54 4.54 0 0 1-.647-.647c-.658-.785-.951-1.732-1.091-2.9C1.25 16.833 1.25 15.387 1.25 13.55v-.1c0-1.837 0-3.283.137-4.425.14-1.168.433-2.115 1.091-2.9.197-.234.413-.45.647-.647.784-.658 1.732-.951 2.9-1.091 1-.12 2.223-.136 3.733-.137L13.55 1.4c.331-.248.801-.181 1.05.15ZM4.09 6.627c-.168.141-.322.295-.463.463-.394.47-.628 1.09-.751 2.114-.125 1.042-.126 2.398-.126 4.296 0 1.898.001 3.254.126 4.296.123 1.024.357 1.644.751 2.114.141.168.295.322.463.463.47.394 1.09.628 2.114.751 1.042.125 2.398.126 4.296.126h3c1.898 0 3.254-.001 4.296-.126 1.024-.123 1.644-.357 2.114-.751.168-.141.322-.295.463-.463.394-.47.628-1.09.751-2.114.125-1.042.126-2.398.126-4.296 0-1.898-.001-3.254-.126-4.296-.123-1.024-.357-1.644-.751-2.114a3.043 3.043 0 0 0-.463-.463c-.47-.394-1.09-.628-2.114-.751-1.042-.125-2.398-.126-4.296-.126h-3c-1.898 0-3.254.001-4.296.126-1.024.123-1.644.357-2.114.751ZM14.5 8.75a.75.75 0 0 1 .75.75V11h1.5a.75.75 0 0 1 0 1.5h-1.5V14a.75.75 0 0 1-1.5 0v-1.5h-1.5a.75.75 0 0 1 0-1.5h1.5V9.5a.75.75 0 0 1 .75-.75ZM6 11.25h1a.75.75 0 0 1 0 1.5H6a.75.75 0 0 1 0-1.5Zm0 3h1a.75.75 0 0 1 0 1.5H6a.75.75 0 0 1 0-1.5Z'/%3E%3C/svg%3E");
    }

    .artist-tab-icon:hover {
    box-shadow: 0 0 0 2px #b9c5d1; /* A ring in the official Bootstrap blue */
    }

    .artist-tab-icon.selected {
    box-shadow: none; /* Disable box-shadow */
    outline: 2px solid #007bff; /* A ring in the official Bootstrap blue */
    outline-offset: 4px; /* Adjust this value for the padding effect */
    border-radius: 50%; /* Maintain rounded appearance */
    }

    .artist-tab-container {
    display: inline-block;
    padding: 6px; /* Adds space around the icon */
    border-radius: 50%; /* Ensures the container is circular */
    }


    .badges svg {
      margin-right: 8px;
  }


    .gazcard .card-footer {
      /*margin-top: auto; */   /* Pin the footer to the bottom if there's extra space */
      display: flex;       /* existing layout rules */
      justify-content: center;
      align-items: center;
      /*margin-left: -40px;*/
      /* margin-right: +5px; */
      background: linear-gradient(to right, #e3e3e3 80%, rgb(255 255 255 / 0%));
      /* etc. */
  }

  /*
  .card-footer {
      display: flex;
      justify-content: center; 
      align-items: center; 
      flex-wrap: wrap; 
      margin-left: -32px;
      background: linear-gradient(to right, #e3e3e3 80%, rgb(255 255 255 / 0%));
  
  }*/

  .card-footer .badges {
      display: flex; /* Enable flexbox for badges */
      gap: 10px; /* Add space between badges */
      justify-content: center; /* Ensure badges are horizontally centered */
      flex-wrap: wrap; /* Wrap badges to the next line if needed */
  }

  .card-footer .badges svg {
      display: block; /* Ensure SVGs behave like block elements */
      margin: 0 auto; /* Center-align SVGs horizontally */
  }

  /* dynamic placeholder images */
  .avatar-container {
    position: relative;
    background-color: #ff8800;
    border-radius: 50%;
    width: 108px;
    height: 108px;
    overflow: hidden;
  } 

  
  /* Make the inner container mimic the PHP-generated inner div */
  .avatar-container .avatar-inner {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
    border-radius: inherit;
    /* Remove the extra border that was added in JS */
    border: none;
    object-fit: cover;
  }
  
  /* Style the placeholder text exactly as in PHP */
  .avatar-container .avatar-inner .placeholder-text {
    position: absolute;
    top: -40px;
    left: -20px;
    width: 200px;
    font-size: 11px;
    opacity: 0.55;
    transform: rotate(-30deg);
    white-space: normal;
    pointer-events: none;
  }

  .avatar-image {
    display: block; /* or remove any inline display: none */
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  
  .avatar-image.lazyloaded {
    opacity: 1;
  }

  .avatar-inner .placeholder-text.lazyloaded {
    z-index: -1;
  }


  .filter-dropdown-wrapper {
    display: flex;
    align-items: center;
    justify-content: center; /* centre items, you can also try flex-start */
    gap: 1rem;               /* set the desired gap between dropdowns, adjust as needed */
    padding: 0 1rem;         /* add some horizontal padding */
    /* Optionally constrain the max width so the items don't get too spread out */
    max-width: 1200px;
    margin: 0 auto;
    font-size: 0.9rem;
  }

  /*.gcspacer
  {
    padding-top: 0;
  }*/

@media (max-width: 768px) {
  .list-voicecard {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px;
    text-align: left;
  }

  .list-voicecard-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 0;
  }

  .list-voicecard-text {
    width: 100%;
  }

  .heading-line {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.5rem;
    width: 100%;
  }

  .heading-line .artist-subheading {
    display: block;
    width: 100%;
  }

  .list-voicecard-controls-wrapper {
    margin: 12px 0 0 0 !important;
    width: 100%;
  }

  .list-voicecard-controls-wrapper .list-voicecard-controls {
    justify-content: flex-start;
    width: 100%;
  }
}