.btn-smaller {
    padding: 0.1rem 0.4rem;
    font-size: 1rem;
}

.tab-button {
    height: 49px;
}

[data-bs-theme="dark2"] {
    --bs-primary: #a8d8ea;
    --bs-secondary: #aa96da;
    --bs-success: #bbfcba;
    --bs-danger: #fcbad3;
    --bs-warning: #ffffd2;
    --bs-info: #96a9da;
    --bs-primary-rgb: 168, 216, 234;
    --bs-secondary-rgb: 170, 150, 218;
    --bs-success-rgb: 187, 252, 186;
    --bs-danger-rgb: 252, 186, 211;
    --bs-warning-rgb: 255, 255, 210;
    --bs-info-rgb: 150, 169, 218;
}

.tabs-and-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.blink {
    animation: blinkMe 2s linear infinite;
}
@keyframes blinkMe {
    0% { opacity: 0;}
    50% { opacity: 1;}
    100% {opacity: 0;}
}


.theme-icon-light {
    display: none;
}
.theme-icon-dark {
    display: inline-block;
}
  
[data-bs-theme="dark"] .theme-icon-light {
    display: inline-block;
}
[data-bs-theme="dark"] .theme-icon-dark {
    display: none;
}

/* Global Vue cloak behavior: hide content and show loading spinner until mounted */
[v-cloak] {
    position: relative;
    min-height: var(--v-cloak-min-height, 120px);
}

[v-cloak] > * {
    display: none !important;
}

[v-cloak]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: var(--v-cloak-spinner-size, 3rem);
    height: var(--v-cloak-spinner-size, 3rem);
    border: 4px solid var(--v-cloak-spinner-track, var(--bs-border-color, #f3f3f3));
    border-top: 4px solid var(--v-cloak-spinner-color, var(--bs-primary, #0d6efd));
    border-radius: 50%;
    animation: v-cloak-spin 1s linear infinite;
    display: block;
    z-index: 1000;
}

@keyframes v-cloak-spin {
    0% { transform: translate(-50%, -50%) rotate(0deg); }
    100% { transform: translate(-50%, -50%) rotate(360deg); }
}
