/**
 * Investor Network Sidebar Menu Styles
 * Enhanced Design with Clear Text and Attractive Icons
 * Version: 2.0
 */

/* Main Sidebar Container */
.investor-sidebar-menu {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    border: 1px solid #e1e5e9;
    overflow: hidden;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    transition: all 0.3s ease;
    margin-top: 0 !important; /* ensure block aligns to top without extra spacing */
    margin-bottom: 0 !important;
    width: 100%;
    display: block;
    padding-top: 0; /* ensure no internal top gap */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Try to neutralize common theme container gaps */
.widget .investor-sidebar-menu,
.wp-block-group .investor-sidebar-menu,
.wp-block .investor-sidebar-menu {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
}

/* Remove theme-added top spacing on wrappers that contain this menu */
.widget:has(> .investor-sidebar-menu),
.widget_block:has(> .investor-sidebar-menu),
.wp-block:has(> .investor-sidebar-menu),
.wp-block-group:has(> .investor-sidebar-menu),
/* broader descendant selector version in case of extra wrappers */
.widget:has(.investor-sidebar-menu),
.widget_block:has(.investor-sidebar-menu),
.wp-block:has(.investor-sidebar-menu),
.wp-block-group:has(.investor-sidebar-menu) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Gutenberg Preformatted block sometimes wraps our menu in widgets; neutralize its spacing/typography */
.wp-block-preformatted:has(.investor-sidebar-menu) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    white-space: normal !important; /* allow normal layout inside */
    font-family: inherit !important;
    background: transparent !important;
    border: 0 !important;
    overflow: visible !important; /* allow sticky descendants to escape */
}

/* Fallback when :has is unsupported: target the menu inside Preformatted wrapper */
.wp-block-preformatted .investor-sidebar-menu {
    margin-top: 0 !important;
}

/* If sidebar container adds spacing, collapse when menu present */
.sidebar-main:has(.investor-sidebar-menu) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* If the widget has a title directly before our menu, collapse its bottom margin to remove gaps */
.widget .widget-title + .investor-sidebar-menu { /* legacy fallback without :has */
    /* no extra top margin on the menu itself */
    margin-top: 0 !important;
}
.widget .wp-block-heading + .investor-sidebar-menu { /* Gutenberg heading block used as title */
    margin-top: 0 !important;
}
.widget .widget-title:has(+ .investor-sidebar-menu),
.widget .wp-block-heading:has(+ .investor-sidebar-menu) {
    margin-bottom: 6px !important; /* reduce default 1em gap above menu */
}

/* Footer widget areas often downsize font; normalize inside our menu for readability */
.footer-widget-area .widget:has(.investor-sidebar-menu) {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.footer-widget-area .investor-sidebar-menu {
    font-size: 16px; /* ensure clear text in footers too */
    line-height: 1.5;
}

/* Astra theme adjustments for #secondary when our menu is present */
#secondary:has(.investor-sidebar-menu) {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

@media (min-width: 993px) {
  .ast-left-sidebar #secondary:has(.investor-sidebar-menu) {
      padding-right: 0 !important;
  }
  .ast-right-sidebar #secondary:has(.investor-sidebar-menu) {
      padding-left: 0 !important;
  }
}

/* Sticky behavior: keep the menu visible while scrolling in sidebars */
@supports ((position: sticky) or (position: -webkit-sticky)) {
  #secondary .investor-sidebar-menu {
      position: -webkit-sticky;
      position: sticky;
      top: 24px; /* base offset below theme header */
      z-index: 2;
  }
  /* Account for WP admin bar */
  body.admin-bar #secondary .investor-sidebar-menu {
      top: 56px; /* 24 + 32px admin bar */
  }
  @media (max-width: 782px) {
      body.admin-bar #secondary .investor-sidebar-menu {
          top: 70px; /* 24 + 46px admin bar on small screens */
      }
  }
  /* Keep sticky enabled on mobile per user request */
  @media (max-width: 768px) {
      #secondary .investor-sidebar-menu { top: 24px; }
  }
}

.investor-sidebar-menu:hover {
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.12);
}

