/* Shared polish for creation, portfolio, personal lists, ads and editing pages. */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-padding-top: calc(76px + env(safe-area-inset-top));
}

body.workspace-page,
body.page-public-profile.workspace-profile-page {
    overflow-x: hidden;
    background:
        radial-gradient(circle at 18% 0%, rgba(253, 185, 19, 0.08), transparent 28%),
        radial-gradient(circle at 94% 10%, rgba(40, 167, 69, 0.06), transparent 24%),
        linear-gradient(180deg, #101012 0%, #171719 52%, #101012 100%);
}

:root.light-theme body.workspace-page,
:root.light-theme body.page-public-profile.workspace-profile-page {
    background:
        radial-gradient(circle at 18% 0%, rgba(253, 185, 19, 0.18), transparent 30%),
        radial-gradient(circle at 94% 10%, rgba(40, 167, 69, 0.10), transparent 24%),
        linear-gradient(180deg, #f4f5f7 0%, #ffffff 48%, #f4f5f7 100%);
}

body.workspace-page .container,
body.page-public-profile.workspace-profile-page .container {
    width: 100%;
    max-width: none;
    overflow-x: clip;
}

body.workspace-page .page-content,
body.workspace-page .advertising-page {
    width: min(1180px, calc(100% - 32px));
    margin: 28px auto 64px;
    padding: 0;
}

body.workspace-page .page-header,
body.workspace-page .gist-header,
body.workspace-page .filter-section,
body.workspace-page .inline-form,
body.workspace-page .edit-form,
body.workspace-page .settings-form,
body.workspace-page .project-form-container,
body.workspace-page .advertising-hero,
body.workspace-page .advertising-panel,
body.workspace-page .comments-section,
body.workspace-page .user-info-popup-content {
    border: 1px solid rgba(255, 255, 255, 0.08);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.018)),
        var(--bg-surface, #1e1e1e);
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.24);
}

:root.light-theme body.workspace-page .page-header,
:root.light-theme body.workspace-page .gist-header,
:root.light-theme body.workspace-page .filter-section,
:root.light-theme body.workspace-page .inline-form,
:root.light-theme body.workspace-page .edit-form,
:root.light-theme body.workspace-page .settings-form,
:root.light-theme body.workspace-page .project-form-container,
:root.light-theme body.workspace-page .advertising-hero,
:root.light-theme body.workspace-page .advertising-panel,
:root.light-theme body.workspace-page .comments-section,
:root.light-theme body.workspace-page .user-info-popup-content {
    border-color: rgba(15, 23, 42, 0.10);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.72)),
        var(--bg-surface, #ffffff);
    box-shadow: 0 18px 46px rgba(15, 23, 42, 0.08);
}

body.workspace-page .page-header,
body.workspace-page .gist-header {
    border-radius: 14px;
    padding: 24px;
    gap: 18px;
}

body.workspace-page .page-title-stack h1,
body.workspace-page .page-header h1,
body.workspace-page .paste-title-stack h1 {
    max-width: 100%;
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 2.15rem;
    line-height: 1.12;
    letter-spacing: 0;
}

body.workspace-page .page-header p,
body.workspace-page .page-title-stack p,
body.workspace-page .advertising-hero p {
    max-width: 760px;
    color: var(--text-secondary, #aaa);
}

body.workspace-page .header-actions,
body.workspace-page .form-actions,
body.workspace-page .create-actions,
body.workspace-page .actions,
body.workspace-page .card-footer,
body.workspace-page .ad-inline-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

body.workspace-page .header-actions {
    justify-content: flex-end;
}

body.workspace-page .btn,
body.workspace-page button,
body.workspace-page .action-btn,
body.workspace-page .proj-action-btn {
    min-height: 42px;
    max-width: 100%;
}

body.workspace-page .btn,
body.workspace-page .action-btn {
    white-space: normal;
}

body.workspace-page input,
body.workspace-page select,
body.workspace-page textarea {
    max-width: 100%;
    color-scheme: dark;
}

:root.light-theme body.workspace-page input,
:root.light-theme body.workspace-page select,
:root.light-theme body.workspace-page textarea {
    color-scheme: light;
}

body.workspace-page input[type="text"],
body.workspace-page input[type="search"],
body.workspace-page input[type="url"],
body.workspace-page input[type="date"],
body.workspace-page input[type="number"],
body.workspace-page select,
body.workspace-page textarea,
body.workspace-page .form-control {
    width: 100%;
    min-height: 44px;
    border-radius: 10px;
}

body.workspace-page textarea,
body.workspace-page .code-editor-textarea {
    resize: vertical;
    line-height: 1.55;
}

body.workspace-page .message,
body.workspace-page .alert,
body.workspace-page .empty-state {
    border-radius: 12px;
    overflow-wrap: anywhere;
}

/* Create and view paste pages. */
body.workspace-create-page main.create-paste-content,
body.workspace-view-page main.paste-view-content,
body.page-create-paste.workspace-page main.page-content,
body.page-paste-view.workspace-page main.page-content {
    background: transparent !important;
    box-shadow: none !important;
}

body.workspace-create-page .create-paste-form {
    display: grid;
    gap: 22px;
}

body.workspace-create-page .create-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

body.workspace-create-page .code-editor-shell,
body.workspace-create-page .code-block-item,
body.workspace-view-page .code-tabs,
body.workspace-view-page .code-content,
body.workspace-view-page .gist-meta,
body.workspace-view-page .comments-section {
    border-radius: 14px;
    overflow: hidden;
}

body.workspace-create-page .code-block-item {
    border: 1px solid var(--border-color, #333);
    background: rgba(0, 0, 0, 0.14);
}

body.workspace-create-page .block-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 210px) auto;
    gap: 10px;
    align-items: center;
}

