/**
 * WCT Partner Portal - Frontend Styles
 * All selectors scoped to .wct-portal-wrap to prevent conflicts
 */

.wct-portal-wrap, .wct-portal-wrap *, .wct-portal-wrap *::before, .wct-portal-wrap *::after {
    box-sizing: border-box !important;
}

.wct-portal-wrap {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: #1f2937 !important;
    -webkit-font-smoothing: antialiased !important;
}

.wct-portal-wrap.wct-full {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    max-width: none !important;
}

.wct-portal-wrap.wct-contained {
    max-width: 1400px !important;
    margin: 0 auto !important;
}

.wct-portal-wrap .wct-portal-layout {
    display: flex !important;
    min-height: 100vh !important;
    background: #f3f4f6 !important;
}

/* Sidebar */
.wct-portal-wrap .wct-sidebar {
    width: 280px !important;
    min-width: 280px !important;
    max-width: 280px !important;
    background: #0c1222 !important;
    color: #e5e7eb !important;
    display: flex !important;
    flex-direction: column !important;
    position: sticky !important;
    top: 0 !important;
    height: 100vh !important;
    overflow-y: auto !important;
}

.wct-portal-wrap .wct-sidebar-inner {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    padding: 20px !important;
}

/* User Block - styled like update banner but greyscale */
.wct-portal-wrap .wct-user-block {
    background: linear-gradient(135deg, rgba(156, 163, 175, 0.15) 0%, rgba(107, 114, 128, 0.15) 100%) !important;
    border: 1px solid rgba(156, 163, 175, 0.3) !important;
    border-radius: 8px !important;
    padding: 14px !important;
    margin-bottom: 16px !important;
}

.wct-portal-wrap .wct-user-header {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.wct-portal-wrap .wct-user-avatar {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #fff !important;
}

.wct-portal-wrap .wct-user-details {
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

.wct-portal-wrap .wct-user-name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #fff !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.wct-portal-wrap .wct-user-role {
    font-size: 12px !important;
    font-weight: 500 !important;
}

/* License Section within User Block */
.wct-portal-wrap .wct-license-section {
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.wct-portal-wrap .wct-license-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 4px 0 !important;
}

.wct-portal-wrap .wct-license-label {
    font-size: 12px !important;
    color: #9ca3af !important;
}

.wct-portal-wrap .wct-license-value {
    font-size: 12px !important;
    color: #e5e7eb !important;
    font-weight: 500 !important;
}

.wct-portal-wrap .wct-payment-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 3px 8px !important;
    border-radius: 20px !important;
}

.wct-portal-wrap .wct-payment-pill .dashicons {
    width: 12px !important;
    height: 12px !important;
    font-size: 12px !important;
}

.wct-portal-wrap .wct-pill-paid {
    background: #22c55e !important;
    color: #fff !important;
}

.wct-portal-wrap .wct-pill-overdue {
    background: #ef4444 !important;
    color: #fff !important;
}

/* Update Banner */
.wct-portal-wrap .wct-update-banner {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.15) 0%, rgba(139, 92, 246, 0.15) 100%) !important;
    border: 1px solid rgba(59, 130, 246, 0.3) !important;
    border-radius: 8px !important;
    padding: 12px !important;
    margin-bottom: 20px !important;
}

.wct-portal-wrap .wct-update-header {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #60a5fa !important;
    margin-bottom: 6px !important;
}

.wct-portal-wrap .wct-update-header .dashicons {
    width: 14px !important;
    height: 14px !important;
    font-size: 14px !important;
}

