@font-face {
	font-family: "FC Paragraph";
	src: url("../fonts/FCParagraph-Regular.ttf");
}

@font-face {
	font-family: "FC Subject";
	src: url("../fonts/FCSubject-Bold.ttf");
}

:root {
	--border-radius-box: 6px;
	--border-color-custom: 1px solid #d9dade;

	--group-tag-text-color: #fff;
	--group-tag-bg-color: #7a8ad4;
}

html {
	min-width: 380px;
	scroll-behavior: smooth !important;
}

/* bluma config color */
.is-primary {
	background-color: #001b38 !important;
}

.is-secondary {
	background-color: #71ca70 !important;
}

.has-text-primary {
	color: #001b38 !important;
}

.has-text-secondary {
	color: #71ca70;
}

/* A little extra style to make it look even closer to the image */
body {
	background-color: #eeeff6;
	color: #2c3e50;
	font-family: FC Paragraph;
}

/* section.section {
	padding-top: 1rem;
} */
/* .logo-img {
    max-height: 50px;
} */
/* Style for the filter box */
.box {
	background-color: #ffffff; /* Explicit white background */
	box-shadow: none; /* Remove the default shadow to make it flat */
	--bulma-box-background-color: var(--bulma-scheme-main);
	--bulma-box-color: unset;
	--bulma-box-radius: unset;
	--bulma-box-shadow: unset;
	--bulma-box-padding: 0.75rem;
	--bulma-box-link-hover-shadow: unset;
	--bulma-box-link-active-shadow: unset;
	border-radius: 12px;
	border: 1px solid #c2c5c9;
	display: block;
	padding: var(--bulma-box-padding);
}

/* This is the new rule to force inputs/selects inside the box to have a white background */
.box .input,
.box .select select {
	background-color: #ffffff;
	color: #2c3e50;
	border: 1px solid #cacad0;
	font-family: "FC Paragraph";
}
.label {
	color: #2c3e50;
}
.control .button {
	/* background-color: #ffffff; */
}
.button {
	color: #fff;
}
.title {
	color: #2c3e50;
	font-weight: 500;
}

.content strong {
	color: #2c3e50;
}
.news-item {
	/* border: 1px solid #dbdbdb; */
	/* border-radius: 6px; */
	padding: 1.25rem;
	margin-bottom: 1.5rem;
	background-color: white;
	box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.05);
}
.news-item:hover {
	box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1);
}
.metric-icon {
	margin: 0 0.5rem;
}
.source-logo {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid #eee;
}
.bg-lightblue {
	background-color: #eef1fd;
}

.text-big {
	/* font-size: 1.5em; */
	font-size: 1.4em;
	font-weight: bold;
}

.has-text-grey-light,
.is-color-grey-light {
	color: unset !important;
}

/* header.php */
.info .dropdown-trigger.info button {
	min-width: 120px;
}

.info .dropdown-trigger.info span {
	color: #000;
}

.info #dropdown-logout .dropdown-item.logout:hover {
	background-color: #f0f2f4;
	/* font-weight: 600; */
}

.info .dropdown-item.email {
	font-size: 14px;
}

.info .dropdown-item.logout {
	font-size: 14px;
	color: red;
}

.info button.button:hover {
	background-color: #f4f4f4;
}

.info .dropdown-fit {
	min-width: fit-content;
}

.info .dropdown-fit .dropdown-content {
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
}
/***************/
section.header .banner {
	padding: 24px;
	background-color: #112d52;
	height: 190px;
}

section.header .title {
	color: white;
	font-weight: 400;
	font-size: 24px;
}

section.header .header-logo {
	width: 150px;
	height: 150px;
	border-radius: 12px;
}

section.header .filter {
	color: #031932;
}

section.header .topic {
	width: 100%;
}

section.header .topic .level-left {
	width: 80%;
}

.label {
	font-weight: 500;
}
/*****************************************/
/* action_admin.php */
section.admin .box {
	background-color: #f1fff0;
}

section.admin .title {
	font-size: 20px;
	font-weight: 500;
}

section.admin .button {
	min-width: 140px;
}

/* custom dropdown multiselect */
section.admin .dropdown.dropdown.multi-dropdown {
    display: block;
    box-shadow: none;
}

section.admin .dropdown.multi-dropdown .dropdown-content {
	height: 300px;
	overflow-y: auto;
	scrollbar-width: thin;
}

section.admin .dropdown.multi-dropdown .dropdown-item {
	cursor: pointer;

	&:hover {
		background-color: #f7f7f7;
	}
}

