/*
 * Technical Adda admin skin: tokens, type, meta boxes, ACF, tab rail,
 * page sections navigator, login, responsive.
 *
 * Loaded after ACF (priority 25, ACF handles as deps) so equal-specificity selectors win by load order.
 * Where ACF's own selectors are more specific, ours match their specificity (noted inline).
 * !important only in the documented ACF sidebar gutter reset (≤782px).
 */

/* ---------------------------------------------------------------- Tokens (§2) */
:root {
	--dd-ink: #0B1020;
	--dd-ink-2: #141A2E;
	--dd-blue: #7C3AED;
	--dd-blue-dark: #6D28D9;
	--dd-blue-darker: #8C0F15;
	--dd-blue-200: #F5A9AD;
	--dd-tint: #F5F3FF;
	--dd-paper: #F7F8FC;
	--dd-rule: #E6E6E6;
	--dd-text: #0B1020;
	--dd-muted: #4B4B4B;
	--dd-leaf: #7C3AED;

	/* Slate neutrals */
	--dd-slate-50: #FAFAFA;
	--dd-rail: #F3F3F3;
	--dd-hover: #EFEFEF;
	--dd-slate-300: #D4D4D4;
	--dd-slate-400: #9A9A9A;
	--dd-on-ink: #F7F8FC;

	--dd-sans: 'Proxima Nova', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--dd-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

	--dd-radius: 6px;
	--dd-radius-lg: 8px;
	--dd-accent: 3px;
	--dd-shadow: 0 1px 2px rgba(11, 22, 51, 0.06);
	--dd-shadow-drag: 0 4px 12px rgba(11, 22, 51, 0.12);
	--dd-shadow-login: 0 2px 8px rgba(11, 22, 51, 0.07);
}

/* ---------------------------------------------------------------- Fonts (§2.3) */
@font-face {
	font-family: 'Proxima Nova';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../assets/fonts/proxima-nova-400.woff2') format('woff2');
}

@font-face {
	font-family: 'Proxima Nova';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../assets/fonts/proxima-nova-600.woff2') format('woff2');
}

body.wp-admin,
body.login {
	font-family: var(--dd-sans);
	font-size: 15px;
	color: var(--dd-text);
}

body.wp-admin {
	background: var(--dd-paper);
}

/* No focus ring on mouse click anywhere in the admin: core draws a:focus { box-shadow } on every
   link, which shows as a border after clicking a lead, post or page title. Keyboard focus keeps
   the ring through :focus-visible below. */
.wp-admin :where(a, button, .button, .row-title, [tabindex]):focus:not(:focus-visible) {
	box-shadow: none;
	outline: none;
}

/* Visible focus on every control (scoped away from Gutenberg's own UI); white on ink surfaces. */
:is(.wp-admin .wrap, .wp-admin .postbox, .login) :where(a:not(.button), button:not(.button), [tabindex]):focus-visible {
	outline: 2px solid var(--dd-blue);
	outline-offset: 1px;
}

/* ---------------------------------------------------------------- Type scale (§2.3) */
.wrap > h1,
.wrap > .wp-heading-inline {
	font-size: 28px;
	line-height: 1.15;
	font-weight: 600;
	letter-spacing: -0.015em;
	color: var(--dd-ink);
}

/* ---------------------------------------------------------------- Meta boxes */
.postbox {
	border: 1px solid var(--dd-rule);
	border-radius: var(--dd-radius);
	box-shadow: var(--dd-shadow);
}

.postbox > .postbox-header {
	background: var(--dd-ink);
	border-bottom: 0;
	border-radius: calc(var(--dd-radius) - 1px) calc(var(--dd-radius) - 1px) 0 0;
}

.postbox.closed > .postbox-header {
	border-radius: calc(var(--dd-radius) - 1px);
}

/* #poststuff variant matches the block editor's `.edit-post-meta-boxes-area #poststuff h2.hndle`. */
.postbox > .postbox-header .hndle,
#poststuff .postbox > .postbox-header h2.hndle {
	padding: 12px 14px;
	color: #fff;
	font-size: 13px;
	line-height: 22px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.acf-postbox > .postbox-header .hndle,
#poststuff .acf-postbox > .postbox-header h2.hndle {
	padding-left: 24px;
}

.postbox > .postbox-header .handle-actions button,
.postbox > .postbox-header .order-higher-indicator::before,
.postbox > .postbox-header .order-lower-indicator::before,
.postbox > .postbox-header .toggle-indicator::before,
.postbox > .postbox-header .acf-hndle-cog {
	color: var(--dd-slate-300);
}

.postbox > .postbox-header .handle-actions button:hover .order-higher-indicator::before,
.postbox > .postbox-header .handle-actions button:hover .order-lower-indicator::before,
.postbox > .postbox-header .handle-actions button:hover .toggle-indicator::before,
.postbox > .postbox-header .acf-hndle-cog:hover {
	color: #fff;
}

.postbox > .postbox-header .handle-actions button:focus,
.postbox > .postbox-header .acf-hndle-cog:focus {
	box-shadow: none;
	outline: 2px solid #fff;
	outline-offset: -2px;
}

#dashboard-widgets .postbox .inside {
	padding: 16px 24px;
	margin: 0;
}

/* ---------------------------------------------------------------- ACF fields */
.acf-fields > .acf-field {
	padding: 16px 24px;
	border-top-color: var(--dd-rule);
}