.wct-portal-wrap .wct-update-text {
    font-size: 12px !important;
    color: #9ca3af !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

/* Navigation */
.wct-portal-wrap .wct-nav {
    flex: 1 !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

.wct-portal-wrap .wct-nav-group {
    margin-bottom: 20px !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

.wct-portal-wrap .wct-nav-label {
    display: block !important;
    width: 100% !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 0 12px !important;
    margin-bottom: 8px !important;
}

.wct-portal-wrap .wct-nav-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 10px 12px !important;
    background: transparent !important;
    border: none !important;
    border-left: 3px solid transparent !important;
    border-radius: 0 6px 6px 0 !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    text-align: left !important;
    color: #9ca3af !important;
    font-size: 14px !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
}

.wct-portal-wrap .wct-nav-item:hover {
    background: #141d2f !important;
    color: #e5e7eb !important;
}

.wct-portal-wrap .wct-nav-item.wct-active {
    background: #141d2f !important;
    border-left-color: #ef4444 !important;
    color: #fff !important;
}

.wct-portal-wrap .wct-nav-item .dashicons {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    font-size: 20px !important;
    line-height: 20px !important;
}

.wct-portal-wrap .wct-nav-text {
    flex: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Sidebar Footer */
.wct-portal-wrap .wct-sidebar-footer {
    padding-top: 16px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    margin-top: auto !important;
}

.wct-portal-wrap .wct-copyright {
    font-size: 11px !important;
    color: #6b7280 !important;
    text-align: center !important;
    margin: 0 !important;
}

/* Main Content */
.wct-portal-wrap .wct-main {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
}

/* Top Bar */
.wct-portal-wrap .wct-topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 24px !important;
    background: #fff !important;
    border-bottom: 1px solid #e5e7eb !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
}

.wct-portal-wrap .wct-topbar-left {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.wct-portal-wrap .wct-section-icon {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    font-size: 24px !important;
    color: #6b7280 !important;
}

.wct-portal-wrap .wct-section-title {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    margin: 0 !important;
}

.wct-portal-wrap .wct-topbar-right {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}

.wct-portal-wrap .wct-search-box {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #f3f4f6 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
}

.wct-portal-wrap .wct-search-box .dashicons {
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
    color: #9ca3af !important;
}

.wct-portal-wrap .wct-search-input {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    font-size: 14px !important;
    color: #1f2937 !important;
    width: 200px !important;
    font-family: inherit !important;
}

.wct-portal-wrap .wct-search-input::placeholder {
    color: #9ca3af !important;
}

/* Content */
.wct-portal-wrap .wct-content {
    flex: 1 !important;
    padding: 24px !important;
    overflow-y: auto !important;
}

.wct-portal-wrap .wct-content-inner {
    background: #fff !important;
    border-radius: 12px !important;
    padding: 24px !important;
    min-height: 400px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.wct-portal-wrap .wct-section-content {
    color: #374151 !important;
    line-height: 1.7 !important;
}

.wct-portal-wrap .wct-section-content h1,
.wct-portal-wrap .wct-section-content h2,
.wct-portal-wrap .wct-section-content h3,
.wct-portal-wrap .wct-section-content h4,
.wct-portal-wrap .wct-section-content h5,
.wct-portal-wrap .wct-section-content h6 {
    color: #1f2937 !important;
    margin-top: 1.5em !important;
    margin-bottom: 0.5em !important;
}

.wct-portal-wrap .wct-section-content h1:first-child,
.wct-portal-wrap .wct-section-content h2:first-child,
.wct-portal-wrap .wct-section-content h3:first-child {
    margin-top: 0 !important;
}

.wct-portal-wrap .wct-section-content p { margin-bottom: 1em !important; }
.wct-portal-wrap .wct-section-content ul,
.wct-portal-wrap .wct-section-content ol { margin: 1em 0 !important; padding-left: 2em !important; }
.wct-portal-wrap .wct-section-content li { margin-bottom: 0.5em !important; }
.wct-portal-wrap .wct-section-content a { color: #3b82f6 !important; text-decoration: underline !important; }
.wct-portal-wrap .wct-section-content img { max-width: 100% !important; height: auto !important; border-radius: 8px !important; }

/* ==========================================
   SECTION CONTENT UTILITY CLASSES
   ========================================== */

/* Card Component */
.wct-portal-wrap .wct-section-content .wct-card {
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-bottom: 16px !important;
}

.wct-portal-wrap .wct-section-content .wct-card:last-child {
    margin-bottom: 0 !important;
}

.wct-portal-wrap .wct-section-content .wct-card-header {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
}

.wct-portal-wrap .wct-section-content .wct-card-icon {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    background: #3b82f6 !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.wct-portal-wrap .wct-section-content .wct-card-icon .dashicons {
    color: #fff !important;
    width: 20px !important;
    height: 20px !important;
    font-size: 20px !important;
}

.wct-portal-wrap .wct-section-content .wct-card-icon.wct-icon-green { background: #22c55e !important; }
.wct-portal-wrap .wct-section-content .wct-card-icon.wct-icon-blue { background: #3b82f6 !important; }
.wct-portal-wrap .wct-section-content .wct-card-icon.wct-icon-purple { background: #8b5cf6 !important; }
.wct-portal-wrap .wct-section-content .wct-card-icon.wct-icon-orange { background: #f59e0b !important; }
.wct-portal-wrap .wct-section-content .wct-card-icon.wct-icon-red { background: #ef4444 !important; }
.wct-portal-wrap .wct-section-content .wct-card-icon.wct-icon-gray { background: #6b7280 !important; }

.wct-portal-wrap .wct-section-content .wct-card-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    margin: 0 !important;
}

.wct-portal-wrap .wct-section-content .wct-card-subtitle {
    font-size: 13px !important;
    color: #6b7280 !important;
    margin: 2px 0 0 0 !important;
}

.wct-portal-wrap .wct-section-content .wct-card-body {
    color: #4b5563 !important;
    font-size: 14px !important;
}

.wct-portal-wrap .wct-section-content .wct-card-body p:last-child {
    margin-bottom: 0 !important;
}

/* Grid Layout */
.wct-portal-wrap .wct-section-content .wct-grid {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

.wct-portal-wrap .wct-section-content .wct-grid .wct-card {
    margin-bottom: 0 !important;
}

@media (min-width: 900px) {
    .wct-portal-wrap .wct-section-content .wct-grid-2 {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }
}

/* Alert Components */
.wct-portal-wrap .wct-section-content .wct-alert {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding: 16px !important;
    border-radius: 10px !important;
    margin-bottom: 16px !important;
}

.wct-portal-wrap .wct-section-content .wct-alert:last-child {
    margin-bottom: 0 !important;
}

.wct-portal-wrap .wct-section-content .wct-alert .dashicons {
    width: 20px !important;
    height: 20px !important;
    font-size: 20px !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
}

.wct-portal-wrap .wct-section-content .wct-alert-content {
    flex: 1 !important;
}

.wct-portal-wrap .wct-section-content .wct-alert-title {
    font-weight: 600 !important;
    margin-bottom: 4px !important;
}

.wct-portal-wrap .wct-section-content .wct-alert p {
    margin: 0 !important;
    font-size: 14px !important;
}

.wct-portal-wrap .wct-section-content .wct-alert-info {
    background: #eff6ff !important;
    border: 1px solid #bfdbfe !important;
}
.wct-portal-wrap .wct-section-content .wct-alert-info .dashicons,
.wct-portal-wrap .wct-section-content .wct-alert-info .wct-alert-title { color: #2563eb !important; }

.wct-portal-wrap .wct-section-content .wct-alert-success {
    background: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
}
.wct-portal-wrap .wct-section-content .wct-alert-success .dashicons,
.wct-portal-wrap .wct-section-content .wct-alert-success .wct-alert-title { color: #16a34a !important; }

.wct-portal-wrap .wct-section-content .wct-alert-warning {
    background: #fffbeb !important;
    border: 1px solid #fde68a !important;
}
.wct-portal-wrap .wct-section-content .wct-alert-warning .dashicons,
.wct-portal-wrap .wct-section-content .wct-alert-warning .wct-alert-title { color: #d97706 !important; }

.wct-portal-wrap .wct-section-content .wct-alert-error {
    background: #fef2f2 !important;
    border: 1px solid #fecaca !important;
}
.wct-portal-wrap .wct-section-content .wct-alert-error .dashicons,
.wct-portal-wrap .wct-section-content .wct-alert-error .wct-alert-title { color: #dc2626 !important; }

/* Stats/Metric Cards */
.wct-portal-wrap .wct-section-content .wct-stat-card {
    background: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-bottom: 16px !important;
}

.wct-portal-wrap .wct-section-content .wct-stat-card:last-child {
    margin-bottom: 0 !important;
}

.wct-portal-wrap .wct-section-content .wct-stat-label {
    font-size: 13px !important;
    color: #6b7280 !important;
    margin-bottom: 4px !important;
}

.wct-portal-wrap .wct-section-content .wct-stat-value {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #1f2937 !important;
    line-height: 1.2 !important;
}

.wct-portal-wrap .wct-section-content .wct-stat-change {
    font-size: 13px !important;
    margin-top: 4px !important;
}

.wct-portal-wrap .wct-section-content .wct-stat-change.wct-positive { color: #16a34a !important; }
.wct-portal-wrap .wct-section-content .wct-stat-change.wct-negative { color: #dc2626 !important; }

/* Button Variants */
.wct-portal-wrap .wct-section-content .wct-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    text-decoration: none !important;
    border: none !important;
    font-family: inherit !important;
}

.wct-portal-wrap .wct-section-content .wct-btn-primary {
    background: #3b82f6 !important;
    color: #fff !important;
}
.wct-portal-wrap .wct-section-content .wct-btn-primary:hover {
    background: #2563eb !important;
    color: #fff !important;
}

.wct-portal-wrap .wct-section-content .wct-btn-success {
    background: #22c55e !important;
    color: #fff !important;
}
.wct-portal-wrap .wct-section-content .wct-btn-success:hover {
    background: #16a34a !important;
    color: #fff !important;
}

.wct-portal-wrap .wct-section-content .wct-btn-secondary {
    background: #e5e7eb !important;
    color: #374151 !important;
}
.wct-portal-wrap .wct-section-content .wct-btn-secondary:hover {
    background: #d1d5db !important;
    color: #1f2937 !important;
}

.wct-portal-wrap .wct-section-content .wct-btn-outline {
    background: transparent !important;
    border: 1px solid #d1d5db !important;
    color: #374151 !important;
}
.wct-portal-wrap .wct-section-content .wct-btn-outline:hover {
    background: #f3f4f6 !important;
    color: #1f2937 !important;
}

/* Video Embed */
.wct-portal-wrap .wct-section-content .wct-video-wrapper {
    position: relative !important;
    padding-bottom: 56.25% !important;
    height: 0 !important;
    overflow: hidden !important;
    border-radius: 12px !important;
    margin-bottom: 16px !important;
    background: #000 !important;
}

.wct-portal-wrap .wct-section-content .wct-video-wrapper iframe,
.wct-portal-wrap .wct-section-content .wct-video-wrapper video {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
}

/* Divider */
.wct-portal-wrap .wct-section-content .wct-divider {
    border: none !important;
    border-top: 1px solid #e5e7eb !important;
    margin: 24px 0 !important;
}

/* Badge/Tag */
.wct-portal-wrap .wct-section-content .wct-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 4px 10px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    border-radius: 20px !important;
    background: #e5e7eb !important;
    color: #374151 !important;
}

.wct-portal-wrap .wct-section-content .wct-badge-blue { background: #dbeafe !important; color: #1d4ed8 !important; }
.wct-portal-wrap .wct-section-content .wct-badge-green { background: #dcfce7 !important; color: #15803d !important; }
.wct-portal-wrap .wct-section-content .wct-badge-yellow { background: #fef3c7 !important; color: #b45309 !important; }
.wct-portal-wrap .wct-section-content .wct-badge-red { background: #fee2e2 !important; color: #b91c1c !important; }
.wct-portal-wrap .wct-section-content .wct-badge-purple { background: #ede9fe !important; color: #6d28d9 !important; }

/* Table Styling */
.wct-portal-wrap .wct-section-content table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-bottom: 16px !important;
    background: #fff !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    border: 1px solid #e5e7eb !important;
}

.wct-portal-wrap .wct-section-content th,
.wct-portal-wrap .wct-section-content td {
    padding: 12px 16px !important;
    text-align: left !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.wct-portal-wrap .wct-section-content th {
    background: #f9fafb !important;
    font-weight: 600 !important;
    color: #374151 !important;
    font-size: 13px !important;
}

.wct-portal-wrap .wct-section-content tr:last-child td {
    border-bottom: none !important;
}

/* Progress Bar */
.wct-portal-wrap .wct-section-content .wct-progress {
    background: #e5e7eb !important;
    border-radius: 8px !important;
    height: 8px !important;
    overflow: hidden !important;
    margin: 8px 0 !important;
}

.wct-portal-wrap .wct-section-content .wct-progress-bar {
    height: 100% !important;
    background: #3b82f6 !important;
    border-radius: 8px !important;
    transition: width 0.3s ease !important;
}

.wct-portal-wrap .wct-section-content .wct-progress-bar.wct-green { background: #22c55e !important; }
.wct-portal-wrap .wct-section-content .wct-progress-bar.wct-yellow { background: #f59e0b !important; }
.wct-portal-wrap .wct-section-content .wct-progress-bar.wct-red { background: #ef4444 !important; }

/* ==========================================================================
   INPUT FIX - Ensure all inputs inside section content work properly
   These rules have high specificity to override WordPress themes/plugins
   ========================================================================== */

/* Reset pointer-events and user-select on content containers */
.wct-portal-wrap .wct-content,
.wct-portal-wrap .wct-content-inner,
.wct-portal-wrap .wct-section-content {
    pointer-events: auto !important;
    user-select: auto !important;
    -webkit-user-select: auto !important;
    -moz-user-select: auto !important;
    -ms-user-select: auto !important;
}

/* Universal input/select/textarea reset for section content */
.wct-portal-wrap .wct-section-content input,
.wct-portal-wrap .wct-section-content select,
.wct-portal-wrap .wct-section-content textarea,
.wct-portal-wrap .wct-section-content button {
    pointer-events: auto !important;
    user-select: auto !important;
    -webkit-user-select: auto !important;
    -moz-user-select: auto !important;
    -ms-user-select: auto !important;
    cursor: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 1 !important;
}

.wct-portal-wrap .wct-section-content input[type="text"],
.wct-portal-wrap .wct-section-content input[type="number"],
.wct-portal-wrap .wct-section-content input[type="email"],
.wct-portal-wrap .wct-section-content input[type="password"],
.wct-portal-wrap .wct-section-content input[type="search"],
.wct-portal-wrap .wct-section-content input[type="tel"],
.wct-portal-wrap .wct-section-content input[type="url"],
.wct-portal-wrap .wct-section-content input[type="date"],
.wct-portal-wrap .wct-section-content textarea {
    cursor: text !important;
}

.wct-portal-wrap .wct-section-content select,
.wct-portal-wrap .wct-section-content button,
.wct-portal-wrap .wct-section-content input[type="button"],
.wct-portal-wrap .wct-section-content input[type="submit"],
.wct-portal-wrap .wct-section-content input[type="range"],
.wct-portal-wrap .wct-section-content input[type="checkbox"],
.wct-portal-wrap .wct-section-content input[type="radio"] {
    cursor: pointer !important;
}

/* Ensure labels are clickable */
.wct-portal-wrap .wct-section-content label {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* Remove any overlays that might block inputs */
.wct-portal-wrap .wct-section-content::before,
.wct-portal-wrap .wct-section-content::after {
    pointer-events: none !important;
}

/* ==========================================================================
   END INPUT FIX
   ========================================================================== */

/* Spacing Utilities */
.wct-portal-wrap .wct-section-content .wct-mb-0 { margin-bottom: 0 !important; }
.wct-portal-wrap .wct-section-content .wct-mb-1 { margin-bottom: 8px !important; }
.wct-portal-wrap .wct-section-content .wct-mb-2 { margin-bottom: 16px !important; }
.wct-portal-wrap .wct-section-content .wct-mb-3 { margin-bottom: 24px !important; }
.wct-portal-wrap .wct-section-content .wct-mt-0 { margin-top: 0 !important; }
.wct-portal-wrap .wct-section-content .wct-mt-1 { margin-top: 8px !important; }
.wct-portal-wrap .wct-section-content .wct-mt-2 { margin-top: 16px !important; }
.wct-portal-wrap .wct-section-content .wct-mt-3 { margin-top: 24px !important; }

/* Text Utilities */
.wct-portal-wrap .wct-section-content .wct-text-center { text-align: center !important; }
.wct-portal-wrap .wct-section-content .wct-text-muted { color: #6b7280 !important; }
.wct-portal-wrap .wct-section-content .wct-text-small { font-size: 13px !important; }
.wct-portal-wrap .wct-section-content .wct-text-large { font-size: 18px !important; }
.wct-portal-wrap .wct-section-content .wct-font-bold { font-weight: 600 !important; }

/* Welcome State */
.wct-portal-wrap .wct-welcome {
    text-align: center !important;
    padding: 60px 20px !important;
}

.wct-portal-wrap .wct-welcome h2 {
    font-size: 24px !important;
    color: #1f2937 !important;
    margin-bottom: 12px !important;
}

.wct-portal-wrap .wct-welcome p {
    color: #6b7280 !important;
    font-size: 16px !important;
}

/* Loading */
.wct-portal-wrap .wct-loading {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 60px !important;
}

.wct-portal-wrap .wct-spinner {
    width: 40px !important;
    height: 40px !important;
    border: 3px solid #e5e7eb !important;
    border-top-color: #3b82f6 !important;
    border-radius: 50% !important;
    animation: wct-spin 0.8s linear infinite !important;
}

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

/* Message States */
.wct-portal-wrap .wct-portal-message,
.wct-portal-wrap .wct-portal-blocked {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 100vh !important;
    background: #f3f4f6 !important;
    padding: 20px !important;
}

.wct-portal-wrap .wct-message-card,
.wct-portal-wrap .wct-blocked-card {
    background: #fff !important;
    border-radius: 16px !important;
    padding: 40px !important;
    text-align: center !important;
    max-width: 400px !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
}

.wct-portal-wrap .wct-message-card h2,
.wct-portal-wrap .wct-blocked-card h2 {
    font-size: 20px !important;
    color: #1f2937 !important;
    margin: 16px 0 8px 0 !important;
}

.wct-portal-wrap .wct-message-card p,
.wct-portal-wrap .wct-blocked-card p {
    color: #6b7280 !important;
    margin-bottom: 20px !important;
}

.wct-portal-wrap .wct-large-icon {
    width: 48px !important;
    height: 48px !important;
    font-size: 48px !important;
    color: #6b7280 !important;
}

.wct-portal-wrap .wct-icon-warning {
    color: #f59e0b !important;
}

/* Blocked Screen */
.wct-portal-wrap .wct-blocked-icon {
    width: 80px !important;
    height: 80px !important;
    margin: 0 auto 20px auto !important;
    background: rgba(239, 68, 68, 0.1) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.wct-portal-wrap .wct-blocked-icon .dashicons {
    width: 40px !important;
    height: 40px !important;
    font-size: 40px !important;
    color: #ef4444 !important;
}

.wct-portal-wrap .wct-blocked-alert {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    background: #fef2f2 !important;
    border: 1px solid #fecaca !important;
    border-radius: 8px !important;
    padding: 16px !important;
    margin: 20px 0 !important;
    text-align: left !important;
}

.wct-portal-wrap .wct-blocked-alert .dashicons {
    width: 20px !important;
    height: 20px !important;
    font-size: 20px !important;
    color: #ef4444 !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
}

.wct-portal-wrap .wct-blocked-alert strong {
    display: block !important;
    color: #dc2626 !important;
    margin-bottom: 4px !important;
}

.wct-portal-wrap .wct-blocked-alert p {
    font-size: 13px !important;
    color: #7f1d1d !important;
    margin: 0 !important;
}

.wct-portal-wrap .wct-blocked-info {
    background: #f9fafb !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
    margin-bottom: 20px !important;
    text-align: left !important;
}

.wct-portal-wrap .wct-blocked-info p {
    font-size: 13px !important;
    color: #4b5563 !important;
    margin: 4px 0 !important;
}

.wct-portal-wrap .wct-blocked-info strong { color: #1f2937 !important; }

/* Buttons */
.wct-portal-wrap .wct-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    text-decoration: none !important;
    border: none !important;
    font-family: inherit !important;
    background: #3b82f6 !important;
    color: #fff !important;
}

.wct-portal-wrap .wct-btn:hover {
    background: #2563eb !important;
    color: #fff !important;
}

/* Responsive */
@media (max-width: 1024px) {
    .wct-portal-wrap .wct-sidebar { width: 240px !important; min-width: 240px !important; max-width: 240px !important; }
}

@media (max-width: 768px) {
    .wct-portal-wrap .wct-portal-layout { flex-direction: column !important; }
    .wct-portal-wrap .wct-sidebar { width: 100% !important; min-width: 100% !important; max-width: 100% !important; height: auto !important; position: relative !important; }
    .wct-portal-wrap .wct-nav { flex-direction: row !important; flex-wrap: wrap !important; gap: 8px !important; }
    .wct-portal-wrap .wct-nav-group { flex-direction: row !important; flex-wrap: wrap !important; gap: 8px !important; margin-bottom: 8px !important; width: auto !important; }
    .wct-portal-wrap .wct-nav-label { width: 100% !important; }
    .wct-portal-wrap .wct-nav-item { width: auto !important; border-radius: 6px !important; border-left: none !important; }
    .wct-portal-wrap .wct-search-input { width: 120px !important; }
    .wct-portal-wrap .wct-content { padding: 16px !important; }
}