/**
* Copyright (C) 2000 - 2024 Silverpeas
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* As a special exception to the terms and conditions of version 3.0 of
* the GPL, you may redistribute this Program in connection with Free/Libre
* Open Source Software ("FLOSS") applications as described in Silverpeas's
* FLOSS exception. You should have received a copy of the text describing
* the FLOSS exception, and it is also available here:
* "http://www.silverpeas.org/docs/core/legal/floss_exception.html"
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/

#classifieds #categories {
	padding-top: 1em;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
}

#classifieds #categories>div {
	margin-bottom: 1em;
	background-color: var(--bgColor-bloc-fond-clair);
	border: 1px solid var(--border-color-bloc-fond-clair);
	margin-right: 1em;
	flex-basis: 24em;
}

#classifieds #categories .categoryTitle {
	background: var(--bgColor-header-bloc);
	color: var(--color-titre-bloc-header);
	height: auto;
	text-align: center;
	text-transform: uppercase;
	line-height: 1.2em;
	padding: 0.25em;
}

#classifieds #categories .categoryTitle a {
	color: var(--color-titre-bloc-header);
	font-weight: bold;
}

#classifieds #categories .newClassified,
#classifieds #categories .ViewAllClassifiedsByCategory {
	padding: 0.25em;
	text-align: center;
}

#classifieds #categories .ViewAllClassifiedsByCategory a:before,
#classifieds #categories .newClassified a:before {
	content: '';
	display: inline-block;
	background: transparent url(../../../util/icons/component/classifiedsSmall.gif) center 0 no-repeat;
	width: 16px;
	min-height: 16px;
	height: 1em;
	vertical-align: middle;
}

#classifieds #categories .ViewAllClassifiedsByCategory a,
#classifieds #categories .newClassified a {
	text-decoration: underline;
	color: var(--color-lien-action);
}

#classifieds #categories .ViewAllClassifiedsByCategory a:hover,
#classifieds #categories .newClassified a:hover,
#classifieds #categories .ViewAllClassifiedsByCategory a:focus,
#classifieds #categories .newClassified a:focus {
	color: var(--color-action);
}


#classifieds #categories .newClassified a:before {
	background: transparent url(../../../util/icons/newsFeed_publication.gif) center 0 no-repeat;
}

#classifieds #categories .categoryContent ul,
.list_result_classifieds {
	list-style-type: none;
	margin: 0.5em 0 0;
	padding: 0;
}

#classifieds #categories .categoryContent ul li {
	margin: 0 0 1em 0.5em;
	padding: 0;
}

#classifieds #categories .categoryContent ul li a:before,
.list_result_classifieds li:before {
	width: 0.5em;
	height: 0.5em;
	content: '';
	background-color: rgb(161, 161, 161);
	display: inline-block;
	margin-right: 0.5em;
}

.list_result_classifieds li {
	margin-bottom: 0.5em;
}

.title_result_classifieds {
	display: block;
	font-weight: bold;
}

#classifieds #categories .categoryContent .emptyCategory {
	padding: 0.25em 0.25em 0.5em 0.25em;
	display: block;
	font-style: italic;
	color: var(--color-text-second-niveau);
}

.categoryContent .date {
	color:var(--color-text-date);
}

hr.clear {
	border: 0 none;
	clear: both;
	display: block;
	height: 0;
	margin: 0;
	padding: 0;
	line-height: 0;
	visibility: hidden;
}

div.tableBoard {
	padding: 0.25em;
}

.emptyCategory {
	color:var(--color-text-second-niveau);
}

#classifieds_rich_list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: initial;
	align-content: flex-start;
	list-style-type: none;
	padding: 0;
	margin: 0;
}

#classifieds_rich_list li {
	float: left;
	flex-grow: 1;
	flex-basis: 320px;
	background-color: var(--bgColor-bloc-fond-clair);
	border: 1px solid var(--border-color-bloc-fond-clair);
	margin: 0 2em 2em 0;
	padding: 0.5em;
	height: auto;
	position: relative;
	z-index: 1;
	cursor: pointer;
	overflow: hidden;
	max-width: 50%;
}

#classifieds_rich_list li:hover {
	background-color: #FFF;
	border-color:var(--border-color-bloc-fond-clair-hover);
}

#classifieds_rich_list li .classified_thumb {
	width: 92px;
	border: 3px solid var(--border-color-bloc-fond-clair);
	overflow: hidden;
	height: 68px;
	position: relative;
	margin: 0.5em;
	float: left;
}

#classifieds_rich_list li .classified_thumb img {
	width: 92px;
	position: absolute;
	top: 0;
	left: 0;
	border: 0px;
}

#classifieds_rich_list .classified_info {
	margin-left: 100px;
	margin-right: 4em;
}

#classifieds_rich_list .add-without-image .classified_info {
	margin-left: 0;
}

#classifieds_rich_list h4 {
	margin: 0 0 0.5em 0;
	padding: 0;
	font-size: 1.25em;
	font-weight: normal;
}

#classifieds_rich_list h4 a {
	font-size: 1em;
}

#classifieds_rich_list .classified_type a {
	background-color: var(--bgColor-etiquette);
	border-radius: var(--radius-etiquette);
	color: var(--color-text-etiquette);
	display: inline-block;
	font-size: 0.9em;
	line-height: 1em;
	margin: 0 0.25em 0.15em 0;
	padding: 0.35em 0.5em;
	position: relative;
	z-index: 10;
}

#classifieds_rich_list .classified_type a:hover {
	background-color: var(--bgColor-hover-etiquette);
	color: var(--color-text-hover-etiquette);
}

#classifieds_rich_list .classified_creationInfo {
	position: absolute;
	bottom: 0.5em;
	right: 0.5em;
	color:var(--color-text-date);
}

#classifieds_rich_list .classified_price {
	position: absolute;
	top: 0.5em;
	right: 0.5em;
	color: #FFF;
	font-size: 1.15em;
	font-weight: bold;
	padding: 0.15em 0.5em;
	background-color:var(--color-lien-action) ;
	float: left;
	border-radius:var(--radius-etiquette);
}

#pagination {
	clear: left
}

/*** fiche presentation ***/
.classified_fiche {
	position: relative;
}

