#weavemap-error-dialog {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99999;
    max-width: 600px;
    width: 90%;
}

#weavemap-error-dialog .btn-close {
    filter: none;
    opacity: 1;
}

.nunito-sans-normal-font {
    font-family: "Nunito Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "wdth" 100, "YTLC" 500;
}

.bricolage-grotesque-semibold-font {
    font-family: "Bricolage Grotesque", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    font-variation-settings: "wdth" 100;
}

html, body {
    font-family: "Nunito Sans", 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a, .btn-link {
    color: #0F1337;
    font-weight: 500;
}

.btn-primary {
    color: #fff;
    background-color: #DF5D5B;
    border-color: #DF5D5B;
    padding-inline: 1rem;
    margin-bottom: 2rem;
    border-radius: 0.5rem;
}

tr .btn-primary {
    margin-bottom: 0; /* Remove margin for buttons in table rows */
}

.generated-content-frame .btn-primary {
    margin-bottom: 0; /* Remove margin for buttons inside generaed content frame (Show Transcription button) */
}

.btn-primary-less-bottom-margin {
    margin-bottom: 1rem; /* Smaller margin for buttons e.g. above tables (refresh button etc) */
}

/* Spacing if two or more buttons are next to each other, without adding margins at the edges: */
.btn-primary + .btn-primary {
    margin-left: 1rem;
}

.btn-primary:hover {
    color: #fff;
    background-color: #DDB634;
    border-color: #DDB634;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.btn:disabled {
    background-color: #c5c5c5;
    border-color: #c5c5c5;
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary-selected {
    background-color: #8CCB88;
    border-color: #8CCB88;
    color: #4B4B4B
}

.content {
    padding-top: 1.1rem;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Bricolage Grotesque", "Nunito Sans", 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    font-variation-settings: "wdth" 100;
    margin-top: 1.9rem;
}

h1 {
    font-size: 48px;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #8CCB88;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #DF5D5B;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred."
}

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

.meetings-table {
    background-color: transparent;
    border-collapse: separate;
    border-spacing: 0;
}

.meetings-table tr th,
.meetings-table tr td {
    border-right: 0.1rem solid #0F1337;
    border-bottom: 0.1rem solid #0F1337;
    padding: 0.45rem;
}

.meetings-table tr th:first-child,
.meetings-table tr td:first-child {
    border-left: 0.1rem solid #0F1337;
}

.meetings-table tr th {
    background: #E7E8EF;
    text-align: left;
    border-top: solid 0.1rem #0F1337;
}

/* top-left border-radius */
.meetings-table tr:first-child th:first-child {
    border-top-left-radius: 0.5rem;
}

/* top-right border-radius */
.meetings-table tr:first-child th:last-child {
    border-top-right-radius: 0.5rem;
}

/* bottom-left border-radius */
.meetings-table tr:last-child td:first-child {
    border-bottom-left-radius: 0.5rem;
}

/* bottom-right border-radius */
.meetings-table tr:last-child td:last-child {
    border-bottom-right-radius: 0.5rem;
}


.linkBackImage {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%230F1337'%3E%3Cpath d='m385-421 137.21 137.21Q540-266 540.5-241.5T523-198.52Q505-181 480.5-181.5t-42.31-18.32L200.4-437.91q-8.4-8.41-13.4-19.72-5-11.31-5-22.53 0-11.21 5-22.53Q192-514 200-522l239-239q19-19 42.67-19 23.66 0 41.33 19 18 17.67 18 41.83 0 24.17-17.84 42.01L385-539h358.02q24.29 0 41.64 17.29Q802-504.42 802-480.21t-17.34 41.71Q767.31-421 743.02-421H385Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    width: 1rem;
    height: 1rem;
    margin-right: 0.25rem;
    position: relative;
    top: 0.1rem;
}

.bi2-house-door-fill-nav-menu {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.th-sort {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='48px' viewBox='0 -960 960 960' width='48px' fill='%230F1337'%3E%3Cpath d='M141-189q-20.1 0-33.05-13.68Q95-216.35 95-236.33q0-19.99 12.95-33.33T141-283h185q19.98 0 33.49 13.68Q373-255.65 373-235.08t-13.51 33.33Q345.98-189 326-189H141Zm0-244q-20.1 0-33.05-13.68Q95-460.35 95-480.33q0-19.99 12.95-33.33T141-527h431q19.97 0 33.49 14.26Q619-498.47 619-478.49t-13.51 32.74Q591.97-433 572-433H141Zm0-244q-20.1 0-33.05-13.68Q95-704.35 95-724.42t13.63-32.83Q122.25-770 142-770h677q19.97 0 33.49 13.68Q866-742.65 866-722.58t-14.19 32.83Q837.63-677 818-677H141Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    width: 1rem;
    height: 1rem;
    margin-right: 0.25rem;
    margin-left: 0.0rem;
    position: relative;
    top: 0.1rem;
}

.th-sort-desc {
    transform: scaleY(-100%);
}

.copy-of-meeting-frame {
    border-width: 0.1rem;
    border-color: #0F1337;
    border-radius: 0.5rem;
    border-style: solid;
    padding: 0.5rem;
    margin: 0.5rem 0 1.5rem 0;
}

.generated-content-frame {
    border-width: 0.1rem;
    border-color: #0F1337;
    border-radius: 0.5rem;
    border-style: solid;
    padding: 0.5rem;
    margin: 0.5rem 0 1.5rem 0;
}

.scroll-if-over-50 {
    max-height: 50vh;
    overflow-y: auto;
}


.cesium-custom-button{
    background-color: white;
    border-radius: 0.5rem;
    border: 0 solid #0F1337;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.21);
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0.5rem;
}

.cesium-custom-button:hover {
    background-color: #DDB634;
}

.cesium-layout-button-selected{
    background-color: #8CCB88;
}

.cesium-layout-button-container {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
    z-index: 1; /* Ensure the buttons are above the Cesium canvas */
}

.cesium-scenario-container {
    margin: 5px 10px 10px;
}
.cesium-scenario-dropdown-container {
    display: inline-block;
    background: rgba(38, 38, 38, 0.75);
    padding: 0 1px 0 10px;
    height: 32px;
    border-radius: 0.5rem;
}
.cesium-scenario-dropdown-container label {
    margin-right: 10px;
    color: #edffff;
    font-weight: bold;
}
.cesium-scenario-dropdown-container select {
    padding: 5px;
    min-width: 250px;
    background: #303336;
    color: #edffff;
    border: 1px solid #444;
    border-radius: 0.5rem;
}
.cesium-scenario-dropdown-container span {
    padding: 5px;
    min-width: 250px;
    display: inline-block;
    height: 32px;
    background: #303336;
    color: #edffff;
    border: 1px solid #444;
    border-radius: 0.5rem;
}
.cesium-scenario-navigation-container {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    margin-left: 0.5rem;
}
.cesium-scenario-navigation-container .cesium-custom-button {
    background-color: #303336;
    color: #edffff;
    border: 1px solid #444;
}
.cesium-scenario-navigation-container .cesium-custom-button:hover:not(:disabled) {
    background-color: #404346;
}
.cesium-scenario-navigation-container .cesium-custom-button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.scenario-step-counter {
    background: rgba(38, 38, 38, 0.75);
    padding: 5px 10px;
    border-radius: 0.5rem;
    font-weight: bold;
    color: #edffff;
    min-width: 50px;
    text-align: center;
    position: relative;
}
.scenario-step-spinner {
    display: none;
    position: absolute;
    inset: 0;
    margin: auto;
    width: 20px;
    height: 20px;
    background-color: rgba(0, 0, 0, 0.4);
    border: 2px solid rgba(237, 255, 255, 0.45);
    border-top-color: rgba(237, 255, 255, 0.99);
    border-radius: 50%; /* Making the border a circle */
    animation: scenario-spin 0.8s linear infinite;
    pointer-events: none;
}
.scenario-step-counter.loading .scenario-step-spinner {
    display: block;
}
@keyframes scenario-spin {
    to { transform: rotate(360deg); }
}

#cesiumMapLayersContainer {
    margin-bottom: 10px;
    margin-top: 5px;
    margin-right: 10px;
    margin-left: 10px;
    position: relative;
}

.cesium-map-layers-toggle {
    background: rgba(38, 38, 38, 0.75);
    color: #edffff;
    border: 1px solid #444;
    border-radius: 0.5rem;
    padding: 0 10px;
    height: 32px;
    cursor: pointer;
    font-weight: bold;
}

.cesium-map-layers-toggle:hover {
    background: rgba(58, 58, 58, 0.85);
}

.cesium-map-layers-panel {
    position: absolute;
    left: 0;
    background: rgba(38, 38, 38, 0.95);
    border: 1px solid #444;
    border-radius: 0.5rem;
    padding: 8px;
    min-width: 420px;
    max-height: 400px;
    overflow-y: auto;
    z-index: 100;
}

.cesium-map-layers-panel::-webkit-scrollbar {
    width: 8px;
}

.cesium-map-layers-panel::-webkit-scrollbar-track {
    background: rgba(38, 38, 38, 0.5);
    border-radius: 0 0.5rem 0.5rem 0;
}

.cesium-map-layers-panel::-webkit-scrollbar-thumb {
    background: #555;
    border-radius: 0.5rem;
}

.cesium-map-layers-panel::-webkit-scrollbar-thumb:hover {
    background: #777;
}

.cesium-map-layers-group-header {
    color: #DDB634;
    font-weight: bold;
    font-size: 0.85em;
    margin-top: 8px;
    margin-bottom: 4px;
    padding-bottom: 2px;
    border-bottom: 1px solid #555;
}

.cesium-map-layers-group-header:first-child {
    margin-top: 0;
}

.cesium-map-layers-item {
    display: flex;
    align-items: center;
    color: #edffff;
    padding: 2px 0;
    cursor: pointer;
    font-size: 0.9em;
}

.cesium-map-layers-item:hover {
    background: rgba(68, 68, 68, 0.5);
}

.cesium-map-layers-item input[type="checkbox"] {
    margin-right: 6px;
}

.cesium-map-layers-item input[type="radio"] {
    margin-right: 6px;
}

.cesium-map-layers-zoom-btn {
    margin-left: auto;
    background: transparent;
    border: none;
    cursor: pointer;
    font-size: 0.85em;
    padding: 0 4px;
    line-height: 1;
    opacity: 0.6;
    transition: opacity 0.15s;
}

.cesium-map-layers-zoom-btn:hover {
    opacity: 1;
}

.cesium-toolbar-button {
    border-radius: 0.5rem !important;
}
.cesium-viewer-geocoderContainer {
    border-radius: 0.5rem !important;
}
.cesium-geocoder-input {
    border-radius: 0.5rem !important;
}
.cesium-geocoder-searchButton {
    border-radius: 0.5rem !important;
}
.cesium-button {
    border-radius: 0.5rem !important;
}
.cesium-viewer-fullscreenContainer {
    margin-bottom: 10px;
    margin-right: 5px;
}

.cesium-scenario-sharing-container {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 0.4rem;
    margin-left: 0.5rem;
    position: relative;
}

/* Reserve space for all three buttons so the container width stays constant */
.cesium-scenario-sharing-container .cesium-share-button {
    visibility: hidden;
}

.cesium-scenario-sharing-container .cesium-share-button.visible {
    visibility: visible;
}

.cesium-share-button {
    background: rgba(38, 38, 38, 0.75);
    color: #edffff;
    border: 1px solid #444;
    border-radius: 0.5rem;
    padding: 0 10px;
    height: 32px;
    cursor: pointer;
    font-size: 0.85em;
    white-space: nowrap;
}

.cesium-share-button:hover:not(:disabled) {
    background: rgba(58, 58, 58, 0.85);
}

.cesium-share-button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.cesium-share-button-danger:hover:not(:disabled) {
    background: rgba(180, 50, 50, 0.85);
}

.cesium-share-toast {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    background: #8CCB88;
    color: #1a1a1a;
    padding: 4px 12px;
    border-radius: 0.5rem;
    font-size: 0.85em;
    font-weight: bold;
    white-space: nowrap;
    pointer-events: none;
    animation: shareFadeInOut 3s ease-in-out;
}

@keyframes shareFadeInOut {
    0% { opacity: 0; }
    10% { opacity: 1; }
    80% { opacity: 1; }
    100% { opacity: 0; }
}

.meeting-copy-toast {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    background: #8CCB88;
    color: #1a1a1a;
    padding: 4px 12px;
    border-radius: 0.5rem;
    font-size: 0.85em;
    font-weight: bold;
    white-space: nowrap;
    pointer-events: none;
    margin-bottom: 4px;
    animation: meetingCopyFadeInOut 2s ease-in-out forwards;
}

@keyframes meetingCopyFadeInOut {
    0% { opacity: 0; }
    10% { opacity: 1; }
    75% { opacity: 1; }
    100% { opacity: 0; }
}

.description-icon {
    white-space: nowrap;
}

.recording-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2220px%22%20viewBox%3D%220%20-960%20960%20960%22%20width%3D%2220px%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M388-428.08q-37-39.09-37-94.92v-246q0-52.5%2037.68-90.25Q426.35-897%20480.18-897%20534-897%20572-859.25q38%2037.75%2038%2090.25v246q0%2055.83-37.44%2094.92Q535.12-389%20480.06-389T388-428.08ZM480-643Zm-41%20527v-97q-107-11-184-85.5T164-481q-3-16.85%208.59-29.43%2011.6-12.57%2029.5-12.57%2017.91%200%2030.41%2012.5T249-480q15%2084%2081.3%20136%2066.29%2052%20149.32%2052%2085.38%200%20150.88-52T712-480q3-18%2015.68-30.5%2012.67-12.5%2030.5-12.5Q776-523%20787-509.93q11%2013.08%209%2029.93-15%20106-91%20181t-184%2086v97q0%2017.85-11.96%2029.93Q497.07-74%20480.04-74%20463-74%20451-86.07%20439-98.15%20439-116Zm66.5-378.77Q515-506.55%20515-523v-245.87q0-13.73-10.29-23.93T480-803q-14.42%200-24.71%2010.2Q445-782.6%20445-768.87V-523q0%2016.45%209.61%2028.23%209.6%2011.77%2025.5%2011.77%2015.89%200%2025.39-11.77Z%22%2F%3E%3C%2Fsvg%3E");
}
.stop-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M215-309v-342q0-40.21%2027.1-67.61Q269.2-746%20309-746h342q40.21%200%2067.61%2027.39Q746-691.21%20746-651v342q0%2039.8-27.39%2066.9Q691.21-215%20651-215H309q-39.8%200-66.9-27.1Q215-269.2%20215-309Zm94%200h342v-342H309v342Zm171-171Z%22%2F%3E%3C%2Fsvg%3E");
}
.retry-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M236-477q0%2059%2022%20102t60%2075l24%2015v-70q0-15%2010-25t25.5-10q15.5%200%2025.5%2010t10%2025v163q0%2020-13.5%2033.5T366-145H204q-15%200-25-10.5T169-181q0-15%2010-25t26-10h69l-5-5q-65-56-96.5-117.5T141-477q0-102%2056-185.5T345-787q16-7%2030%203t19%2028q5%2018-3.5%2035T366-695q-60%2032-95%2090.5T236-477Zm488-6q0-44-22.5-90T645-655l-23-20v70q0%2015-10.5%2025T586-570q-15%200-25.5-10.5T550-606v-162q0-20%2013.5-33.5T598-815h161q15%200%2025.5%2010t10.5%2025q0%2015-10.5%2025.5T759-744h-71l6%207q62%2058%2093.5%20125T819-483q0%20101-54%20183.5T620-174q-16%208-31.5-1.5T568-204q-6-18%202.5-35t25.5-26q59-31%2093.5-90T724-483Z%22%2F%3E%3C%2Fsvg%3E");
}
.retry-icon-black::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23000000%22%3E%3Cpath%20d%3D%22M236-477q0%2059%2022%20102t60%2075l24%2015v-70q0-15%2010-25t25.5-10q15.5%200%2025.5%2010t10%2025v163q0%2020-13.5%2033.5T366-145H204q-15%200-25-10.5T169-181q0-15%2010-25t26-10h69l-5-5q-65-56-96.5-117.5T141-477q0-102%2056-185.5T345-787q16-7%2030%203t19%2028q5%2018-3.5%2035T366-695q-60%2032-95%2090.5T236-477Zm488-6q0-44-22.5-90T645-655l-23-20v70q0%2015-10.5%2025T586-570q-15%200-25.5-10.5T550-606v-162q0-20%2013.5-33.5T598-815h161q15%200%2025.5%2010t10.5%2025q0%2015-10.5%2025.5T759-744h-71l6%207q62%2058%2093.5%20125T819-483q0%20101-54%20183.5T620-174q-16%208-31.5-1.5T568-204q-6-18%202.5-35t25.5-26q59-31%2093.5-90T724-483Z%22%2F%3E%3C%2Fsvg%3E");
}
.sync-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M236-477q0%2059%2022%20102t60%2075l24%2015v-70q0-15%2010-25t25.5-10q15.5%200%2025.5%2010t10%2025v163q0%2020-13.5%2033.5T366-145H204q-15%200-25-10.5T169-181q0-15%2010-25t26-10h69l-5-5q-65-56-96.5-117.5T141-477q0-102%2056-185.5T345-787q16-7%2030%203t19%2028q5%2018-3.5%2035T366-695q-60%2032-95%2090.5T236-477Zm488-6q0-44-22.5-90T645-655l-23-20v70q0%2015-10.5%2025T586-570q-15%200-25.5-10.5T550-606v-162q0-20%2013.5-33.5T598-815h161q15%200%2025.5%2010t10.5%2025q0%2015-10.5%2025.5T759-744h-71l6%207q62%2058%2093.5%20125T819-483q0%20101-54%20183.5T620-174q-16%208-31.5-1.5T568-204q-6-18%202.5-35t25.5-26q59-31%2093.5-90T724-483Z%22%2F%3E%3C%2Fsvg%3E");
}
.refresh-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M477-135q-143%200-244-101T132-480q0-143%20101-244.5T477-826q91%200%20160.5%2036.5T757-687v-103q0-15%2010-25.5t25.5-10.5q15.5%200%2026%2010.5T829-790v208q0%2020-14%2033.5T781-535H572q-15%200-25-10.5T537-571q0-15%2010.5-25t25.5-10h128q-39-56-94-90.5T477-731q-105%200-178%2073t-73%20178q0%20105%2073%20178t178%2073q67%200%20126-33.5t92-91.5q11-16%2029-23t36%201q18%207%2025%2023.5t-1%2032.5q-44%2085-126.5%20135T477-135Z%22%2F%3E%3C%2Fsvg%3E");
}
.description-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M355-248h251q14.88%200%2024.94-10.57T641-284.05q0-14.91-10.06-24.93T606-319H354q-14.87%200-24.94%2010.09-10.06%2010.09-10.06%2025t10.35%2025.41Q339.7-248%20355-248Zm0-170h251q14.88%200%2024.94-10.57T641-454.05q0-14.91-10.06-24.93T606-489H354q-14.87%200-24.94%2010.09-10.06%2010.09-10.06%2025t10.35%2025.41Q339.7-418%20355-418ZM229-55q-39.05%200-66.52-27.47Q135-109.95%20135-149v-662q0-39.46%2027.48-67.23Q189.95-906%20229-906h323q19.56%200%2037.28%208Q607-890%20620-877l177%20177q13%2013%2021%2030.72t8%2037.28v483q0%2039.05-27.77%2066.53Q770.46-55%20731-55H229Zm313-617v-139H229v662h502v-476H589q-19.75%200-33.37-13.63Q542-652.25%20542-672ZM229-811v186-186%20662-662Z%22%2F%3E%3C%2Fsvg%3E");
}
.share-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M688.94-55q-56.44%200-96.69-40T552-191q0-8%204-26.83L283-378q-19.28%2017.34-41.91%2026.67Q218.45-342%20192-342q-57.08%200-97.04-40Q55-422%2055-480t39.96-98q39.96-40%2097.04-40%2026%200%2048.91%209.3%2022.92%209.29%2042.09%2025.7l272-156q-1-7-2-14.5t-1-14.5q0-56.42%2040.31-97.21Q632.62-906%20689.06-906t96.69%2040.81Q826-824.38%20826-767.94t-40.1%2096.69Q745.79-631%20688.5-631q-26.14%200-49.32-10T597-667L325-518q3%208.86%204.5%2019.15t1.5%2019.07q0%208.78-1%2017.78-1%209-4%2017l271%20153q19.03-17.06%2042.31-27.03%2023.27-9.97%2049.88-9.97%2057.73%200%2097.27%2040.04Q826-248.91%20826-191.71q0%2057.21-40.31%2096.96Q745.38-55%20688.94-55Zm-.52-87q21.58%200%2036.08-14.32%2014.5-14.33%2014.5-35.5%200-21.18-14.39-35.68-14.38-14.5-36.65-14.5-21.41%200-35.18%2014.54Q639-212.93%20639-191.96q0%2020.96%2013.92%2035.46t35.5%2014.5Zm-496.6-287q21.18%200%2036.68-14.32%2015.5-14.33%2015.5-36.5%200-22.18-15.44-36.68T191.65-531q-21.47%200-35.56%2014.32Q142-502.35%20142-480.18q0%2022.18%2014.32%2036.68%2014.33%2014.5%2035.5%2014.5ZM724.5-732.5q14.5-14.49%2014.5-35.92%200-21-14.53-35.79-14.52-14.79-36-14.79-21.47%200-35.97%2014.82-14.5%2014.81-14.5%2036.72%200%2021.05%2015.04%2035.25%2015.03%2014.21%2036%2014.21%2020.96%200%2035.46-14.5ZM690-192ZM193-480Zm496-288Z%22%2F%3E%3C%2Fsvg%3E");
}
.share-off-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M688.42-142q21.58%200%2036.08-14.32%2014.5-14.33%2014.5-35.5%200-21.18-14.39-35.68-14.38-14.5-36.65-14.5-21.41%200-35.18%2014.54Q639-212.93%20639-191.96q0%2020.96%2013.92%2035.46t35.5%2014.5Zm36.08-590.5q14.5-14.49%2014.5-35.92%200-21-14.53-35.79-14.52-14.79-36-14.79-21.47%200-35.97%2014.82-14.5%2014.81-14.5%2036.72%200%2021.05%2015.04%2035.25%2015.03%2014.21%2036%2014.21%2020.96%200%2035.46-14.5Zm-36%20101.5q-26.14%200-49.32-10T597-667L266-484q-13.23%206.8-26.16%2011.4Q226.92-468%20212-469q-1.02.43-1.69-.29-.66-.71-.43-.71-30.23%200-53.45%207-23.22%207-49.43%2020-10%206-19.5%204t-17-9.5Q63-456%2058-467t-3-25q4.08-52.81%2042.81-89.41Q136.55-618%20192-618q26%200%2048.91%209.3%2022.92%209.29%2042.09%2025.7l272-156q-1-7-2-14.5t-1-14.5q0-56.42%2040.31-97.21Q632.62-906%20689.06-906t96.69%2040.81Q826-824.38%20826-767.94t-40.1%2096.69Q745.79-631%20688.5-631Zm.44%20576q-56.44%200-96.69-40T552-191q0-8%204-27.1L459-274q-15-9-19-25t4.5-31q8.5-15%2025-19.5T501-347l96%2055q19.03-17.06%2042.31-27.03%2023.27-9.97%2049.88-9.97%2057.73%200%2097.27%2040.04Q826-248.91%20826-191.71q0%2057.21-40.31%2096.96Q745.38-55%20688.94-55ZM85.5-85.5Q30-141%2030-219.29q0-78.3%2055.5-134.5Q141-410%20219.29-410q78.3%200%20134.5%2056.21Q410-297.59%20410-219.29%20410-141%20353.79-85.5%20297.59-30%20219.29-30%20141-30%2085.5-85.5ZM219-178l49%2048q6.64%208%2018.82%207.5t20.18-8.26q8-7.76%208-19.5T307-170l-49-48%2052-52q8-6.55%208-18.77%200-12.23-7.93-20.23t-20.18-8q-12.25%200-19.89%208l-50%2050-50-51q-7.27-8-19.14-8-11.86%200-19.86%207.93t-8%2020.18q0%2012.25%208%2019.89l49%2050-50%2049q-8%208.73-8%2020.36%200%2011.64%208.86%2020.64%208.85%209%2020.18%209%2011.32%200%2019.96-9l48-48Zm471-14Zm-1-576Z%22%2F%3E%3C%2Fsvg%3E");
}
.delete-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M253-95q-40.21%200-67.61-27.1Q158-149.2%20158-189v-553h-11q-19.75%200-33.37-13.68Q100-769.35%20100-789.18q0-19.82%2013.63-33.32Q127.25-836%20147-836h184q0-20%2013.63-34%2013.62-14%2033.37-14h203q19.75%200%2033.38%2014.19Q628-855.63%20628-836h185q19.75%200%2033.38%2013.68Q860-808.65%20860-788.82q0%2019.82-13.62%2033.32Q832.75-742%20813-742h-11v553q0%2039.8-27.39%2066.9Q747.21-95%20707-95H253Zm454-647H253v553h454v-553ZM420-278.26q11-11.26%2011-26.74v-323q0-15.47-11.18-26.74Q408.65-666%20392.32-666%20376-666%20365-654.74q-11%2011.27-11%2026.74v323q0%2015.48%2011.18%2026.74Q376.35-267%20392.68-267%20409-267%20420-278.26Zm175.5%200Q607-289.52%20607-305v-323q0-15.47-11.57-26.74Q583.86-666%20567.93-666t-27.43%2011.26Q529-643.47%20529-628v323q0%2015.48%2011.87%2026.74Q552.74-267%20568.37-267t27.13-11.26ZM253-742v553-553Z%22%2F%3E%3C%2Fsvg%3E");
}
.copy-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M326-192q-39.05%200-66.52-27.48Q232-246.95%20232-286v-542q0-39.46%2027.48-67.23Q286.95-923%20326-923h422q39.46%200%2067.23%2027.77Q843-867.46%20843-828v542q0%2039.05-27.77%2066.52Q787.46-192%20748-192H326Zm0-94h422v-542H326v542ZM172-37q-39.46%200-67.23-27.77Q77-92.54%2077-132v-589q0-19.75%2013.68-33.38%2013.67-13.62%2034-13.62%2020.32%200%2033.82%2013.62Q172-740.75%20172-721v589h469q19.75%200%2033.38%2013.68%2013.62%2013.67%2013.62%2034Q688-64%20674.38-50.5%20660.75-37%20641-37H172Zm154-249v-542%20542Z%22%2F%3E%3C%2Fsvg%3E");
}
.arrow-back-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22m315-433%20198%20198q14%2014.09%2014.5%2033.55.5%2019.45-13.5%2033.88-14%2014.57-33.82%2014.07T446-168L168-446q-6.91-7.17-10.95-16.19-4.05-9.03-4.05-17.92%200-8.89%204.05-17.84Q161.09-506.9%20168-514l279-279q15.5-14%2034.25-14T514-793q14%2015%2014%2033.93%200%2018.94-14%2033.07L315-527h463q19.88%200%2033.94%2013.5Q826-500%20826-480t-14.06%2033.5Q797.88-433%20778-433H315Z%22%2F%3E%3C%2Fsvg%3E");
}
.cancel-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22m480-430%20117%20117q11%2011%2025%2011t25.5-11.51q11.5-11.5%2011.5-25.24%200-13.74-12-25.25L530-480l117-117q11-11%2011.5-25t-11.11-25.5q-11.6-11.5-25.5-11.5Q608-659%20597-647L480-530%20363-647q-11-11-24.5-11.5t-25%2011.11q-11.5%2011.6-11.5%2025.5Q302-608%20314-597l116%20117-117%20117q-11%2011-11%2024.5t11.51%2025q11.5%2011.5%2025.24%2011.5%2013.74%200%2025.25-12l116-116Zm.14%20375Q392-55%20314.5-88%20237-121%20179-179T88-314.36q-33-77.36-33-165.5Q55-569%2088-646.5q33-77.5%2090.84-135.05%2057.85-57.56%20135.28-91Q391.56-906%20479.78-906q89.22%200%20166.84%2033.37t135.09%2090.79q57.48%2057.42%2090.89%20134.96Q906-569.34%20906-480q0%2088.28-33.45%20165.76-33.44%2077.48-91%20135.36Q724-121%20646.64-88q-77.36%2033-166.5%2033Zm-.14-94q138%200%20234.5-96.37T811-480q0-138-96.5-234.5t-235-96.5q-137.5%200-234%2096.5t-96.5%20235q0%20137.5%2096.37%20234T480-149Zm0-331Z%22%2F%3E%3C%2Fsvg%3E");
}
.zoom-in-icon::before {
    content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20-960%20960%20960%22%20fill%3D%22%23FFFFFF%22%3E%3Cpath%20d%3D%22M346-556h-52q-12.75%200-21.37-8.68-8.63-8.67-8.63-21.5%200-12.82%208.63-21.32%208.62-8.5%2021.37-8.5h52v-51q0-12.75%208.68-21.38%208.67-8.62%2021.5-8.62%2012.82%200%2021.32%208.62%208.5%208.63%208.5%2021.38v51h51q12.75%200%2021.38%208.68%208.62%208.67%208.62%2021.5%200%2012.82-8.62%2021.32-8.63%208.5-21.38%208.5h-51v52q0%2012.75-8.68%2021.37-8.67%208.63-21.5%208.63-12.82%200-21.32-8.63-8.5-8.62-8.5-21.37v-52Zm32%20227q-108.16%200-183.08-75Q120-479%20120-585t75-181q75-75%20181.5-75t181%2075Q632-691%20632-584.85%20632-542%20618-502q-14%2040-42%2075l242%20240q9%208.56%209%2021.78T818-143q-9%209-22.22%209-13.22%200-21.78-9L533-384q-30%2026-69.96%2040.5Q423.08-329%20378-329Zm-1-60q81.25%200%20138.13-57.5Q572-504%20572-585t-56.87-138.5Q458.25-781%20377-781q-82.08%200-139.54%2057.5Q180-666%20180-585t57.46%20138.5Q294.92-389%20377-389Z%22%2F%3E%3C%2Fsvg%3E");
}
.recording-icon::before,
.stop-icon::before,
.retry-icon::before,
.retry-icon-black::before,
.sync-icon::before,
.refresh-icon::before,
.description-icon::before,
.share-icon::before,
.share-off-icon::before,
.delete-icon::before,
.copy-icon::before,
.arrow-back-icon::before,
.cancel-icon::before,
.zoom-in-icon::before
{
    margin-right: 0.5rem;
    margin-bottom: 0.1rem;
    align-content: center;
    vertical-align: middle;
    display: inline-block;
    height: 1.25rem;
    width: 1.25rem;
}
.icon-without-text::before {
    margin-right: 0.0rem !important;
    margin-bottom: 0.0rem !important;
}

.recording-indicator {
    inset: 0;
    margin: auto;
    display: inline-block; /* Enable span to have explicit width/height */
    width: 1.0rem;
    height: 1.0rem;
    background-color: red;
    border: 0px;
    border-radius: 50%; /* Making the border a circle */
    pointer-events: none;
    animation: recording-blink 1s infinite;
}

@keyframes recording-blink {
     0%, 100% { opacity: 1; }
     50% { opacity: 0; }
 }