/**
 * Service Card Widget Styles
 */

.service-card {
    display: block;
    text-decoration: none;
    transition: all 0.3s ease;
    cursor: pointer;
    box-sizing: border-box;
}

.service-card:hover {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.service-card__icon-box {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.service-card__icon-box svg,
.service-card__icon-box svg path,
.service-card__icon-box i {
    transition: all 0.3s ease;
}

.service-card__title {
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: color 0.3s ease;
    margin: 0;
    line-height: 1.3;
}

.service-card__description {
    margin: 0;
    line-height: 1.6;
}

/* Button - Hidden by default, shown on hover */
.service-card__button {
    display: inline-flex;
    align-items: center;
    opacity: 0;
    transform: translateY(10px);
    transition: all 0.3s ease;
    font-weight: 500;
}

.service-card:hover .service-card__button {
    opacity: 1;
    transform: translateY(0);
}

.service-card__button-text {
    font-weight: inherit;
}

.service-card__button-icon {
    display: inline-flex;
    align-items: center;
}

.service-card__button-icon svg,
.service-card__button-icon i {
    transition: all 0.3s ease;
}

/* Focus state for accessibility */
.service-card:focus {
    outline: 2px solid #f7941d;
    outline-offset: 2px;
}

.service-card:focus:not(:focus-visible) {
    outline: none;
}

/* SVG Style Modes */

/* Fill Mode - default */
.service-card--fill .service-card__icon-box svg,
.service-card--fill .service-card__icon-box svg path {
    fill: #f7941d;
    stroke: none;
}

/* Stroke Mode - no fill, only stroke */
.service-card--stroke .service-card__icon-box svg,
.service-card--stroke .service-card__icon-box svg path,
.service-card--stroke .service-card__icon-box svg circle,
.service-card--stroke .service-card__icon-box svg rect,
.service-card--stroke .service-card__icon-box svg line,
.service-card--stroke .service-card__icon-box svg polyline,
.service-card--stroke .service-card__icon-box svg polygon {
    fill: none !important;
    stroke: #f7941d !important;
    stroke-width: 1.5 !important;
}

/* Original Mode - preserve original SVG style, force no fill */
.service-card--original .service-card__icon-box svg,
.service-card--original .service-card__icon-box svg[style],
.service-card--original .service-card__icon-box svg path,
.service-card--original .service-card__icon-box svg path[style],
.service-card--original .service-card__icon-box svg circle,
.service-card--original .service-card__icon-box svg rect,
.service-card--original .service-card__icon-box svg line,
.service-card--original .service-card__icon-box svg polyline,
.service-card--original .service-card__icon-box svg polygon,
.service-card--original .service-card__icon-box svg * {
    fill: transparent !important;
    stroke: inherit !important;
}

/* No fill class for SVG */
.service-card-svg--no-fill,
.service-card-svg--no-fill path,
.service-card-svg--no-fill circle,
.service-card-svg--no-fill rect,
.service-card-svg--no-fill line,
.service-card-svg--no-fill polyline,
.service-card-svg--no-fill polygon {
    fill: none !important;
}