/* ==========================================================================
   Editor styles — makes the back end resemble the front end.
   Applies to both the block editor and TinyMCE.
   ========================================================================== */

:root,
.editor-styles-wrapper {
	--atg-paper:       #fbf9f6;
	--atg-surface:     #ffffff;
	--atg-surface-sunk:#f4f0ea;
	--atg-ink:         #1a1613;
	--atg-ink-muted:   #5d554d;
	--atg-ink-faint:   #8b8178;
	--atg-line:        #e6dfd5;
	--atg-line-strong: #d4cabb;
	--atg-accent:      #14524a;
	--atg-highlight:   #b07d38;
	--atg-highlight-soft: #f6efe2;
	--atg-radius:      12px;
	--atg-font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
	--atg-font-body:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.editor-styles-wrapper,
body#tinymce.wp-editor {
	background: var(--atg-paper);
	color: var(--atg-ink);
	font-family: var(--atg-font-body);
	font-size: 17px;
	line-height: 1.75;
	max-width: none;
}

.editor-styles-wrapper .wp-block,
body#tinymce.wp-editor { max-width: 46rem; }

.editor-styles-wrapper h1, .editor-styles-wrapper h2,
.editor-styles-wrapper h3, .editor-styles-wrapper h4,
.editor-styles-wrapper h5, .editor-styles-wrapper h6,
body#tinymce.wp-editor :is(h1, h2, h3, h4, h5, h6) {
	font-family: var(--atg-font-display);
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: -0.015em;
	color: var(--atg-ink);
}

.editor-styles-wrapper h2, body#tinymce.wp-editor h2 { font-size: 1.875rem; }
.editor-styles-wrapper h3, body#tinymce.wp-editor h3 { font-size: 1.375rem; }
.editor-styles-wrapper h4, body#tinymce.wp-editor h4 { font-size: 1.15rem; }

.editor-styles-wrapper a, body#tinymce.wp-editor a {
	color: var(--atg-accent);
	text-underline-offset: 0.18em;
}

.editor-styles-wrapper ul > li::marker,
body#tinymce.wp-editor ul > li::marker { color: var(--atg-highlight); }

.editor-styles-wrapper blockquote,
body#tinymce.wp-editor blockquote {
	border-left: 3px solid var(--atg-highlight);
	background: var(--atg-highlight-soft);
	padding: 1rem 1.5rem;
	border-radius: 0 var(--atg-radius) var(--atg-radius) 0;
	font-style: italic;
	margin-inline: 0;
}

.editor-styles-wrapper table,
body#tinymce.wp-editor table { border-collapse: collapse; width: 100%; background: var(--atg-surface); }

.editor-styles-wrapper :is(th, td),
body#tinymce.wp-editor :is(th, td) {
	border: 1px solid var(--atg-line);
	padding: 0.65rem 0.85rem;
	text-align: left;
}

.editor-styles-wrapper th, body#tinymce.wp-editor th {
	background: var(--atg-surface-sunk);
	font-weight: 600;
}

.editor-styles-wrapper img, body#tinymce.wp-editor img { border-radius: var(--atg-radius); }

.editor-styles-wrapper hr, body#tinymce.wp-editor hr {
	border: 0;
	border-top: 1px solid var(--atg-line);
	margin: 2rem 0;
}

/*
 * Reminder for anyone editing a tour_plan / faqs field: headings become
 * accordion rows on the front end.
 */
.editor-styles-wrapper .atg-editor-note {
	background: var(--atg-highlight-soft);
	border-left: 3px solid var(--atg-highlight);
	padding: 0.75rem 1rem;
	font-size: 0.875rem;
}
