
progress {
    border-left: 1px solid #FFF;
    border-right: 1px solid #FFF;
}

.sectiontitle {
    text-transform: uppercase;
    color: var(--yd-accent, #17b596);
    min-width: 120px;
}
#yd-note-accent, #yd-note-background, #yd-note-text { color: #778781 }

.yd-chatbot-wizard .yd-settings-row { margin-bottom: 4em; }
.yd-chatbot-wizard .header-container {
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin-bottom: 2em;
}

fieldset { border: 0; margin: 0; padding: 0; }
.yd-chatbot-wizard label {color: var(--yd-accent, #17b596); }

.product-items.widget-product-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.product-items.widget-product-grid li {
    text-align: center;
    border: 1px solid var(--yd-line, #222531);
    background: transparent;
    transition: background 0.3s ease;
}
.product-items.widget-product-grid li:hover {
    background: var(--yd-line, #222531);
}

.field.qty {
    display: none;
}

.gallery-placeholder {
    max-width: 200px !important;
}

.page.messages {
    max-width: 800px;
    margin: 0 auto;
    
}

.product.media {
    display: none;
}

.product-info-main {
    display: flex;
    flex-direction: column;
    text-align: center;
    margin: 0 auto;
    float: none!important;
}

.product-info-main .page-title {
    text-align: center;
    display: block !important;
    margin: 0 auto;
}
.block-collapsible-nav {
    border:none
}

.block-collapsible-nav .item .delimiter {
    display: none;
}

.block-collapsible-nav .item.current a, .block-collapsible-nav .item.current > strong {
    border:none;
    color: var(--yd-accent, #17b596);
}

.sidebar.sidebar-main {
    border-right: 1px solid var(--yd-line, #222531);
}

.product-add-form .product-options-wrapper .field .control {
    margin: 0 auto;
}
.action.back {
    display: inline-block;
    margin-top: 16px;
    color: var(--yd-accent, #17b596);
    text-decoration: underline;
}

a:hover {cursor: pointer;}
.yd-subscription-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin: 0; padding: 0; list-style: none; margin-bottom:4em; }
.yd-subscription-card { min-width: 0; margin: 0; padding: 24px; border: 1px solid var(--yd-line, #222531); border-radius: 16px; background: var(--yd-panel, #0e1627); }
.yd-card-heading, .yd-header-main { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.yd-card-heading > div, .yd-header-main > div { flex: 1 1 190px; min-width: 0; }
.yd-subscription-card h2, .yd-subscription-header h2 { margin: 0; font-size: 24px; line-height: 1.35; overflow-wrap: anywhere; }
.yd-subscription-card h2 a { color: var(--yd-heading, #fbf5f2);  text-decoration-thickness: 1px; text-underline-offset: 5px; }
.yd-ui-icon { display: inline-block; flex: 0 0 18px; width: 18px; height: 18px; vertical-align: middle; }
.yd-section-label { margin: 0 0 8px; color: var(--yd-muted, #9eabba); font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.yd-card-product { margin: 12px 0 24px; color: var(--yd-muted, #9eabba); }
.yd-status-badge { display: inline-block; padding: 5px 12px; border: 1px solid var(--yd-line, #222531); border-radius: 30px; background: var(--yd-surface, #090d1a); color: var(--yd-heading, #fbf5f2); font-size: 12px; font-weight: 600; line-height: 1.5; }
.yd-status-badge[data-status="active"], .yd-status-badge[data-status="trial"] { border-color: #17b596; color: #41d7b6; }
.yd-status-badge[data-status="past_due"] { border-color: #f57074; color: #f57074; }
.yd-card-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 16px; margin: 0 0 24px; }
.yd-card-facts dt { color: var(--yd-muted, #9eabba); font-size: 13px; font-weight: 400; }
.yd-card-facts dd { margin: 4px 0 0; font-weight: 500; }
.yd-card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding-top: 20px; border-top: 1px solid var(--yd-line, #222531); }
.yd-card-actions:empty { display: none; }
.yd-card-actions a.action, .yd-subscription-workspace a.action { display: inline-block; box-sizing: border-box; padding: 10px 18px; border-radius: 8px; font-weight: 600; line-height: 1.5; text-decoration: none; }
.yd-card-actions a.primary, .yd-subscription-workspace a.primary { border: 1px solid var(--yd-accent, #17b596); background: var(--yd-accent, #17b596); color: #fff; }
.yd-card-actions a.primary:hover, .yd-subscription-workspace a.primary:hover { background: #0e6f5d; border-color: #0e6f5d; }
.yd-card-notice { color: #f57074; font-size: 14px; }
.yd-subscription-offers > summary { cursor: pointer; font-size: 22px; font-weight: 600; padding: 4px 0; }
.yd-subscription-offers[open] > summary { margin-bottom: 24px; }
.yd-subscription-workspace { min-width: 0; }
.yd-subscription-workspace [hidden] { display: none !important; }
.yd-subscription-header { margin-bottom: 24px; }
.yd-header-main { padding: 24px; border: 1px solid var(--yd-line, #222531); border-radius: 16px; background: var(--yd-panel, #0e1627); }
.yd-subscription-menu { display: flex; flex-wrap: wrap; gap: 0 20px; margin: 0 0 20px; padding: 0; border-bottom: 1px solid var(--yd-line, #222531); }
.yd-subscription-menu a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 8px 0; border-bottom: 3px solid transparent; color: var(--yd-muted, #9eabba); font-size: 14px; font-weight: 500; text-decoration: none; }
.yd-subscription-menu a[aria-current="page"] { border-bottom-color: var(--yd-accent, #17b596); color: var(--yd-heading, #fbf5f2); }
.yd-subscription-menu a:hover { color: var(--yd-heading, #fbf5f2); }
.yd-yd-chatbot-setup-active .yd-subscription-header { margin-bottom: 12px; }
.yd-configuration-active .yd-header-main { gap: 8px 16px; padding: 0; border: 0; border-radius: 0; background: transparent; }
.yd-configuration-active .yd-header-main > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.yd-configuration-active .yd-header-main .yd-section-label { margin: 0; font-size: 11px; }
.yd-configuration-active .yd-header-main h2 { margin: 0; font-size: 16px; }
.yd-domain-context { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 20px; min-width: 0; }
/* .yd-domain-form { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px; min-width: 0; max-width: 100%; margin: 0; }
.yd-domain-form > .field { flex: 1 1 240px; min-width: 0; margin: 0; }
.yd-domain-form input { min-height: 44px; }
.yd-domain-form > .note { flex: 1 1 100%; margin: 0; } */
.yd-subscription-workspace { padding: 8px 0; }
.yd-workspace-enhanced:not(.yd-domain-editing) [data-domain-form],
.yd-workspace-enhanced.yd-domain-editing [data-domain-display],
.yd-workspace-enhanced.yd-domain-editing [data-domain-edit] { display: none; }
.yd-domain-context [data-domain-status] { flex: 1 1 100%; margin: 0; font-size: 13px; }
.yd-domain-context [data-domain-status]:empty { display: none; }
.yd-domain-context [data-domain-status].yd-status-error { color: #f57074; }
.yd-subscription-workspace .yd-plain-card > .yd-domain-context {
    margin-top: 42px;
}
.yd-subscription-workspace .yd-domain-context h2 {
    min-width: 0;
    margin-top: 0;
}
.yd-subscription-workspace:not(.yd-workspace-enhanced) [data-domain-edit],
.yd-subscription-workspace:not(.yd-workspace-enhanced) [data-domain-display]:has(~ [data-domain-form]) { display: none; }
.yd-domain-form .note { color: var(--yd-muted, #9eabba); font-size: 13px; }
.yd-domain-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.yd-resume-subscription { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--yd-line, #222531); }
.yd-subscription-workspace:not(.yd-workspace-enhanced) [data-domain-cancel] { display: none; }
section { box-sizing: border-box; min-width: 0; margin: 0 0 24px; padding: 28px; border: 1px solid var(--yd-line, #222531); border-radius: 16px; background: var(--yd-surface, #090d1a); }
.yd-subscription-workspace h2 { margin-top: 0; font-size: 26px; font-weight: 500; }
.yd-subscription-workspace .yd-summary  { padding: 20px; border-radius: 12px; background: var(--yd-panel, #0e1627); }
.yd-plain-card { padding: 20px; margin-bottom: 10px; margin-right: 30px; border-radius: 12px; background: var(--yd-panel, #0e1627); }
.yd-section-shortcuts { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.yd-shortcut { flex: 1 1 150px; padding: 16px; border: 1px solid var(--yd-line, #222531); border-radius: 8px; }
.yd-shortcut span { margin-right: 8px; }
.yd-subscription-workspace .yd-save-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 20px; padding: 0; border: 0; background: transparent; }
.yd-save-toolbar > div { flex: 1 1 180px; min-width: 0; }
.yd-subscription-workspace .yd-save-toolbar h2 { margin: 0 0 4px; font-size: 22px; line-height: 1.3; }
.yd-save-toolbar [data-save-status] { display: block; color: var(--yd-muted, #9eabba); font-size: 13px; }
.yd-save-toolbar button { min-height: 44px; padding: 10px 18px; border-radius: 8px; }
.yd-subscription-workspace [data-save-status].yd-status-error { color: #f57074; }
.yd-code-disclosure { margin: 20px 0; }
.yd-code-disclosure summary, .yd-management summary { cursor: pointer; color: var(--yd-accent, #17b596); padding: 12px 0; font-weight: 600; }
.yd-code-disclosure textarea { width: 100%; box-sizing: border-box; margin-top: 12px; font-family: monospace; }
.yd-management { margin-top: 32px; border-top: 1px solid var(--yd-line, #222531); padding-top: 12px; }
.yd-plan-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 16px; margin: 24px 0; }
.yd-plan-option { display: flex; flex-direction: column; min-width: 0; padding: 20px; border: 1px solid var(--yd-line, #222531); border-radius: 12px; background: var(--yd-panel, #0e1627); }
.yd-plan-current { border-color: var(--yd-accent, #17b596); }
.yd-plan-option-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 16px; }
.yd-plan-option h3 { margin: 0 0 8px; }
.yd-plan-option p { margin: 0 0 12px; }
.yd-plan-option ul { padding-left: 20px; margin-bottom: 20px; }
.yd-plan-price { font-size: 24px; font-weight: 600; }
.yd-plan-price span { color: var(--yd-muted, #9eabba); font-size: 14px; font-weight: 400; }
.yd-plan-option-action { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--yd-line, #222531); }
.yd-plan-option-action form { margin: 0; }
.yd-plan-option-action button { width: 100%; white-space: normal; }
.yd-plan-option-action p { color: var(--yd-muted, #9eabba); font-size: 13px; }
.yd-renewal-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 24px; padding-top: 24px; border-top: 1px solid var(--yd-line, #222531); }
.yd-renewal-option { min-width: 0; }
.yd-renewal-option h3 { margin-top: 0; }
.yd-renewal-option select { display: block; width: 100%; margin: 8px 0 16px; }
.yd-renewal-option button { white-space: normal; }
.yd-subscription-workspace :focus-visible, .yd-subscription-card a:focus-visible, .yd-subscription-offers summary:focus-visible { outline: 2px solid var(--yd-accent, #17b596); outline-offset: 3px; }
.yd-overview-container { 
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    padding: 20px;
}
.yd-overview-container > .yd-plain-card {
    box-sizing: border-box;
    flex: 1 1 calc(50% - 20px);
    min-width: min(100%, 280px);
    margin: 0;
    overflow-wrap: anywhere;
    container-type: inline-size;
}
.yd-overview-container .yd-summary {
    padding: 0;
    margin-bottom: 0;
}
@container (max-width: 360px) {
    .yd-overview-container .yd-summary {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .yd-overview-container .yd-summary dd:not(:last-child) {
        margin-bottom: 16px;
    }
}
@media (max-width: 767px) {
    .yd-subscription-workspace > #overview { padding: 16px; }
    .yd-subscription-cards { gap: 16px; }
    .yd-subscription-card, .yd-header-main { padding: 20px 16px; }
    .yd-subscription-menu { gap: 0 16px; }
    .yd-subscription-menu a { justify-content: flex-start; flex-basis: calc(50% - 8px); font-size: 13px; }
    .yd-subscription-workspace .yd-summary { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .yd-subscription-workspace .yd-summary dd:not(:last-child) { margin-bottom: 16px; }
}
.yd-token-usage { display: block; }
.yd-token-usage-heading { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.yd-token-usage-label { color: var(--yd-muted, #9eabba); font-size: 13px; }
.yd-token-usage-value { font-weight: 500; }
.yd-token-usage-progress { display: block; width: 100%; height: 8px; border: 0; border-radius: 4px; overflow: hidden; background: var(--yd-line, #222531); accent-color: var(--yd-accent, #17b596); }
.yd-token-usage-progress::-webkit-progress-bar { background: var(--yd-line, #222531); }
.yd-token-usage-progress::-webkit-progress-value { background: var(--yd-accent, #17b596); }
.yd-token-usage-progress::-moz-progress-bar { background: var(--yd-accent, #17b596); }


.yd-chatbot-wizard {
    --wizard-accent: var(--yd-accent, #17b596);
    --wizard-surface: var(--yd-surface, #090d1a);
    --wizard-line: var(--yd-line, rgba(255, 255, 255, .1));
    container: yd-wizard / inline-size;
    min-width: 0;
}

.yd-chatbot-install [hidden], .yd-chatbot-wizard [hidden] { display: none !important; }
.yd-chatbot-wizard .yd-wizard-intro { max-width: none; }
.yd-chatbot-install .yd-wizard-eyebrow, .yd-chatbot-wizard .yd-wizard-eyebrow { margin: 0 0 12px; color: var(--wizard-accent); font-size: 12px; font-weight: 600; letter-spacing: .16em; line-height: 1.5; text-transform: uppercase; }
.yd-chatbot-wizard .yd-wizard-intro h2 { color: var(--yd-heading, #fbf5f2); font-weight: 500; }
.yd-chatbot-wizard .yd-wizard-steps { display: flex; flex-wrap: wrap; gap: 4px; list-style: none; margin: 0 0 20px; padding: 4px; border: 1px solid var(--wizard-line); border-radius: 12px; }
.yd-chatbot-wizard .yd-wizard-steps li { flex: 1 1 100px; margin: 0; }
.yd-chatbot-wizard .yd-wizard-steps button { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 44px; padding: 10px 8px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--yd-muted, #9eabba); font-size: 13px; font-weight: 600; line-height: 1.5; }
.yd-chatbot-wizard .yd-wizard-steps [aria-current="step"] { background: var(--wizard-accent); border-color: var(--wizard-accent); color: #fff; }
.yd-chatbot-wizard .yd-wizard-steps span { display: inline-flex; flex: 0 0 22px; align-items: center; justify-content: center; height: 22px; border: 1px solid currentColor; border-radius: 50%; font-size: 11px; }
.yd-chatbot-wizard .yd-wizard-fields { min-width: 0; margin: 0 0 20px; padding: 0; border: 0; }
.yd-chatbot-wizard section { margin: 0; }
.yd-chatbot-wizard section > h2 { margin: 0 0 12px; font-size: 24px; font-weight: 500; line-height: 1.25; }
.yd-chatbot-wizard [data-panel] > .yd-wizard-eyebrow { display: none; }
.yd-chatbot-install .yd-panel-description, .yd-chatbot-wizard .yd-panel-description { max-width: 680px; margin-bottom: 32px; color: var(--yd-muted, #9eabba); }
.yd-chatbot-wizard .field { min-width: 0; margin-bottom: 24px; }
.yd-chatbot-wizard .label,
.yd-chatbot-wizard .yd-topic-row label,
.yd-chatbot-wizard .yd-topic-header { margin-bottom: 8px; }
.yd-chatbot-wizard .yd-topic-header .note { margin-bottom: 0; }
.yd-chatbot-wizard .note { display: block; margin: 8px 0 12px; color: var(--yd-muted, #9eabba); font-size: 14px; font-weight: 400; line-height: 1.7; }
.yd-chatbot-wizard .yd-wizard-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px 40px; }
.yd-chatbot-wizard .yd-wizard-grid > * { min-width: 0; }
.yd-chatbot-wizard .yd-wizard-grid > .field { margin-bottom: 0; }
.yd-chatbot-wizard .yd-settings-row { display: flex; align-items: flex-start; gap: 40px; }
.yd-chatbot-wizard .yd-settings-row > .yd-panel-description { flex: 0 0 30%; margin: 0; }
.yd-chatbot-wizard #yd-chatbot-locale { flex: 1; min-width: 0; }
@container yd-wizard (max-width: 640px) {
    .yd-chatbot-wizard .yd-settings-row { flex-direction: column; gap: 24px; }
    .yd-chatbot-wizard .yd-settings-row > .yd-panel-description { flex-basis: auto; }
    .yd-chatbot-wizard .yd-settings-content { width: 100%; }
}
.yd-chatbot-wizard input.input-text,
.yd-chatbot-wizard select,
.yd-chatbot-install textarea.input-text, .yd-chatbot-wizard textarea.input-text { box-sizing: border-box; max-width: 100%; padding: 10px 12px; margin-right: 6px; border: 1px solid var(--wizard-line); border-radius: 8px; background-color: var(--wizard-surface); color: var(--yd-heading, #fbf5f2); font-size: 14px; }
.yd-chatbot-wizard input.input-text,
.yd-chatbot-wizard select { min-height: 44px; }
.yd-chatbot-wizard input:focus-visible,
.yd-chatbot-wizard select:focus-visible,
.yd-chatbot-install textarea:focus-visible, .yd-chatbot-wizard textarea:focus-visible,
.yd-chatbot-install button:focus-visible, .yd-chatbot-wizard button:focus-visible,
.yd-chatbot-wizard a:focus-visible { outline: 2px solid var(--wizard-accent); outline-offset: 3px; }
.yd-chatbot-wizard input.mage-error,
.yd-chatbot-wizard select.mage-error,
.yd-chatbot-wizard textarea.mage-error { border-color: #e20613; }
.yd-chatbot-install .yd-choice-group, .yd-chatbot-wizard .yd-choice-group { display: inline-flex; flex-wrap: wrap; gap: 4px; max-width: 100%; padding: 4px; border: 1px solid var(--wizard-line); border-radius: 10px; }
.yd-chatbot-install .yd-choice-group button, .yd-chatbot-wizard .yd-choice-group button { padding: 10px 16px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--yd-muted, #9eabba); font-size: 14px; font-weight: 600; line-height: 1.5; }
.yd-chatbot-install .yd-choice-group [aria-pressed="true"], .yd-chatbot-wizard .yd-choice-group [aria-pressed="true"] { background: var(--wizard-accent); color: #fff; }
.yd-chatbot-wizard .yd-website-choices { gap: 10px; padding: 0; border: 0; border-radius: 0; }
.yd-chatbot-wizard .yd-website-choices button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 9px 16px; border: 1px solid var(--wizard-line); border-radius: 24px; }
.yd-chatbot-wizard .yd-website-choices [aria-pressed="true"] { border-color: var(--wizard-accent); background: transparent; color: var(--yd-heading, #fbf5f2); }
.yd-chatbot-wizard .yd-website-choices [aria-pressed="true"]::before { content: ''; width: 8px; height: 4px; border-left: 2px solid var(--wizard-accent); border-bottom: 2px solid var(--wizard-accent); transform: rotate(-45deg); }
.yd-chatbot-wizard .yd-catalog-callout button.action.secondary,
.yd-chatbot-wizard .yd-wizard-navigation button.action.secondary { min-height: 44px; padding: 10px 18px; border: 1px solid var(--wizard-line); border-radius: 8px; background: transparent; color: var(--yd-heading, #fbf5f2); }
.yd-chatbot-wizard .yd-catalog-callout button.action.secondary:hover,
.yd-chatbot-wizard .yd-wizard-navigation button.action.secondary:hover { border-color: var(--wizard-accent); background: var(--yd-panel, #0e1627); }
.yd-chatbot-wizard select.yd-choice-enhanced { display: none; }
.yd-chatbot-wizard select.yd-choice-responsive { display: block; width: 100%; margin-top: 12px; }
.yd-chatbot-wizard .yd-choice-responsive + .yd-choice-group { display: none; }
.yd-chatbot-wizard .yd-catalog-callout { margin-top: 32px; padding: 24px; border-left: 4px solid var(--wizard-accent); background: var(--yd-surface-alt, #04132c); }
.yd-chatbot-wizard .yd-catalog-callout h3 { margin-top: 0; font-size: 24px; font-weight: 600; }
.yd-chatbot-wizard .yd-catalog-callout .yd-wizard-grid { margin: 24px 0; }
.yd-chatbot-wizard .yd-topic-row { min-width: 0; margin: 28px 0 0; padding: 16px 0 24px; border: 0; border-top: 1px solid var(--wizard-line); }
.yd-chatbot-wizard .yd-topic-row legend { margin: 0; padding-right: 12px; color: var(--yd-heading, #fbf5f2); font-size: 14px; font-weight: 600; }
.yd-chatbot-wizard .yd-topic-row input { width: 100%; }
.yd-chatbot-wizard .yd-topic-row .yd-icon-button { margin-top: 16px; }
.yd-chatbot-install .yd-icon-button, .yd-chatbot-wizard .yd-icon-button { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; border: 1px solid var(--wizard-line); border-radius: 8px; background: transparent; color: var(--yd-muted, #9eabba); }
.yd-chatbot-wizard .yd-outline-button { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border: 1px solid var(--wizard-line); border-radius: 8px; background: transparent; font-size: 14px; font-weight: 600; }
.yd-chatbot-install .yd-icon-button:hover, .yd-chatbot-wizard .yd-icon-button:hover,
.yd-chatbot-wizard .yd-outline-button:hover { border-color: var(--wizard-accent); color: var(--yd-heading, #fbf5f2); }
.yd-chatbot-wizard .yd-color-controls,
.yd-chatbot-wizard .yd-swatches { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.yd-chatbot-wizard .yd-color-controls { margin-top: 12px; gap: 12px; }
.yd-chatbot-wizard .yd-swatches button { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; padding: 0; border: 2px solid var(--wizard-line); border-radius: 50%; background: transparent; }
.yd-chatbot-wizard .yd-swatches [aria-pressed="true"] { border-color: var(--wizard-accent); outline: 1px solid var(--wizard-accent); outline-offset: 2px; }
.yd-chatbot-wizard .yd-custom-color { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--yd-muted, #9eabba); font-size: 12px; }
.yd-chatbot-wizard input[type="color"] { width: 40px; height: 32px; padding: 0; border: 1px solid var(--wizard-line); border-radius: 4px; background: transparent; cursor: pointer; }
.yd-chatbot-wizard input.yd-color-hex { width: 112px; min-height: 34px; padding: 6px 12px; font-family: monospace; font-size: 12px; }
.yd-chatbot-install .yd-install-steps, .yd-chatbot-wizard .yd-install-steps { counter-reset: install-step; list-style: none; margin: 32px 0; padding: 0; }
.yd-chatbot-install .yd-install-steps li, .yd-chatbot-wizard .yd-install-steps li { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 20px; color: var(--yd-muted, #9eabba); font-size: 14px; line-height: 1.7; }
.yd-chatbot-install .yd-install-steps li:before, .yd-chatbot-wizard .yd-install-steps li:before { counter-increment: install-step; content: counter(install-step); display: inline-flex; flex: 0 0 28px; align-items: center; justify-content: center; height: 28px; border: 1px solid var(--wizard-accent); border-radius: 50%; color: var(--wizard-accent); font-size: 12px; font-weight: 600; }
.yd-chatbot-install .yd-code-section, .yd-chatbot-wizard .yd-code-section { min-width: 0; margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--wizard-line); }
.yd-chatbot-install .yd-code-heading, .yd-chatbot-wizard .yd-code-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.yd-chatbot-install .yd-code-section h3, .yd-chatbot-wizard .yd-code-section h3 { margin: 0 0 12px; font-size: 20px; font-weight: 600; }
.yd-chatbot-install .yd-code-heading h3, .yd-chatbot-wizard .yd-code-heading h3 { margin: 0; }
.yd-chatbot-install .yd-code-section p, .yd-chatbot-wizard .yd-code-section p { color: var(--yd-muted, #9eabba); font-size: 14px; line-height: 1.7; }
.yd-chatbot-install textarea.yd-install-code, .yd-chatbot-wizard textarea.yd-install-code,
.yd-chatbot-wizard pre { box-sizing: border-box; width: 100%; max-width: 100%; max-height: 420px; margin: 16px 0 0; padding: 20px; overflow: auto; border: 1px solid var(--wizard-line); border-radius: 12px; background: var(--yd-panel, #0b0d1a); color: var(--yd-heading, #fbf5f2); font-family: monospace; font-size: 13px; line-height: 1.85; }
.yd-chatbot-install textarea.yd-install-code, .yd-chatbot-wizard textarea.yd-install-code { min-height: 160px; resize: vertical; }
.yd-chatbot-install [data-copy-status], .yd-chatbot-wizard [data-copy-status],
.yd-chatbot-wizard [data-connect-status] { min-height: 24px; margin: 12px 0 0; font-size: 14px; }
.yd-chatbot-wizard .yd-wizard-navigation { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-top: 24px; border-top: 1px solid var(--wizard-line); }
.yd-chatbot-wizard .yd-wizard-navigation > button { border-radius: 8px; font-size: 14px; }
.yd-chatbot-wizard [data-progress] { color: var(--yd-muted, #9eabba); font-size: 13px; }
.yd-chatbot-wizard .yd-wizard-help { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--wizard-line); }
.yd-chatbot-wizard .yd-wizard-help h3 { margin: 0 0 8px; font-size: 20px; font-weight: 600; }
.yd-chatbot-wizard .yd-wizard-help p { color: var(--yd-muted, #9eabba); font-size: 14px; }
.yd-chatbot-wizard .yd-wizard-help .action { display: inline-block; margin-top: 12px; font-size: 14px; }
.yd-chatbot-wizard .yd-wizard-save-form,
.yd-chatbot-wizard .yd-wizard-connect-form { margin: 0; }

.yd-chatbot-wizard .yd-panel-description { margin-bottom: 20px; }
.yd-chatbot-wizard .field { margin-bottom: 20px; }
.yd-chatbot-wizard .yd-catalog-callout { margin-top: 20px; padding: 20px; }
.yd-chatbot-wizard .yd-catalog-callout h3 { font-size: 20px; }
.yd-chatbot-wizard .yd-wizard-navigation { padding-top: 12px; }
.yd-subscription-workspace .yd-chatbot-wizard .yd-save-toolbar button.action.primary { border: 1px solid #e2e8f0; border-radius: 999px; background: #e2e8f0; color: #152033; }
.yd-subscription-workspace .yd-chatbot-wizard .yd-save-toolbar button.action.primary:hover { border-color: #fff; background: #fff; color: #152033; }
.yd-subscription-workspace .yd-chatbot-wizard .yd-wizard-navigation > button,
.yd-subscription-workspace .yd-chatbot-wizard .yd-wizard-navigation > button.action.secondary { min-height: 44px; padding: 10px 20px; border: 1px solid #94a3b8; border-radius: 8px; background: #334155; color: #f8fafc; }
.yd-subscription-workspace .yd-chatbot-wizard .yd-wizard-navigation > button:hover:not(:disabled),
.yd-subscription-workspace .yd-chatbot-wizard .yd-wizard-navigation > button.action.secondary:hover:not(:disabled) { border-color: #cbd5e1; background: #475569; color: #fff; }
.yd-subscription-workspace .yd-chatbot-wizard .yd-wizard-navigation > button:disabled { opacity: .5; cursor: not-allowed; }
.yd-chatbot-wizard .yd-topic-header,
.yd-chatbot-wizard .yd-topic-field { display: grid; grid-template-columns: 2rem minmax(0, 1fr) minmax(0, 1fr) 44px; column-gap: 12px; }
.yd-chatbot-wizard .yd-topic-field { align-items: center; margin-bottom: 12px; }
.yd-chatbot-wizard .yd-topic-field input { min-width: 0; width: 100%; }
.yd-chatbot-wizard [data-topics] { counter-reset: yd-topic; }
.yd-chatbot-wizard .yd-topic-field { counter-increment: yd-topic; }
.yd-chatbot-wizard .yd-topic-field [data-topic-position] { text-align: center; }
.yd-chatbot-wizard .yd-topic-field [data-topic-position]::before { content: counter(yd-topic) "."; }
.yd-chatbot-wizard .yd-topic-field .yd-icon-button { width: 44px; height: 44px; margin: 0; }

.yd-chatbot-install {
    --wizard-accent: var(--yd-accent, #17b596);
    --wizard-surface: var(--yd-surface, #090d1a);
    --wizard-line: var(--yd-line, rgba(255, 255, 255, .1));
    min-width: 0;
}
.yd-chatbot-install > h2 { margin: 0 0 16px; color: var(--yd-heading, #fbf5f2); font-size: 28px; font-weight: 500; line-height: 1.25; }
.yd-chatbot-install .yd-panel-description { margin-bottom: 24px; }
.yd-chatbot-install .yd-choice-group { display: flex; }
.yd-chatbot-install .yd-choice-group button { flex: 1 1 auto; }
.yd-chatbot-wizard [data-connect-status].yd-status-error { color: #ff6b6b; }
.yd-chatbot-wizard [data-connect-status].yd-status-success { color: var(--wizard-accent); }


@container yd-wizard (min-width: 640px) {
    .yd-chatbot-wizard select.yd-choice-responsive.yd-choice-enhanced { display: none; }
    .yd-chatbot-wizard .yd-choice-responsive + .yd-choice-group { display: flex; margin-top: 12px; }
    .yd-chatbot-wizard .yd-choice-responsive + .yd-choice-group button { flex: 1 0 auto; padding: 8px 12px; }
}

@container yd-wizard (max-width: 360px) {
    .yd-chatbot-wizard .yd-wizard-navigation [data-progress] { order: -1; width: 100%; text-align: center; }
    .yd-chatbot-wizard .yd-catalog-callout { padding: 20px 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .yd-chatbot-wizard button,
    .yd-chatbot-wizard input[type],
    .yd-chatbot-wizard select,
    .yd-chatbot-wizard textarea { transition: none; }
}


