/* 图片处理工具 - 与 L4D2 站点统一的透明玻璃风格 */
html,
body.site-embed {
    background: transparent !important;
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

.site-embed header,
.site-embed section:not(#main-content),
.site-embed footer,
.site-embed [style*="display:none"] {
    display: none !important;
}

.site-embed #main-content {
    background: transparent !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.site-embed h2,
.site-embed h3 {
    color: rgba(255, 255, 255, 0.95) !important;
}

.site-embed .text-dark,
.site-embed .text-gray-600,
.site-embed .text-gray-700,
.site-embed .text-gray-500,
.site-embed .text-gray-400,
.site-embed label,
.site-embed p,
.site-embed span {
    color: rgba(255, 255, 255, 0.82) !important;
}

.site-embed .bg-white,
.site-embed .bg-gray-50,
.site-embed .bg-gray-100,
.site-embed .bg-gray-200,
.site-embed #tools,
.site-embed #upload,
.site-embed #processing,
.site-embed #drop-area,
.site-embed .tool-card,
.site-embed .image-preview {
    background: rgba(255, 255, 255, 0.08) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-color: rgba(255, 255, 255, 0.2) !important;
    box-shadow: none !important;
}

.site-embed .shadow-sm,
.site-embed .shadow-md,
.site-embed .shadow-lg {
    box-shadow: none !important;
}

.site-embed #drop-area {
    border: 2px dashed rgba(255, 255, 255, 0.35) !important;
}

.site-embed #drop-area:hover,
.site-embed #drop-area.border-primary {
    border-color: rgba(255, 133, 192, 0.7) !important;
    background: rgba(255, 255, 255, 0.12) !important;
}

.site-embed .tool-card:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.35) !important;
}

.site-embed .tool-card.ring-2 {
    border-color: rgba(255, 133, 192, 0.75) !important;
    box-shadow: 0 0 0 2px rgba(255, 133, 192, 0.45) !important;
}

.site-embed .ring-primary {
    --tw-ring-color: rgba(255, 133, 192, 0.65) !important;
}

.site-embed button,
.site-embed a.bg-white,
.site-embed .bg-primary,
.site-embed .bg-secondary,
.site-embed #download-btn,
.site-embed #reset-btn,
.site-embed #new-image-btn,
.site-embed #crop-reset {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    box-shadow: none !important;
}

.site-embed button:hover,
.site-embed #download-btn:hover,
.site-embed #reset-btn:hover,
.site-embed #new-image-btn:hover,
.site-embed #crop-reset:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
}

.site-embed input[type="file"],
.site-embed input[type="text"],
.site-embed input[type="number"],
.site-embed select,
.site-embed textarea {
    background: rgba(0, 0, 0, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    color: rgba(255, 255, 255, 0.9) !important;
}

.site-embed input[type="range"] {
    accent-color: #ff85c0;
}

.site-embed .text-primary {
    color: #ff85c0 !important;
}

.site-embed .text-secondary {
    color: rgba(255, 255, 255, 0.85) !important;
}

.site-embed .fa {
    color: inherit;
}

.site-embed .crop-overlay {
    border-color: rgba(255, 133, 192, 0.85) !important;
    background-color: rgba(255, 133, 192, 0.12) !important;
}

.site-embed .crop-handle {
    background-color: #ff85c0 !important;
    border-color: rgba(255, 255, 255, 0.8) !important;
}

.site-embed ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.site-embed ::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.25);
    border-radius: 4px;
}

.site-embed ::-webkit-scrollbar-track {
    background: transparent;
}