/*
 =========================================================
 * MU Baryon - Modern Profiles
 * Compatible con WebEngine 1.2.x
 * Reemplazar: templates/default/css/profiles.css
 =========================================================
*/

/* GUILD PROFILES - se mantiene simple y compatible */
.profiles_guild_card {
	width: 100%;
	background: linear-gradient(135deg, rgba(0,18,14,.95), rgba(0,80,62,.75)), url('../img/profiles/guild.jpg') center/cover no-repeat;
	overflow: auto;
	border-radius: 14px;
	border: 1px solid rgba(0,221,166,.35);
	box-shadow: 0 18px 55px rgba(0,0,0,.55), inset 0 0 35px rgba(0,221,166,.08);
	padding: 36px;
	color: #fff;
	text-shadow: 1px 1px 2px #000;
}
.profiles_guild_card .guild_logo img { box-shadow: 0 0 18px rgba(0,255,190,.35), 0 0 10px #000; border-radius: 8px; }
.profiles_guild_card .guild_name,
.profiles_guild_card .guild_members { font-family: 'Cinzel', serif; font-size: 24px; color: #fff; font-weight: bold; }
.profiles_guild_card table { table-layout: fixed; }
.profiles_guild_card hr { border-top: 1px solid rgba(0,221,166,.25); margin: 30px 0; }
.profiles_guild_card .guild_members_list { margin-top: 30px; }

/* PLAYER PROFILE - nuevo layout */
.baryon-profile {
	position: relative;
	width: 100%;
	min-height: 470px;
	box-sizing: border-box;
	overflow: hidden;
	border-radius: 16px;
	border: 1px solid var(--race-color-mid);
	background-color: #00100d;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	box-shadow: 0 24px 55px rgba(0,0,0,.45), 0 0 30px var(--race-color-soft), inset 0 0 0 1px rgba(255,255,255,.05);
	color: #fff;
	text-shadow: 1px 1px 2px #000;
}



/* Colores e imagen del emblema por raza */
.baryon-profile {
	--race-color: var(--race-color);
	--race-color-soft: rgba(0,230,176,.28);
	--race-color-mid: rgba(0,230,176,.55);
	--race-color-dark: rgba(0,58,46,.78);
	--race-emblem: url('../img/profiles/SMProfile.png');
}

/* Dark Wizard / Soul Master / Grand Master - Azul */
.DW.baryon-profile, .SM.baryon-profile, .GM.baryon-profile, .SW.baryon-profile, .DSW.baryon-profile {
	--race-color: #2f8cff;
	--race-color-soft: rgba(47,140,255,.25);
	--race-color-mid: rgba(47,140,255,.58);
	--race-color-dark: rgba(11,44,91,.78);
	--race-emblem: url('../img/profiles/SMProfile.png');
}

/* Dark Knight / Blade Knight / Blade Master - Rojo */
.DK.baryon-profile, .BK.baryon-profile, .BM.baryon-profile, .DGK.baryon-profile, .IGK.baryon-profile {
	--race-color: #ff2d2d;
	--race-color-soft: rgba(255,45,45,.24);
	--race-color-mid: rgba(255,45,45,.58);
	--race-color-dark: rgba(91,12,12,.78);
	--race-emblem: url('../img/profiles/BKProfile.png');
}

/* Elf / Muse Elf / High Elf - Verde */
.ELF.baryon-profile, .ME.baryon-profile, .HE.baryon-profile, .NE.baryon-profile, .RYE.baryon-profile {
	--race-color: #34d86f;
	--race-color-soft: rgba(52,216,111,.24);
	--race-color-mid: rgba(52,216,111,.58);
	--race-color-dark: rgba(13,75,37,.78);
	--race-emblem: url('../img/profiles/ElfProfile.png');
}

/* Magic Gladiator / Duel Master - Violeta */
.MG.baryon-profile, .DM.baryon-profile, .MK.baryon-profile, .DPK.baryon-profile {
	--race-color: #a855f7;
	--race-color-soft: rgba(168,85,247,.24);
	--race-color-mid: rgba(168,85,247,.60);
	--race-color-dark: rgba(55,24,89,.78);
	--race-emblem: url('../img/profiles/MGprofile.png');
}

/* Dark Lord / Lord Emperor - Dorado */
.DL.baryon-profile, .LE.baryon-profile, .EL.baryon-profile, .FCE.baryon-profile {
	--race-color: #ffd24a;
	--race-color-soft: rgba(255,210,74,.25);
	--race-color-mid: rgba(255,210,74,.62);
	--race-color-dark: rgba(96,68,8,.78);
	--race-emblem: url('../img/profiles/DLProfile.png');
}

.DW.baryon-profile, .SM.baryon-profile, .GM.baryon-profile, .SW.baryon-profile, .DSW.baryon-profile { background-image: url('../img/profiles/wiz.jpg'); }
.DK.baryon-profile, .BK.baryon-profile, .BM.baryon-profile, .DGK.baryon-profile, .IGK.baryon-profile { background-image: url('../img/profiles/knight.jpg'); }
.ELF.baryon-profile, .ME.baryon-profile, .HE.baryon-profile, .NE.baryon-profile, .RYE.baryon-profile { background-image: url('../img/profiles/elf.jpg'); }
.MG.baryon-profile, .DM.baryon-profile, .MK.baryon-profile, .DPK.baryon-profile { background-image: url('../img/profiles/mg.jpg'); }
.DL.baryon-profile, .LE.baryon-profile, .EL.baryon-profile, .FCE.baryon-profile { background-image: url('../img/profiles/dl.jpg'); }
.SUM.baryon-profile, .BS.baryon-profile, .DSM.baryon-profile, .DS.baryon-profile, .ESUM.baryon-profile { background-image: url('../img/profiles/sum.jpg'); }
.RF.baryon-profile, .FM.baryon-profile, .FB.baryon-profile, .BF.baryon-profile { background-image: url('../img/profiles/rf.jpg'); }
.GL.baryon-profile, .ML.baryon-profile, .SL.baryon-profile, .AL.baryon-profile { background-image: url('../img/profiles/gl.jpg'); }
.RW.baryon-profile, .RSM.baryon-profile, .GRM.baryon-profile, .MRW.baryon-profile, .IRW.baryon-profile { background-image: url('../img/profiles/rw.jpg'); }
.SLR.baryon-profile, .SLRR.baryon-profile, .MSLR.baryon-profile, .SLTR.baryon-profile, .RS.baryon-profile { background-image: url('../img/profiles/sl.jpg'); }
.GC.baryon-profile, .GB.baryon-profile, .MGB.baryon-profile, .HGC.baryon-profile, .MGC.baryon-profile { background-image: url('../img/profiles/gc.jpg'); }
.LIW.baryon-profile, .LIM.baryon-profile, .SHW.baryon-profile, .LUW.baryon-profile, .GLW.baryon-profile { background-image: url('../img/profiles/liw.jpg'); }
.LEM.baryon-profile, .WAM.baryon-profile, .ARM.baryon-profile, .MYM.baryon-profile, .BAM.baryon-profile { background-image: url('../img/profiles/lem.jpg'); }
.IK.baryon-profile, .MIK.baryon-profile, .IM.baryon-profile, .MYK.baryon-profile, .PPK.baryon-profile { background-image: url('../img/profiles/ik.jpg'); }
.ALC.baryon-profile, .ALMN.baryon-profile, .ALMTR.baryon-profile, .ALFC.baryon-profile, .CRE.baryon-profile { background-image: url('../img/profiles/alc.jpg'); }
.CRU.baryon-profile, .ICRU.baryon-profile, .MPAL.baryon-profile, .SPAL.baryon-profile, .TCOM.baryon-profile { background-image: url('../img/profiles/cru.jpg'); }

.baryon-profile:before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(0,14,12,.98) 0%, rgba(0,28,23,.76) 32%, rgba(0,0,0,.36) 58%, rgba(0,0,0,.90) 100%),
		linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,.35) 45%, rgba(0,15,12,.94) 100%),
		radial-gradient(circle at 12% 25%, var(--race-color-soft), transparent 28%);
	z-index: 0;
}
.baryon-profile > * { position: relative; z-index: 2; }