section.admin button.multi-select {
    color: #2c3e50;
    box-shadow: none;
}

.big-checkbox-dropdown {
	width: 16px;
	height: 16px;
	cursor: pointer;
	transition: all 0.2s ease;

	&:hover {
		box-shadow: 0 0 4px #007bff;
		border: 2px solid #007bff;
		background-color: #e6f0ff;
	}
}

/*****************************************/
/* filter.php */
section.filter .title {
	font-size: 20px;
	font-weight: 500;
}
.is-flex-basis-1 {
	flex: 1 1 auto !important;
}

.is-select-active {
	color: #000;
	font-weight: 700;
	background-color: #f6fff4 !important;
}

.filter.title {
	font-weight: 500;
}

.text-dxt {
	color: #c1c1c9;
	font-size: 12px;
	width: fit-content;
}

.button-group {
	display: flex;
	justify-content: space-between;
	width: 100%;
	gap: 1rem !important;
}

.button-group .button {
	font-weight: 400;
}

.filter-select {
	min-width: 140px;
}

.filter-select:hover,
.filter-status:hover {
	background-color: #f0f2f4 !important;
}

.filter-select option,
.filter-status option {
	background-color: #fff;
}

.dropdown-item,
.dropdown-item input,
.dropdown-item label {
	font-size: 16px;
}

.dropdown-item.custom,
.dropdown-item.apply-btn {
	cursor: auto;
}

.dropdown-item.custom input {
	cursor: pointer;
}

.box.status {
	border-radius: 4px;
	border: 1px solid #cacad0;
}

/* custom dropdown */
.dropdown-trigger button {
	border: 1px solid #cacad0;
}

.select-is-danger {
	border-color: #ff3860 !important;
}
.select-is-danger:focus {
	border-color: #ff3860 !important;
	box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25) !important;
}

.select-is-danger::after {
	border: 0.125em solid #ff3860 !important;
}

input#fromDateInput,
input#toDateInput {
    position: relative;
    display: block !important;
    /* color: transparent; */
}

/* input#fromDateInput:before,
input#toDateInput:before {
    position: absolute;
    content: attr(data-date);
    display: inline-block;
    color: #2e333d;
} */
/*****************************************/
/* chart.php */
.section.chart {
	--bulma-section-padding-desktop: 0;
}

.section.chart .title {
	font-weight: 400;
}

.section.chart .mentions {
	height: 100%;
}

.total-container {
	display: flex;
	justify-content: center;
	align-items: center;
	height: inherit;
	margin-top: -1rem;
}
.grand-total {
	min-width: fit-content;
}

.div-toggle {
	border-radius: var(--border-radius-box);
	border: var(--border-color-custom);
	height: 40px;
	align-items: center;
	display: flex;
	gap: 0.5rem;

	background-color: #fff;
}

/* mention button */
.go-to-mentions:disabled {
	background-color: #dfdfe9;
	cursor: auto;
}

.go-to-mentions:disabled .fa-circle-down {
	color: #555b6b !important;
}

/* custom toggle */
.toggle-2 {
	display: inline-block;
}

.toggle-2__input {
	display: none;
}

.toggle-2__button {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;

	width: 65px;
	height: 28px;
	padding: 0 10px;

	background-color: #545f6f;
	border-radius: 20px;
	color: white;
	cursor: pointer;
	font-size: 0.9rem;
	text-transform: uppercase;
	transition: background 0.3s ease;
}

/* ON appears on the left */
.toggle-2__text.on {
	order: 1;
}

/* OFF appears on the right */
.toggle-2__text.off {
	order: 2;
	margin-left: 20px;
}

/* Hide ON by default */
.toggle-2__button .on {
	display: none;
}

/* Show ON, hide OFF when checked */
.toggle-2__input:checked + .toggle-2__button .on {
	display: inline;
}
.toggle-2__input:checked + .toggle-2__button .off {
	display: none;
}

/* Toggle knob */
.toggle-2__button::before {
	content: "";
	position: absolute;
	top: 3px;
	left: 4px;
	width: 22px;
	height: 22px;
	background-color: #fff;
	border-radius: 50%;
	transition: left 0.3s ease;
}

/* Move knob to right when checked */
.toggle-2__input:checked + .toggle-2__button::before {
	left: calc(100% - 26px);
}

/* Active background */
.toggle-2__input:checked + .toggle-2__button {
	background-color: #71ca70;
}

