/**
 * Software 页面样式
 *
 * @package     block-canvas Child
 * @subpackage  Assets
 * @author      JoshuaWang2019
 * @version     1.0.0
 * @since       2025-07-03
 */

/* Software 容器样式 */
.software-container {
  padding: var(--spacing-xl) var(--spacing-lg) !important;
  background: var(--theme-gradient-background) !important;
  min-height: 100vh !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.software-content-wrapper {
  max-width: 800px !important;
  width: 100% !important;
  margin: 0 auto !important;
  background: var(--card-bg) !important;
  border-radius: var(--card-radius) !important;
  overflow: hidden !important;
  box-shadow: var(--card-shadow) !important;
  position: relative !important;
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
}

/* 软件信息头部样式 */
.software-header {
  padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-lg)
    var(--spacing-xl) !important;
  border-bottom: 1px solid var(--theme-gray-200) !important;
}

/* 软件标题区域样式 */
.software-title-section {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--spacing-lg) !important;
  margin-bottom: var(--spacing-lg) !important;
}

.software-icon {
  flex-shrink: 0 !important;
}

.software-icon-img {
  width: 80px !important;
  height: 80px !important;
  object-fit: cover !important;
  border-radius: var(--border-radius) !important;
  box-shadow: var(--card-shadow) !important;
  border: 2px solid var(--theme-gray-200) !important;
}

.software-title {
  font-size: var(--font-size-3xl) !important;
  font-weight: var(--font-weight-bold) !important;
  color: var(--theme-primary) !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

.software-description {
  font-size: var(--font-size-lg) !important;
  line-height: 1.6 !important;
  color: var(--theme-gray-700) !important;
  margin-bottom: var(--spacing-lg) !important;
  text-align: center !important;
}

.software-description p {
  margin: 0 0 var(--spacing-md) 0 !important;
}

.software-description p:last-child {
  margin-bottom: 0 !important;
}

/* 软件元数据样式 */
.software-meta {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
  gap: var(--spacing-md) !important;
  margin-top: var(--spacing-lg) !important;
  padding: var(--spacing-lg) !important;
  background: var(--theme-gray-50) !important;
  border-radius: var(--border-radius-md) !important;
}

.software-meta-item {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--spacing-xs) !important;
}

.software-meta-item .meta-label {
  font-weight: var(--font-weight-semibold) !important;
  color: var(--theme-gray-600) !important;
  font-size: var(--font-size-sm) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

.software-meta-item .meta-value {
  font-weight: var(--font-weight-medium) !important;
  color: var(--theme-gray-800) !important;
  font-size: var(--font-size-base) !important;
}

/* 软件下载区域样式 */
.software-download-section {
  padding: var(--spacing-xl) !important;
}

.download-title {
  font-size: var(--font-size-2xl) !important;
  font-weight: var(--font-weight-bold) !important;
  color: var(--theme-primary) !important;
  margin: 0 0 var(--spacing-lg) 0 !important;
  text-align: center !important;
}

.download-info {
  display: flex !important;
  flex-direction: column !important;
  gap: var(--spacing-lg) !important;
  padding: var(--spacing-lg) !important;
  background: var(--theme-gray-50) !important;
  border-radius: var(--border-radius-lg) !important;
  border: 2px dashed var(--theme-primary-light) !important;
}

/* 软件文件信息样式 */
.software-file-info {
  display: flex !important;
  align-items: center !important;
  gap: var(--spacing-md) !important;
}

.file-icon {
  font-size: 3rem !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

.file-details {
  flex: 1 !important;
  min-width: 0 !important;
}

.file-name {
  font-size: var(--font-size-lg) !important;
  font-weight: var(--font-weight-semibold) !important;
  color: var(--theme-gray-800) !important;
  margin-bottom: var(--spacing-xs) !important;
  word-break: break-word !important;
}

.file-size {
  font-size: var(--font-size-sm) !important;
  color: var(--theme-gray-600) !important;
  font-weight: var(--font-weight-medium) !important;
}

/* 下载按钮样式 */
.download-actions {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.download-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: var(--spacing-sm) !important;
  padding: var(--spacing-md) var(--spacing-xl) !important;
  font-size: var(--font-size-lg) !important;
  font-weight: var(--font-weight-semibold) !important;
  text-decoration: none !important;
  border-radius: var(--border-radius-lg) !important;
  transition: all var(--transition-base) !important;
  cursor: pointer !important;
  border: none !important;
  outline: none !important;
  box-shadow: var(--shadow-md) !important;
  min-width: 160px !important;
  justify-content: center !important;
}

.download-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--shadow-lg) !important;
}

.download-btn:active {
  transform: translateY(0) !important;
  box-shadow: var(--shadow-sm) !important;
}

.download-icon {
  font-size: 1.25em !important;
  line-height: 1 !important;
}

