/* 强制“开始生成”按钮高度和主按钮样式（覆盖全局/系统样式） */
#bananaPage .upload-section .upload-button#generateBtn {
    height: 80px !important;
    min-height: 80px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
    border: 1px solid #16a34a !important;
    color: #ffffff !important;
    border-radius: 14px !important; /* 改为圆角矩形，去掉大椭圆效果 */
}
/* UXP/CEP 环境下 appearance:none 会导致 select 选项文字无法正确渲染而"乱码"，仅保留背景/边框样式 */
#bananaPage .main-content select.dark-select,
#bananaPage .form-group select#batchSize {
    background: #020617 !important;
    color: #e5e7eb !important;
    border: 1px solid #374151 !important;
    padding: 6px !important;
}

#bananaPage .main-content select.dark-select:focus,
#bananaPage .form-group select#batchSize:focus {
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.15) !important;
    border-color: #4ade80 !important;
    background: #1f1f1f !important;
    color: #e5e7eb !important;
}

/* option/optgroup 也统一深色 */
#bananaPage .main-content select.dark-select option,
#bananaPage .form-group select#batchSize option,
#bananaPage .main-content select.dark-select optgroup,
#bananaPage .form-group select#batchSize optgroup {
    background: #1f1f1f !important;
    color: #e5e7eb !important;
}

/* 隐藏IE下拉箭头（以防宿主兼容层） */
#bananaPage .main-content select.dark-select::-ms-expand,
#bananaPage .form-group select#batchSize::-ms-expand { display: none !important; }
/* 全局字体统一 - 确保所有文字使用一致字体 */
#bananaPage,
#bananaPage *,
#ecommercePanel,
#ecommercePanel * {
    font-family: "Microsoft YaHei", "微软雅黑", Arial, sans-serif !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    font-smooth: always !important;
}

/* 取消所有圆角设计 - 旧实现已移除，圆角现在由各组件在 styles.css 中自行控制 */

/* 保持开关的圆角设计 */
.switch,
.slider,
.slider:before {
    border-radius: 24px !important;
}

/* Gemini 特定样式 */

/* 画幅比例选择器样式 */
.aspect-ratio-selector {
    position: relative;
}

.aspect-ratio-options {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
    gap: 8px;
    margin-top: 8px;
}

.aspect-ratio-option {
    padding: 8px;
    border: 2px solid #e1e5e9;
    border-radius: 6px;
    background: #f8f9fa;
    text-align: center;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 0.75rem;
}

.aspect-ratio-option:hover {
    border-color: #94a3b8;
    background: #f1f5f9;
}

.aspect-ratio-option.selected {
    border-color: #64748b;
    background: #e2e8f0;
    color: #1e293b;
    font-weight: 600;
}

/* 进度指示器 */
.progress-container {
    margin: 15px 0;
    padding: 10px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e1e5e9;
}

.progress-bar {
    width: 100%;
    height: 6px;
    background: #e2e8f0;
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 8px;
}

.progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #64748b, #475569);
    border-radius: 3px;
    transition: width 0.3s ease;
    width: 0%;
}

.progress-text {
    font-size: 0.8rem;
    color: #64748b;
    text-align: center;
}

/* 生成状态指示器 */
.generation-status {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #f8f9fa;
    border-radius: 8px;
    margin: 10px 0;
    border: 1px solid #e1e5e9;
}

#bananaPage .status-indicator,
#ecommercePanel .status-indicator {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #e2e8f0;
    animation: pulse 2s infinite;
}

#bananaPage .status-indicator.generating,
#ecommercePanel .status-indicator.generating {
    display: none !important;
    background: #f59e0b;
}

#bananaPage .status-indicator.success,
#ecommercePanel .status-indicator.success {
    display: none !important;
    background: #16a34a;
    animation: none;
}

#bananaPage .status-indicator.error,
#ecommercePanel .status-indicator.error {
    display: none !important;
    background: #dc2626;
    animation: none;
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

#bananaPage .status-text,
#ecommercePanel .status-text {
    display: none !important;
    font-size: 0.8rem;
    color: #64748b;
}

/* 图像网格布局 */
.image-grid.multiple-images {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
}

.image-grid.multiple-images .image-item {
    max-height: 200px;
}

.image-grid.multiple-images .image-item img {
    max-height: 150px;
}

/* 批量操作按钮 */
.batch-actions {
    display: flex;
    gap: 8px;
    margin: 15px 0;
    flex-wrap: wrap;
}

.batch-btn {
    padding: 8px 16px;
    border: none;
    border-radius: 6px;
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 6px;
}

.batch-btn.primary {
    background: #0ea5e9;
    color: white;
}

.batch-btn.primary:hover {
    background: #0284c7;
}

.batch-btn.secondary {
    background: #f59e0b;
    color: white;
}

.batch-btn.secondary:hover {
    background: #d97706;
}

.batch-btn.danger {
    background: #dc2626;
    color: white;
}

.batch-btn.danger:hover {
    background: #b91c1c;
}

/* 通知样式 - 隐藏所有通知 */
.notification {
    display: none !important;
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 12px 20px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    z-index: 1000;
    font-size: 0.85rem;
    max-width: 300px;
    animation: slideIn 0.3s ease;
}

.notification.success {
    background: #dcfce7;
    color: #166534;
    border-left: 4px solid #16a34a;
}

.notification.error {
    background: #fee2e2;
    color: #dc2626;
    border-left: 4px solid #dc2626;
}

