/* Demonax theme for demonax-account (loaded inside the /account-frame/ iframe).
   Palette mirrors demonax-web/asset/style/styles.css:
     - body bg #051122 (dark blue), text #d7d7d7
     - accent gold #cfa600, teal #4b7874
     - boxes: cream #FFF2db with brown text #5A2800 for legibility on forms
*/

body {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
	             "Helvetica Neue", Arial, sans-serif;
	background-color: #051122;
	color: #d7d7d7;
	margin: 0;
	padding: 1rem;
}

p {
	font-size: 1rem;
	line-height: 1.6;
}

a {
	color: #cfa600;
	text-decoration: none;
}

a:hover {
	color: #b89000;
	text-decoration: underline;
}

h1 {
	color: #cfa600;
	font-size: 1.6rem;
	margin: 0.5rem 0 1rem 0;
}

h2 {
	color: #cfa600;
	font-size: 1.2rem;
	margin: 0.5rem 0;
}

/* Navigation bar of inner buttons */
.nav {
	width: 100%;
	max-width: 900px;
	margin: 0.5rem auto 1.5rem auto;
	text-align: center;
}

a.button {
	display: inline-block;
	margin: 0.25rem;
	padding: 0.5rem 1rem;
	background-color: #0D2E2B;
	border: 1px solid #4b7874;
	border-radius: 0.375rem;
	color: #d7d7d7;
	font-weight: 500;
	transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}

a.button:hover {
	background-color: rgba(207, 166, 0, 0.15);
	border-color: #cfa600;
	color: #cfa600;
	text-decoration: none;
}

/* Form/content boxes — keep demonax-account's existing .box class but restyle */
.box {
	width: 100%;
	max-width: 700px;
	margin: 1rem auto;
	padding: 1.5rem;
	background-color: #FFF2db;
	border: 1px solid #cfa600;
	border-radius: 0.5rem;
	color: #5A2800;
}

.box h1 {
	color: #5A2800;
	margin-top: 0;
}

.box label {
	display: block;
	margin: 0.75rem 0 0.25rem 0;
	font-size: 0.95rem;
	font-weight: 600;
	text-transform: uppercase;
	color: #793d03;
	letter-spacing: 0.025em;
}

.box input[type=text],
.box input[type=password],
.box input[type=email],
.box select {
	width: 100%;
	padding: 0.5rem;
	border: 1px solid #b89000;
	border-radius: 0.375rem;
	background-color: #ffffff;
	color: #5A2800;
	font-size: 1rem;
	box-sizing: border-box;
}

.box input[type=text]:focus,
.box input[type=password]:focus,
.box input[type=email]:focus,
.box select:focus {
	outline: none;
	border-color: #cfa600;
	box-shadow: 0 0 0 2px rgba(207, 166, 0, 0.25);
}

.box input[type=submit] {
	margin-top: 1rem;
	padding: 0.6rem 1.5rem;
	background-color: #0D2E2B;
	color: #d7d7d7;
	border: 1px solid #4b7874;
	border-radius: 0.375rem;
	font-size: 1rem;
	cursor: pointer;
	transition: background-color 0.15s, color 0.15s;
}

.box input[type=submit]:hover {
	background-color: #cfa600;
	color: #051122;
	border-color: #cfa600;
}

/* Tables */
table {
	width: 100%;
	max-width: 900px;
	margin: 0.5rem auto;
	border-collapse: collapse;
	text-align: left;
}

th {
	padding: 0.5rem;
	font-weight: 600;
	color: #cfa600;
	border-bottom: 1px solid #4b7874;
}

td {
	padding: 0.5rem;
	border-bottom: 1px solid rgba(75, 120, 116, 0.3);
	word-break: break-word;
}

table.info th {
	width: 30%;
}

/* Inside .box, the table inherits the cream context */
.box table {
	margin: 0.5rem 0;
}
.box th {
	color: #793d03;
	border-bottom-color: #b89000;
}
.box td {
	color: #5A2800;
	border-bottom-color: rgba(184, 144, 0, 0.3);
}

/* Live feed (world_embed's dark-theme counterpart — terminal-style box,
   not the cream .box used for forms, since this is a passive log view). */
.live-feed-box {
	width: 100%;
	max-width: 700px;
	margin: 1rem auto;
	padding: 1rem 1.25rem;
	background-color: #08152a;
	border: 1px solid #4b7874;
	border-radius: 0.5rem;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.9rem;
	height: 60vh;
	overflow-y: auto;
	display: flex;
	flex-direction: column-reverse; /* newest entry visually at the top */
}

.live-feed-box p {
	margin: 0.15rem 0;
	line-height: 1.4;
}

.live-feed-empty {
	color: #6c7a89;
	font-style: italic;
}

.lf-teal   { color: #6fcfc7; }
.lf-gray   { color: #9aa0a6; }
.lf-green  { color: #7fd17f; }
.lf-blue   { color: #7fb0e0; }
.lf-yellow { color: #e0b400; }
.lf-red    { color: #e07a75; }