/* Useful Widgets for Elementor - 小组件基础样式 */
/* 注意：此CSS仅应用于插件小组件，绝不影响WordPress核心功能 */

/* 上次更新时间小组件 */
.uwfe-last-updated {
    display: flex;
    align-items: center;
    gap: 8px;
}

.uwfe-last-updated-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    flex-shrink: 0;
    width: auto;
    max-width: none;
    /* 确保图标大小由Elementor控制 */
}

.uwfe-last-updated-icon i,
.uwfe-last-updated-icon svg {
    display: inline-block;
    width: 1em;
    height: 1em;
    /* 防止继承可能影响编辑器的样式 */
    box-sizing: content-box;
    /* 确保不影响其他图标 */
    margin: 0;
    padding: 0;
}

.uwfe-last-updated-label {
    font-weight: 600;
}

/* .uwfe-last-updated-date 的字体样式完全由Elementor控制 */

.uwfe-last-updated-ago {
    font-size: 12px;
    font-style: italic;
}

/* 分类描述小组件 */
.uwfe-category-description-widget {
    /* 基础样式，所有样式都通过Elementor控制面板设置 */
}

.uwfe-category-title {
    margin: 0 0 16px 0;
    border-bottom: 2px solid;
    padding-bottom: 8px;
}

.uwfe-category-name {
    margin-bottom: 12px;
    padding: 8px 12px;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
}

.uwfe-category-description {
    line-height: 1.6;
}

/* 面包屑导航小组件 */
.uwfe-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.uwfe-breadcrumb a,
.uwfe-breadcrumb .uwfe-breadcrumb-current {
    text-decoration: none;
    transition: all 0.3s ease;
}

.uwfe-breadcrumb a:hover {
    text-decoration: underline;
}

.uwfe-breadcrumb .uwfe-breadcrumb-separator {
    margin: 0 4px;
    user-select: none;
}

/* 文章访问统计小组件 */
.uwfe-post-views {
    display: flex;
    align-items: center;
    gap: 8px;
}

.uwfe-post-views-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    flex-shrink: 0;
    width: auto;
    max-width: none;
    /* 确保图标大小由Elementor控制 */
}

.uwfe-post-views-icon i,
.uwfe-post-views-icon svg {
    display: inline-block;
    width: 1em;
    height: 1em;
    /* 防止继承可能影响编辑器的样式 */
    box-sizing: content-box;
    /* 确保不影响其他图标 */
    margin: 0;
    padding: 0;
}

.uwfe-post-views-label {
    font-weight: 600;
}

.uwfe-post-views-number {
    /* 字体样式完全由Elementor控制 */
    font-weight: bold;
    display: inline-block;
    /* 移除硬编码的过渡，让Elementor控制 */
}

/* 加载状态样式 */
.uwfe-post-views-number[data-loading="true"] {
    opacity: 0.6;
    animation: uwfe-pulse 1.5s ease-in-out infinite;
}

/* 加载完成状态 */
.uwfe-post-views.uwfe-loaded .uwfe-post-views-number {
    animation: uwfe-fadeIn 0.5s ease-in-out;
}

/* 在线人数小组件 */
.uwfe-online-users {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

/* 在线人数图标样式 */
.uwfe-online-users .uwfe-online-users-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    flex-shrink: 0;
    width: auto;
    max-width: none;
}

.uwfe-online-users .uwfe-online-users-icon i,
.uwfe-online-users .uwfe-online-users-icon svg {
    display: inline-block;
    width: 1em;
    height: 1em;
    box-sizing: content-box;
    margin: 0;
    padding: 0;
}

/* 在线人数数字样式 */
.uwfe-online-users-number {
    font-weight: bold;
    display: inline-block;
    /* 移除硬编码的过渡，让Elementor控制 */
}

/* 加载状态样式 */
.uwfe-online-users-number[data-loading="true"] {
    opacity: 0.6;
    animation: uwfe-pulse 1.5s ease-in-out infinite;
}

/* 加载完成状态 */
.uwfe-online-users.uwfe-loaded .uwfe-online-users-number {
    animation: uwfe-fadeIn 0.5s ease-in-out;
}

