/* Agent Builder Page Specific Styles */

/* Builder themed intro cards */
.intro-card.builder-card-highlight {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.15) 0%, rgba(34, 211, 238, 0.1) 100%);
    border: 1px solid rgba(6, 182, 212, 0.3);
}

.intro-card.builder-card-highlight:hover {
    border-color: rgba(6, 182, 212, 0.5);
    box-shadow: 0 8px 32px rgba(6, 182, 212, 0.2);
}

.builder-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 0.75rem;
    color: #22d3ee;
}

.builder-icon svg {
    stroke: #22d3ee;
    filter: drop-shadow(0 0 6px rgba(34, 211, 238, 0.4));
}

/* Light mode overrides */
[data-theme="light"] .intro-card.builder-card-highlight {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.08) 0%, rgba(34, 211, 238, 0.05) 100%);
    border-color: rgba(6, 182, 212, 0.2);
}

[data-theme="light"] .intro-card.builder-card-highlight:hover {
    border-color: rgba(6, 182, 212, 0.4);
    box-shadow: 0 8px 32px rgba(6, 182, 212, 0.15);
}

[data-theme="light"] .builder-icon svg {
    stroke: #0891b2;
}

/* Feature items with builder theme */
.feature__item--builder {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.08) 0%, rgba(34, 211, 238, 0.05) 100%);
    border: 1px solid rgba(6, 182, 212, 0.2);
}

.feature__item--builder:hover {
    border-color: rgba(6, 182, 212, 0.4);
    box-shadow: 0 12px 40px rgba(6, 182, 212, 0.2);
    transform: translateY(-4px);
}

.feature__item--builder .feature__icon {
    color: #22d3ee;
}

.feature__item--builder .feature__icon svg {
    stroke: #22d3ee;
    filter: drop-shadow(0 0 8px rgba(34, 211, 238, 0.4));
}

.feature__item--builder .feature__title {
    color: #22d3ee;
}

/* Light mode feature overrides */
[data-theme="light"] .feature__item--builder {
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.05) 0%, rgba(34, 211, 238, 0.03) 100%);
    border-color: rgba(6, 182, 212, 0.15);
}

[data-theme="light"] .feature__item--builder:hover {
    border-color: rgba(6, 182, 212, 0.3);
    box-shadow: 0 12px 40px rgba(6, 182, 212, 0.12);
}

[data-theme="light"] .feature__item--builder .feature__title {
    color: #0891b2;
}

[data-theme="light"] .feature__item--builder .feature__icon svg {
    stroke: #0891b2;
}

/* Hero gradient for builder theme */
.home__title-gradient {
    background: linear-gradient(135deg, #22d3ee 0%, #67e8f9 50%, #22d3ee 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    animation: gradientFlow 3s ease infinite;
}

@keyframes gradientFlow {
    0% {
        background-position: 0% center;
    }
    50% {
        background-position: 100% center;
    }
    100% {
        background-position: 0% center;
    }
}