body.workspace-create-page .btn-remove-block {
    width: 42px;
    min-width: 42px;
    height: 42px;
    justify-content: center;
}

body.workspace-view-page .paste-view-header {
    align-items: flex-start;
}

body.workspace-view-page .paste-view-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    padding: 16px;
}

body.workspace-view-page .author-meta-box {
    min-width: min(100%, 260px);
}

body.workspace-view-page .tab-container {
    min-width: 0;
}

body.workspace-view-page .tab-buttons {
    display: flex;
    overflow-x: auto;
    scrollbar-width: thin;
}

body.workspace-view-page .tab-btn {
    flex: 0 0 auto;
    min-height: 42px;
    white-space: nowrap;
}

body.workspace-view-page pre,
body.workspace-view-page code {
    max-width: 100%;
    white-space: pre;
}

body.workspace-view-page pre {
    overflow: auto;
}

body.workspace-view-page #comment-form,
body.workspace-view-page .review-controls {
    display: grid;
    gap: 12px;
}

body.workspace-view-page .comment {
    max-width: 100%;
    overflow-wrap: anywhere;
}

/* Personal list pages. */
body.workspace-list-page .filter-section,
body.workspace-presentations-page .create-presentation-form {
    border-radius: 14px;
    padding: 18px;
}

body.workspace-list-page .filter-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 14px;
}

body.workspace-list-page .search-form,
body.workspace-list-page .search-box,
body.workspace-list-page .sort-form,
body.workspace-presentations-page .create-presentation-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

body.workspace-list-page .search-input-wrapper {
    display: flex;
    flex: 1 1 260px;
    min-width: 0;
}

body.workspace-list-page .search-input-wrapper input {
    min-width: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

body.workspace-list-page .search-input-wrapper button {
    flex: 0 0 48px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

body.workspace-list-page .pastes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    gap: 18px;
}

body.workspace-list-page .paste-card,
body.workspace-presentations-page .table-wrapper {
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.048), rgba(255, 255, 255, 0.018)),
        var(--bg-surface, #1e1e1e);
    overflow: hidden;
}

:root.light-theme body.workspace-list-page .paste-card,
:root.light-theme body.workspace-presentations-page .table-wrapper {
    border-color: rgba(15, 23, 42, 0.10);
    background: #fff;
}

body.workspace-list-page .paste-card {
    min-height: 210px;
}

body.workspace-list-page .card-footer {
    margin-top: auto;
}

body.workspace-list-page .card-footer .action-btn,
body.workspace-list-page .card-footer form {
    flex: 1 1 46px;
}

body.workspace-list-page .card-footer form {
    display: flex;
}

body.workspace-list-page .card-footer button.action-btn,
body.workspace-list-page .card-footer a.action-btn {
    width: 100%;
    justify-content: center;
}

body.workspace-presentations-page .create-presentation-form {
    margin-bottom: 18px;
}

body.workspace-presentations-page .create-presentation-form .inline-group {
    flex: 1 1 320px;
    min-width: 0;
}

body.workspace-presentations-page .table-wrapper {
    width: 100%;
    overflow-x: auto;
}

body.workspace-presentations-page .pastes-table {
    min-width: 820px;
}

body.workspace-presentations-page .pastes-table td.actions {
    min-width: 320px;
}

body.workspace-presentations-page .table-action-form {
    display: inline-flex;
    margin: 0;
}