/* Nested rows (repeater, group, clone): tighter so nesting doesn't stack padding. */
.acf-input .acf-fields > .acf-field {
	padding: 12px 16px;
}

.acf-field .acf-label {
	margin: 0 0 8px;
}

.acf-field .acf-label label {
	margin: 0 0 4px;
	color: var(--dd-ink);
	font-size: 15px;
	line-height: 22px;
	font-weight: 600;
}

.acf-field p.description {
	margin-top: 4px;
	max-width: 68ch;
	color: var(--dd-muted);
	font-size: 14px;
	line-height: 22px;
	font-style: normal;
}

.acf-required {
	color: var(--dd-blue);
}

.acf-field :is(input[type='text'], input[type='email'], input[type='url'], input[type='number'], input[type='password'], input[type='search'], input[type='tel'], textarea, select) {
	border: 1px solid var(--dd-slate-300);
	border-radius: var(--dd-radius);
	color: var(--dd-text);
	font-size: 15px;
}

.acf-field-number input[type='number'] {
	font-family: var(--dd-mono);
	font-variant-numeric: tabular-nums;
}

/* Prepend/append ($, %, …): one joined field, add-on the same height as the input. */
.acf-field .acf-input:has(> .acf-input-prepend, > .acf-input-append) {
	display: flex;
	align-items: stretch;
}
.acf-field :is(.acf-input-prepend, .acf-input-append) {
	display: flex;
	align-items: center;
	float: none;
	min-height: 0;
	padding: 0 12px;
	border: 1px solid var(--dd-slate-300);
	background: var(--dd-slate-50, #F7F8FC);
	color: var(--dd-text);
	font-family: var(--dd-mono);
	font-size: 15px;
	line-height: 1;
}
.acf-field .acf-input-prepend {
	border-right: 0;
	border-radius: var(--dd-radius) 0 0 var(--dd-radius);
}
.acf-field .acf-input-append {
	order: 2;
	border-left: 0;
	border-radius: 0 var(--dd-radius) var(--dd-radius) 0;
}
.acf-field .acf-input-wrap:has(+ .acf-input-append),
.acf-field .acf-input-prepend + .acf-input-wrap {
	flex: 1;
	min-width: 0;
}
.acf-field input.acf-is-prepended {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.acf-field input.acf-is-appended {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

/* true_false: brand red when on. */
.acf-switch {
	border-color: var(--dd-slate-300);
	border-radius: var(--dd-radius);
}

.acf-switch.-on,
.acf-switch.-on:hover {
	background: var(--dd-leaf);
	border-color: var(--dd-leaf);
}

.acf-switch.-on .acf-switch-slider {
	border-color: var(--dd-leaf);
}

.acf-switch.-on .acf-switch-on {
	color: var(--dd-text);
	text-shadow: none;
}

/* Message field */
.acf-field-message > .acf-input {
	padding: 12px 14px;
	background: var(--dd-tint);
	border-left: var(--dd-accent) solid var(--dd-blue);
	border-radius: 0 var(--dd-radius) var(--dd-radius) 0;
	color: var(--dd-text);
	font-size: 14px;
	line-height: 1.55;
}

.acf-field-message > .acf-input > :first-child {
	margin-top: 0;
}

.acf-field-message > .acf-input > :last-child {
	margin-bottom: 0;
}

/* Repeater tables */
.acf-table {
	border-color: var(--dd-rule);
	border-radius: var(--dd-radius);
}

.acf-table > thead > tr > th,
.acf-table > tbody > tr > td,
.acf-table > tbody > tr > th {
	border-color: var(--dd-rule);
}

.acf-table > thead > tr > th {
	background: var(--dd-slate-50);
	color: var(--dd-ink);
	font-size: 14px;
	font-weight: 600;
}

.acf-repeater .acf-row-handle.order {
	background: var(--dd-slate-50);
	color: var(--dd-muted);
	text-shadow: none;
}

.acf-repeater .acf-row-handle.order + td {
	border-left-color: var(--dd-rule);
}

/* Link field */
.acf-link .link-wrap {
	border-color: var(--dd-rule);
	border-radius: var(--dd-radius);
}

.acf-link .link-wrap .link-title {
	color: var(--dd-ink);
	font-weight: 600;
}

.acf-link .link-wrap .link-url {
	font-family: var(--dd-mono);
	font-size: 13px;
	word-break: break-all;
}

/* ---------------------------------------------------------------- Left tab rail (§6.2) */
/* `.-left` variants match ACF's label-placement-left selectors. */
.acf-fields.-sidebar::before,
.acf-fields.-sidebar.-left::before {
	background: var(--dd-rail);
	border-right: 1px solid var(--dd-rule);
}

.acf-tab-wrap.-left .acf-tab-group {
	border: 0;
	background: transparent;
	padding: 0;
}

/* Matches ACF's `.acf-fields > .acf-tab-wrap .acf-tab-group li a`. */
.acf-fields > .acf-tab-wrap.-left .acf-tab-group li a {
	margin: 0;
	padding: 12px 24px 12px 21px;
	border: 0;
	border-left: var(--dd-accent) solid transparent;
	border-radius: 0;
	background: transparent;
	color: var(--dd-muted);
	font-size: 15px;
	line-height: 22px;
	font-weight: 400;
}

.acf-fields > .acf-tab-wrap.-left .acf-tab-group li a:hover {
	background: var(--dd-hover);
	color: var(--dd-ink);
}

.acf-fields > .acf-tab-wrap.-left .acf-tab-group li.active a {
	margin-right: -1px;
	background: #fff;
	border-left-color: var(--dd-blue);
	color: var(--dd-blue);
	font-weight: 600;
}

/* Top-placed tabs */
.acf-fields > .acf-tab-wrap:not(.-left) {
	background: #fff;
	border-bottom: 1px solid var(--dd-rule);
}

.acf-fields > .acf-tab-wrap:not(.-left) .acf-tab-group {
	border: 0;
	padding: 0 24px;
}

.acf-fields > .acf-tab-wrap:not(.-left) .acf-tab-group li a {
	padding: 12px 16px;
	border: 0;
	background: transparent;
	color: var(--dd-muted);
	font-size: 15px;
	line-height: 22px;
	font-weight: 400;
}

.acf-fields > .acf-tab-wrap:not(.-left) .acf-tab-group li.active a {
	background: transparent;
	box-shadow: inset 0 -2px 0 var(--dd-blue);
	color: var(--dd-blue);
	font-weight: 600;
}

/* ---------------------------------------------------------------- Page sections box (§5.4) */
#acf-group_dd_page_sections > .postbox-header {
	background: #fff;
}

#acf-group_dd_page_sections > .postbox-header .hndle,
#poststuff #acf-group_dd_page_sections > .postbox-header h2.hndle {
	display: flex;
	justify-content: flex-start;
	gap: 12px;
	color: var(--dd-ink);
	font-size: 17px;
	line-height: 26px;
	text-transform: none;
	letter-spacing: 0;
}

#acf-group_dd_page_sections > .postbox-header .hndle::before {
	content: '';
	flex: none;
	width: 20px;
	height: 20px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z'/%3E%3Cpath d='m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65'/%3E%3Cpath d='m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z'/%3E%3Cpath d='m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65'/%3E%3Cpath d='m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65'/%3E%3C/svg%3E") center / contain no-repeat;
}

