/* 创业者 API 工具箱 - 前台样式（适配 Bootstrap 5.3 / 浅色主题） */

.cyz-tabs {
    gap: .5rem;
    flex-wrap: wrap;
}

.cyz-tabs .nav-link {
    border-radius: 2rem;
    padding: .5rem 1.1rem;
    font-size: .925rem;
    color: var(--bs-body-color, #212529);
    background: var(--bs-secondary-bg, #f1f3f5);
    border: 1px solid transparent;
    transition: all .15s ease-in-out;
}

.cyz-tabs .nav-link:hover {
    border-color: var(--bs-primary, #0d6efd);
    color: var(--bs-primary, #0d6efd);
}

.cyz-tabs .nav-link.active {
    background: var(--bs-primary, #0d6efd);
    color: #fff;
    box-shadow: 0 .25rem .75rem rgba(13, 110, 253, .25);
}

.cyz-tabs .nav-link i {
    margin-right: .25rem;
}

.cyz-subtabs .nav-link {
    color: var(--bs-secondary-color, #6c757d);
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent;
    font-size: .95rem;
    padding: .5rem .75rem;
}

.cyz-subtabs .nav-link.active {
    color: var(--bs-primary, #0d6efd);
    border-bottom-color: var(--bs-primary, #0d6efd);
    background: transparent;
}

/* 拖拽上传区 */
.cyz-drop {
    border: 1.5px dashed var(--bs-border-color, #dee2e6);
    border-radius: .75rem;
    padding: 2rem 1rem;
    text-align: center;
    cursor: pointer;
    background: var(--bs-tertiary-bg, #fbfbfc);
    transition: all .15s ease-in-out;
    color: var(--bs-secondary-color, #6c757d);
}

.cyz-drop:hover,
.cyz-drop:focus,
.cyz-drop-active {
    border-color: var(--bs-primary, #0d6efd);
    background: rgba(13, 110, 253, .04);
    outline: none;
}

.cyz-drop > i {
    font-size: 1.9rem;
    display: block;
    margin-bottom: .35rem;
    color: var(--bs-primary, #0d6efd);
}

.cyz-drop-title {
    font-size: .95rem;
    color: var(--bs-body-color, #212529);
}

.cyz-drop-tip {
    font-size: .8rem;
    margin-top: .2rem;
}

.cyz-preview {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.cyz-preview[hidden],
.cyz-file-meta[hidden],
.cyz-actions[hidden],
.cyz-company-head[hidden],
.cyz-audio[hidden] {
    display: none !important;
}

.cyz-preview img {
    width: 88px;
    height: 88px;
    object-fit: cover;
    border-radius: .6rem;
    border: 1px solid var(--bs-border-color, #dee2e6);
    background: #fff;
}

.cyz-preview-meta {
    display: flex;
    flex-direction: column;
    gap: .4rem;
    min-width: 0;
}

.cyz-file-meta {
    background: var(--bs-tertiary-bg, #f8f9fa);
    border: 1px solid var(--bs-border-color, #e9ecef);
    border-radius: .6rem;
    padding: .7rem .9rem;
}

.cyz-file-line {
    display: flex;
    align-items: center;
    gap: .45rem;
    font-size: .875rem;
    line-height: 1.7;
    word-break: break-all;
}

.cyz-duration-row {
    margin-top: .4rem;
}

.cyz-duration-input {
    max-width: 120px;
}

.cyz-progress {
    height: .5rem;
    border-radius: 2rem;
    background: var(--bs-secondary-bg, #e9ecef);
}

.cyz-progress .progress-bar {
    transition: width .4s ease;
}

/* 提示词输出 */
.cyz-copy-row {
    border: 1px solid var(--bs-border-color, #e9ecef);
    border-radius: .7rem;
    padding: .75rem;
    background: var(--bs-tertiary-bg, #f8f9fa);
}

.cyz-prompt {
    font-size: .9rem;
    line-height: 1.75;
    background: #fff;
    resize: vertical;
    border: 1px solid var(--bs-border-color, #e9ecef);
}

.cyz-copy-actions {
    display: flex;
    gap: .5rem;
    margin-top: .6rem;
    flex-wrap: wrap;
}

.cyz-error {
    border-radius: .7rem;
    padding: .75rem 1rem;
    font-size: .9rem;
    color: #842029;
    background: #f8d7da;
    border: 1px solid #f5c2c7;
}

.cyz-note {
    margin-top: .6rem;
    font-size: .8rem;
    color: var(--bs-secondary-color, #6c757d);
}

/* 视频结果 */
.cyz-video-player {
    position: relative;
    border-radius: .75rem;
    overflow: hidden;
    background: #000;
}

.cyz-video-player video {
    display: block;
    width: 100%;
    max-height: 62vh;
    background: #000;
}

.cyz-wm {
    position: absolute;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .18rem .55rem;
    border-radius: 1rem;
    font-size: .75rem;
    color: #fff !important;
    text-decoration: none;
    background: rgba(74, 108, 247, .9);
    opacity: .92;
    z-index: 3;
    pointer-events: auto;
}

.cyz-wm:hover {
    opacity: 1;
    color: #fff !important;
}

.cyz-wm img {
    width: 14px;
    height: 14px;
    border-radius: 3px;
    object-fit: contain;
}

.cyz-wm-top-left { top: .6rem; left: .6rem; }
.cyz-wm-top-right { top: .6rem; right: .6rem; }
.cyz-wm-bottom-left { bottom: .6rem; left: .6rem; }
.cyz-wm-bottom-right { bottom: .6rem; right: .6rem; }

.cyz-video-meta {
    margin-top: .85rem;
}

.cyz-video-title {
    font-weight: 600;
    font-size: .95rem;
    line-height: 1.6;
    margin-bottom: .4rem;
    word-break: break-word;
}

.cyz-video-sub {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
}

.cyz-chip {
    display: inline-block;
    padding: .12rem .55rem;
    border-radius: 1rem;
    font-size: .75rem;
    line-height: 1.7;
    color: var(--bs-secondary-color, #6c757d);
    background: var(--bs-secondary-bg, #f1f3f5);
    border: 1px solid var(--bs-border-color, #e9ecef);
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cyz-chip-free {
    color: #146c43;
    background: #d1e7dd;
    border-color: #badbcc;
}

.cyz-actions {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .75rem;
}

/* 音色选择 */
.cyz-voice-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: .6rem;
}

.cyz-voice {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .6rem .75rem;
    border: 1px solid var(--bs-border-color, #e9ecef);
    border-radius: .65rem;
    cursor: pointer;
    background: #fff;
    transition: all .15s ease-in-out;
    margin: 0;
}

.cyz-voice:hover {
    border-color: var(--bs-primary, #0d6efd);
}

.cyz-voice input {
    margin-top: .25rem;
    accent-color: var(--bs-primary, #0d6efd);
}

.cyz-voice-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.cyz-voice-name {
    font-size: .9rem;
    font-weight: 600;
    color: var(--bs-body-color, #212529);
}

.cyz-voice-desc {
    font-size: .76rem;
    color: var(--bs-secondary-color, #6c757d);
    line-height: 1.5;
}

.cyz-voice input:checked + .cyz-voice-body .cyz-voice-name {
    color: var(--bs-primary, #0d6efd);
}

.cyz-textarea {
    resize: vertical;
    line-height: 1.7;
}

/* 音频 */
.cyz-audio-head {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
    margin-bottom: .6rem;
}

.cyz-audio-player {
    width: 100%;
    margin-bottom: .25rem;
}

/* 企业结果 */
.cyz-company-head {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .6rem;
}

.cyz-company {
    border: 1px solid var(--bs-border-color, #e9ecef);
    border-radius: .7rem;
    padding: .85rem 1rem;
    margin-bottom: .75rem;
    background: #fff;
}

.cyz-company:last-child {
    margin-bottom: 0;
}

.cyz-company-top {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
}

.cyz-company-logo {
    width: 38px;
    height: 38px;
    border-radius: .5rem;
    object-fit: contain;
    border: 1px solid var(--bs-border-color, #e9ecef);
    background: #fff;
    flex: none;
}

.cyz-company-name-wrap {
    min-width: 0;
}

.cyz-company-name {
    font-weight: 600;
    font-size: .95rem;
    line-height: 1.5;
    word-break: break-word;
}

.cyz-company-tags {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
    margin-top: .35rem;
}

.cyz-company-rows {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .25rem .75rem;
    margin: .65rem 0 0;
    font-size: .82rem;
}

.cyz-company-rows dt {
    color: var(--bs-secondary-color, #6c757d);
    font-weight: 400;
    white-space: nowrap;
}

.cyz-company-rows dd {
    margin: 0;
    color: var(--bs-body-color, #212529);
    word-break: break-all;
}

.cyz-company-scope {
    margin-top: .6rem;
    padding-top: .6rem;
    border-top: 1px dashed var(--bs-border-color, #e9ecef);
    font-size: .82rem;
    line-height: 1.7;
    color: var(--bs-secondary-color, #6c757d);
    max-height: 7.5rem;
    overflow: auto;
}

/* 右侧提示 */
.cyz-tips {
    margin: 0;
    padding-left: 1.1rem;
    font-size: .8rem;
    line-height: 1.8;
    color: var(--bs-secondary-color, #6c757d);
}

.cyz-tips li + li {
    margin-top: .35rem;
}

.cyz-tips b {
    color: var(--bs-body-color, #212529);
    font-weight: 600;
}

@media (max-width: 575.98px) {
    .cyz-tabs .nav-link {
        padding: .4rem .8rem;
        font-size: .85rem;
    }

    .cyz-drop {
        padding: 1.4rem .75rem;
    }

    .cyz-voice-list {
        grid-template-columns: 1fr 1fr;
    }
}

/* 引擎来源说明 */
.cyz-engine-note {
    font-size: .78rem;
    line-height: 1.5;
}

/* 开放 API 文档页 */
.cyz-doc-line {
    display: flex;
    align-items: baseline;
    gap: .6rem;
    flex-wrap: wrap;
    font-size: .82rem;
    padding: .28rem 0;
    border-bottom: 1px dashed var(--bs-border-color, #e9ecef);
}

.cyz-doc-line:last-of-type {
    border-bottom: 0;
}

.cyz-doc-label {
    min-width: 5.2rem;
    color: var(--bs-secondary-color, #6c757d);
}

.cyz-code {
    background: var(--bs-tertiary-bg, #f8f9fa);
    border: 1px solid var(--bs-border-color, #e9ecef);
    border-radius: .55rem;
    padding: .8rem .9rem;
    font-size: .78rem;
    line-height: 1.65;
    overflow-x: auto;
    white-space: pre;
    margin: .6rem 0 0;
    color: var(--bs-body-color, #212529);
}

.cyz-doc-nav {
    margin: 0;
    padding-left: 1.1rem;
    font-size: .82rem;
    line-height: 1.9;
}

.cyz-doc-nav a {
    text-decoration: none;
}

.cyz-doc-nav a:hover {
    text-decoration: underline;
}

@media (max-width: 575.98px) {
    .cyz-doc-line {
        display: block;
    }

    .cyz-doc-label {
        display: block;
        margin-bottom: .1rem;
    }
}