/*
 * Semenka: a light restyle of Curve2 (SMF 2.1 default theme), loaded after
 * index.css and responsive.css. Colours from the old semenka.com portal
 * (seme1 template): dark #222 / #333 with hot pink #f3c.
 */
:root {
	--semenka-dark: #222;
	--semenka-dark-2: #333;
	--semenka-pink: #ff33cc;         /* the old #f3c: accents on dark only */
	--semenka-pink-text: #b0127f;    /* links on light backgrounds (6.5:1 on white) */
	--semenka-pink-deep: #8c0e65;
	--semenka-page: #efeff1;
}

html {
	background: var(--semenka-dark);
}
body {
	background: var(--semenka-page);
}

/* Links */
a, a:visited {
	color: var(--semenka-pink-text);
}
a:hover, a:focus-visible {
	color: var(--semenka-pink-deep);
}
:focus-visible {
	outline: 2px solid var(--semenka-pink-text);
	outline-offset: 2px;
}

/* Header: the old site's dark band with the burning Semenka guy, edge to edge. */
#header {
	background: var(--semenka-dark);
	/* Full-bleed band beyond the centred column, with a pink rule at the bottom. */
	box-shadow: 0 0 0 100vmax var(--semenka-dark);
	clip-path: inset(0 -100vmax);
	position: relative;
	padding: 8px 0 11px;
	margin-bottom: 14px;
}
#header::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	background: var(--semenka-pink);
	/* Shadows and clip-path widen it without making the page scroll sideways. */
	box-shadow: 0 0 0 100vmax var(--semenka-pink);
	clip-path: inset(0 -100vmax);
}
h1.forumtitle {
	padding: 0;
	line-height: 0;
}
h1.forumtitle a {
	display: inline-block;
}
h1.forumtitle img {
	height: 110px;
	width: auto;
	max-width: 100%;
}
#header #smflogo, #header #siteslogan {
	display: none;
}

/* Main menu */
.dropmenu a.active, #top_info a.active,
.dropmenu li a.active:hover, .dropmenu li:hover a.active {
	color: #fff;
	background: linear-gradient(#d0189f, var(--semenka-pink-text));
	border-color: var(--semenka-pink-deep);
	text-shadow: none;
}
.dropmenu > li:hover > a, .dropmenu > li > a:focus,
#top_info > li:hover > a, #top_info > li > a:focus, #top_info > li > a.open {
	background: var(--semenka-dark-2);
	border-color: var(--semenka-dark);
	color: #fff;
}

/* "Galerija" menu icon: a small picture frame */
.main_icons.galerija::before {
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='1.5' y='2.5' width='13' height='11' rx='1.5' fill='%23fff' stroke='%23555'/%3E%3Ccircle cx='5.5' cy='6' r='1.5' fill='%23ff33cc'/%3E%3Cpath d='M2.5 12.5l4-4 2.5 2.5 2-2 2.5 3.5z' fill='%23555'/%3E%3C/svg%3E") no-repeat center / 16px 16px;
}

/* Category and title bars */
div.cat_bar {
	background: var(--semenka-dark);
	border-bottom: 3px solid var(--semenka-pink);
	box-shadow: none;
}
.title_bar {
	border-top-color: var(--semenka-pink);
	border-bottom-color: var(--semenka-pink-text);
}
/* Curve2's orange text accents, in Semenka pink */
.info .subject, .current_page, .popup_heading,
.keyinfo .postinfo a, .keyinfo .postinfo a strong,
.poster h4, .poster h4 a, .poster li.poster_online a {
	color: var(--semenka-pink-text);
}
.new_posts, a.new_posts {
	background: linear-gradient(#d0189f, var(--semenka-pink-text));
	color: #fff;
}

/* Buttons */
.button:hover, .button:focus {
	color: var(--semenka-pink-text);
}
.button.active, .button.active:hover, .button.active:focus {
	background: var(--semenka-dark-2);
	border-color: var(--semenka-dark);
	color: #fff;
}

/* Breadcrumb dividers and footer */
.navigate_section ul li .dividers {
	color: var(--semenka-pink-text);
}
#footer {
	background: var(--semenka-dark);
	border-top: 3px solid var(--semenka-pink);
}
#footer a:hover {
	color: var(--semenka-pink);
}

/* Post images replaced by the fallback script: keep them small and quiet. */
img.bbc_img.semenka_missing {
	max-width: min(100%, 320px);
	height: auto;
}

