// 事件详情抽屉样式（从底部弹出）- 深色毛玻璃风格
// 整体比背景亮一些，形成层次感

// 深色主题变量 - 提亮以区分背景
@glass-bg: #2D3748;
@glass-header-bg: #3D4A5C;
@glass-border: rgba(255, 255, 255, 0.12);
@glass-text: #F7FAFC;
@glass-text-secondary: #CBD5E0;
@glass-card-bg: #354259;
@glass-section-bg: #3D4A5C;

// 深色抽屉样式
.event-detail-drawer-dark {
  // 整个抽屉容器
  &.ant-drawer {
    // 内容包装器 - 移除白边
    .ant-drawer-content-wrapper {
      box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.4) !important;
      border: none !important;
    }

    // 内容容器
    .ant-drawer-content {
      background: @glass-bg !important;
      border: none !important;
      border-radius: 16px 16px 0 0 !important;
    }

    // 头部容器
    .ant-drawer-header {
      background: @glass-header-bg !important;
      border-bottom: 1px solid @glass-border !important;
      padding: 16px 24px !important;
      border-radius: 16px 16px 0 0 !important;
    }

    // 标题样式
    .ant-drawer-title {
      color: @glass-text !important;
      font-size: 16px !important;
      font-weight: 600 !important;
      line-height: 1.4 !important;
    }

    // 关闭按钮区域
    .ant-drawer-extra {
      .anticon-close {
        color: @glass-text !important;
        font-size: 18px;
        transition: all 0.2s ease;

        &:hover {
          color: #fff;
          transform: scale(1.1);
        }
      }
    }

    // 内容区域
    .ant-drawer-body {
      background: @glass-bg !important;
      padding: 0 !important;
    }
  }
}

// 原有基础样式保留（非深色模式）
.event-detail-drawer:not(.event-detail-drawer-dark) {
  .ant-drawer-title {
    color: #1A202C;
  }
}