/*****************************************/
/* table.php */
.box.table {
	border-radius: 4px;
	border: none;
	box-shadow: 2px 2px 6px 3px #e4e4e7;
}
.v-value,
.pr-value {
	color: #2e333d;
}

.pr-value-icon::before {
	content: "V";
}

.reach-icon::before {
	content: "R";
}

.pr-value-icon,
.reach-icon {
	display: inline-flex;
	justify-content: center;
	align-items: center;

	width: 21px;
	height: 21px;

	background-color: #001b3a;
	color: white;

	border-radius: 50%;
	font-weight: bold;
	font-size: 10px;
}

.v-value .pr-value-icon,
.v-value .reach-icon,
.v-publish-icon {
	margin-left: 2.5rem;
}

.table-title {
	color: #626874;
	font-weight: 600;
	font-size: 22px;
}

.reach-text {
	font-size: 16px;
}

.news-icon {
	width: 18px;
}

.icon-box {
	display: contents;
	text-wrap-mode: nowrap;
}

.open-pdf {
	font-size: 16px;
}

.level-left.checkbox {
	margin-left: 16px;
	min-width: 170px;
	max-width: fit-content;
	background-color: white;
	padding: 8px 8px 8px 16px;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
	/* box-shadow: 0px -4px 6px rgba(0, 0, 0, 0.1); */
}

#countDisplay {
	max-width: fit-content;
	display: inline-block;
	min-width: 24px;
	text-align: right;
	font-variant-numeric: tabular-nums;

	color: #2e333d;
}

/* table of data */
.source-name {
	padding-left: 1px;
	max-width: 80%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: inline-block;

	color: #242424;
}

.column.name {
	font-size: 14px;

	color: #242424;
}

.column.headline {
	color: #000;
	font-size: 15px;
	min-height: 140px;

	/* &:hover {
		color: #363636;
	} */
}

.column.headline .title {
	display: inline-table;
	line-height: 1.5;
}

.column.headline .title a {
	color: #000;
	font-size: 16px;
	font-family: "FC Subject";
	font-weight: 500;
	cursor: pointer;

	&:hover {
		color: #4d94df;
		text-decoration: underline;
	}

	/* &:visited {
		color: #551a8b;
	} */
}

.column.headline .hit-sentence a {
	color: #363636;
	font-weight: 400;
}

.striped-rows {
	margin: 0.5rem;
}

.striped-rows:nth-child(even) {
	background-color: #edeffe;
}

.group-tag {
	font-style: italic;
	font-size: 12px;
	cursor: auto;
	text-wrap-mode: nowrap;
	/* color: var(--group-tag-text-color);
	background-color: var(--group-tag-bg-color);

	padding: 0px 12px;
	border-radius: 16px; */
}

.tags {
	display: contents;
	color: #a3a6ab;
}

.buttons.is-right button {
	width: 120px;
}

.buttons [name="btn_previous"]:hover,
.buttons [name="btn_next"]:hover {
	background-color: #10c10f !important;
	border-color: #10c10f !important;
}
/* highlight */
span.hl {
	margin-right: 2px;
	background-color: #c4f551 !important;
}

/* to to top button */
.btn-to-top {
	position: fixed;
	bottom: 16px;
	right: 20px;
	z-index: 999;
	background-color: #001b38;
	color: white;
	border: none;
	border-radius: 50%;
	padding: 16px 16px;
	cursor: pointer;
	display: none;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
	transition: background-color 0.3s;
}

/* modal */
.modal-card {
	width: calc(100vw - 30%);
	/* height: 65%; */

	min-width: 300px;
	min-height: 600px;
	max-height: 65%;
}

.modal-background {
	background-color: #090a0c80;
}

.modal-card-head button.m-pdf {
	font-size: 12px;
	/* transition: transform 0.2s ease; */

	&:hover {
		background-color: #01346b !important;
		/* transform: scale(1.2); */

		/* transform: translateY(-0.5px); */
	}
}

.modal-card-body {
	scrollbar-width: thin;
}

#m-headline {
	font-size: 20px;
	font-weight: bold;
	line-height: 1.5;
}

div#fullTextContent,
#fullTextContent p {
	line-height: 1.75;
	text-indent: 29;
	margin: revert;

	white-space: pre-wrap;
}

#fullTextContent div,
p,
blockquote {
	margin-bottom: 1rem;
}
/* #fullTextCOntent */

/*****************************************/
/* footer.php */
footer.footer {
	/* background-color: transparent; */
	background-color: #eeeff6;
	color: #2c3e50;
	padding: 1rem !important;
}

footer .columns {
	display: flex;
}