@media (max-width: 720px) {
	#header {
		padding: 6px 0 9px;
		margin-bottom: 8px;
	}
	h1.forumtitle img {
		height: 80px;
	}
}

/*
 * The Archive in numbers (ticket 20): the guest teaser around the login form, and the
 * Members' "Arhiva u brojkama" block in the Info Center. Flat colour, no rules or shadows.
 */
.semenka_teaser {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	gap: 32px;
	align-items: start;
	background: var(--semenka-dark);
	color: #fff;
	padding: 40px;
	margin: 0 0 16px;
	border-radius: 0;
}
.semenka_teaser h2 {
	font-size: clamp(2rem, 1.2rem + 3vw, 3.5rem);
	line-height: 1;
	letter-spacing: -0.03em;
	font-weight: 700;
	color: #fff;
	margin: 0 0 16px;
}
.semenka_teaser_voice {
	font-size: 1.15rem;
	line-height: 1.5;
	max-width: 34em;
	margin: 0 0 32px;
	color: #fff;
}
.semenka_teaser_numbers, .semenka_archive_numbers, .semenka_archive_per_year {
	list-style: none;
	margin: 0;
	padding: 0;
}
.semenka_teaser_numbers {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr));
	gap: 24px 16px;
}
.semenka_teaser_numbers li {
	font-size: 1.05rem;
	line-height: 1.3;
	color: #fff;
}
.semenka_teaser_numbers strong {
	display: block;
	font-size: clamp(2rem, 1.4rem + 2vw, 3rem);
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--semenka-pink);
	font-variant-numeric: tabular-nums;
}
/* Phone only: the form sits below the numbers, so a button jumps to it */
.semenka_teaser_jump {
	display: none;
	margin: 0 0 24px;
	padding: 10px 28px;
	background: var(--semenka-pink-text);
	color: #fff;
	font-size: 1rem;
	font-weight: 700;
	border-radius: 0;
	text-decoration: none;
}
a.semenka_teaser_jump:visited {
	color: #fff;
}
a.semenka_teaser_jump:hover, a.semenka_teaser_jump:focus-visible {
	background: var(--semenka-pink-deep);
	color: #fff;
}
/* SMF's own login form, on a light card inside the dark band */
.semenka_teaser_login {
	color: #4d4d4d;
}
/* kick_guest's warning bar: the teaser already says why the form is there */
.semenka_teaser_login .login > .cat_bar:first-child {
	display: none;
}
.semenka_teaser_login .login {
	width: auto;
	max-width: none;
	margin: 0;
}
.semenka_teaser_login .roundframe, .semenka_teaser_login .information {
	border: 0;
	border-radius: 0;
	box-shadow: none;
}
.semenka_teaser_login .information {
	margin: 0;
}
/* Curve2 wraps the form's floated rows with overflow: auto, which clipped the focus outline
   of the first field; flow-root contains the floats without clipping. */
.semenka_teaser_login .roundframe, .semenka_teaser_login .roundframe dl {
	overflow: visible;
	display: flow-root;
}
.semenka_teaser_login input[type="submit"].button {
	background: var(--semenka-pink-text);
	border-color: var(--semenka-pink-text);
	color: #fff;
	font-size: 1rem;
	padding: 6px 28px;
	height: auto;
}
.semenka_teaser_login input[type="submit"].button:hover,
.semenka_teaser_login input[type="submit"].button:focus-visible {
	background: var(--semenka-pink-deep);
	color: #fff;
}
/* "Stari email ti više ne radi?" (ticket 25): the card's last line, under "Zaboravili ste lozinku?" */
.semenka_teaser_reclaim {
	margin: 0;
	padding: 0 16px 20px;
	background: #f8f8f8;
	text-align: center;
}
.semenka_teaser a:focus-visible, .semenka_teaser input:focus-visible, .semenka_teaser select:focus-visible {
	outline: 2px solid var(--semenka-pink);
}

/* Members' block */
.semenka_archive {
	padding: 6px 12px 12px;
}
.semenka_archive_years {
	font-weight: 700;
	margin: 0 0 6px;
}
.semenka_archive_numbers {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 24px;
	margin-bottom: 12px;
}
.semenka_archive_numbers strong {
	font-size: 1.4em;
	color: var(--semenka-pink-text);
	font-variant-numeric: tabular-nums;
}
.semenka_archive_facts {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 6px 16px;
	margin: 0;
}
.semenka_archive_facts dt {
	font-weight: 700;
}
.semenka_archive_facts dd {
	margin: 0;
}
.semenka_archive_per_year {
	display: flex;
	flex-wrap: wrap;
	gap: 0 20px;
}
.semenka_archive_per_year span {
	font-weight: 700;
}

