/* Consistent Icon System using CSS */
/* This replaces emoji icons with CSS-based icons for better consistency and accessibility */

/* Base icon class */
.icon {
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    speak: none;
    text-align: center;
    width: 1.5em;
    height: 1.5em;
    line-height: 1.5em;
    vertical-align: middle;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
    position: relative;
}

/* Ensure icons display even when empty */
.icon:empty {
    min-width: 1.5em;
}

/* Service Icons */
.icon-forensic-economics::before {
    content: "📊";
    font-size: 1em;
}

.icon-business-valuation::before {
    content: "🏢";
    font-size: 1em;
}

.icon-vocational::before {
    content: "🎯";
    font-size: 1em;
}

.icon-life-care::before {
    content: "🏥";
    font-size: 1em;
}

/* For icons with content, we'll use the content directly */

/* Service card icons need proper sizing */
.service-icon .icon {
    font-size: 3rem;
    width: auto;
    height: auto;
    line-height: 1;
    display: inline-block;
}

/* Hero section icon fixes */
.hero .icon {
    display: inline-block;
    font-size: 1.2rem;
}

/* Practice chip icon fixes */
.practice-chip .icon {
    display: inline-block;
    font-size: 1.5rem;
    width: auto;
    height: auto;
    line-height: normal;
}

/* Practice Area Icons */
.icon-personal-injury::before {
    content: "⚖️";
    font-size: 1.2em;
}

.icon-medical-malpractice::before {
    content: "🏥";
    font-size: 1.2em;
}

.icon-employment::before {
    content: "💼";
    font-size: 1.2em;
}

.icon-commercial::before {
    content: "📊";
    font-size: 1.2em;
}

/* General Purpose Icons */
.icon-phone::before {
    content: "📞";
    font-size: 1em;
}

.icon-email::before {
    content: "✉️";
    font-size: 1em;
}

.icon-location::before {
    content: "📍";
    font-size: 1em;
}

.icon-calendar::before {
    content: "📅";
    font-size: 1em;
}

.icon-document::before {
    content: "📋";
    font-size: 1em;
}

.icon-checkmark::before {
    content: "✓";
    color: var(--success, #059669);
    font-weight: bold;
}

.icon-arrow-right::before {
    content: "→";
}

.icon-chevron-right::before {
    content: "▶";
    font-size: 0.8em;
}

.icon-star::before {
    content: "⭐";
}

.icon-lightning::before {
    content: "⚡";
}

.icon-target::before {
    content: "🎯";
}

.icon-trophy::before {
    content: "🏆";
}

.icon-graduation::before {
    content: "🎓";
}

.icon-court::before {
    content: "⚖️";
}

.icon-book::before {
    content: "📚";
}

.icon-lock::before {
    content: "🔒";
}

/* Icon Sizes */
.icon.icon-sm {
    width: 1em;
    height: 1em;
    line-height: 1em;
}

.icon.icon-lg {
    width: 2em;
    height: 2em;
    line-height: 2em;
    font-size: 1.5em;
}

.icon.icon-xl {
    width: 3em;
    height: 3em;
    line-height: 3em;
    font-size: 2em;
}

/* Debug: Force icon visibility */
.service-icon .icon::before,
.section-icon .icon::before {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Icon with text spacing */
.icon-text {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

/* Fallback for better emoji support */
@supports not (content: "📊") {
    .icon::before {
        font-family: Arial, sans-serif;
    }
    
    .icon-forensic-economics::before { content: "◆"; }
    .icon-business-valuation::before { content: "■"; }
    .icon-vocational::before { content: "●"; }
    .icon-life-care::before { content: "▲"; }
    .icon-personal-injury::before { content: "§"; }
    .icon-medical-malpractice::before { content: "+"; }
    .icon-employment::before { content: "▼"; }
    .icon-commercial::before { content: "◆"; }
    .icon-phone::before { content: "☎"; }
    .icon-email::before { content: "@"; }
    .icon-calendar::before { content: "▣"; }
    .icon-document::before { content: "□"; }
    .icon-checkmark::before { content: "✓"; }
    .icon-arrow-right::before { content: "→"; }
    .icon-chevron-right::before { content: ">"; }
    .icon-star::before { content: "★"; }
    .icon-lightning::before { content: "↯"; }
    .icon-target::before { content: "◎"; }
    .icon-trophy::before { content: "♦"; }
    .icon-graduation::before { content: "◈"; }
    .icon-court::before { content: "§"; }
    .icon-book::before { content: "≡"; }
    .icon-lock::before { content: "◊"; }
}

/* Accessibility improvements */
.icon[aria-label]::before {
    content: attr(aria-label);
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Animation for interactive icons */
.icon-animated {
    transition: transform 0.3s ease;
}

.icon-animated:hover {
    transform: scale(1.1);
}

/* Loading spinner icon */
.icon-spinner {
    animation: spin 1s linear infinite;
}

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

/* Button icons alignment */
.btn .icon {
    margin-right: 0.5rem;
}

.btn .icon:last-child {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Practice area chips icon styling */
.practice-chip .icon {
    font-size: 1.5rem;
    width: auto;
    height: auto;
    line-height: normal;
}

/* Service card icon styling */
.service-icon {
    text-align: center;
    margin-bottom: 1rem;
    font-size: 3rem;
}

.service-icon .icon {
    font-size: inherit;
    width: auto;
    height: auto;
    display: inline-block;
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
}

/* Section icon styling */
.section-icon .icon {
    font-size: 2.5rem;
    width: auto;
    height: auto;
    display: block;
    margin: 0 auto 1rem;
}