#acf-group_dd_page_sections > .postbox-header .acf-hndle-cog {
	margin-left: auto;
}

#acf-group_dd_page_sections > .postbox-header .acf-hndle-cog,
#acf-group_dd_page_sections > .postbox-header .order-higher-indicator::before,
#acf-group_dd_page_sections > .postbox-header .order-lower-indicator::before,
#acf-group_dd_page_sections > .postbox-header .toggle-indicator::before {
	color: var(--dd-muted);
}

#acf-group_dd_page_sections > .postbox-header .handle-actions button:hover .order-higher-indicator::before,
#acf-group_dd_page_sections > .postbox-header .handle-actions button:hover .order-lower-indicator::before,
#acf-group_dd_page_sections > .postbox-header .handle-actions button:hover .toggle-indicator::before,
#acf-group_dd_page_sections > .postbox-header .acf-hndle-cog:hover {
	color: var(--dd-ink);
}

#acf-group_dd_page_sections > .postbox-header .handle-actions button:focus,
#acf-group_dd_page_sections > .postbox-header .acf-hndle-cog:focus {
	outline-color: var(--dd-blue);
}

#acf-group_dd_page_sections > .inside {
	padding: 0;
}

#acf-group_dd_page_sections .acf-fields > .acf-field-flexible-content[data-name='sections'] {
	padding: 0 16px 16px;
	border: 0;
}

#acf-group_dd_page_sections .acf-field-flexible-content[data-name='sections'] > .acf-label {
	margin: 0;
}

/* Visually hidden, still read by screen readers. */
#acf-group_dd_page_sections .acf-field-flexible-content[data-name='sections'] > .acf-label > label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

#acf-group_dd_page_sections .acf-field-flexible-content[data-name='sections'] > .acf-label > p.description {
	margin: 0 0 16px;
	font-size: 15px;
}

/* ---------------------------------------------------------------- Navigator grid (§5.5) */
.acf-flexible-content.dd-sections-editor {
	display: grid;
	grid-template-columns: minmax(200px, 25%) minmax(0, 1fr);
	grid-template-rows: auto 1fr;
	column-gap: 16px;
	align-items: start;
}

.dd-sections-editor > .dd-sec-nav {
	grid-column: 1;
	grid-row: 1;
	padding: 4px 0;
	background: var(--dd-paper);
	border-radius: var(--dd-radius-lg);
}

.dd-sections-editor.-empty > .dd-sec-nav {
	display: none;
}

.dd-sections-editor > .acf-actions:not(.acf-fc-top-actions) {
	grid-column: 1;
	grid-row: 2;
	margin: 0;
	padding: 12px 0 0;
}

.dd-sections-editor > .acf-actions:not(.acf-fc-top-actions) .acf-button {
	display: flex;
	justify-content: center;
	width: 100%;
}

.dd-sections-editor > .values,
.dd-sections-editor > .no-value-message {
	grid-column: 2;
	grid-row: 1 / span 2;
	margin: 0;
}

.acf-flexible-content.dd-sections-editor > .acf-actions.acf-fc-top-actions {
	display: none;
}

.acf-flexible-content.dd-sections-editor > .no-value-message {
	padding: 24px;
	background: var(--dd-paper);
	border: 0;
	border-radius: var(--dd-radius-lg);
	color: var(--dd-muted);
}

/* ---------------------------------------------------------------- Nav items (§5.6) */
.dd-sec-nav__item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 12px 16px 12px 13px;
	border: 0;
	border-left: var(--dd-accent) solid transparent;
	background: transparent;
	color: var(--dd-ink);
	font: inherit;
	text-align: left;
	cursor: pointer;
}

