/* =========================================================
   Valdepan — Esquema de color del panel de administración
   - Se aplica cuando el usuario elige "Valdepan" en su perfil
   - Soporta modo oscuro vía cookie del frontend o prefers-color-scheme
   ========================================================= */

/* ----- Variables compartidas (inyectadas desde functions.php) ----- */

/* =========================================================
   MODO CLARO — esquema "Valdepan"
   ========================================================= */

body.admin-color-valdepan,
body.admin-color-valdepan #wpcontent {
	background-color: #fff8f0;
	color: #3a2a32;
}

/* Admin bar */
body.admin-color-valdepan #wpadminbar {
	background: linear-gradient(180deg, #f4b5cd 0%, #fbd5e3 100%);
	color: #3a2a32;
	border-bottom: 1px solid #d98ab0;
}
body.admin-color-valdepan #wpadminbar .ab-item,
body.admin-color-valdepan #wpadminbar a.ab-item,
body.admin-color-valdepan #wpadminbar > #wp-toolbar span.ab-label,
body.admin-color-valdepan #wpadminbar > #wp-toolbar span.noticon {
	color: #3a2a32 !important;
}
body.admin-color-valdepan #wpadminbar .ab-icon::before,
body.admin-color-valdepan #wpadminbar .ab-item::before {
	color: #3a2a32;
}
body.admin-color-valdepan #wpadminbar .ab-sub-wrapper,
body.admin-color-valdepan #wpadminbar .quicklinks .menupop ul li a {
	background: #fff8f0;
	color: #3a2a32;
}
body.admin-color-valdepan #wpadminbar .ab-sub-wrapper .ab-submenu {
	background: #fff8f0;
	border: 1px solid #f4b5cd;
}
body.admin-color-valdepan #wpadminbar .ab-sub-wrapper a:hover,
body.admin-color-valdepan #wpadminbar .quicklinks .menupop ul li a:hover {
	background: #fbd5e3 !important;
	color: #c46a8f !important;
}
body.admin-color-valdepan #wpadminbar .menupop .ab-item:hover,
body.admin-color-valdepan #wpadminbar .ab-item:focus {
	background: #f4b5cd !important;
	color: #3a2a32 !important;
}
body.admin-color-valdepan #wpadminbar #wp-admin-bar-site-name a.ab-item,
body.admin-color-valdepan #wpadminbar #wp-admin-bar-my-sites a.ab-item {
	background: rgba(255, 255, 255, 0.4);
}

/* Menú lateral */
body.admin-color-valdepan #adminmenuback,
body.admin-color-valdepan #adminmenuwrap {
	background-color: #3a2a32;
}
body.admin-color-valdepan #adminmenu a,
body.admin-color-valdepan #adminmenu .wp-submenu a,
body.admin-color-valdepan #adminmenu .wp-submenu li.current a,
body.admin-color-valdepan .wp-submenu li a {
	color: #fbd5e3;
}
body.admin-color-valdepan #adminmenu .wp-submenu,
body.admin-color-valdepan #adminmenu .wp-submenu-wrap {
	background-color: #2a1a22;
}
body.admin-color-valdepan #adminmenu a.menu-top {
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
body.admin-color-valdepan #adminmenu li.menu-top:hover,
body.admin-color-valdepan #adminmenu li.opensub > a.menu-top,
body.admin-color-valdepan #adminmenu li > a.menu-top:focus {
	background-color: #c46a8f;
	color: #fff8f0;
}
body.admin-color-valdepan #adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,
body.admin-color-valdepan #adminmenu li.current a.menu-top {
	background: #c46a8f;
	color: #fff8f0;
}
body.admin-color-valdepan #adminmenu .wp-submenu li.current a,
body.admin-color-valdepan #adminmenu a.current {
	color: #fff8f0;
}
body.admin-color-valdepan #adminmenu div.wp-menu-image::before {
	color: #f4b5cd;
}
body.admin-color-valdepan #adminmenu li.wp-has-current-submenu div.wp-menu-image::before,
body.admin-color-valdepan #adminmenu li.current div.wp-menu-image::before {
	color: #fff8f0;
}

/* Logo de WP en el menú */
body.admin-color-valdepan #adminmenu li#collapse-menu {
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

