/* ============================================================
   IFAD Admin branding — Site Done
   Self-hosted Nunito Sans + brand navy (#0E0E31) sidebar/toolbar
   + rounded, smooth controls. Loaded on wp-admin and wp-login.
   ============================================================ */

/* --- Brand font (relative to this file: assets/css/ -> assets/fonts/) --- */
@font-face {
	font-family: "Nunito Sans";
	src: url("../fonts/NunitoSans-Variable.ttf") format("truetype");
	font-weight: 200 1000;
	font-stretch: 75% 125%;
	font-style: normal;
	font-display: optional; /* preloaded → applies on first paint, no swap flash */
}

:root {
	--ifad-navy: #0E0E31;
	--ifad-navy-2: #1b1b4a;
	--ifad-navy-3: #2a2a63;
	--ifad-on-dark: #e7e8f0;
	--ifad-on-dark-dim: #b9bad2;
	--ifad-font: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--ifad-radius: 10px;
	--ifad-radius-sm: 7px;
}

/* --- Typography: Nunito Sans across admin + login; icon fonts untouched --- */
body.wp-admin, body.login,
#wpwrap, #wpbody-content, #wpbody-content .wrap,
#adminmenu, #adminmenu a, #wpadminbar, #wpadminbar *,
.wp-core-ui, .wp-core-ui .button, .wp-core-ui .button-primary, .wp-core-ui .button-secondary,
input, select, textarea, button,
#wpbody-content h1, #wpbody-content h2, #wpbody-content h3, #wpbody-content h4,
#wpbody-content p, #wpbody-content li, #wpbody-content td, #wpbody-content th, label,
.form-table th, .postbox .hndle, .postbox-header .hndle,
body.login label, body.login h1 a {
	font-family: var(--ifad-font) !important;
}
/* Keep icon fonts (Dashicons) intact. */
.dashicons, .dashicons-before:before, .dashicons:before,
[class^="dashicons-"]:before, [class*=" dashicons-"]:before,
#adminmenu div.wp-menu-image:before,
#wpadminbar .ab-icon:before, #wpadminbar .ab-item:before {
	font-family: dashicons !important;
}

/* --- Left sidebar + toolbar in brand navy --- */
#adminmenuback, #adminmenuwrap, #adminmenu,
#adminmenu .wp-submenu,
#adminmenu li.wp-has-current-submenu .wp-submenu {
	background-color: var(--ifad-navy) !important;
}
#adminmenu a { color: var(--ifad-on-dark) !important; }
#adminmenu .wp-submenu a { color: var(--ifad-on-dark-dim) !important; }
#adminmenu div.wp-menu-image:before { color: var(--ifad-on-dark-dim) !important; }

#adminmenu li.menu-top:hover, #adminmenu li.opensub > a.menu-top,
#adminmenu li > a.menu-top:focus {
	background-color: var(--ifad-navy-2) !important;
	color: #fff !important;
}
#adminmenu li.menu-top:hover div.wp-menu-image:before,
#adminmenu li.opensub div.wp-menu-image:before { color: #fff !important; }
#adminmenu .wp-submenu a:hover, #adminmenu .wp-submenu a:focus { color: #fff !important; }

#adminmenu li.current a.menu-top,
#adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,
#adminmenu li.current .wp-submenu,
#adminmenu .wp-has-current-submenu .wp-submenu {
	background-color: var(--ifad-navy-3) !important;
	color: #fff !important;
}
#adminmenu li.current > a.menu-top,
#adminmenu li.wp-has-current-submenu > a.menu-top {
	box-shadow: inset 4px 0 0 #fff !important;
}
#adminmenu li.current div.wp-menu-image:before { color: #fff !important; }
#adminmenu .wp-submenu li.current a, #adminmenu .wp-submenu a.current { color: #fff !important; font-weight: 700; }
#collapse-button { color: var(--ifad-on-dark-dim) !important; }

#wpadminbar { background: var(--ifad-navy) !important; }
#wpadminbar .ab-item, #wpadminbar a.ab-item,
#wpadminbar > #wp-toolbar span.ab-label, #wpadminbar .ab-icon {
	color: var(--ifad-on-dark) !important;
}
#wpadminbar .ab-top-menu > li:hover > .ab-item,
#wpadminbar .ab-top-menu > li.hover > .ab-item {
	background: var(--ifad-navy-2) !important;
	color: #fff !important;
}