.dd-sec-nav__item:hover {
	background: var(--dd-hover);
}

.dd-sec-nav__item[aria-current='true'] {
	background: var(--dd-tint);
	border-left-color: var(--dd-blue);
	color: var(--dd-blue);
}

.dd-sec-nav .dd-sec-nav__item:focus-visible {
	outline: 2px solid var(--dd-blue);
	outline-offset: -2px;
}

.dd-sec-nav__num {
	flex: none;
	box-sizing: border-box;
	min-width: 28px;
	padding: 0 4px;
	background: #fff;
	border-radius: 4px;
	color: var(--dd-ink);
	font-size: 14px;
	line-height: 22px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	text-align: center;
}

.dd-sec-nav__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
}

.dd-sec-nav__item.is-disabled .dd-sec-nav__body {
	opacity: 0.55;
}

.dd-sec-nav__label {
	font-size: 15px;
	line-height: 22px;
	font-weight: 600;
}

.dd-sec-nav__sub {
	overflow: hidden;
	color: var(--dd-muted);
	font-size: 15px;
	line-height: 22px;
	font-weight: 400;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.dd-sec-nav__sub:empty {
	display: none;
}

.dd-sec-nav__grip {
	display: flex;
	flex: none;
	padding: 4px;
	color: var(--dd-slate-400);
	cursor: grab;
}

.dd-sec-nav__item:hover .dd-sec-nav__grip {
	color: var(--dd-muted);
}

.dd-sec-nav__grip svg {
	display: block;
	width: 10px;
	height: 16px;
}

.dd-sec-nav__item.ui-sortable-helper {
	background: #fff;
	box-shadow: var(--dd-shadow-drag);
	cursor: grabbing;
}

.dd-sec-nav__placeholder {
	background: var(--dd-rule);
}

/* ---------------------------------------------------------------- Workspace (§5.7) */
.dd-sections-editor > .values > .layout {
	margin: 0;
	border: 0;
	background: transparent;
}

/* Only the selected section shows. Every row stays in the DOM and is saved. */
.dd-sections-editor > .values > .layout:not(.is-current) {
	display: none;
}

/*
 * Title bar. `body` + 5 classes matches ACF's
 * `body:not(.block-editor-page) .acf-flexible-content .layout.active-layout > .acf-fc-layout-actions-wrap`.
 */
body .acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap,
body .acf-flexible-content.dd-sections-editor > .values > .layout.active-layout > .acf-fc-layout-actions-wrap {
	display: flex;
	min-height: 0;
	padding: 0 16px 0 0;
	background: var(--dd-ink);
	border: 0;
	border-radius: var(--dd-radius-lg);
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap > .acf-fc-layout-handle {
	padding: 12px 24px;
	color: #fff;
	font-size: 16px;
	line-height: 24px;
	font-weight: 600;
	cursor: default;
	pointer-events: none;
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-fc-layout-order,
.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-fc-layout-draggable-icon,
.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-fc-layout-original-title,
.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap [data-name='add-layout'],
.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-layout-collapse {
	display: none;
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-layout-disabled {
	background: var(--dd-ink-2);
	color: var(--dd-on-ink);
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-layout-disabled::before {
	background: var(--dd-on-ink);
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap > .acf-fc-layout-controls {
	gap: 8px;
}

/* 7 classes: ACF styles these icons with 6 (`.acf-fc-layout-controls .acf-icon.-trash-alt`). */
.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-fc-layout-controls .acf-icon {
	visibility: visible;
	width: 20px;
	height: 20px;
	background: var(--dd-slate-300);
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-fc-layout-controls a:hover .acf-icon {
	background: #fff;
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap .acf-fc-layout-controls :is(a, button):focus-visible {
	box-shadow: none;
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.dd-sec-move {
	width: 24px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--dd-slate-300);
	font: inherit;
	font-size: 16px;
	line-height: 24px;
	cursor: pointer;
}

.dd-sec-move:hover {
	color: #fff;
}

.dd-sec-move.is-off {
	display: none;
}

/* Fields area. Same specificity note as the title bar. */
body .acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fields,
body .acf-flexible-content.dd-sections-editor > .values > .layout.active-layout > .acf-fields {
	margin-top: 8px;
	background: #fff;
	border: 0;
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fields > .acf-field {
	padding: 16px 24px;
}

.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fields.-sidebar::before {
	background: var(--dd-paper);
}

/* ---------------------------------------------------------------- Login (§8) */
body.login {
	background: var(--dd-paper);
}

.login form {
	border: 1px solid var(--dd-rule);
	border-radius: var(--dd-radius);
	box-shadow: var(--dd-shadow-login);
}

.login label {
	color: var(--dd-ink);
	font-weight: 600;
}

.login #nav a,
.login #backtoblog a {
	color: var(--dd-muted);
}

.login #nav a:hover,
.login #backtoblog a:hover {
	color: var(--dd-blue);
}

.login .message,
.login .success {
	border-left-color: var(--dd-blue);
}

.login.dd-has-logo h1 a {
	width: 100%;
	max-width: 260px;
	height: 64px;
	background-image: var(--dd-login-logo);
	background-position: center;
	background-size: contain;
}

/* ---------------------------------------------------------------- Responsive (§9) */
@media screen and (max-width: 782px) {
	.acf-fields > .acf-field,
	.acf-input .acf-fields > .acf-field,
	.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fields > .acf-field,
	.acf-flexible-content.dd-sections-editor > .values > .layout > .acf-fc-layout-actions-wrap > .acf-fc-layout-handle {
		padding: 12px 16px;
	}

	.postbox > .postbox-header .hndle,
	#poststuff .postbox > .postbox-header h2.hndle,
	.acf-postbox > .postbox-header .hndle,
	#poststuff .acf-postbox > .postbox-header h2.hndle {
		padding-left: 16px;
	}

	/* Navigator stacks: nav, Add button, fields. */
	.acf-flexible-content.dd-sections-editor {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: auto;
		row-gap: 12px;
	}

	.dd-sections-editor > .dd-sec-nav,
	.dd-sections-editor > .acf-actions:not(.acf-fc-top-actions),
	.dd-sections-editor > .values,
	.dd-sections-editor > .no-value-message {
		grid-column: 1;
		grid-row: auto;
	}

	.dd-sections-editor > .acf-actions:not(.acf-fc-top-actions) {
		order: 1;
		padding-top: 0;
	}

	.dd-sections-editor > .values,
	.dd-sections-editor > .no-value-message {
		order: 2;
	}

	/* Tab rail becomes a wrapping strip. Documented !important: ACF sets the gutter with !important. */
	.acf-fields.-sidebar,
	.acf-fields.-sidebar.-left {
		padding-left: 0 !important;
	}

	.acf-fields.-sidebar::before,
	.acf-fields.-sidebar.-left::before {
		display: none;
	}

	.acf-fields.-sidebar > .acf-tab-wrap.-left .acf-tab-group,
	.acf-fields.-sidebar.-left > .acf-tab-wrap.-left .acf-tab-group {
		position: static;
		display: flex;
		flex-wrap: wrap;
		width: auto;
		margin: 0;
		border-bottom: 1px solid var(--dd-rule);
	}

	.acf-fields > .acf-tab-wrap.-left .acf-tab-group li a {
		margin: 0;
		padding: 12px 16px;
		border-left: 0;
		border-bottom: var(--dd-accent) solid transparent;
	}

	.acf-fields > .acf-tab-wrap.-left .acf-tab-group li.active a {
		margin-right: 0;
		border-bottom-color: var(--dd-blue);
	}
}

/* ACF sets fractional widths inline with no breakpoints; collapse them so fields stay usable.
   Documented !important: overrides the inline style attribute. */
@media screen and (max-width: 1280px) {
	.acf-fields > .acf-field[data-width="12"],
	.acf-fields > .acf-field[data-width="13"],
	.acf-fields > .acf-field[data-width="15"],
	.acf-fields > .acf-field[data-width="17"],
	.acf-fields > .acf-field[data-width="18"],
	.acf-fields > .acf-field[data-width="20"],
	.acf-fields > .acf-field[data-width="24"],
	.acf-fields > .acf-field[data-width="25"],
	.acf-fields > .acf-field[data-width="30"],
	.acf-fields > .acf-field[data-width="33"] {
		width: 50% !important;
	}

}

@media screen and (max-width: 782px) {
	.acf-fields > .acf-field[data-width] {
		width: 100% !important;
		float: none;
		clear: both;
	}
}

/* ---------------------------------------------------------------- Motion (§9) */
@media (prefers-reduced-motion: reduce) {
	.wp-admin *,
	.wp-admin *::before,
	.wp-admin *::after,
	.login *,
	.login *::before,
	.login *::after {
		animation-duration: 0.01ms;
		animation-iteration-count: 1;
		transition-duration: 0.01ms;
		scroll-behavior: auto;
	}
}

/* ---------------------------------------------------------------- Theme Settings page
   Grouped sidebar, fields in cards (dd_card() accordions), tracking checklist, sticky save bar.
   Everything is scoped to the options page body class. */
.toplevel_page_dd-theme-settings #wpbody-content {
	padding-bottom: 96px;
}

.toplevel_page_dd-theme-settings #acf-group_dd_theme_settings {
	border-radius: 12px;
	overflow: hidden;
}

.toplevel_page_dd-theme-settings #acf-group_dd_theme_settings > .postbox-header {
	display: none;
}

.toplevel_page_dd-theme-settings #acf-group_dd_theme_settings > .acf-fields {
	min-height: 640px;
	background: var(--dd-paper);
}

/* Sidebar: group headings + icons. Labels live here because ACF tab buttons carry only a key. */
.toplevel_page_dd-theme-settings .acf-tab-wrap.-left .acf-tab-group {
	padding: 12px 0 24px;
}

.toplevel_page_dd-theme-settings .acf-tab-group li:has(> a[data-key="field_dd_tab_branding"])::before,
.toplevel_page_dd-theme-settings .acf-tab-group li:has(> a[data-key="field_dd_tab_whatsapp"])::before,
.toplevel_page_dd-theme-settings .acf-tab-group li:has(> a[data-key="field_dd_tab_admin_menu"])::before {
	display: block;
	padding: 18px 24px 8px;
	color: var(--dd-slate-400);
	font-size: 11px;
	line-height: 16px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.toplevel_page_dd-theme-settings .acf-tab-group li:has(> a[data-key="field_dd_tab_branding"])::before { content: "Site"; }
.toplevel_page_dd-theme-settings .acf-tab-group li:has(> a[data-key="field_dd_tab_whatsapp"])::before { content: "Contact"; }
.toplevel_page_dd-theme-settings .acf-tab-group li:has(> a[data-key="field_dd_tab_admin_menu"])::before { content: "Tools"; }

.toplevel_page_dd-theme-settings .acf-fields > .acf-tab-wrap.-left .acf-tab-group li a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 24px 9px 21px;
}

.toplevel_page_dd-theme-settings .acf-tab-group li a::before {
	font: 400 18px/1 dashicons;
	color: var(--dd-slate-400);
}

.toplevel_page_dd-theme-settings .acf-tab-group li.active a::before,
.toplevel_page_dd-theme-settings .acf-tab-group li a:hover::before {
	color: inherit;
}

.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_branding"]::before { content: "\f309"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_fonts"]::before { content: "\f215"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_header"]::before { content: "\f333"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_footer"]::before { content: "\f103"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_articles"]::before { content: "\f119"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_ads"]::before { content: "\f488"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_about"]::before { content: "\f110"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_whatsapp"]::before { content: "\f19a"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_form"]::before { content: "\f175"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_email"]::before { content: "\f465"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_admin_menu"]::before { content: "\f108"; }
.toplevel_page_dd-theme-settings a[data-key="field_dd_tab_speed"]::before { content: "\f311"; }

/* Sidebar colours: a true-black band like the site's header and footer, red marks the open screen. */
.toplevel_page_dd-theme-settings #acf-group_dd_theme_settings > .acf-fields.-sidebar::before {
	border-right: 0;
	background: var(--dd-ink);
}

.toplevel_page_dd-theme-settings .acf-fields > .acf-tab-wrap.-left .acf-tab-group li a {
	color: var(--dd-slate-300);
}

.toplevel_page_dd-theme-settings .acf-fields > .acf-tab-wrap.-left .acf-tab-group li a:hover {
	background: var(--dd-ink-2);
	color: #fff;
}

.toplevel_page_dd-theme-settings .acf-fields > .acf-tab-wrap.-left .acf-tab-group li.active a {
	margin-right: 0;
	border-left-color: var(--dd-blue);
	background: var(--dd-ink-2);
	color: #fff;
}

.toplevel_page_dd-theme-settings .acf-tab-group li.active a::before {
	color: var(--dd-blue);
}

.toplevel_page_dd-theme-settings .acf-fields > .acf-tab-wrap.-left .acf-tab-group li a:focus {
	outline: 0;
	box-shadow: none;
}

.toplevel_page_dd-theme-settings .acf-fields > .acf-tab-wrap.-left .acf-tab-group li a:focus-visible {
	box-shadow: inset 0 0 0 2px #fff;
}

/* Cards */
.toplevel_page_dd-theme-settings .acf-field.dd-card {
	margin: 20px 24px 0;
	padding: 0;
	border: 1px solid var(--dd-rule);
	border-radius: 12px;
	background: #fff;
	box-shadow: var(--dd-shadow);
	overflow: hidden;
}

.toplevel_page_dd-theme-settings .acf-field.dd-card:last-of-type,
.toplevel_page_dd-theme-settings .acf-field.dd-card:has(+ .acf-field-accordion:not(.dd-card)) {
	margin-bottom: 24px;
}

.toplevel_page_dd-theme-settings .acf-fields > .acf-field.dd-card > .acf-accordion-title {
	margin: 0;
	padding: 16px 20px;
	border-bottom: 1px solid var(--dd-rule);
	background: #fff;
}

.toplevel_page_dd-theme-settings .dd-card:not(.-open) > .acf-accordion-title {
	border-bottom: 0;
}

.toplevel_page_dd-theme-settings .dd-card > .acf-accordion-title label {
	font-size: 16px;
	line-height: 24px;
	font-weight: 600;
	color: var(--dd-ink);
}

.toplevel_page_dd-theme-settings .dd-card > .acf-accordion-title p.description {
	margin: 2px 0 0;
	color: var(--dd-muted);
	font-size: 13px;
	line-height: 20px;
}

/* Branding previews: white logo on navy so it is readable; square icons at icon size. */
.toplevel_page_dd-theme-settings .acf-field-dd-logo-white .image-wrap,
.toplevel_page_dd-theme-settings .acf-field-dd-logo-white .image-wrap img {
	background: var(--dd-ink, #0b1020);
}

.toplevel_page_dd-theme-settings :is(.acf-field-dd-logo-mark, .acf-field-dd-favicon) .image-wrap img {
	max-width: 96px;
	max-height: 96px;
}

/* The title's bottom border is the only divider: no gap, no second line from the field grid. */
.toplevel_page_dd-theme-settings .dd-card > .acf-accordion-content > .acf-fields {
	border-top: 0;
}

.toplevel_page_dd-theme-settings .dd-card > .acf-accordion-content > .acf-fields > .acf-field {
	padding: 16px 20px;
	border-top-color: var(--dd-slate-50);
}

.toplevel_page_dd-theme-settings .dd-card > .acf-accordion-content > .acf-fields > .acf-field:first-child {
	border-top: 0;
}

/* Notes and action buttons inside a card: plain, not the red call-out. */
.toplevel_page_dd-theme-settings .dd-card .acf-field-message > .acf-input {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.toplevel_page_dd-theme-settings .dd-card .acf-field-message > .acf-input .button {
	margin-right: 8px;
}

/* Tracking checklist */
.toplevel_page_dd-theme-settings .acf-field.dd-status {
	margin: 20px 24px 0;
	padding: 0;
	border: 1px solid var(--dd-rule);
	border-radius: 12px;
	background: #fff;
	box-shadow: var(--dd-shadow);
}

.toplevel_page_dd-theme-settings .dd-status > .acf-label,
.toplevel_page_dd-theme-settings .dd-plain > .acf-label {
	display: none;
}

.toplevel_page_dd-theme-settings .dd-status > .acf-input,
.toplevel_page_dd-theme-settings .dd-plain > .acf-input {
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.dd-checklist {
	margin: 0;
}

.dd-checklist li {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 12px 20px;
	border-top: 1px solid var(--dd-slate-50);
}

.dd-checklist li:first-child {
	border-top: 0;
}

.dd-checklist li::before {
	flex: none;
	font: 400 20px/1 dashicons;
	content: "\f159";
	color: var(--dd-slate-300);
}

.dd-checklist li.is-on::before {
	content: "\f12a";
	color: var(--dd-blue);
}

.dd-checklist__name {
	font-weight: 600;
	color: var(--dd-ink);
}

.dd-checklist__detail {
	flex: 1;
	color: var(--dd-muted);
	font-family: var(--dd-mono);
	font-size: 12px;
}

.dd-checklist__chip {
	flex: none;
	padding: 2px 10px;
	border-radius: 999px;
	background: var(--dd-hover);
	color: var(--dd-muted);
	font-size: 12px;
	line-height: 20px;
	font-weight: 600;
}

.dd-checklist li.is-on .dd-checklist__chip {
	background: var(--dd-ink);
	color: #fff;
}

.dd-checklist__note {
	margin: 0;
	padding: 12px 20px;
	border-top: 1px solid var(--dd-rule);
	border-radius: 0 0 12px 12px;
	background: var(--dd-slate-50);
	color: var(--dd-muted);
	font-size: 13px;
}

.dd-events {
	margin: 0 0 12px;
}

.dd-events li {
	display: grid;
	grid-template-columns: 180px 1fr;
	gap: 12px;
	margin: 0;
	padding: 7px 0;
	border-top: 1px solid var(--dd-slate-50);
	font-size: 13px;
	line-height: 20px;
}

.dd-events li:first-child {
	border-top: 0;
}

.dd-events code {
	justify-self: start;
	padding: 0 6px;
	border-radius: 4px;
	background: var(--dd-hover);
	font-family: var(--dd-mono);
	font-size: 12px;
}

/* Save bar: the Publish box becomes a bar pinned to the bottom of the screen. */
.toplevel_page_dd-theme-settings #poststuff #post-body.columns-2 {
	margin-right: 0;
}

.toplevel_page_dd-theme-settings #poststuff #post-body.columns-2 #postbox-container-1 {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 160px;
	z-index: 99;
	float: none;
	width: auto;
	margin: 0;
	padding: 12px 24px;
	border-top: 1px solid var(--dd-rule);
	background: #fff;
	box-shadow: 0 -2px 8px rgba(11, 22, 51, 0.05);
}

.folded .toplevel_page_dd-theme-settings #postbox-container-1,
.toplevel_page_dd-theme-settings.folded #poststuff #post-body.columns-2 #postbox-container-1 {
	left: 36px;
}

.toplevel_page_dd-theme-settings #poststuff #post-body.columns-2 #side-sortables {
	width: auto;
	min-height: 0;
}