/* 下载说明样式 */
.download-notice {
  margin-top: var(--spacing-lg) !important;
  padding: var(--spacing-md) !important;
  background: var(--theme-info-bg, #e6f3ff) !important;
  border: 1px solid var(--theme-info-border, #b3d9ff) !important;
  border-radius: var(--border-radius-md) !important;
}

.notice-text {
  margin: 0 !important;
  font-size: var(--font-size-sm) !important;
  color: var(--theme-info-text, #0066cc) !important;
  line-height: 1.5 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: var(--spacing-sm) !important;
}

.notice-icon {
  font-size: 1.1em !important;
  flex-shrink: 0 !important;
  margin-top: 1px !important;
}

/* ==========================================================================
   响应式设计
   ========================================================================== */

/* 平板设备 */
@media (max-width: 768px) {
  .software-container {
    padding: var(--spacing-lg) var(--spacing-md) !important;
  }

  .software-content-wrapper {
    margin: var(--spacing-lg) var(--spacing-md) !important;
  }

  .software-header {
    padding: var(--spacing-lg) !important;
  }

  .software-title-section {
    flex-direction: column !important;
    text-align: center !important;
    gap: var(--spacing-md) !important;
  }

  .software-icon-img {
    width: 60px !important;
    height: 60px !important;
  }

  .software-title {
    text-align: center !important;
    font-size: var(--font-size-2xl) !important;
  }

  .software-download-section {
    padding: var(--spacing-md) !important;
  }

  .software-file-info {
    flex-direction: column !important;
    text-align: center !important;
    gap: var(--spacing-sm) !important;
  }
}

/* 手机设备 */
@media (max-width: 480px) {
  .software-container {
    padding: var(--spacing-md) var(--spacing-sm) !important;
  }

  .software-header {
    padding: var(--spacing-md) !important;
  }

  .software-icon-img {
    width: 50px !important;
    height: 50px !important;
  }
}

/* ==========================================================================
   可访问性和交互增强
   ========================================================================== */

/* 聚焦状态 */
.download-btn:focus {
  outline: 2px solid var(--theme-primary) !important;
  outline-offset: 2px !important;
}

/* 禁用状态 */
.download-btn:disabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

/* 高对比度模式支持 */
@media (prefers-contrast: high) {
  .software-meta {
    border: 1px solid var(--theme-gray-400) !important;
  }

  .download-info {
    border: 2px solid var(--theme-primary) !important;
  }

  .download-notice {
    border: 2px solid var(--theme-info-border, #0066cc) !important;
  }
}

/* 减少动画模式 */
@media (prefers-reduced-motion: reduce) {
  .download-btn {
    transition: none !important;
  }

  .download-btn:hover {
    transform: none !important;
  }

  .download-btn:active {
    transform: none !important;
  }
}

/* 打印样式 */
@media print {
  .software-container {
    background: white !important;
    padding: 0 !important;
  }

  .software-content-wrapper {
    box-shadow: none !important;
    border: 1px solid #000 !important;
  }

  .download-btn {
    display: none !important;
  }

  .download-notice {
    display: none !important;
  }
}

/* ==========================================================================
   深色模式适配
   ========================================================================== */
@media (prefers-color-scheme: dark) {
  .software-container {
    background: var(--theme-gray-50) !important;
  }

  .software-content-wrapper {
    background: var(--card-bg) !important;
    border-color: var(--theme-gray-200) !important;
  }

  .software-header {
    border-bottom-color: var(--theme-gray-200) !important;
  }

  .software-title {
    color: var(--theme-gray-800) !important;
  }

  .software-version,
  .software-meta,
  .software-author,
  .software-date {
    color: var(--theme-gray-400) !important;
  }

  .software-description,
  .software-content,
  .software-content p {
    color: var(--theme-gray-600) !important;
  }

  .software-content h1,
  .software-content h2,
  .software-content h3,
  .software-content h4,
  .software-content h5,
  .software-content h6 {
    color: var(--theme-gray-800) !important;
  }

  .software-download-section {
    background: var(--theme-gray-100) !important;
    border-color: var(--theme-gray-200) !important;
  }

  .download-btn {
    background: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
  }

  .download-btn:hover {
    background: var(--theme-primary-dark) !important;
  }

  .software-tags a {
    background: var(--theme-gray-100) !important;
    color: var(--theme-gray-600) !important;
  }

  .software-tags a:hover {
    background: var(--theme-primary) !important;
    color: white !important;
  }

  .software-navigation {
    background: var(--card-bg) !important;
    border-color: var(--theme-gray-200) !important;
  }

  .nav-link {
    color: var(--theme-gray-600) !important;
  }

  .nav-link:hover {
    color: var(--theme-primary) !important;
  }

  .software-requirements {
    background: var(--theme-gray-100) !important;
    border-left-color: var(--theme-primary-light) !important;
  }

  .software-requirements h4 {
    color: var(--theme-gray-800) !important;
  }

  .software-requirements ul li {
    color: var(--theme-gray-600) !important;
  }
}
