/**
 * CSP-Compliant Utility Classes
 *
 * These classes replace inline style="" attributes to comply with
 * Content Security Policy (CSP) directives.
 *
 * Created: October 29, 2025
 * Purpose: Eliminate CSP violations from inline styles
 */

/* Display State Utilities */
.d-none-csp {
    display: none !important;
}

.d-block-csp {
    display: block !important;
}

.d-inline-block-csp {
    display: inline-block !important;
}

/* Toast Container Positioning */
.toast-container {
    z-index: 9999 !important;
}

/* Clipboard Helper (for fallback copy functionality) */
.clipboard-helper {
    position: fixed !important;
    opacity: 0 !important;
    pointer-events: none;
    left: -9999px;
}

/* Progress Bar Width Utilities */
/* These classes replace inline style.width manipulation for CSP compliance */
.progress-width-0 {
    width: 0% !important;
}

.progress-width-25 {
    width: 25% !important;
}

.progress-width-50 {
    width: 50% !important;
}

.progress-width-75 {
    width: 75% !important;
}

.progress-width-100 {
    width: 100% !important;
}

/* Margin-Right Utilities */
/* These classes replace inline style="margin-right: Xpx;" attributes */
.me-2-csp {
    margin-right: 8px !important;
}

.me-3-csp {
    margin-right: 12px !important;
}

/* Cursor Utilities */
/* These classes replace inline style="cursor: X;" attributes */
.cursor-pointer {
    cursor: pointer !important;
}

.cursor-help {
    cursor: help !important;
}

/* Device Edit Icon */
/* Combined styles for device table edit icons */
.device-edit-icon {
    cursor: pointer !important;
    font-size: 0.8em !important;
}

/* Toast Clickable */
/* Makes toast elements clickable */
.toast-clickable {
    cursor: pointer !important;
}

/* Input Width Utilities */
.input-width-auto {
    width: auto !important;
}

/* Password Strength Levels */
/* These classes combine width + background color for password strength indicators */
.strength-very-weak {
    width: 25% !important;
    background-color: #dc3545 !important; /* Bootstrap danger red */
}

.strength-weak {
    width: 50% !important;
    background-color: #fd7e14 !important; /* Bootstrap orange */
}

.strength-medium {
    width: 75% !important;
    background-color: #ffc107 !important; /* Bootstrap warning yellow */
}

.strength-strong {
    width: 100% !important;
    background-color: #28a745 !important; /* Bootstrap success green */
}

/* Password Strength Label Colors */
/* These classes apply color to password strength text labels */
.strength-label-very-weak {
    color: #dc3545 !important;
}

.strength-label-weak {
    color: #fd7e14 !important;
}

.strength-label-medium {
    color: #ffc107 !important;
}

.strength-label-strong {
    color: #28a745 !important;
}