.toplevel_page_dd-theme-settings #postbox-container-1 #submitdiv {
	min-width: 0;
	margin: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.toplevel_page_dd-theme-settings #postbox-container-1 #submitdiv > .postbox-header {
	display: none;
}

.toplevel_page_dd-theme-settings #postbox-container-1 #submitdiv > .inside {
	margin: 0;
	padding: 0;
}

.toplevel_page_dd-theme-settings #postbox-container-1 #publishing-action {
	float: none;
}

.toplevel_page_dd-theme-settings #postbox-container-1 #major-publishing-actions {
	display: flex;
	justify-content: flex-end;
	padding: 0;
	border: 0;
	background: transparent;
}

.toplevel_page_dd-theme-settings #postbox-container-1 #publishing-action .button-primary {
	min-width: 160px;
	min-height: 40px;
}

@media (max-width: 960px) {
	.toplevel_page_dd-theme-settings #poststuff #post-body.columns-2 #postbox-container-1 {
		left: 36px;
	}
}

@media (max-width: 782px) {
	.toplevel_page_dd-theme-settings #poststuff #post-body.columns-2 #postbox-container-1 {
		left: 0;
	}

	.toplevel_page_dd-theme-settings .acf-field.dd-card,
	.toplevel_page_dd-theme-settings .acf-field.dd-status {
		margin-right: 12px;
		margin-left: 12px;
	}

	.dd-events li {
		grid-template-columns: 1fr;
		gap: 2px;
	}

	/* Tabs wrap into rows here, so the group headings would break the grid. */
	.toplevel_page_dd-theme-settings .acf-tab-group li:has(> a[data-key])::before {
		display: none;
	}

	.toplevel_page_dd-theme-settings .acf-fields > .acf-tab-wrap.-left {
		background: var(--dd-ink);
	}

	.dd-checklist li {
		flex-wrap: wrap;
		row-gap: 2px;
	}

	.dd-checklist__name {
		flex: 1;
	}

	.dd-checklist__detail {
		order: 3;
		flex-basis: 100%;
		padding-left: 32px;
	}
}

