/* Shared editorial and admin styling; colors inherit the Collector theme. */
.blog-page, .article-page, .blog-admin-page, .blog-editor-page, .admin-page {
    width: 100%; max-width: 1080px; margin: 0 auto; padding: 18px 0 30px;
}
.blog-header { margin: 0 0 28px; }
.blog-header h1, .blog-admin-page h1, .blog-editor-page h1 { margin: 8px 0 10px; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.1; letter-spacing: -.055em; }
.blog-header p { margin: 0; color: var(--muted); }
.blog-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.blog-card { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--section-bg, var(--surface)); box-shadow: var(--shadow-soft); }
.blog-card h2 { margin: 7px 0 8px; font-size: 1.3rem; line-height: 1.25; letter-spacing: -.03em; }
.blog-card h2 a:hover { color: var(--accent); }
.blog-date, .article-date { margin: 0 0 15px; color: var(--muted); font-size: .82rem; }
.blog-excerpt { color: var(--muted); }
.blog-read-more { display: inline-flex; margin-top: 8px; color: var(--accent); font-size: .9rem; font-weight: 800; }
.blog-empty { padding: 26px; border: 1px dashed var(--line-strong); border-radius: var(--radius); background: var(--surface); color: var(--muted); }
.article-back { display: inline-block; margin-bottom: 25px; color: var(--accent); font-size: .9rem; font-weight: 750; }
.article { max-width: 850px; margin: 0 auto; }
.article-header { margin-bottom: 28px; }
.article-header h1 { margin: 0 0 10px; font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.08; letter-spacing: -.055em; }
.article-excerpt { padding: 14px 18px; border-left: 3px solid var(--accent); border-radius: 0 8px 8px 0; background: var(--surface); color: var(--muted); font-size: 1.1rem; }
.article-content { font-size: 1.04rem; line-height: 1.85; overflow-wrap: anywhere; }
.article-content > :first-child { margin-top: 0; }
.article-content p { margin: 0 0 1.25em; }
.article-content h2 { margin: 1.8em 0 .65em; font-size: 1.65rem; line-height: 1.25; }
.article-content h3 { margin: 1.6em 0 .6em; font-size: 1.3rem; line-height: 1.3; }
.article-content ul, .article-content ol { margin-bottom: 1.25em; padding-left: 1.6em; }
.article-content blockquote { margin: 1.5em 0; padding: 15px 20px; border-left: 4px solid var(--accent); border-radius: 0 8px 8px 0; background: var(--surface-soft); color: var(--muted); }
.article-content a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.article-content img { max-width: 100%; height: auto; border-radius: 10px; }
.admin-page-heading { display: flex; justify-content: space-between; gap: 18px; margin: 0 0 24px; }
.admin-page-heading h1 { margin: 7px 0 8px; }
.admin-page-heading p { margin: 0; color: var(--muted); }
.admin-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 23px; }
.section-admin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.section-admin-card { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.section-admin-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.section-admin-key { color: var(--muted); font-size: .72rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.section-admin-card h2 { margin: 12px 0 6px; font-size: 1.25rem; }
.section-admin-card p { min-height: 25px; margin: 0 0 16px; color: var(--muted); font-size: .86rem; }
.section-admin-card .button-secondary { margin-top: 14px; }
.status-chip { display: inline-flex; align-items: center; width: fit-content; padding: 4px 8px; border-radius: 999px; font-size: .7rem; font-weight: 850; white-space: nowrap; }
.status-on { background: color-mix(in srgb, var(--success) 16%, var(--surface)); color: var(--success); }
.status-off { background: var(--surface-soft); color: var(--muted); }
.swatch-row { display: flex; gap: 6px; min-height: 15px; }
.swatch-row span { width: 18px; height: 18px; border: 1px solid var(--line); border-radius: 50%; }
.admin-form { display: grid; gap: 16px; }
.form-card { min-width: 0; padding: clamp(18px, 3vw, 26px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--section-bg, var(--surface)); box-shadow: var(--shadow-soft); }
.form-card h2 { margin: 0 0 15px; font-size: 1.25rem; }
.admin-form > .form-card > label:not(.check-row), .form-card > label:not(.check-row), .rich-image-tools > label, .upload-card > label { display: block; margin: 16px 0 7px; color: var(--muted); font-size: .85rem; font-weight: 750; }
.admin-form input:not([type="checkbox"]):not([type="color"]):not([type="file"]), .admin-form select { min-height: 43px; }
.admin-form input[type="color"] { width: 100%; height: 46px; padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); }
.admin-form input[type="file"], .upload-card input[type="file"] { width: 100%; padding: 10px; border: 1px dashed var(--line-strong); border-radius: 8px; background: var(--bg); color: var(--text); }
.admin-form label + textarea { margin-top: 0; }
.admin-form textarea { min-height: 140px; resize: vertical; }
.form-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.form-two-columns, .color-controls { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
.color-controls > div { min-width: 0; }
.check-row { display: flex; align-items: flex-start; gap: 10px; margin: 16px 0; color: var(--text); font-weight: 650; }
.check-row input { margin-top: 5px; }
.muted-copy { color: var(--muted); font-size: .86rem; }
.homepage-blocks-note { margin: 25px 0 8px; padding: 15px; border-radius: 8px; background: var(--surface-soft); }
.homepage-blocks-note p { margin: 5px 0 0; color: var(--muted); font-size: .86rem; }
.success-message, .error-message { margin: 0 0 18px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.success-message { border-color: color-mix(in srgb, var(--success) 55%, var(--line)); color: var(--success); }
.error-message { border-color: color-mix(in srgb, var(--danger) 55%, var(--line)); color: var(--danger); }
.media-choice-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-top: 14px; }
.media-choice { position: relative; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: var(--bg); }
.media-choice > input { position: absolute; top: 8px; left: 8px; z-index: 1; width: 18px; height: 18px; }
.media-choice img { width: 100%; height: 115px; object-fit: cover; }
.media-choice span { display: block; overflow: hidden; padding: 7px 8px; color: var(--muted); font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.rich-editor-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); }
.rich-editor-toolbar { display: flex; flex-wrap: wrap; gap: 5px; padding: 8px; border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.rich-editor-toolbar button { min-height: 32px; padding: 5px 9px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--text); font-size: .78rem; font-weight: 700; }
.rich-editor-toolbar button:hover { border-color: var(--accent); color: var(--accent); }
.rich-editor-content { min-height: 170px; padding: 15px; color: var(--text); line-height: 1.75; overflow-wrap: anywhere; }
.rich-editor-content:focus { outline: 2px solid var(--accent); outline-offset: -2px; }
.rich-editor-content img { max-width: 100%; height: auto; border-radius: 6px; }
.rich-editor-content blockquote { margin: 14px 0; padding: 8px 13px; border-left: 3px solid var(--accent); background: var(--surface-soft); }
.rich-image-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px; border-top: 1px solid var(--line); background: var(--surface); }
.rich-image-tools > label { margin: 0; }
.rich-image-tools input[type="file"] { max-width: 280px; padding: 5px; font-size: .82rem; }
.upload-status { color: var(--muted); font-size: .8rem; }
.media-library-heading { margin-top: 36px; }
.media-library-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 15px; }
.media-library-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.media-library-card > img { width: 100%; height: 190px; object-fit: cover; background: var(--surface-soft); }
.media-library-caption { display: flex; flex-direction: column; gap: 3px; padding: 13px 14px; }
.media-library-caption strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-library-caption small { color: var(--muted); font-size: .73rem; }
.media-assignment-form { padding: 12px 14px 16px; border-top: 1px solid var(--line); }
.media-assignment-form > strong { display: block; margin-bottom: 8px; font-size: .83rem; }
.media-assignment-form .button-secondary { margin-top: 10px; }
.section-checkbox-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; }
.section-checkbox-list label { display: flex; align-items: flex-start; gap: 7px; color: var(--muted); font-size: .8rem; }
.section-checkbox-list input { flex: 0 0 auto; margin-top: 4px; }
.upload-card { margin-bottom: 22px; }
.upload-card fieldset { margin: 15px 0; padding: 13px; border: 1px solid var(--line); border-radius: 8px; }
.upload-card legend { padding: 0 5px; color: var(--muted); font-size: .82rem; font-weight: 750; }
.admin-table-wrap { width: 100%; overflow-x: auto; border-radius: 10px; }
.blog-admin-table { width: 100%; border-collapse: collapse; background: var(--surface); font-size: .9rem; }
.blog-admin-table th, .blog-admin-table td { padding: 12px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.blog-admin-table th { background: var(--surface-soft); color: var(--muted); font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; }
.blog-admin-table td { color: var(--text); }
.admin-table-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.admin-table-actions form { display: inline; }
.analytics-total { display: flex; flex-direction: column; gap: 5px; margin: 0 0 16px; padding: 25px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.analytics-total span { color: var(--muted); font-size: .85rem; }
.analytics-total strong { font-size: clamp(2.2rem, 6vw, 3.6rem); line-height: 1; letter-spacing: -.06em; }
.analytics-columns { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; margin-bottom: 18px; }
.analytics-columns .form-card { padding: 18px; }
.blog-admin-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.blog-editor-form { display: flex; flex-direction: column; gap: 17px; }
.blog-editor-field { display: flex; flex-direction: column; gap: 8px; }
.blog-editor-field > label { color: var(--muted); font-weight: 750; }
.blog-editor-field input, .blog-editor-field textarea { width: 100%; min-height: 42px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--text); }
.blog-editor-toolbar { display: flex; flex-wrap: wrap; gap: 5px; padding: 8px; border: 1px solid var(--line); border-radius: 10px 10px 0 0; background: var(--surface-soft); }
.blog-editor-button, .blog-save-button { display: inline-flex; align-items: center; width: fit-content; padding: 8px 11px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); color: var(--text); font-size: .83rem; font-weight: 750; cursor: pointer; }
.blog-editor-button:hover, .blog-save-button:hover { border-color: var(--accent); color: var(--accent); }
.blog-editor-content { min-height: 340px; padding: 16px; border: 1px solid var(--line); border-radius: 0 0 10px 10px; background: var(--bg); color: var(--text); line-height: 1.75; overflow-wrap: anywhere; }
.blog-editor-content:focus { outline: 2px solid var(--accent); outline-offset: -2px; }
.blog-editor-content img { max-width: 100%; height: auto; border-radius: 8px; }
.blog-image-upload { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.blog-image-upload label { margin: 0; }
.blog-image-upload input { max-width: 280px; padding: 4px; }
.blog-published { display: flex; align-items: center; gap: 9px; color: var(--text); }
.blog-editor-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }

