/**
 * WPHelp Events - Base Styles
 * Shared CSS custom properties and reset for all frontend components.
 * Built from: assets/src/css/
 */

/* Box sizing reset for plugin scope */
.whe-calendar-wrapper *,
.whe-booking-form *,
.whe-single-event *,
.whe-archive-events *,
.whe-user-dashboard * {
    box-sizing: border-box;
}

/* Base typography */
.whe-calendar-wrapper,
.whe-booking-form,
.whe-single-event,
.whe-archive-events,
.whe-user-dashboard {
    font-family: var(--whe-font, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif);
    color: var(--whe-text, #1f2937);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Links */
.whe-calendar-wrapper a,
.whe-booking-form a,
.whe-single-event a,
.whe-archive-events a,
.whe-user-dashboard a {
    color: var(--whe-primary, #2563eb);
    text-decoration: none;
    transition: color 0.2s ease;
}

.whe-calendar-wrapper a:hover,
.whe-booking-form a:hover,
.whe-single-event a:hover,
.whe-archive-events a:hover,
.whe-user-dashboard a:hover {
    color: var(--whe-secondary, #1d4ed8);
}

/* Buttons */
.whe-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: var(--whe-btn-padding, 10px 20px);
    border-radius: var(--whe-btn-radius, 6px);
    font-weight: 600;
    font-size: 14px;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    line-height: 1.4;
}

.whe-btn-primary {
    background: var(--whe-primary, #2563eb);
    color: #fff;
}

.whe-btn-primary:hover {
    background: var(--whe-secondary, #1d4ed8);
    color: #fff;
    transform: translateY(-1px);
}

.whe-btn-secondary {
    background: var(--whe-bg-light, #f3f4f6);
    color: var(--whe-text, #1f2937);
    border: 1px solid #e5e7eb;
}

.whe-btn-secondary:hover {
    background: #e5e7eb;
}

.whe-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* Badges */
.whe-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.whe-badge-success {
    background: #d1fae5;
    color: #065f46;
}

.whe-badge-warning {
    background: #fef3c7;
    color: #92400e;
}

.whe-badge-danger {
    background: #fee2e2;
    color: #991b1b;
}

.whe-badge-info {
    background: #dbeafe;
    color: #1e40af;
}

/* Screen reader text */
.whe-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Loading spinner */
.whe-spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #fff;
    animation: whe-spin 0.6s linear infinite;
}

@keyframes whe-spin {
    to { transform: rotate(360deg); }
}

/* Fade animations */
@keyframes whe-fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes whe-fadeSlide {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}