/* Advertising centre. */
body.advertising-body .advertising-page {
    padding-bottom: 32px;
}

body.advertising-body .advertising-hero {
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)),
        radial-gradient(circle at 14% 0%, rgba(253, 185, 19, 0.16), transparent 34%),
        radial-gradient(circle at 94% 14%, rgba(40, 167, 69, 0.10), transparent 28%),
        var(--bg-surface, #1a1a1a) !important;
}

body.advertising-body .ad-stats-grid,
body.advertising-body .ad-report-grid,
body.advertising-body .ad-dashboard-grid,
body.advertising-body .ad-subscription-grid,
body.advertising-body .pricing-grid,
body.advertising-body .ad-pricing-grid,
body.advertising-body .ad-placement-grid,
body.advertising-body .ad-form-grid,
body.advertising-body .ad-preview-grid,
body.advertising-body .ad-order-form-grid {
    min-width: 0;
}

body.advertising-body .ad-stat-card,
body.advertising-body .ad-report-card,
body.advertising-body .ad-dashboard-block,
body.advertising-body .ad-subscription-card,
body.advertising-body .pricing-card,
body.advertising-body .ad-pricing-card,
body.advertising-body .placement-card,
body.advertising-body .ad-preview-card {
    border-radius: 14px;
    min-width: 0;
}

body.advertising-body .ad-current-subscription {
    flex-wrap: wrap;
}

body.advertising-body .ad-subscription-usage {
    min-width: min(100%, 240px);
}

body.advertising-body .ad-orders-table-wrap,
body.advertising-body .ad-table-wrapper,
body.advertising-body .table-wrapper,
body.advertising-body .ad-data-scroll {
    width: 100%;
    overflow-x: auto;
}

body.advertising-body .ad-eyebrow {
    letter-spacing: 0;
}

body.advertising-body .ad-data-table {
    min-width: 860px;
}

body.advertising-body .ad-preview-card img,
body.advertising-body .ad-preview-device img,
body.advertising-body .ad-device-preview img,
body.advertising-body .advertisement-placement img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

body.advertising-body .advertisement-placement {
    max-width: calc(100vw - 24px);
}

/* Editing pages. */
body.workspace-edit-page .workspace-edit-shell {
    max-width: 1080px;
}

body.workspace-edit-page .edit-form,
body.workspace-edit-page .settings-form,
body.workspace-edit-page .project-form-container,
body.page-edit-presentation #slides-form {
    border-radius: 14px;
    padding: 24px;
}

body.page-edit-catalog .edit-form {
    max-width: 720px;
    margin: 0 auto;
}

body.page-edit-presentation #slides-form {
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--bg-surface, #1e1e1e);
}

:root.light-theme body.page-edit-presentation #slides-form {
    border-color: rgba(15, 23, 42, 0.10);
    background: #fff;
}

body.page-edit-presentation .slide-block,
body.page-edit-presentation .slide-element-block {
    border: 1px solid var(--border-color, #333);
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.12);
    padding: 16px;
    overflow: hidden;
}

body.page-edit-presentation .slide-block-header,
body.page-edit-presentation .element-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

body.page-edit-presentation .slide-header-actions,
body.page-edit-presentation .element-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body.page-edit-presentation .tinymce-editor,
body.page-edit-presentation .code-editor-textarea {
    min-height: 160px;
}

body.page-edit-project .project-form-container {
    max-width: 1040px;
    margin: 18px auto 0;
}

body.page-edit-project .form-section-title i,
body.page-edit-project .project-ide-panel h3 i {
    color: var(--accent-yellow, #fdb913) !important;
}

body.page-edit-project .checkbox-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 185px), 1fr));
}

body.page-edit-project .checkbox-item,
body.page-edit-project .radio-label {
    min-width: 0;
}