.notification.info {
    background: #dbeafe;
    color: #1e40af;
    border-left: 4px solid #3b82f6;
}

@keyframes slideIn {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* 工具提示 - 隐藏所有工具提示 */
.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    display: none !important;
    visibility: hidden;
    width: 200px;
    background-color: #1e293b;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    left: 50%;
    margin-left: -100px;
    opacity: 0;
    transition: opacity 0.3s;
    font-size: 0.75rem;
    line-height: 1.4;
}

.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #1e293b transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
    display: none !important;
    visibility: hidden;
    opacity: 0;
}

/* 加载动画变体 */
.loading-dots {
    display: inline-block;
    position: relative;
    width: 40px;
    height: 10px;
}

.loading-dots div {
    position: absolute;
    top: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #64748b;
    animation: loadingDots 1.4s infinite ease-in-out both;
}

.loading-dots div:nth-child(1) { left: 0; animation-delay: -0.32s; }
.loading-dots div:nth-child(2) { left: 12px; animation-delay: -0.16s; }
.loading-dots div:nth-child(3) { left: 24px; animation-delay: 0s; }

@keyframes loadingDots {
    0%, 80%, 100% {
        transform: scale(0);
    }
    40% {
        transform: scale(1);
    }
}

/* 错误状态样式 */
.error-state {
    text-align: center;
    padding: 30px 20px;
    color: #dc2626;
}

.error-state .error-icon {
    font-size: 2.5rem;
    margin-bottom: 15px;
}

.error-state h3 {
    color: #dc2626;
    margin-bottom: 10px;
}

.error-state p {
    color: #64748b;
    font-size: 0.9rem;
    line-height: 1.5;
}

/* 成功状态样式 */
.success-state {
    text-align: center;
    padding: 30px 20px;
    color: #16a34a;
}

.success-state .success-icon {
    font-size: 2.5rem;
    margin-bottom: 15px;
}

.success-state h3 {
    color: #16a34a;
    margin-bottom: 10px;
}

/* 紧凑模式 */
.compact-mode .form-group {
    margin-bottom: 10px;
}

.compact-mode .form-group label {
    font-size: 0.8rem;
    margin-bottom: 4px;
}

.compact-mode .form-group input,
.compact-mode .form-group textarea,
.compact-mode .form-group select {
    padding: 8px;
    font-size: 0.8rem;
}

.compact-mode .config-section {
    padding: 10px;
    margin-bottom: 15px;
}

.compact-mode .upload-section {
    padding: 10px;
    margin-bottom: 15px;
}

/* 强制深灰色主题 - 更舒适的深色 */
.main-content {
    background: #1a1a1a !important;
    color: #ffffff !important;
}

#bananaPage .form-group input,
#bananaPage .form-group textarea,
#bananaPage .form-group select {
    background: #2a2a2a !important;
    border-color: #444444 !important;
    color: #ffffff !important;
    font-weight: normal !important;
    font-family: "Microsoft YaHei", "微软雅黑", Arial, sans-serif !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    font-smooth: always !important;
}

#bananaPage .form-group input:focus,
#bananaPage .form-group textarea:focus,
#bananaPage .form-group select:focus {
    background: #2a2a2a !important;
    border-color: #666666 !important;
}

#bananaPage .form-group label {
    color: #ffffff !important;
    font-weight: normal !important;
    font-family: "Microsoft YaHei", "微软雅黑", Arial, sans-serif !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    font-smooth: always !important;
}

/* 覆盖预设下拉框样式 */
#bananaPage .preset-trigger {
    background: #2a2a2a !important;
    border-color: #444444 !important;
    color: #ffffff !important;
    font-weight: normal !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    text-align: left !important;
    vertical-align: middle !important;
    display: flex !important;
    align-items: center !important;
    font-family: "Microsoft YaHei", "微软雅黑", Arial, sans-serif !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    font-smooth: always !important;
}

#bananaPage .preset-trigger:focus {
    background: #2a2a2a !important;
    border-color: #666666 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    text-align: left !important;
    vertical-align: middle !important;
    display: flex !important;
    align-items: center !important;
    font-weight: normal !important;
    font-family: "Microsoft YaHei", "微软雅黑", Arial, sans-serif !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    font-smooth: always !important;
}

#bananaPage .config-section {
    background: #2a2a2a !important;
    border-color: #444444 !important;
    color: #ffffff !important;
}

#bananaPage .upload-section {
    background: #2a2a2a !important;
    border-color: #444444 !important;
    color: #ffffff !important;
}

#bananaPage .upload-section h3 {
    color: #ffffff !important;
    font-weight: 600 !important;
}

.results {
    background: #2a2a2a !important;
}

.image-item {
    background: #2a2a2a !important;
}

.text-output {
    background: #2a2a2a !important;
    color: #ffffff !important;
}

.header {
    background: #2a2a2a !important;
    color: #ffffff !important;
}

/* 尝试覆盖Photoshop系统UI */
#bananaPage,
#ecommercePanel {
    background: #1a1a1a !important;
}

/* 覆盖可能的系统标题栏 */
[data-uxp-panel] {
    background: #1a1a1a !important;
}

.uxp-panel {
    background: #1a1a1a !important;
}

.uxp-panel-header,
.uxp-panel-title,
.uxp-panel-toolbar {
    background: #2a2a2a !important;
    color: #ffffff !important;
}

.uxp-panel-footer,
.uxp-panel-status {
    background: #2a2a2a !important;
    color: #ffffff !important;
}

/* 强制设置根元素背景 */
:root {
    background: #1a1a1a !important;
}
