/**
 * MZH Icons Stylesheet
 *
 * Provides consistent styling for SVG icons throughout the plugin.
 *
 * @package MZH_Location_Manager
 * @since 4.1.0
 */

/* Base icon styling */
.mzh-icon {
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 1 !important;
}

/* Icon alignment variations */
.mzh-icon-inline {
    margin: 0 4px !important;
}

.mzh-icon-left {
    margin-right: 8px !important;
}

.mzh-icon-right {
    margin-left: 8px !important;
}

/* Icon sizing */
.mzh-icon-small {
    width: 16px !important;
    height: 16px !important;
}

.mzh-icon-medium {
    width: 20px !important;
    height: 20px !important;
}

.mzh-icon-large {
    width: 24px !important;
    height: 24px !important;
}

.mzh-icon-xlarge {
    width: 32px !important;
    height: 32px !important;
}

/* Notification icons */
.mzh-notification-icon {
    margin-right: 10px !important;
    flex-shrink: 0 !important;
}

/* Success state */
.mzh-icon-success {
    color: #28a745 !important;
}

.mzh-notification-success .mzh-icon,
.mzh-notice-success .mzh-icon {
    stroke: #28a745 !important;
}

/* Error state */
.mzh-icon-error {
    color: #dc3545 !important;
}

.mzh-notification-error .mzh-icon,
.mzh-notice-error .mzh-icon {
    stroke: #dc3545 !important;
}

/* Warning state */
.mzh-icon-warning {
    color: #ffc107 !important;
}

.mzh-notification-warning .mzh-icon,
.mzh-notice-warning .mzh-icon {
    stroke: #ffc107 !important;
}

/* Info state */
.mzh-icon-info {
    color: #17a2b8 !important;
}

.mzh-notification-info .mzh-icon,
.mzh-notice-info .mzh-icon {
    stroke: #17a2b8 !important;
}

/* Button icons */
button .mzh-icon,
.button .mzh-icon,
a.button .mzh-icon {
    margin-right: 6px !important;
}

/* Smooth transitions for interactive icons */
button .mzh-icon,
.button .mzh-icon,
a.button .mzh-icon,
a .mzh-icon {
    transition: transform 0.2s ease, opacity 0.2s ease !important;
}

button:hover .mzh-icon,
.button:hover .mzh-icon,
a:hover .mzh-icon {
    transform: scale(1.1) !important;
}

/* Ensure icons don't break layout */
.mzh-icon svg {
    display: block !important;
    max-width: 100% !important;
    max-height: 100% !important;
}

/* Icon in table cells */
td .mzh-icon,
th .mzh-icon {
    margin-right: 6px !important;
}

/* Loading/spinner state for icons */
.mzh-icon-loading {
    animation: mzh-icon-spin 1s linear infinite !important;
}

@keyframes mzh-icon-spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Accessibility: Ensure icons are properly hidden from screen readers when decorative */
.mzh-icon[aria-hidden="true"] {
    pointer-events: none !important;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .mzh-icon {
        filter: contrast(1.2) !important;
    }
}

/* Print styles - simplify icons for print */
@media print {
    .mzh-icon {
        display: none !important;
    }
}