@media (max-width: 900px) {
    .section-admin-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .media-choice-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .media-library-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 620px) {
    .blog-list, .section-admin-grid, .media-library-grid, .analytics-columns, .form-two-columns, .color-controls { grid-template-columns: minmax(0,1fr); }
    .blog-page, .article-page, .blog-admin-page, .blog-editor-page, .admin-page { padding-top: 6px; }
    .blog-card { padding: 18px; }
    .media-choice-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .media-library-card > img { height: 160px; }
    .rich-image-tools { align-items: stretch; }
    .rich-image-tools input[type="file"] { width: 100%; max-width: none; }
    .blog-admin-table th, .blog-admin-table td { padding: 8px; }
    .admin-table-actions { min-width: 130px; }
}
.language-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 20px; }
.language-filter label { color: var(--muted); font-size: .86rem; font-weight: 750; }
.language-filter select { min-height: 41px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text); }
.translation-list { display: grid; gap: 14px; }
.translation-card { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 18px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.translation-source span, .translation-card form > label { color: var(--accent); font-size: .73rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.translation-source p { margin-bottom: 0; overflow-wrap: anywhere; color: var(--muted); }
.translation-card textarea { width: 100%; margin-top: 8px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--text); resize: vertical; }
.translation-meta { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.translation-meta small { color: var(--muted); }
@media (max-width: 700px) { .translation-card { grid-template-columns: minmax(0,1fr); } }