/* Custom code tab: code-editor feel for the pasted snippets. */
.toplevel_page_dd-theme-settings .dd-code textarea {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 13px;
	line-height: 1.5;
	tab-size: 2;
}

/* Theme Settings → Admin: sortable sidebar list (inc/admin-theme.php). */
.dd-menu-list .acf-checkbox-list {
	max-width: 640px;
	margin: 4px 0 0;
	border: 1px solid var(--dd-rule);
	border-radius: 12px;
	background: #fff;
	overflow: hidden;
	counter-reset: dd-mi;
}
.dd-menu-list .acf-checkbox-list li {
	position: relative;
	margin: 0;
	border-bottom: 1px solid var(--dd-rule);
	background: #fff;
	counter-increment: dd-mi;
	transition: background-color .15s ease;
}
.dd-menu-list .acf-checkbox-list li:last-child { border-bottom: 0; }
.dd-menu-list .acf-checkbox-list li:hover { background: var(--dd-slate-50); }
.dd-menu-list .acf-checkbox-list label {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 48px;
	padding: 0 10px 0 16px;
	margin: 0;
	cursor: grab;
	user-select: none;
	font-size: 14px;
	font-weight: 500;
	color: var(--dd-text);
}
/* Grip + position number. */
.dd-menu-list .acf-checkbox-list label::before {
	content: "\f333";
	font: 18px/1 dashicons;
	color: #B5B5B5;
	transition: color .15s ease;
}
.dd-menu-list .acf-checkbox-list li:hover label::before { color: var(--dd-ink); }
.dd-menu-list .acf-checkbox-list label::after {
	content: counter(dd-mi, decimal-leading-zero);
	order: -1;
	width: 18px;
	font-size: 12px;
	font-weight: 500;
	font-variant-numeric: tabular-nums;
	color: #9A9A9A;
}
.dd-menu-list .acf-checkbox-list .dashicons { color: var(--dd-muted); font-size: 18px; width: 18px; height: 18px; }
.dd-menu-list .dd-mi-name { flex: 1; transition: color .15s ease, opacity .15s ease; }

