@use "../variables" as *;
@use "sass:map";
@use "sass:color";

.border {
    border-color: $border-color !important;
}
.border-top {
    border-color: $border-color !important;
}
.border-bottom {
    border-color: $border-color !important;
}
.border-end {
    border-color: $border-color !important;
}
.border-start {
    border-color: $border-color !important;
}
@each $state in map.keys($theme-colors) {
    .border-#{$state}-subtle {
        border-color: var(--#{$state}-transparent) !important;
    }
}

// Border opacity utilities
.border-opacity-100 { --border-opacity: 1; }
.border-opacity-75  { --border-opacity: 0.75; }
.border-opacity-50  { --border-opacity: 0.5; }
.border-opacity-25  { --border-opacity: 0.25; }
.border-opacity-10  { --border-opacity: 0.10; }

// Use the variable for border color with opacity

@each $state in map.keys($theme-colors) {
  .border-#{$state} {
    border-color: rgba(var(--#{$state}-rgb), var(--border-opacity, 1)) !important;
  }
}
.rounded {
    border-radius: 5px !important;
}
.shadow {
    box-shadow: $box-shadow !important;
}
.shadow-sm {
    box-shadow: $box-shadow-sm !important;
}
.shadow-lg {
    box-shadow: $box-shadow-lg !important;
}
.link-opacity-10 {
    opacity: 0.1;
}
.link-opacity-25 {
    opacity: 0.25;
}
.link-opacity-50 {
    opacity: 0.50;
}
.link-opacity-75 {
    opacity: 0.75;
}
.link-opacity-10-hover:hover {
    opacity: 0.1;
}
.link-opacity-25-hover:hover {
    opacity: 0.25;
}
.link-opacity-50-hover:hover {
    opacity: 0.50;
}
.link-opacity-75-hover:hover {
    opacity: 0.75;
}
.link-underline-opacity-100 { --link-underline-opacity: 1; }
.link-underline-opacity-75  { --link-underline-opacity: 0.75; }
.link-underline-opacity-50  { --link-underline-opacity: 0.5; }
.link-underline-opacity-25  { --link-underline-opacity: 0.25; }
.link-underline-opacity-10  { --link-underline-opacity: 0.10; }
.link-underline-opacity-0  { --link-underline-opacity: 0; }
.link-underline {
    text-decoration-color: rgba(var(--primary-rgb), var(--link-underline-opacity, 1)) !important;
}
.rounded-2 {
    border-radius: 5px !important;
}

.fs-7 {
    font-size: 0.4375rem !important;
}
.fs-8 {
    font-size: 0.5rem !important;
}
.fs-9 {
    font-size: 0.5625rem;
}
.fs-10 {
    font-size: 0.75em !important;
}
.fs-11 {
    font-size: 0.6875rem;
}
.fs-12 {
    font-size: 0.75rem !important;
}
.fs-13 {
    font-size: 0.8125rem;
}
.fs-14 {
    font-size: 0.875rem !important;
}
.fs-15 {
    font-size: 0.9375rem;
}
.fs-16 {
    font-size: 1rem !important;
}
.fs-17 {
    font-size: 1.0625rem;
}
.fs-18 {
    font-size: 1.125rem;
}
.fs-19 {
    font-size: 1.1875rem;
}
.fs-20 {
    font-size: 1.25rem;
}
.fs-21 {
    font-size: 1.3125rem;
}
.fs-22 {
    font-size: 1.375rem;
}
.fs-23 {
    font-size: 1.4375rem;
}
.fs-24 {
    font-size: 1.5rem;
}
.fs-25 {
    font-size: 1.5625rem;
}
.fs-26 {
    font-size: 1.625rem;
}
.fs-27 {
    font-size: 1.6875rem;
}
.fs-28 {
    font-size: 1.75rem;
}
.fs-29 {
    font-size: 1.8125rem;
}
.fs-30 {
    font-size: 1.875rem;
}
.fs-32 {
    font-size: 2rem;
}
.fs-34 {
    font-size: 2.125rem;
}
.fs-36 {
    font-size: 2.25rem;
}
.fs-38 {
    font-size: 2.375rem;
}
.fs-40 {
    font-size: 2.5rem;
}
.fs-42 {
    font-size: 2.625rem;
}
.fs-44 {
    font-size: 2.75rem;
}
.fs-46 {
    font-size: 2.875rem;
}
.fs-48 {
    font-size: 3rem;
}
.rounded-4 {
    border-radius: 20px !important;
}
.rounded-end-5 {
    border-radius: 24px !important;
}