@media (max-width: 720px) {
	.semenka_teaser {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
		padding: 24px 16px;
	}
	.semenka_teaser_voice {
		margin-bottom: 24px;
	}
	.semenka_teaser_numbers {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 16px 12px;
	}
	.semenka_teaser_numbers li {
		font-size: 0.95rem;
	}
	.semenka_teaser_numbers strong {
		font-size: 1.75rem;
	}
	.semenka_teaser_jump {
		display: inline-block;
	}
	.semenka_archive_facts {
		grid-template-columns: minmax(0, 1fr);
		gap: 2px;
	}
	.semenka_archive_facts dd {
		margin-bottom: 8px;
	}
}

/* The weekly release reminder (ADR 0006, semenka.js) */
dialog.semenka_glasanje {
	margin: auto;  /* SMF's reset drops the margin that centres a modal dialog */
	max-width: min(32rem, calc(100vw - 32px));
	border: 0;
	border-top: 6px solid var(--semenka-pink);
	border-radius: 6px;
	padding: 20px 22px 14px;
	box-shadow: 0 18px 40px -10px rgba(0, 0, 0, .6);
}
dialog.semenka_glasanje::backdrop {
	background: rgba(0, 0, 0, .55);
}
dialog.semenka_glasanje h2 {
	margin: 0 0 10px;
	font-size: 1.35em;
}
dialog.semenka_glasanje p {
	margin: 0 0 10px;
	line-height: 1.45;
}
dialog.semenka_glasanje .buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-end;
	margin-top: 16px;
}

/*
 * Old Members we are looking for (ticket 30): the list at /stari-email.php?popis and the
 * admin's "Zahtjevi za novi email". Flat, in the Archive block's manner.
 */
.semenka_wanted, .semenka_wanted_tally, .semenka_reclaim_counts {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
}
.semenka_wanted_tally {
	gap: 8px 32px;
	margin: 12px 0 16px;
}
.semenka_wanted_tally strong, .semenka_reclaim_counts strong {
	display: block;
	font-size: 2em;
	line-height: 1;
	color: var(--semenka-pink-text);
	font-variant-numeric: tabular-nums;
}
.semenka_wanted {
	gap: 6px;
	margin: 12px 0;
}
.semenka_wanted li[hidden] {
	display: none;
}
.semenka_wanted a {
	display: inline-block;
	padding: 6px 10px;
	background: #f4f4f6;
	border: 1px solid #d5d5d8;
	border-radius: 4px;
	text-decoration: none;
}
.semenka_wanted a:hover, .semenka_wanted a:focus-visible {
	background: var(--semenka-pink-text);
	border-color: var(--semenka-pink-text);
	color: #fff;
}
.semenka_wanted span {
	font-size: 0.85em;
	color: #666;
	margin-left: 4px;
}
.semenka_wanted a:hover span, .semenka_wanted a:focus-visible span {
	color: #fff;
}
#reclaim_wanted input[type="search"] {
	max-width: 100%;
}
.semenka_reclaim_counts {
	gap: 8px;
	margin: 8px 0;
}
.semenka_reclaim_counts li {
	flex: 1 1 130px;
	background: #fff;
	border: 1px solid #d5d5d8;
	padding: 10px 12px;
}
.semenka_reclaim_counts .semenka_reclaim_ok strong, .semenka_reclaim_badge.semenka_reclaim_ok {
	color: #1c6b2a;
}
.semenka_reclaim_counts .semenka_reclaim_bad strong, .semenka_reclaim_badge.semenka_reclaim_bad, .semenka_reclaim_typed {
	color: #a31621;
}
.semenka_reclaim_badge {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 10px;
	font-weight: 700;
	white-space: nowrap;
}
.semenka_reclaim_badge.semenka_reclaim_ok {
	background: #e3f4e5;
}
.semenka_reclaim_badge.semenka_reclaim_bad {
	background: #fbe4e6;
}
#reclaim_list td {
	overflow-wrap: anywhere;
}
#reclaim_list form + form {
	margin-top: 6px;
}
#reclaim_not_yet {
	margin-top: 16px;
}
#reclaim_not_yet summary {
	cursor: pointer;
	padding: 8px 0;
	font-weight: 700;
}