/* Botones primarios */
body.admin-color-valdepan .wp-core-ui .button-primary {
	background: #c46a8f;
	border-color: #a85878;
	color: #fff8f0;
	box-shadow: 0 1px 0 #a85878;
}
body.admin-color-valdepan .wp-core-ui .button-primary:hover,
body.admin-color-valdepan .wp-core-ui .button-primary:focus {
	background: #a85878;
	border-color: #8c4661;
	color: #fff8f0;
}
body.admin-color-valdepan .wp-core-ui .button-primary:active {
	background: #8c4661;
	border-color: #703a4d;
}

/* Botones secundarios */
body.admin-color-valdepan .wp-core-ui .button,
body.admin-color-valdepan .wp-core-ui .button-secondary {
	background: #fbd5e3;
	border-color: #f4b5cd;
	color: #3a2a32;
	box-shadow: 0 1px 0 #d98ab0;
}
body.admin-color-valdepan .wp-core-ui .button:hover,
body.admin-color-valdepan .wp-core-ui .button-secondary:hover {
	background: #f4b5cd;
	color: #3a2a32;
}

/* Links */
body.admin-color-valdepan a,
body.admin-color-valdepan .wp-admin a {
	color: #c46a8f;
}
body.admin-color-valdepan a:hover,
body.admin-color-valdepan .wp-admin a:hover {
	color: #a85878;
}

/* Títulos H1 */
body.admin-color-valdepan h1,
body.admin-color-valdepan h2,
body.admin-color-valdepan h3 {
	color: #3a2a32;
}

/* Formularios */
body.admin-color-valdepan input[type="text"],
body.admin-color-valdepan input[type="email"],
body.admin-color-valdepan input[type="url"],
body.admin-color-valdepan input[type="password"],
body.admin-color-valdepan input[type="search"],
body.admin-color-valdepan input[type="number"],
body.admin-color-valdepan input[type="tel"],
body.admin-color-valdepan input[type="date"],
body.admin-color-valdepan textarea,
body.admin-color-valdepan select {
	border-color: #f4b5cd;
	background: #ffffff;
	color: #3a2a32;
}
body.admin-color-valdepan input[type="text"]:focus,
body.admin-color-valdepan textarea:focus,
body.admin-color-valdepan select:focus {
	border-color: #c46a8f;
	box-shadow: 0 0 0 1px #c46a8f;
}

/* Notificaciones (notice) */
body.admin-color-valdepan .notice-info {
	border-left-color: #c46a8f;
}

/* Footer */
body.admin-color-valdepan #wpfooter {
	color: #6b5560;
	background: transparent;
}

/* Tablas */
body.admin-color-valdepan .widefat thead th,
body.admin-color-valdepan .widefat tfoot th {
	background: #fbd5e3;
	color: #3a2a32;
	border-color: #f4b5cd;
}
body.admin-color-valdepan .widefat tbody tr:hover {
	background: #fbd5e3;
}

/* =========================================================
   MODO OSCURO — cuando body tiene .vp-dark o el OS lo pide
   ========================================================= */