footer a {
	text-wrap-mode: nowrap;
}

.content-footer .contact {
	font-size: 1.2em;
}

.content-footer a {
	color: #767d90;
	cursor: pointer;
	text-decoration: none;
}

.content-footer a:hover {
	color: #363636;
}

/* loading */
.loader-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #00000045;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9999;
}

.loader {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: block;
	margin: 15px auto;
	position: relative;
	color: #f1f1f1;
	left: -100px;
	box-sizing: border-box;
	animation: shadowRolling 2s linear infinite;

	border: 0;
}

@keyframes shadowRolling {
	0% {
		box-shadow: 0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0),
			0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
	}
	12% {
		box-shadow: 100px 0 white, 0px 0 rgba(255, 255, 255, 0),
			0px 0 rgba(255, 255, 255, 0), 0px 0 rgba(255, 255, 255, 0);
	}
	25% {
		box-shadow: 110px 0 white, 100px 0 white, 0px 0 rgba(255, 255, 255, 0),
			0px 0 rgba(255, 255, 255, 0);
	}
	36% {
		box-shadow: 120px 0 white, 110px 0 white, 100px 0 white,
			0px 0 rgba(255, 255, 255, 0);
	}
	50% {
		box-shadow: 130px 0 white, 120px 0 white, 110px 0 white, 100px 0 white;
	}
	62% {
		box-shadow: 200px 0 rgba(255, 255, 255, 0), 130px 0 white, 120px 0 white,
			110px 0 white;
	}
	75% {
		box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0),
			130px 0 white, 120px 0 white;
	}
	87% {
		box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0),
			200px 0 rgba(255, 255, 255, 0), 130px 0 white;
	}
	100% {
		box-shadow: 200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0),
			200px 0 rgba(255, 255, 255, 0), 200px 0 rgba(255, 255, 255, 0);
	}
}

.radio-wrapper {
	margin-bottom: 10px;
}

.radio-group-flex {
	display: flex;
	gap: 30px; /* space between options */
}

span#lb_selected {
	font-size: smaller;
	/* font-style: italic; */
	color: #025bb9;
}

/* responsive */
@media screen and (max-width: 1215px) {
	.v-value .pr-value-icon,
	.v-value .reach-icon,
	.v-publish-icon {
		margin-left: 0;
	}
}
@media screen and (max-width: 860px) {
	section.header .topic .level-left {
		width: 75%;
	}
}

@media screen and (max-width: 768px) {
	section.header .topic .level-left {
		width: 60%;
	}
	.search-input {
		margin-top: 18px;
	}

	.header .level-left,
	.level {
		flex-direction: row !important;
	}

	/* filter */
	.column.status {
		padding-top: 12px;
	}

	.div-btn-group {
		flex-direction: row;
	}

	.section.chart .mentions {
		height: max-content;
	}

	.total-container {
		margin-top: 0px;
	}

	/* table.php */
	.column.reach {
		font-size: 14px;
	}

	.pr-value {
		flex-direction: row;
		margin-top: 1.5rem;
	}

	.v-value {
		justify-content: flex-start !important;
	}

	.v-value .pr-value-icon,
	.v-value .reach-icon,
	.v-publish-icon {
		margin-right: 0.75rem;
	}

	.display-time {
		margin-top: 0.75rem !important;
	}

	.level-left.checkbox {
		flex-direction: row;
		height: -webkit-fill-available;
	}
}

@media screen and (max-width: 550px) {
	.checkbox-pr-value {
		flex-direction: column-reverse !important;
	}
	.section.header .topic {
		flex-direction: column !important;
	}

	section.header .topic .level-left {
		width: 100%;
		justify-content: center;
	}

	.modal-card .m-info {
		flex-direction: column;
		align-items: flex-start !important;
	}

	.modal-card .m-info #m-line {
		display: none;
	}
}

@media screen and (max-width: 445px) {
	/* header.php */
	section.header .header-logo {
		width: 120px;
		height: 120px;
	}

	/* filter.php */
	.div-btn-group {
		flex-direction: row;
		align-items: start;
		font-size: 11px;
	}

	.toggle-2__button {
		height: 24px;
		font-size: 12px;
		padding: 0 16px;
	}

	.toggle-2__button::before {
		width: 18px;
		height: 18px;
	}
	.toggle-2__input:checked + .toggle-2__button::before {
		left: calc(100% - 22px);
	}

	/* table.php */
	.table-title {
		font-size: 20px;
	}

	.buttons.is-right {
		justify-content: center;
	}
}