.principalContent .classified_photos {
	width: 30%;
	float: left;
}

.principalContent .classified_title {
	color:var(--color-titre);
	font-size:1.3em;
	font-weight: bold;
	padding: 0;
	margin: 0 0 1em;
}

.principalContent .classified_description {
	border-left: var(--border-left-size-description) solid var(--border-left-color-description);
	padding-left:var(--padding-left-description);
	color:var(--color-text-description);
	text-align: justify;
	float: left;
	width: 66%;
}

.principalContent .classified_price {
	position: absolute;
	top: 0.5em;
	right: 0.5em;
	color: #FFF;
	font-size: 1.25em;
	font-weight: bold;
	padding: 0.5em;
	float: left;
	background-color:var(--color-lien-action) ;
	border-radius:var(--radius-etiquette);
}

.principalContent .classified_thumbs {
	height: 38px;
}

.principalContent .classified_thumbs a.selected {
	border: 1px solid var(--color-action);
}

.principalContent .classified_thumbs a {
	width: 52px;
	height: 36px;
	background-color:var(--bgColor-bloc-fond-clair);
	float: left;
	display: block;
	overflow: hidden;
	border: 1px solid var(--color-lien-action);
	text-align: center;
	margin-right: 11px;
}

.principalContent .classified_selected_photo {
	width: 90%;
	border: 3px solid var(--border-color-bloc-fond-clair);
	margin-top: 1em;
	text-align: center;
	height: auto;
	clear: left;
}

.principalContent .classified_selected_photo img {
	width: 100%;
	height: auto;
	border: 0;
}

.principalContent .classified_thumbs a img {
	height: 36px;
	width: auto;
	border: 0;
}


.principalContent #classified_content_form td {
	font-size: 1.15em;
	line-height: 1.5em;
}

.principalContent #classified_content_form .txtlibform {
	font-size: 1.05em;
	line-height: 1.5em;
}