body.page-edit-project .project-ide-panel {
    text-align: center;
    margin: 40px 0;
    padding: 34px;
    border: 1px solid var(--border-color, #333);
    border-radius: 14px;
    background:
        radial-gradient(circle at 8% 0%, rgba(253, 185, 19, 0.10), transparent 34%),
        var(--bg-main, #121212);
}

body.page-edit-project .project-ide-panel .btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

body.page-edit-project .project-danger-actions {
    align-items: center;
}

/* Public profile fixes and portfolio actions. */
body.page-public-profile.workspace-profile-page .profile-container {
    width: min(1180px, calc(100% - 32px));
    max-width: 1180px;
    margin: 30px auto 64px !important;
    padding: 0 !important;
}

body.page-public-profile.workspace-profile-page .profile-header {
    margin: 0 0 26px !important;
    border-radius: 16px !important;
    overflow: hidden;
}

body.page-public-profile.workspace-profile-page .profile-cover {
    height: 260px;
    background:
        radial-gradient(circle at 18% 0%, rgba(253, 185, 19, 0.20), transparent 32%),
        linear-gradient(135deg, #161616, #2a2a2a 62%, #171717);
    background-size: cover;
    background-position: center;
}

body.page-public-profile.workspace-profile-page .profile-info-wrap {
    gap: 24px;
}

body.page-public-profile.workspace-profile-page .profile-avatar-large {
    width: 168px !important;
    height: 168px !important;
}

body.page-public-profile.workspace-profile-page .profile-text-details {
    min-width: 0;
}

body.page-public-profile.workspace-profile-page .profile-text-details h1 {
    font-size: 2.35rem !important;
    line-height: 1.12;
    letter-spacing: 0;
    overflow-wrap: anywhere;
}

body.page-public-profile.workspace-profile-page .profile-badges,
body.page-public-profile.workspace-profile-page .profile-actions,
body.page-public-profile.workspace-profile-page .proj-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body.page-public-profile.workspace-profile-page .profile-layout,
body.page-public-profile.workspace-profile-page .projects-grid {
    min-width: 0;
}

body.page-public-profile.workspace-profile-page .p-card,
body.page-public-profile.workspace-profile-page .project-item {
    border-radius: 14px;
}

body.page-public-profile.workspace-profile-page .project-item {
    overflow: hidden;
}

body.page-public-profile.workspace-profile-page .proj-footer {
    align-items: center;
}

body.page-public-profile.workspace-profile-page .proj-action-btn {
    width: auto;
    min-width: 40px;
    height: 40px;
    border-radius: 10px;
    color: var(--text-primary);
}

body.page-public-profile.workspace-profile-page .proj-action-btn.ide {
    color: var(--accent-yellow, #fdb913);
}

body.page-public-profile.workspace-profile-page .proj-action-btn.ide:hover,
body.page-public-profile.workspace-profile-page .proj-action-btn.ide:focus-visible {
    border-color: rgba(253, 185, 19, 0.55);
    background: rgba(253, 185, 19, 0.12);
}

body.page-public-profile.workspace-profile-page .contribution-graph {
    max-width: 100%;
    overflow-x: auto;
}

@media (display-mode: standalone) {
    body.workspace-page,
    body.page-public-profile.workspace-profile-page {
        min-height: 100dvh;
        padding-bottom: calc(20px + env(safe-area-inset-bottom));
    }

    body.workspace-page .page-content,
    body.workspace-page .advertising-page,
    body.page-public-profile.workspace-profile-page .profile-container {
        margin-bottom: calc(90px + env(safe-area-inset-bottom)) !important;
    }
}

@media (max-width: 1000px) {
    body.workspace-page .page-content,
    body.workspace-page .advertising-page,
    body.page-public-profile.workspace-profile-page .profile-container {
        width: min(100% - 24px, 960px);
    }

    body.workspace-page .page-header,
    body.workspace-page .gist-header {
        align-items: stretch;
        flex-direction: column;
    }

    body.workspace-page .header-actions {
        justify-content: flex-start;
    }

    body.workspace-list-page .filter-section,
    body.workspace-create-page .create-settings-grid {
        grid-template-columns: 1fr;
    }

    body.page-public-profile.workspace-profile-page .profile-cover {
        height: 220px;
    }
}

@media (max-width: 760px) {
    body.workspace-page .page-content,
    body.workspace-page .advertising-page,
    body.page-public-profile.workspace-profile-page .profile-container {
        width: calc(100% - 18px);
        margin-top: 16px;
    }

    body.workspace-page .page-header,
    body.workspace-page .gist-header,
    body.workspace-page .filter-section,
    body.workspace-page .inline-form,
    body.workspace-page .edit-form,
    body.workspace-page .settings-form,
    body.workspace-page .project-form-container,
    body.workspace-page .advertising-hero,
    body.workspace-page .advertising-panel,
    body.workspace-page .comments-section {
        padding: 18px;
        border-radius: 12px;
    }

    body.workspace-page .page-title-stack h1,
    body.workspace-page .page-header h1,
    body.workspace-page .paste-title-stack h1,
    body.page-public-profile.workspace-profile-page .profile-text-details h1 {
        font-size: 1.72rem !important;
    }

    body.workspace-page .btn,
    body.workspace-page .action-btn {
        min-height: 44px;
    }

    body.workspace-create-page .block-header {
        grid-template-columns: 1fr;
    }

    body.workspace-create-page .btn-remove-block {
        width: 100%;
    }

    body.workspace-list-page .search-form,
    body.workspace-list-page .search-box,
    body.workspace-list-page .sort-form,
    body.workspace-presentations-page .create-presentation-form,
    body.workspace-page .form-actions,
    body.workspace-page .create-actions,
    body.page-edit-project .form-actions-right {
        align-items: stretch;
        flex-direction: column;
    }

    body.workspace-list-page .search-form .btn,
    body.workspace-list-page .search-box .btn,
    body.workspace-list-page .sort-form .btn,
    body.workspace-presentations-page .create-presentation-form .btn,
    body.workspace-page .form-actions .btn,
    body.workspace-page .create-actions .btn,
    body.page-edit-project .form-actions-right .btn,
    body.page-edit-project .btn-danger {
        width: 100%;
    }

    body.workspace-presentations-page .pastes-table,
    body.advertising-body .ad-data-table {
        min-width: 0;
    }

    body.workspace-presentations-page .pastes-table,
    body.workspace-presentations-page .pastes-table thead,
    body.workspace-presentations-page .pastes-table tbody,
    body.workspace-presentations-page .pastes-table tr,
    body.workspace-presentations-page .pastes-table th,
    body.workspace-presentations-page .pastes-table td {
        display: block;
        width: 100%;
    }

    body.workspace-presentations-page .pastes-table thead {
        display: none;
    }

    body.workspace-presentations-page .pastes-table tr {
        border-bottom: 1px solid var(--border-color, #333);
        padding: 14px;
    }

    body.workspace-presentations-page .pastes-table td {
        display: grid;
        grid-template-columns: minmax(90px, 34%) minmax(0, 1fr);
        gap: 10px;
        padding: 9px 0;
    }

    body.workspace-presentations-page .pastes-table td::before {
        content: attr(data-label);
        color: var(--text-secondary, #aaa);
        font-weight: 700;
    }

    body.workspace-presentations-page .pastes-table td.actions {
        display: flex;
        min-width: 0;
        flex-direction: column;
        align-items: stretch;
    }

    body.workspace-presentations-page .pastes-table td.actions::before {
        display: none;
    }

    body.workspace-presentations-page .pastes-table td.actions .btn,
    body.workspace-presentations-page .table-action-form,
    body.workspace-presentations-page .table-action-form button {
        width: 100%;
    }

    body.advertising-body .ad-current-subscription {
        align-items: stretch;
        flex-direction: column;
    }

    body.advertising-body .ad-subscription-usage {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.10);
        padding-left: 0;
        padding-top: 16px;
    }

    body.page-public-profile.workspace-profile-page .profile-container {
        width: calc(100% - 18px);
    }

    body.page-public-profile.workspace-profile-page .profile-info-wrap {
        padding: 0 18px 22px !important;
    }

    body.page-public-profile.workspace-profile-page .profile-avatar-large {
        width: 132px !important;
        height: 132px !important;
    }

    body.page-public-profile.workspace-profile-page .profile-actions .btn-edit-profile,
    body.page-public-profile.workspace-profile-page .portfolio-header .btn {
        width: 100%;
    }
}

@media (max-width: 520px) {
    body.workspace-page .page-content,
    body.workspace-page .advertising-page,
    body.page-public-profile.workspace-profile-page .profile-container {
        width: calc(100% - 14px);
    }

    body.workspace-page .page-header,
    body.workspace-page .gist-header,
    body.workspace-page .filter-section,
    body.workspace-page .inline-form,
    body.workspace-page .edit-form,
    body.workspace-page .settings-form,
    body.workspace-page .project-form-container,
    body.workspace-page .advertising-hero,
    body.workspace-page .advertising-panel,
    body.workspace-page .comments-section,
    body.page-edit-presentation #slides-form {
        padding: 14px;
    }

    body.workspace-page input,
    body.workspace-page select,
    body.workspace-page textarea {
        font-size: 16px;
    }

    body.workspace-view-page .paste-view-meta {
        align-items: stretch;
        flex-direction: column;
    }

    body.workspace-view-page .author-meta-box {
        min-width: 0;
    }

    body.workspace-list-page .pastes-grid {
        grid-template-columns: 1fr;
    }

    body.page-edit-project .project-ide-panel {
        padding: 22px 14px;
    }

    body.page-public-profile.workspace-profile-page .profile-cover {
        height: 178px;
    }

    body.page-public-profile.workspace-profile-page .proj-links {
        width: 100%;
    }

    body.page-public-profile.workspace-profile-page .proj-action-btn {
        flex: 1 1 42px;
    }
}