/* 脉冲动画 */
@keyframes uwfe-pulse {
    0%, 100% {
        opacity: 0.6;
    }
    50% {
        opacity: 1;
    }
}

/* 剩余名额小组件 */
.uwfe-remaining-spots {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* 剩余名额图标样式 */
.uwfe-remaining-spots .uwfe-spots-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    flex-shrink: 0;
    width: auto;
    max-width: none;
}

.uwfe-remaining-spots .uwfe-spots-icon i,
.uwfe-remaining-spots .uwfe-spots-icon svg {
    display: inline-block;
    width: 1em;
    height: 1em;
    box-sizing: content-box;
    margin: 0;
    padding: 0;
}

/* 前缀标签样式 */
.uwfe-spots-prefix-label {
    font-weight: 600;
    white-space: nowrap;
    /* 其他样式由Elementor控制 */
}

/* 数字样式 */
.uwfe-spots-number {
    font-weight: bold;
    display: inline-block;
    /* 移除硬编码的过渡，让Elementor控制 */
    /* 其他样式由Elementor控制 */
}

/* 加载状态样式 */
.uwfe-spots-number[data-loading="true"] {
    opacity: 0.6;
    animation: uwfe-pulse 1.5s ease-in-out infinite;
}

/* 加载完成状态 */
.uwfe-remaining-spots.uwfe-loaded .uwfe-spots-number {
    animation: uwfe-fadeIn 0.5s ease-in-out;
}

/* 后缀标签样式 */
.uwfe-spots-suffix-label {
    font-weight: 500;
    white-space: nowrap;
    /* 其他样式由Elementor控制 */
}

/* 结束消息样式 */
.uwfe-spots-ended {
    font-style: italic;
    /* 其他样式由Elementor控制 */
}

/* 兼容旧版本的样式 */
.uwfe-spots-label {
    font-weight: 600;
    white-space: nowrap;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .uwfe-last-updated {
        /* 保持水平排列，避免在移动端换行 */
        flex-wrap: wrap;
        gap: 4px;
    }

    .uwfe-last-updated-label {
        /* 防止标签过长导致换行 */
        white-space: nowrap;
    }

    .uwfe-last-updated-date {
        /* 防止日期过长导致换行 */
        white-space: nowrap;
        flex-shrink: 0;
    }
}

/* Elementor环境增强样式 - 只在Elementor上下文中生效 */
.elementor-editor-active .uwfe-last-updated-icon i,
.elementor-editor-active .uwfe-last-updated-icon svg,
.elementor-editor-preview .uwfe-last-updated-icon i,
.elementor-editor-preview .uwfe-last-updated-icon svg {
    width: 1em !important;
    height: 1em !important;
    font-size: inherit !important;
    max-width: none !important;
    max-height: none !important;
}

.elementor-editor-active .uwfe-post-views-icon i,
.elementor-editor-active .uwfe-post-views-icon svg,
.elementor-editor-preview .uwfe-post-views-icon i,
.elementor-editor-preview .uwfe-post-views-icon svg {
    width: 1em !important;
    height: 1em !important;
    font-size: inherit !important;
    max-width: none !important;
    max-height: none !important;
}

.elementor-editor-active .uwfe-online-users-icon i,
.elementor-editor-active .uwfe-online-users-icon svg,
.elementor-editor-preview .uwfe-online-users-icon i,
.elementor-editor-preview .uwfe-online-users-icon svg {
    width: 1em !important;
    height: 1em !important;
    font-size: inherit !important;
    max-width: none !important;
    max-height: none !important;
}

.elementor-editor-active .uwfe-remaining-spots .uwfe-spots-icon i,
.elementor-editor-active .uwfe-remaining-spots .uwfe-spots-icon svg,
.elementor-editor-preview .uwfe-remaining-spots .uwfe-spots-icon i,
.elementor-editor-preview .uwfe-remaining-spots .uwfe-spots-icon svg {
    width: 1em !important;
    height: 1em !important;
    font-size: inherit !important;
    max-width: none !important;
    max-height: none !important;
}