.baryon-profile-hero {
	display: flex;
	align-items: center;
	min-height: 255px;
	padding: 42px 42px 34px 42px;
	box-sizing: border-box;
}
.baryon-profile-emblem {
	position: relative;
	width: 100px;
	height: 100px;
	line-height: 100px;
	margin-right: 34px;
	border-radius: 50%;
	text-align: center;
	font-size: 54px;
	color: transparent;
	background-image: linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.35)), var(--race-emblem);
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 124px auto;
	background-color: rgba(0,18,15,.82);
	border: 2px solid var(--race-color-mid);
	box-shadow: 0 0 25px var(--race-color-soft), inset 0 0 22px rgba(0,0,0,.45);
	overflow: hidden;
}
.baryon-profile-emblem:after {
	content: "";
	position: absolute;
	inset: 7px;
	border-radius: 50%;
	box-shadow: inset 0 0 26px rgba(0,0,0,.40), 0 0 18px var(--race-color-soft);
	pointer-events: none;
}

.baryon-profile-main h2 {
	margin: 8px 0 4px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 36px;
	line-height: 40px;
	font-weight: 900;
	letter-spacing: .5px;
	text-transform: none;
	color: #fff;
	text-shadow: 0 3px 9px #000;
}
.baryon-class-badge {
	display: inline-block;
	font-size: 13px;
	font-weight: 800;
	color: var(--race-color);
	background: linear-gradient(180deg, var(--race-color-soft), var(--race-color-dark));
	border: 1px solid var(--race-color-mid);
	border-radius: 7px;
	padding: 6px 11px;
	text-shadow: none;
}
.baryon-status {
	display: inline-flex;
	align-items: center;
	font-size: 14px;
	font-weight: 900;
	text-shadow: none;
}
.baryon-status:before,
.baryon-profile-details .isonline:before,
.baryon-profile-details .isoffline:before {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 8px;
	border-radius: 50%;
	vertical-align: middle;
}
.baryon-profile .isonline { color: #00ff9d !important; }
.baryon-profile .isoffline { color: #ff2a2a !important; }
.baryon-profile .isonline:before { background: #00ff9d; box-shadow: 0 0 10px rgba(0,255,157,.9); }
.baryon-profile .isoffline:before { background: #ff2020; box-shadow: 0 0 10px rgba(255,0,0,.9); }

.baryon-profile-cards {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 13px;
	padding: 0 34px 16px 34px;
	box-sizing: border-box;
}
.baryon-card {
	position: relative;
	min-height: 78px;
	box-sizing: border-box;
	border-radius: 12px;
	border: 1px solid var(--race-color-mid);
	background: linear-gradient(180deg, rgba(0,34,27,.88), rgba(0,20,17,.88));
	box-shadow: inset 0 0 28px var(--race-color-soft), 0 12px 24px rgba(0,0,0,.22);
	padding: 16px 15px 14px 62px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.baryon-card:before {
	position: absolute;
	left: 18px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 27px;
	line-height: 1;
	color: var(--race-color);
	text-shadow: 0 0 14px var(--race-color-mid);
}
.baryon-card-level:before { content: "⚔"; }
.baryon-card-master:before { content: "♛"; }
.baryon-card-resets:before { content: "⟳"; }
.baryon-card-grand:before { content: "✺"; }
.baryon-card-kills:before { content: "☠"; }
.baryon-card span {
	font-size: 12px;
	font-weight: 900;
	text-transform: none;
	color: #f2fffc;
}
.baryon-card strong {
	font-size: 27px;
	line-height: 1;
	font-weight: 900;
	color: #fff;
}

.baryon-profile-details {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px 16px;
	padding: 0 34px 32px 34px;
	box-sizing: border-box;
}
.baryon-profile-details div {
	min-height: 50px;
	box-sizing: border-box;
	border-radius: 10px;
	border: 1px solid rgba(255,255,255,.055);
	background: rgba(0,24,19,.68);
	box-shadow: inset 0 0 24px rgba(0,221,166,.035);
	padding: 13px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.baryon-profile-details span {
	font-size: 14px;
	font-weight: 800;
	color: #e4fff8;
}
.baryon-profile-details strong {
	font-size: 14px;
	font-weight: 900;
	color: #fff;
}
.baryon-profile-details a {
	color: var(--race-color) !important;
	font-weight: 900;
	text-decoration: none !important;
}
.baryon-profile-details a:hover { color: #69ffd5 !important; }

/* Compatibilidad si algún otro perfil viejo sigue usando las clases originales */
.profiles_player_card { width: 100%; overflow: auto; border-radius: 10px; border: 1px solid #333; box-shadow: 0 0 10px #555; padding: 20px; }
.profiles_player_content { float: right; width: 50%; color: #fff; }
.profiles_player_table { width: 100%; }
.profiles_player_table .cname { font-family: 'Cinzel', serif; text-align: center; font-size: 24px; color: #fff; font-weight: bold; }
.profiles_player_table .cclass { text-align: center; font-size: 11px; color: #eee; }
.profiles_player_table .isoffline { color: #ff0000; }
.profiles_player_table .isonline { color: #00ff00; }
.profiles_player_table_info { table-layout: fixed; margin-top: 10px; }
.profiles_player_table_info tr td { padding: 3px 10px; }
.profiles_player_table_info tr td:first-child { text-align: right; }

@media (max-width: 900px) {
	.baryon-profile-hero { min-height: 230px; padding: 34px 24px 28px; }
	.baryon-profile-emblem { width: 78px; height: 78px; line-height: 78px; font-size: 42px; margin-right: 22px; }
	.baryon-profile-emblem:after {
	content: "";
	position: absolute;
	inset: 7px;
	border-radius: 50%;
	box-shadow: inset 0 0 26px rgba(0,0,0,.40), 0 0 18px var(--race-color-soft);
	pointer-events: none;
}

.baryon-profile-main h2 { font-size: 28px; line-height: 32px; }
	.baryon-profile-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 22px 14px; }
	.baryon-profile-details { grid-template-columns: 1fr; padding: 0 22px 24px; }
}
@media (max-width: 560px) {
	.baryon-profile-hero { display: block; text-align: center; min-height: 245px; }
	.baryon-profile-emblem { margin: 0 auto 16px; }
	.baryon-profile-cards { grid-template-columns: 1fr; }
	.baryon-card { min-height: 68px; }
}


/* =========================================================
 * BARYON PROFILE - AJUSTE FINAL LIMPIO
 * Quita la linea atravesada y separa banner/stats como el mockup.
 ========================================================= */
.baryon-profile {
	min-height: 520px;
	background-position: center top;
	background-size: cover;
}

/* La linea molesta venia de este pseudo-elemento */
.baryon-profile:after {
	display: none !important;
	content: none !important;
}

/* Oscurece el arte arriba y convierte la parte inferior en panel limpio */
.baryon-profile:before {
	background:
		linear-gradient(90deg, rgba(0,14,12,.96) 0%, rgba(0,28,23,.62) 34%, rgba(0,0,0,.18) 58%, rgba(0,0,0,.92) 100%),
		linear-gradient(180deg, rgba(0,0,0,.05) 0px, rgba(0,0,0,.28) 230px, rgba(0,13,11,.96) 268px, rgba(0,13,11,.98) 100%),
		radial-gradient(circle at 12% 25%, rgba(0,255,190,.22), transparent 28%);
}

.baryon-profile-hero {
	min-height: 260px;
	padding: 42px 44px 36px 44px;
}

.baryon-profile-emblem {
	position: relative;
	width: 96px;
	height: 96px;
	line-height: 96px;
	margin-right: 32px;
}

.baryon-profile-emblem:after {
	content: "";
	position: absolute;
	inset: 7px;
	border-radius: 50%;
	box-shadow: inset 0 0 26px rgba(0,0,0,.40), 0 0 18px var(--race-color-soft);
	pointer-events: none;
}

.baryon-profile-main h2 {
	font-size: 38px;
	line-height: 42px;
	margin-top: 10px;
}

.baryon-profile-cards {
	padding: 26px 34px 18px 34px;
	gap: 14px;
	background: transparent !important;
}

.baryon-card {
	min-height: 78px;
	border-color: rgba(0,221,166,.28);
	background: linear-gradient(180deg, rgba(0,41,33,.94), rgba(0,23,19,.96));
	box-shadow: inset 0 0 26px rgba(0,221,166,.08), 0 10px 24px rgba(0,0,0,.28);
}

.baryon-profile-details {
	padding: 0 34px 34px 34px;
	gap: 13px 16px;
}

.baryon-profile-details div {
	min-height: 52px;
	background: linear-gradient(180deg, rgba(0,34,28,.93), rgba(0,21,18,.96));
	border-color: rgba(0,221,166,.12);
}

/* Limpieza visual dentro del contenedor blanco del theme */
.page-title + .baryon-profile,
.baryon-profile:first-child {
	margin-top: 0;
}

@media (max-width: 900px) {
	.baryon-profile:before {
		background:
			linear-gradient(90deg, rgba(0,14,12,.96) 0%, rgba(0,28,23,.62) 40%, rgba(0,0,0,.86) 100%),
			linear-gradient(180deg, rgba(0,0,0,.10) 0px, rgba(0,0,0,.34) 215px, rgba(0,13,11,.97) 250px, rgba(0,13,11,.99) 100%);
	}
}