/* --- Rounded, smooth form controls --- */
input[type=text], input[type=search], input[type=email], input[type=url],
input[type=password], input[type=number], input[type=tel], input[type=date],
input[type=datetime-local], input[type=month], input[type=week], input[type=time],
select, textarea, .wp-core-ui select {
	border-radius: var(--ifad-radius-sm) !important;
	transition: border-color .15s ease, box-shadow .15s ease !important;
}
input:focus, select:focus, textarea:focus {
	border-color: var(--ifad-navy-3) !important;
	box-shadow: 0 0 0 3px rgba(42, 42, 99, .16) !important;
	outline: none !important;
}

.wp-core-ui .button, .wp-core-ui .button-primary, .wp-core-ui .button-secondary,
.wp-core-ui .button.button-large, a.page-title-action, .page-title-action {
	border-radius: var(--ifad-radius-sm) !important;
	transition: transform .08s ease, box-shadow .15s ease, background-color .15s ease, border-color .15s ease !important;
}
.wp-core-ui .button-primary {
	background: var(--ifad-navy) !important;
	border-color: var(--ifad-navy) !important;
	color: #fff !important;
}
.wp-core-ui .button-primary:hover {
	background: var(--ifad-navy-2) !important;
	border-color: var(--ifad-navy-2) !important;
}
.wp-core-ui .button:active { transform: translateY(1px); }

/* --- Content links: brand-tinted, no harsh blue focus/active box --- */
#wpbody-content a:not(.button):not(.button-primary):not(.button-secondary):not(.page-title-action) {
	color: var(--ifad-navy-3);
}
#wpbody-content a:not(.button):not(.button-primary):not(.button-secondary):hover,
#wpbody-content .row-title:hover {
	color: var(--ifad-navy);
}
/* Kill the jarring blue box on mouse click; keep a tidy outline for keyboard. */
#wpbody-content a:focus,
#wpbody-content a:active {
	box-shadow: none !important;
	outline: none;
	color: var(--ifad-navy);
}
#wpbody-content a:focus-visible {
	outline: 2px solid rgba(42, 42, 99, .45);
	outline-offset: 1px;
	border-radius: 3px;
}

/* --- Cards / boxes / tables / notices --- */
.postbox, .stuffbox, .card, .welcome-panel,
.wp-list-table, .widefat, .form-table {
	border-radius: var(--ifad-radius) !important;
}
.postbox {
	box-shadow: 0 1px 3px rgba(14, 14, 49, .08) !important;
	border-color: #e6e7ee !important;
}
.notice, div.error, div.updated { border-radius: var(--ifad-radius-sm) !important; }
.postbox-header { border-radius: var(--ifad-radius) var(--ifad-radius) 0 0 !important; }

/* --- Login page: full brand makeover (nothing reads as "WordPress") --- */
body.login {
	background: #f3f3f7;
	font-family: var(--ifad-font) !important;
}
body.login #login {
	width: 384px;
	max-width: 92vw;
	padding: 6vh 0 4vh;
}

/* IFAD logo instead of the W mark (image URL injected inline by branding.php). */
body.login h1 a {
	width: 190px;
	height: 78px;
	margin: 0 auto 24px;
	background-size: contain;
	background-position: center;
	border-radius: 0;
	box-shadow: none;
}