/* Eye toggle: the real checkbox, restyled. Ticked = hidden. */
.dd-menu-list .acf-checkbox-list input[type="checkbox"] {
	appearance: none;
	order: 9;
	width: 34px;
	height: 34px;
	margin: 0;
	border: 0;
	border-radius: 8px;
	background: transparent;
	box-shadow: none;
	cursor: pointer;
	display: grid;
	place-items: center;
	transition: background-color .15s ease, color .15s ease;
	color: var(--dd-muted);
}
.dd-menu-list .acf-checkbox-list input[type="checkbox"]::before,
.dd-menu-list .acf-checkbox-list input[type="checkbox"]:checked::before {
	content: "\f177";
	font: 18px/1 dashicons;
	margin: 0;
	width: auto;
	height: auto;
	float: none;
	color: inherit;
}
.dd-menu-list .acf-checkbox-list input[type="checkbox"]:hover { background: var(--dd-paper); color: var(--dd-ink); }
.dd-menu-list .acf-checkbox-list input[type="checkbox"]:focus-visible { outline: 2px solid var(--dd-blue); outline-offset: 1px; }
.dd-menu-list .acf-checkbox-list input[type="checkbox"]:checked { background: var(--dd-tint); color: var(--dd-blue); }
.dd-menu-list .acf-checkbox-list input[type="checkbox"]:checked::before { content: "\f530"; }