/* 只在Elementor iframe中保护样式，避免影响古腾堡 */
.elementor-editor-active iframe .uwfe-last-updated-icon i,
.elementor-editor-active iframe .uwfe-last-updated-icon svg,
.elementor-editor-preview iframe .uwfe-last-updated-icon i,
.elementor-editor-preview iframe .uwfe-last-updated-icon svg,
.elementor-editor-active iframe .uwfe-post-views-icon i,
.elementor-editor-active iframe .uwfe-post-views-icon svg,
.elementor-editor-preview iframe .uwfe-post-views-icon i,
.elementor-editor-preview iframe .uwfe-post-views-icon svg,
.elementor-editor-active iframe .uwfe-online-users-icon i,
.elementor-editor-active iframe .uwfe-online-users-icon svg,
.elementor-editor-preview iframe .uwfe-online-users-icon i,
.elementor-editor-preview iframe .uwfe-online-users-icon svg,
.elementor-editor-active iframe .uwfe-remaining-spots .uwfe-spots-icon i,
.elementor-editor-active iframe .uwfe-remaining-spots .uwfe-spots-icon svg,
.elementor-editor-preview iframe .uwfe-remaining-spots .uwfe-spots-icon i,
.elementor-editor-preview iframe .uwfe-remaining-spots .uwfe-spots-icon svg {
    width: 1em !important;
    height: 1em !important;
    font-size: inherit !important;
    max-width: none !important;
    max-height: none !important;
    box-sizing: content-box !important;
}

/* Elementor编辑器中的布局保护 - 确保只在Elementor上下文中生效 */
.elementor-editor-active .uwfe-last-updated,
.elementor-editor-active .uwfe-post-views,
.elementor-editor-active .uwfe-online-users,
.elementor-editor-active .uwfe-remaining-spots,
.elementor-editor-preview .uwfe-last-updated,
.elementor-editor-preview .uwfe-post-views,
.elementor-editor-preview .uwfe-online-users,
.elementor-editor-preview .uwfe-remaining-spots {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    flex-wrap: wrap !important;
}

/* Elementor控件样式增强 */
.elementor-control-readonly input[type="text"] {
    background-color: #f8f9fa !important;
    color: #6c757d !important;
    cursor: not-allowed !important;
    opacity: 0.7 !important;
}

.elementor-control-readonly input[type="text"]:focus {
    border-color: #dee2e6 !important;
    box-shadow: none !important;
}

/* 只读控件提示样式 */
.elementor-control-readonly::after {
    content: "只读";
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-size: 10px;
    color: #6c757d;
    background-color: #e9ecef;
    padding: 2px 6px;
    border-radius: 3px;
    pointer-events: none;
}

/* 一键复制按钮小组件 */
.uwfe-copy-wrapper {
    display: inline-block;
    width: 100%;
}

.uwfe-copy-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    line-height: 1;
    text-decoration: none;
    transition: all 0.3s ease;
    user-select: none;
    white-space: nowrap;
    outline: none;
    position: relative;
    overflow: hidden;
}

.uwfe-copy-button:focus {
    outline: 2px solid rgba(0, 124, 186, 0.3);
    outline-offset: 2px;
}

.uwfe-copy-button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

