// IframeView 组件样式
.iframe-view {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;

    .iframe-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 16px;
        background: var(--el-bg-color);
        border-bottom: 1px solid var(--el-border-color-light);
        flex-shrink: 0;
        
        .iframe-title {
            font-size: 16px;
            font-weight: 500;
            color: var(--el-text-color-primary);
        }
    }

    .iframe-content {
        width: 100%;
        height: 100%;
        border: none;
        flex: 1;
        
        &.with-header {
            height: calc(100% - 49px);
        }
    }

    .iframe-error {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        color: var(--el-text-color-secondary);
        
        .error-icon {
            font-size: 48px;
            margin-bottom: 16px;
            color: var(--el-color-warning);
        }
    }

    .iframe-loading {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background: var(--el-bg-color);
        gap: 12px;
        
        .is-loading {
            animation: iframe-rotating 1.5s linear infinite;
            color: var(--el-color-primary);
        }
    }
}

@keyframes iframe-rotating {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