/* The form as a clean card. */
body.login form {
	margin-top: 0;
	padding: 30px 30px 26px;
	background: #fff;
	border: 1px solid #e7e7ee;
	border-radius: var(--ifad-radius) !important;
	box-shadow: 0 14px 40px rgba(14, 14, 49, .10);
}
#login form p { margin-bottom: 10px; }
body.login form .input,
body.login input[type=text],
body.login input[type=password] {
	background: #fbfbfd;
	border: 1px solid #d7d7e1 !important;
	border-radius: var(--ifad-radius-sm) !important;
	padding: 11px 13px;
	font-size: 15px;
	color: var(--ifad-navy);
}
body.login label {
	color: var(--ifad-navy);
	font-size: 13px;
	font-weight: 600;
}
body.login .forgetmenot {
	display: block;
	float: none;
	margin: 4px 0 16px;
	font-weight: 400;
}
body.login .forgetmenot label { font-weight: 400; color: #50506b; }

/* Full-width brand button. */
body.login .submit { text-align: center; }
body.login #wp-submit,
body.login .button-primary {
	float: none !important;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 12px 20px !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	letter-spacing: .05em;
	text-transform: uppercase;
	border-radius: var(--ifad-radius-sm) !important;
	background: var(--ifad-navy) !important;
	border-color: var(--ifad-navy) !important;
	color: #fff !important;
	box-shadow: none !important;
}
body.login #wp-submit:hover,
body.login .button-primary:hover { background: var(--ifad-navy-2) !important; }

/* Messages / errors — brand accent, rounded. */
body.login .message,
body.login .success,
body.login #login_error {
	border-radius: var(--ifad-radius-sm) !important;
	border-left-color: var(--ifad-navy) !important;
}

/* Footer links (Lost password / Back to IFAD Jewellery). */
body.login #nav,
body.login #backtoblog {
	text-align: center;
	padding: 0 24px;
}
body.login #nav a,
body.login #backtoblog a { color: var(--ifad-navy) !important; }
body.login #nav a:hover,
body.login #backtoblog a:hover { color: var(--ifad-navy-3) !important; }

/* Drop WordPress-isms: the language switcher + privacy link clutter. */
body.login .language-switcher { display: none !important; }
body.login .privacy-policy-page-link { display: none !important; }

/* Checked checkboxes/radios use the brand accent (with a white tick for contrast). */
input[type=checkbox]:checked,
input[type=radio]:checked {
	background: #4c4590;
	border-color: #4c4590;
}
input[type=checkbox]:checked::before { color: #fff; }
input[type=radio]:checked::before { background-color: #fff; }

/* --- ACF relationship add/remove icons (e.g. Home "Featured products") ---
   In ACF 6.3.4 the .acf-icon glyph renders as a bare dark circle here (its
   background-image/mask don't apply), so the "remove" −/"add" + is invisible.
   Draw the glyphs ourselves in white. The .acf-icon is already position:absolute,
   so ::before/::after anchor to it. */
.acf-relationship .acf-icon.-minus::before,
.acf-relationship .acf-icon.-plus::before,
.acf-relationship .acf-icon.-plus::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	background: #fff;
	border-radius: 1px;
	transform: translate(-50%, -50%);
}
.acf-relationship .acf-icon.-minus::before,
.acf-relationship .acf-icon.-plus::before { width: 9px; height: 2px; }
.acf-relationship .acf-icon.-plus::after  { width: 2px; height: 9px; }

/* --- ACF File / Image / Gallery action icons (edit + remove) ---
   Same ACF 6.3.4 quirk as above: the .acf-icon glyph doesn't paint, leaving a
   bare dark circle, so the Edit (pencil) and Remove (×) actions on File/Image/
   Gallery fields are invisible — e.g. Product Details → Pdf / Videos / Schemes /
   3D View / Gallery. Overlay a white Dashicon on the .dark circle. Scoped to the
   .dark pencil/cancel variant so the repeater/relationship +/− icons stay intact. */
.acf-icon.-pencil.dark,
.acf-icon.-cancel.dark { position: relative; }
.acf-icon.-pencil.dark::before,
.acf-icon.-cancel.dark::before {
	font-family: dashicons !important;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	font-size: 16px;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.acf-icon.-pencil.dark::before { content: "\f464"; } /* dashicons-edit (pencil) */
.acf-icon.-cancel.dark::before { content: "\f335"; } /* dashicons-no-alt (×) */

/* --- ACF true_false "Yes/No" switch: brand navy when ON (whole admin) --- */
.acf-switch.-on {
	background: #100d30 !important;
	border-color: #100d30 !important;
}
.acf-switch.-on:hover { background: #100d30 !important; border-color: #100d30 !important; }
.acf-switch.-on .acf-switch-on { color: #fff !important; }
.acf-switch:focus-within { border-color: #100d30 !important; box-shadow: 0 0 0 1px #100d30 !important; }