.bg-gradient-primary,
.bg-gradient-primary-secondary,
.bg-gradient-blue-green {

    background: linear-gradient(135deg, var(--tenant-primary) 0%, var(--tenant-secondary) 100%);
}

.bg-gradient-secondary {

    background: linear-gradient(135deg, var(--tenant-secondary) 0%, color-mix(in srgb, var(--tenant-primary) 8%, #ffffff 92%) 100%);
}

.text-gradient-primary {

    background: linear-gradient(135deg, var(--tenant-primary) 0%, var(--tenant-tertiary) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gradient-secondary {

    background: linear-gradient(135deg, var(--tenant-secondary) 0%, color-mix(in srgb, var(--tenant-primary) 8%, #ffffff 92%) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gradient-primary-secondary {

    background: linear-gradient(135deg, var(--tenant-primary) 0%, var(--tenant-secondary) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-primary-600,
.text-primary-500,
.hover\:text-primary-600:hover,
.hover\:text-primary-700:hover,
.group-hover\:text-primary-600,
.group:hover .group-hover\:text-primary-600,
.group-hover\:text-primary-700,
.group:hover .group-hover\:text-primary-700 {

    color: var(--tenant-primary) !important;
}

.dark .text-primary-500,
.dark .text-primary-400,
.dark .hover\:text-primary-300:hover,
.dark .group-hover\:text-primary-400,
.dark .group:hover .group-hover\:text-primary-400,
.dark .group-hover\:text-primary-300,
.dark .group:hover .group-hover\:text-primary-300 {

    color: color-mix(in srgb, var(--tenant-primary) 78%, #e2e8f0 22%) !important;
}

.focus\:border-primary-400:focus,
.focus\:border-primary-500:focus {

    border-color: color-mix(in srgb, var(--tenant-primary) 65%, #ffffff 35%) !important;
}

.focus\:ring-primary-200:focus,
.focus\:ring-primary-600\/40:focus {

    --tw-ring-color: color-mix(in srgb, var(--tenant-primary) 28%, transparent) !important;
}

.dark .focus\:border-primary-500:focus {

    border-color: color-mix(in srgb, var(--tenant-primary) 55%, #1f2937 45%) !important;
}

.dark .focus\:ring-primary-600\/40:focus {

    --tw-ring-color: color-mix(in srgb, var(--tenant-primary) 38%, transparent) !important;
}

.decoration-primary-400\/60,
.group-hover\:decoration-primary-600,
.group:hover .group-hover\:decoration-primary-600 {

    text-decoration-color: color-mix(in srgb, var(--tenant-primary) 55%, transparent) !important;
}

.bg-tenant-primary-soft {

    background-color: color-mix(in srgb, var(--tenant-primary) 14%, #ffffff 86%);
}

.dark .bg-tenant-primary-soft,
.dark\:bg-tenant-primary-soft {

    background-color: color-mix(in srgb, var(--tenant-primary) 28%, #0f172a 72%);
}

.text-tenant-primary-icon {

    color: var(--tenant-primary);
}

.dark .text-tenant-primary-icon,
.dark\:text-tenant-primary-icon {

    color: color-mix(in srgb, var(--tenant-primary) 72%, #ecfdf5 28%);
}

.tenant-land-tag-badge,
.tenant-tag-badge {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    gap: 0.4rem;
    border-radius: 0.5rem;
    border: 1px solid color-mix(in srgb, var(--tenant-primary) 20%, #e2e8f0 80%);
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--tenant-primary) 6%, #ffffff 94%) 0%,
        color-mix(in srgb, var(--tenant-primary) 10%, #f8fafc 90%) 100%
    );
    padding: 0.2rem 0.65rem;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0.01em;
    color: color-mix(in srgb, var(--tenant-primary) 78%, #0f172a 22%);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.9) inset,
        0 1px 2px color-mix(in srgb, var(--tenant-primary) 10%, transparent);
}

.tenant-land-tag-badge__dot,
.tenant-tag-badge::before {
    display: inline-block;
    height: 0.375rem;
    width: 0.375rem;
    flex-shrink: 0;
    border-radius: 9999px;
    background: var(--tenant-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--tenant-primary) 18%, transparent);
}

.dark .tenant-land-tag-badge,
.dark .tenant-tag-badge {
    border-color: color-mix(in srgb, var(--tenant-primary) 34%, #334155 66%);
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--tenant-primary) 14%, #0f172a 86%) 0%,
        color-mix(in srgb, var(--tenant-primary) 20%, #020617 80%) 100%
    );
    color: color-mix(in srgb, var(--tenant-primary) 72%, #f1f5f9 28%);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.06) inset,
        0 1px 3px rgba(0, 0, 0, 0.28);
}

.dark .tenant-land-tag-badge__dot,
.dark .tenant-tag-badge::before {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--tenant-primary) 28%, transparent);
}

#main-content input[wire\:model\.live="search"]:focus,
#main-content select[id*="perPage"]:focus,
#main-content select[id*="per-page"]:focus,
#main-content .rounded-md.shadow-sm select:focus {

    border-color: var(--tenant-primary) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--tenant-primary) 28%, transparent) !important;
}

.text-blue-600,
.text-blue-500,
.hover\:text-blue-700:hover,
.hover\:text-blue-800:hover,
.hover\:underline.text-blue-600 {

    color: var(--tenant-primary) !important;
}

.dark .text-blue-400,
.dark .text-blue-200,
.dark .hover\:text-blue-300:hover {

    color: color-mix(in srgb, var(--tenant-primary) 75%, #e2e8f0 25%) !important;
}

.border-blue-200,
.border-blue-300,
.dark .border-blue-600,
.dark .border-blue-700 {

    border-color: color-mix(in srgb, var(--tenant-primary) 32%, #e5e7eb 68%) !important;
}

.bg-blue-50,
.bg-blue-100 {

    background-color: color-mix(in srgb, var(--tenant-primary) 12%, #ffffff 88%) !important;
}

.dark .bg-blue-800,
.dark .bg-blue-800\/50,
.dark .bg-blue-900\/20 {

    background-color: color-mix(in srgb, var(--tenant-primary) 22%, #0f172a 78%) !important;
}