.principalContent #classified_content_form .forms .fields {
	width: auto;
	float: left;
}

#classified_contact_link {
	border-radius:var(--radius-btn);
	padding: 0.5em;
	display: inline-block;
	margin: 1em 1em 0;
}

#classified_contact_link a {
	background: transparent url("/silverpeas/util/icons/email.gif") 2px -2px no-repeat;
	padding: 0 10px 0 22px;
	display: inline-block;
}

#classified_info #permalinkInfo {
	margin-bottom: 1em;
}

#classified_info #permalinkInfo img {
	border: 0;
}


#classified_info #permalinkInfo input {
	width: 100%;
}


.rightContent .other_classified h4 {
	background: url("/silverpeas/util/icons/component/classifiedsSmall.gif") no-repeat scroll right top transparent;
	height: 16px;
}

.rightContent .other_classified .classifieds_other_list h4 {
	background: url();
	padding: 0 56px 0;
	margin: 0;
}

.rightContent .classifieds_other_list h4 a {
	color: #333;
}

.rightContent .classifieds_other_list {
	list-style-type: none;
	padding: 0;
	margin: 11px 0 5px;
}

.rightContent .classifieds_other_list li {
	padding: 0px 17px 6px;
	margin: 0;
	min-height: 40px;
	position: relative;
	cursor: pointer;
}

.rightContent .classifieds_other_list .classified_price {
	font-size: 1.25em;
	font-weight: bold;
	padding: 0.5em;
	float: left;
	position: absolute;
	top: 0;
	right: 17px;
	color: #FFF;
	background-color:var(--color-lien-action) ;
	border-radius:var(--radius-etiquette);
}

.rightContent .classifieds_other_list .classified_thumb {
	width: 48px;
	height: 36px;
	overflow: hidden;
	border: 1px solid var(--color-lien-action);
	position: absolute;
	top: 0;
	left: 17px;
}

.rightContent .classifieds_other_list .classified_thumb img {
	width: 48px;
}

.rightContent .other_classified {
	padding-bottom: 11px;
}

/**  formulaire de creation **/
#classifiedInfo legend {
	background: transparent url(../../../kmelia/jsp/icons/mini_publi.gif) 11px 0px no-repeat;
}

#pubThumb legend {
	background: url("../../../util/icons/images.png") no-repeat scroll 11px 0 transparent;
}

#specifiedInfo legend {
	background: url("../../../util/icons/component/formsOnlineSmall.gif") no-repeat scroll 11px 0 transparent;
}

#classifiedNumberArea,
#classifiedNameArea,
#descriptionArea,
#creationDateArea,
#updateDateArea,
#validationDateArea,
#mandatoryArea,
.field.thumb {
	clear: both;
	display: block;
	float: none;
	width:100%;
}

.thumbnailInputs {
	clear: both;
}

.thumbnailInputs img,
.thumbnailInputs input,
.thumbnailInputs select {
	vertical-align: middle;
}

.thumbnailPreviewAndActions {
	background-color: var(--bgColor-thumb);
	border: 1px solid var(--border-color-thumb);
	float: left;
	margin-left: 0;
	padding: 3px;
	margin-bottom: 3px;
}

.thumbnailPreview {
	float: left;
}


#thumbnailActions {
	float: left;
	margin-left: 4px;
}

#thumbnailActions a {
	display: block;
	margin-bottom: 5px;
}

#thumbnailActions img {
	vertical-align: middle;
}

.thumbnailPreview .thumbnail {
	height: 50px;
	border: 1px solid var(--border-color-thumb);
}

.classifiedForm .table {
	margin-bottom: 15px
}

.rightContent #pagination {
	padding: 0.83em 0;
	line-height: 1.2em;
	text-align: right;
}

/** portlet view **/
.classifieds-portletView .cellOperation,
.classifieds-portletView #menubar-creation-actions,
.classifieds-portletView #info {
	display: none !important;
}

.classifieds-portletView .hautFrame {
	padding: 0;
}

.classifieds-portletView #classifieds_rich_list li {
	max-width: 42%;
}