.uwfe-copy-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.uwfe-copy-icon i,
.uwfe-copy-icon svg {
    display: inline-block;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

/* 按钮内的图标样式 */
.uwfe-copy-button i,
.uwfe-copy-button svg {
    display: inline-block;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.uwfe-copy-button .elementor-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* 确保图标和文字对齐 */
.uwfe-copy-button .elementor-icon svg {
    width: 1em;
    height: 1em;
    fill: currentColor;
}

/* 图标间距控制 */
.uwfe-copy-button .fa {
    margin-right: 8px;
}

.uwfe-copy-button .elementor-icon {
    margin-right: 8px;
    width: 1em;
    height: 1em;
    box-sizing: content-box;
    margin: 0;
    padding: 0;
}

.uwfe-copy-text {
    flex-shrink: 0;
}

/* 按钮状态样式 - 保留必要的状态样式 */
.uwfe-copy-button.uwfe-copying {
    opacity: 0.8;
    /* 移除硬编码的变换，让Elementor控制 */
}

.uwfe-copy-button.uwfe-copied {
    background-color: #28a745 !important;
    color: #ffffff !important;
}

.uwfe-copy-button.uwfe-error {
    background-color: #dc3545 !important;
    color: #ffffff !important;
}

/* 提示消息样式 */
.uwfe-copy-message {
    display: none;
    margin-top: 8px;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.4;
    text-align: center;
    /* 移除硬编码的动画，让Elementor控制 */
}

.uwfe-copy-message-success {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

.uwfe-copy-message-error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

/* 动画效果 */
@keyframes uwfe-fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 登录状态下的图标大小修复 - 防止WordPress管理后台CSS影响前台显示 */
body.logged-in .uwfe-last-updated-icon i,
body.logged-in .uwfe-last-updated-icon svg,
body.logged-in .uwfe-post-views-icon i,
body.logged-in .uwfe-post-views-icon svg,
body.logged-in .uwfe-online-users-icon i,
body.logged-in .uwfe-online-users-icon svg,
body.logged-in .uwfe-remaining-spots .uwfe-spots-icon i,
body.logged-in .uwfe-remaining-spots .uwfe-spots-icon svg {
    width: 1em !important;
    height: 1em !important;
    font-size: inherit !important;
    max-width: none !important;
    max-height: none !important;
    box-sizing: content-box !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 确保登录状态下的小组件布局正常 */
body.logged-in .uwfe-last-updated,
body.logged-in .uwfe-post-views,
body.logged-in .uwfe-online-users,
body.logged-in .uwfe-remaining-spots {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    flex-wrap: wrap !important;
}

/* 防止WordPress管理后台的图标样式影响前台小组件 */
body.logged-in .uwfe-last-updated-icon,
body.logged-in .uwfe-post-views-icon,
body.logged-in .uwfe-online-users-icon,
body.logged-in .uwfe-remaining-spots .uwfe-spots-icon {
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
    width: auto !important;
    max-width: none !important;
}

/* 针对WordPress管理后台可能加载的图标字体样式进行覆盖 */
body.logged-in .uwfe-last-updated-icon i[class*="dashicons"],
body.logged-in .uwfe-post-views-icon i[class*="dashicons"],
body.logged-in .uwfe-online-users-icon i[class*="dashicons"],
body.logged-in .uwfe-remaining-spots .uwfe-spots-icon i[class*="dashicons"],
body.logged-in .uwfe-last-updated-icon i[class*="fa"],
body.logged-in .uwfe-post-views-icon i[class*="fa"],
body.logged-in .uwfe-online-users-icon i[class*="fa"],
body.logged-in .uwfe-remaining-spots .uwfe-spots-icon i[class*="fa"] {
    width: 1em !important;
    height: 1em !important;
    font-size: inherit !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    display: inline-block !important;
}

/* 确保在WordPress管理后台加载时，前台小组件图标不受影响 */
body.logged-in .uwfe-last-updated-icon svg,
body.logged-in .uwfe-post-views-icon svg,
body.logged-in .uwfe-online-users-icon svg,
body.logged-in .uwfe-remaining-spots .uwfe-spots-icon svg {
    width: 1em !important;
    height: 1em !important;
    fill: currentColor !important;
    vertical-align: middle !important;
    display: inline-block !important;
}

/* 深色主题支持 - 基础样式，用户可以通过Elementor控制面板覆盖 */
@media (prefers-color-scheme: dark) {
    .uwfe-last-updated {
        /* 深色主题样式会通过Elementor控制面板设置 */
    }

    .uwfe-category-description-widget {
        /* 深色主题样式会通过Elementor控制面板设置 */
    }

    .elementor-control-readonly input[type="text"] {
        background-color: #495057 !important;
        color: #adb5bd !important;
    }

    .elementor-control-readonly::after {
        background-color: #343a40;
        color: #adb5bd;
    }

    .uwfe-copy-message-success {
        background-color: #0f5132;
        color: #d1e7dd;
        border-color: #0a3622;
    }

    .uwfe-copy-message-error {
        background-color: #842029;
        color: #f8d7da;
        border-color: #58151c;
    }

    /* 深色主题下的图标样式 */
    .uwfe-copy-button .elementor-icon svg {
        fill: currentColor;
    }

    .uwfe-copy-button i,
    .uwfe-copy-button svg {
        color: inherit;
        fill: currentColor;
    }
}