/* Website controls extend the existing hosting theme and component spacing. */
.panel-content .website-workspace .website-address {
    padding: 20px 24px;
    margin: 0;
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
    min-width: 0;
}
.panel-content .website-workspace .website-address > .h-card-heading {
    padding: 0;
    margin: 0 0 12px;
    border: 0;
    align-items: flex-start;
    flex-wrap: wrap;
}
.website-workspace .website-address h3 { margin: 0; font-size: 16px; overflow-wrap: anywhere; }
.panel-content .website-workspace .website-address > .h-detail-actions,
.panel-content .website-workspace .h-form > .h-detail-actions {
    padding: 0;
    margin: 12px 0 0;
    border: 0;
    gap: 10px;
    flex-wrap: wrap;
}
.website-workspace .website-address > p { margin: 12px 0 0; }
.website-workspace .website-address .h-copy-line { margin: 16px 0; flex-wrap: wrap; }
.website-workspace .website-address .h-copy-line code { overflow-wrap: anywhere; white-space: pre-wrap; }
.panel-content .website-workspace > .h-card > .resource-tools { margin: 20px 24px; }
.website-workspace .h-event { gap: 20px; align-items: flex-start; }
.website-workspace .h-event > div { min-width: 0; flex: 1; }
.website-workspace .h-event strong,
.website-workspace .h-event small { display: block; overflow-wrap: anywhere; }
.website-workspace pre { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 100%; }
.website-workspace .h-form > details { margin: 0; }
.website-workspace .h-form > p { margin: 0; }
.website-workspace .website-address .button:focus-visible { outline-offset: 3px; }
@media (max-width: 600px) {
    .panel-content .website-workspace .website-address { padding: 18px 20px; }
    .panel-content .website-workspace > .h-card > .resource-tools { margin: 18px 20px; }
    .website-workspace .h-event { flex-wrap: wrap; }
    .website-workspace .h-event form { width: 100%; }
    .website-workspace .website-address .h-danger-link { margin-left: auto; }
    .website-workspace .h-copy-line { align-items: flex-start; }
}

/* A single address-and-destination flow, using the hosting choice-row language. */
.website-route-form .website-destinations,
.website-route-form .website-destination-fields { min-width: 0; margin: 0; padding: 0; border: 0; }
.website-route-form .website-destinations { display: grid; gap: 0; }
.website-destinations > legend { margin-bottom: 10px; padding: 0; font-size: 13px; font-weight: 650; }
.website-route-form .website-destination { display: flex; align-items: center; gap: 12px; margin: 0; padding: 14px 12px; border-bottom: 1px solid var(--line); cursor: pointer; border-radius: 0; }
.website-destination:first-of-type { border-top: 1px solid var(--line); }
.website-route-form .website-destination input { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; accent-color: var(--accent); }
.website-destination > .hosting-icon { flex: 0 0 20px; color: var(--h-muted); }
.website-destination > span { min-width: 0; }
.website-destination strong { display: block; font-size: 14px; font-weight: 650; }
.website-route-form .website-destination small { display: block; margin: 3px 0 0; font-weight: 400; line-height: 1.5; }
.website-destination:hover { background: var(--surface2); }
.website-destination:has(input:checked) { background: var(--surface2); }
.website-destination:has(input:checked) .hosting-icon { color: var(--accent); }
.website-destination:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; position: relative; }
.website-route-form .website-destination-fields { display: grid; gap: 18px; }
.website-route-form .website-destination-fields[hidden] { display: none; }
.website-destination-fields > .notice { margin: 0; }
.website-address-field > small { display: block; margin-top: 8px; color: var(--h-muted); font-size: 12px; line-height: 1.6; }
.website-https { padding-top: 20px; border-top: 1px solid var(--line); }
.website-https p { margin: 8px 0 0; }
.website-removal-summary { margin: 0; }
.website-removal-summary dd { overflow-wrap: anywhere; }

.website-preview-settings { min-width: 0; border-top: 1px solid var(--line); padding-top: 18px; }
.website-preview-settings > summary { cursor: pointer; font-size: 14px; font-weight: 650; }
.website-preview-settings > p { margin: 12px 0 16px; }
.website-preview-settings > .dns-check { margin: 0 0 18px; }
.website-preview-settings [hidden] { display: none !important; }
.website-preview-card { margin: 0; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--surface); }
.website-preview-card figcaption { padding: 18px; min-width: 0; }
.website-preview-card figcaption > small { display: block; color: var(--h-muted); font-size: 12px; overflow-wrap: anywhere; }
.website-preview-card strong { display: block; font-size: 16px; line-height: 1.4; margin-top: 8px; overflow-wrap: anywhere; }
.website-preview-card p { margin: 8px 0 0; font-size: 13px; line-height: 1.6; color: var(--h-muted); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.website-preview-image { width: 100%; display: grid; place-items: center; aspect-ratio: 1.91; max-height: 220px; background: var(--surface2); overflow: hidden; }
.website-preview-image img { display: block; width: 100%; height: 100%; max-height: 220px; object-fit: cover; }
.website-preview-image > span { padding: 18px; font-size: 13px; color: var(--h-muted); }