/* Hidden row: muted name + chip. */
.dd-menu-list li:has(input:checked) .dd-mi-name,
.dd-menu-list li:has(input:checked) .dashicons { opacity: .45; }
.dd-menu-list li:has(input:checked) .dd-mi-name::after,
.dd-menu-list li:has(input:disabled) .dd-mi-name::after {
	content: "Hidden";
	margin-left: 10px;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--dd-tint);
	color: var(--dd-blue-dark);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .02em;
	display: inline-block;
	opacity: 1;
}
.dd-menu-list li:has(input:checked) .dd-mi-name { opacity: 1; color: #9A9A9A; }

/* Theme Settings: always shown. */
.dd-menu-list li:has(input:disabled) .dd-mi-name::after { content: "Always shown"; background: var(--dd-paper); color: var(--dd-muted); }
.dd-menu-list .acf-checkbox-list input[type="checkbox"]:disabled { cursor: not-allowed; opacity: .35; background: transparent; }
.dd-menu-list .acf-checkbox-list input[type="checkbox"]:disabled::before { content: "\f160"; }

/* Dragging. */
.dd-menu-list .ui-sortable-helper {
	border: 1px solid var(--dd-rule);
	border-radius: 10px;
	box-shadow: 0 12px 28px rgba(21, 21, 21, .14);
	counter-increment: none;
}
.dd-menu-list .ui-sortable-helper label { cursor: grabbing; }
.dd-menu-list .ui-sortable-helper label::after { visibility: hidden; }
.dd-menu-list .dd-sort-ph {
	visibility: visible !important;
	background: var(--dd-tint);
	border: 1px dashed var(--dd-blue-200);
	margin: 0;
}

/* Classic editor "Text" tab: read the HTML like code. */
.wp-editor-area {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 13px;
	line-height: 1.7;
	tab-size: 2;
	color: #0b1020;
}