@media (prefers-color-scheme: dark) {
	body.admin-color-valdepan,
	body.admin-color-valdepan #wpcontent {
		background-color: #1f1f22;
		color: #e8e6e3;
	}
	body.admin-color-valdepan #wpadminbar {
		background: linear-gradient(180deg, #2a2a2d 0%, #1f1f22 100%);
		color: #e8e6e3;
		border-bottom-color: #3a3a3a;
	}
	body.admin-color-valdepan #wpadminbar .ab-item,
	body.admin-color-valdepan #wpadminbar a.ab-item,
	body.admin-color-valdepan #wpadminbar > #wp-toolbar span.ab-label,
	body.admin-color-valdepan #wpadminbar > #wp-toolbar span.noticon {
		color: #e8e6e3 !important;
	}
	body.admin-color-valdepan #wpadminbar .ab-icon::before {
		color: #e8e6e3;
	}
	body.admin-color-valdepan #wpadminbar .ab-sub-wrapper,
	body.admin-color-valdepan #wpadminbar .quicklinks .menupop ul li a {
		background: #2a2a2d;
		color: #e8e6e3;
	}
	body.admin-color-valdepan #wpadminbar .menupop .ab-item:hover {
		background: #3a3a3a !important;
		color: #f4b5cd !important;
	}
	body.admin-color-valdepan #adminmenuback,
	body.admin-color-valdepan #adminmenuwrap {
		background-color: #15151a;
	}
	body.admin-color-valdepan #adminmenu a,
	body.admin-color-valdepan #adminmenu .wp-submenu a {
		color: #c8c5c0;
	}
	body.admin-color-valdepan #adminmenu .wp-submenu,
	body.admin-color-valdepan #adminmenu .wp-submenu-wrap {
		background-color: #0f0f12;
	}
	body.admin-color-valdepan h1,
	body.admin-color-valdepan h2,
	body.admin-color-valdepan h3 {
		color: #e8e6e3;
	}
	body.admin-color-valdepan .wp-core-ui .button,
	body.admin-color-valdepan .wp-core-ui .button-secondary {
		background: #3a3a3a;
		border-color: #5a5a5a;
		color: #e8e6e3;
	}
	body.admin-color-valdepan .wp-core-ui .button-primary {
		background: #c46a8f;
		border-color: #d98ab0;
		color: #1f1f22;
	}
	body.admin-color-valdepan input[type="text"],
	body.admin-color-valdepan input[type="email"],
	body.admin-color-valdepan input[type="password"],
	body.admin-color-valdepan input[type="search"],
	body.admin-color-valdepan textarea,
	body.admin-color-valdepan select {
		background: #2a2a2d;
		border-color: #3a3a3a;
		color: #e8e6e3;
	}
	body.admin-color-valdepan .widefat thead th {
		background: #2a2a2d;
		color: #e8e6e3;
		border-color: #3a3a3a;
	}
	body.admin-color-valdepan .widefat tbody tr:hover {
		background: #2a2a2d;
	}
}

body.admin-color-valdepan.vp-dark,
body.vp-dark.admin-color-valdepan {
	background-color: #1f1f22;
	color: #e8e6e3;
}
body.admin-color-valdepan.vp-dark #wpcontent {
	background-color: #1f1f22;
}
body.admin-color-valdepan.vp-dark #wpadminbar {
	background: linear-gradient(180deg, #2a2a2d 0%, #1f1f22 100%);
	color: #e8e6e3;
	border-bottom-color: #3a3a3a;
}
body.admin-color-valdepan.vp-dark #wpadminbar .ab-item,
body.admin-color-valdepan.vp-dark #wpadminbar a.ab-item,
body.admin-color-valdepan.vp-dark #wpadminbar > #wp-toolbar span.ab-label {
	color: #e8e6e3 !important;
}
body.admin-color-valdepan.vp-dark #wpadminbar .ab-sub-wrapper,
body.admin-color-valdepan.vp-dark #wpadminbar .quicklinks .menupop ul li a {
	background: #2a2a2d;
	color: #e8e6e3;
}
body.admin-color-valdepan.vp-dark #adminmenuback,
body.admin-color-valdepan.vp-dark #adminmenuwrap {
	background-color: #15151a;
}
body.admin-color-valdepan.vp-dark #adminmenu a,
body.admin-color-valdepan.vp-dark #adminmenu .wp-submenu a {
	color: #c8c5c0;
}
body.admin-color-valdepan.vp-dark #adminmenu .wp-submenu,
body.admin-color-valdepan.vp-dark #adminmenu .wp-submenu-wrap {
	background-color: #0f0f12;
}
body.admin-color-valdepan.vp-dark h1,
body.admin-color-valdepan.vp-dark h2,
body.admin-color-valdepan.vp-dark h3 {
	color: #e8e6e3;
}
body.admin-color-valdepan.vp-dark .wp-core-ui .button,
body.admin-color-valdepan.vp-dark .wp-core-ui .button-secondary {
	background: #3a3a3a;
	border-color: #5a5a5a;
	color: #e8e6e3;
}
body.admin-color-valdepan.vp-dark .wp-core-ui .button-primary {
	background: #c46a8f;
	color: #1f1f22;
}
body.admin-color-valdepan.vp-dark input[type="text"],
body.admin-color-valdepan.vp-dark input[type="email"],
body.admin-color-valdepan.vp-dark input[type="password"],
body.admin-color-valdepan.vp-dark input[type="search"],
body.admin-color-valdepan.vp-dark textarea,
body.admin-color-valdepan.vp-dark select {
	background: #2a2a2d;
	border-color: #3a3a3a;
	color: #e8e6e3;
}
body.admin-color-valdepan.vp-dark .widefat thead th {
	background: #2a2a2d;
	color: #e8e6e3;
	border-color: #3a3a3a;
}