/* Scroll-to-top floating button (mobile-focused) */
.investor-scroll-top {
    position: fixed;
    left: max(16px, env(safe-area-inset-left));
    right: auto;
    bottom: 20px;
    z-index: 999;
    width: 52px;
    height: 52px;
    border-radius: 26px;
    display: none; /* default hidden */
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    border: 1px solid rgba(0,0,0,0.08);
    box-shadow: 0 6px 16px rgba(0,0,0,0.15);
    cursor: pointer;
}
.investor-scroll-top .dashicons { color:#fff; font-size: 24px; width: 24px; height: 24px; line-height: 1; }
.investor-scroll-top:hover { filter: brightness(1.05); }

/* Show the button whenever .visible is toggled (all screens) */
.investor-scroll-top.visible { display: inline-flex; }

/* Header Styles */
.sidebar-menu-header {
    padding: 8px; /* tighter header padding to bring content up */
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    display: flex;
    align-items: center;
    gap: 15px;
}

.user-avatar img {
    border-radius: 50%;
    width: 96px;  /* larger avatar for visibility */
    height: 96px;
    border: 3px solid rgba(255,255,255,0.3);
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

.user-info {
    flex: 1;
}

.user-name {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 4px;
}

.user-status {
    font-size: 12px;
    opacity: 0.9;
}

.menu-title {
    font-size: 20px;
    font-weight: 600;
    margin: 0;
}

/* Menu Section Title */
.menu-section-title {
    padding: 15px 20px 10px;
    font-size: 13px;
    font-weight: 600;
    color: #718096;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Main Menu Items */
.sidebar-menu-items {
    padding: 0;
}

.menu-action-item {
    display: flex;
    align-items: center;
    padding: 6px 12px; /* even tighter vertical spacing */
    text-decoration: none;
    color: #1f2937;
    font-size: 16px;
    font-weight: 500;
    transition: all 0.2s ease;
    border-left: 4px solid transparent;
    gap: 6px; /* less space between icon and text */
    position: relative;
}

.menu-action-item:hover {
    background: #f7fafc;
    color: #111827;
    border-left-color: #4299e1;
}

.menu-action-item.active {
    background: #ebf8ff;
    color: #2b6cb0;
    border-left-color: #3182ce;
    font-weight: 600;
}

.action-icon {
    font-size: 30px; /* larger icons */
    width: 34px;
    text-align: center;
    flex-shrink: 0;
    color: #4299e1;
}
.action-icon .dashicons { font-size: 1.6em; width: 1.6em; height: 1.6em; line-height: 1; }
.action-icon img.icon-svg { width: 1.6em; height: 1.6em; display: inline-block; vertical-align: middle; }

.menu-action-item:hover .action-icon {
    color: #3182ce;
}

.menu-action-item.active .action-icon {
    color: #2b6cb0;
}

.action-text {
    flex: 1;
    display: flex;
    flex-direction: column;
    word-break: break-word;
}

.action-title {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
}

.action-desc {
    font-size: 14px;
    color: #4b5563;
    margin-top: 3px;
}

/* Per-item accent colors (icon + active/hover border) */
.menu-action-item.item-in_cashflow_summary .action-icon { color:#0ea5a4; }
.menu-action-item.item-in_cashflow_summary:hover { border-left-color:#0ea5a4; }
.menu-action-item.item-in_cashflow_summary.active { border-left-color:#0ea5a4; background:#ecfeff; color:#0b3b3b; }

.menu-action-item.item-in_net_income_summary .action-icon { color:#6366f1; }
.menu-action-item.item-in_net_income_summary:hover { border-left-color:#6366f1; }
.menu-action-item.item-in_net_income_summary.active { border-left-color:#6366f1; background:#eef2ff; color:#1e1b4b; }

.menu-action-item.item-investor_proposals .action-icon { color:#f59e0b; }
.menu-action-item.item-investor_proposals:hover { border-left-color:#f59e0b; }
.menu-action-item.item-investor_proposals.active { border-left-color:#f59e0b; background:#fffbeb; color:#78350f; }

.menu-action-item.item-investor_payments_dashboard .action-icon { color:#ef4444; }
.menu-action-item.item-investor_payments_dashboard:hover { border-left-color:#ef4444; }
.menu-action-item.item-investor_payments_dashboard.active { border-left-color:#ef4444; background:#fef2f2; color:#7f1d1d; }

.menu-action-item.item-member_portfolio .action-icon { color:#10b981; }
.menu-action-item.item-member_portfolio:hover { border-left-color:#10b981; }
.menu-action-item.item-member_portfolio.active { border-left-color:#10b981; background:#ecfdf5; color:#064e3b; }

.menu-action-item.item-investor_meetings .action-icon { color:#8b5cf6; }
.menu-action-item.item-investor_meetings:hover { border-left-color:#8b5cf6; }
.menu-action-item.item-investor_meetings.active { border-left-color:#8b5cf6; background:#f5f3ff; color:#2e1065; }

.menu-action-item.item-investor_announcements .action-icon { color:#0ea5e9; }
.menu-action-item.item-investor_announcements:hover { border-left-color:#0ea5e9; }
.menu-action-item.item-investor_announcements.active { border-left-color:#0ea5e9; background:#f0f9ff; color:#0c4a6e; }

.menu-action-item.item-investor_notifications .action-icon { color:#f97316; }
.menu-action-item.item-investor_notifications:hover { border-left-color:#f97316; }
.menu-action-item.item-investor_notifications.active { border-left-color:#f97316; background:#fff7ed; color:#7c2d12; }

.menu-action-item.item-im_contributions .action-icon { color:#06b6d4; }
.menu-action-item.item-im_contributions:hover { border-left-color:#06b6d4; }
.menu-action-item.item-im_contributions.active { border-left-color:#06b6d4; background:#ecfeff; color:#083344; }

.menu-action-item.item-investor_network_activity .action-icon { color:#3b82f6; }
.menu-action-item.item-investor_network_activity:hover { border-left-color:#3b82f6; }
.menu-action-item.item-investor_network_activity.active { border-left-color:#3b82f6; background:#eff6ff; color:#0b2a63; }

.menu-action-item.item-investment_calculator .action-icon { color:#84cc16; }
.menu-action-item.item-investment_calculator:hover { border-left-color:#84cc16; }
.menu-action-item.item-investment_calculator.active { border-left-color:#84cc16; background:#f7fee7; color:#365314; }

/* Account settings accent */
.menu-action-item.item-member_profile .action-icon { color:#7c3aed; }
.menu-action-item.item-member_profile:hover { border-left-color:#7c3aed; }
.menu-action-item.item-member_profile.active { border-left-color:#7c3aed; background:#f5f3ff; color:#2e1065; }

.action-badge {
    background: #4299e1;
    color: white;
    padding: 3px 8px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: 600;
    margin-left: auto;
    flex-shrink: 0;
    box-shadow: 0 2px 4px rgba(66, 153, 225, 0.3);
}

/* Priority Actions Section */
.priority-actions {
    padding: 20px;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.priority-action {
    display: flex;
    align-items: center;
    padding: 12px 15px;
    text-decoration: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    transition: all 0.2s ease;
    gap: 12px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.priority-action.primary {
    background: #4299e1;
    color: white;
}

.priority-action.primary:hover {
    background: #3182ce;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(66, 153, 225, 0.3);
}

.priority-action.secondary {
    background: white;
    color: #4a5568;
    border: 1px solid #e2e8f0;
}

.priority-action.secondary:hover {
    background: #f7fafc;
    border-color: #cbd5e0;
    transform: translateY(-1px);
}

.priority-action.logout {
    background: white;
    color: #e53e3e;
    border: 1px solid #e53e3e;
}

.priority-action.logout:hover {
    background: #e53e3e;
    color: white;
    transform: translateY(-1px);
}

/* Compact Mode */
.investor-sidebar-menu.compact .menu-action-item {
    padding: 6px 10px;
    font-size: 13px;
}

.investor-sidebar-menu.compact .action-icon {
    font-size: 16px;
}

.investor-sidebar-menu.compact .priority-actions {
    padding: 15px;
}

.investor-sidebar-menu.compact .priority-action {
    padding: 10px 12px;
    font-size: 13px;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .sidebar-menu-header { padding: 10px; }
    
    .menu-action-item { padding: 8px 12px; font-size: 15px; gap: 8px; min-height: 44px; }
    .action-icon { font-size: 26px; }
    
    .priority-actions {
        padding: 15px;
    }
    
    .priority-action { padding: 10px 12px; font-size: 15px; min-height: 44px; }
}

@media (max-width: 768px) {
    .investor-sidebar-menu { border-radius: 8px; margin-top: 0 !important; width: 100%; }

    .sidebar-menu-header {
        padding: 8px; /* tighter header padding on mobile */
        flex-direction: column; /* stack avatar and text */
        align-items: center;
        text-align: center;
        gap: 10px;
    }

    .user-avatar img {
        width: 96px; /* keep avatar large on mobile */
        height: 96px;
    }

    .user-name { font-size: 16px; }

    .menu-action-item { padding: 10px 12px; font-size: 15px; gap: 10px; min-height: 44px; }

    .action-icon { font-size: 28px; }

    .priority-actions { padding: 12px; gap: 8px; }
    .priority-action { padding: 10px 12px; font-size: 15px; min-height: 44px; }
}