/*
 * Alquileres-Gesell - Lavado de cara del tema /avisos/ (capa sobre main.css)
 * Paso 1: tipografia Roboto + paleta azul del sitio + cards modernas.
 * (No se toca main.css; esto sobrescribe por encima.)
 */

/* --- Tipografia del sitio (Roboto) --- */
body,
.form-horizontal input,
.form-horizontal textarea,
.form-horizontal select,
button, input, select, textarea {
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Roboto', Arial, Helvetica, sans-serif;
	color: #004D71;
	letter-spacing: 0;
}
/* el logo del header conserva su tipografia original */
#header #logo,
#header #logo a,
#header #logo span {
	font-family: "Osclass", 'Roboto', Arial, sans-serif;
}

/* --- Paleta: reemplazar el turquesa (#35c3d9) por el azul del sitio --- */
#header {
	background-color: #0060BF;
}
a { color: #01589b; }
a:hover { color: #00366C; }

.searchPaginationSelected,
.paginate a:hover {
	background-color: #0060BF !important;
	color: #fff !important;
}
ul.r-list li.active h1,
ul.r-list li.active a {
	background-color: #0060BF;
	border-color: #00477f;
	text-shadow: 0 1px 1px #00477f;
}

/* --- Cards de los listados: mas modernas --- */
.listing-grid .listing-card {
	border: 1px solid #e6e6e6;
	border-radius: 8px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.06);
	transition: box-shadow .15s ease, transform .15s ease;
}
.listing-grid .listing-card:hover {
	box-shadow: 0 6px 16px rgba(0,0,0,0.12);
	transform: translateY(-2px);
}
.listing-card h2 a,
.listing-card h3 a,
.listing-card .listing-title a {
	color: #01589b;
}

/* --- Boton "Publicar" del header: fondo blanco + texto azul legible --- */
#header .nav li.publish a {
	display: inline-block;
	background: #ffffff;
	padding: 6px 14px;
	border-radius: 4px;
	line-height: 1.2;
}
#header .nav li.publish a,
#header .nav li.publish a * {
	color: #00477f !important;
	font-weight: 700;
	text-decoration: none;
}
#header .nav li.publish a:hover {
	background: #eaf3fb;
}
#header .nav li.publish a:hover,
#header .nav li.publish a:hover * {
	color: #003257 !important;
}

/* --- Paso 2: banda del titulo responsive (sin position:absolute) --- */
body.search #content {
	padding-top: 0;
	display: flex;
	flex-direction: column;
}
body.search #content > #main { order: 1; }
body.search #content > #sidebar { order: 2; margin-top: 18px; }
body.search .list-header {
	position: static;
	height: auto;
	width: auto;
	top: auto;
	left: auto;
	margin-bottom: 12px;
}
/* Intro de categoria (texto SEO debajo del titulo) */
body.search .category-intro {
	max-width: 900px;
	margin: 0 0 18px;
	color: #444;
	font-size: 14px;
	line-height: 1.55;
}
body.search .category-intro p { margin: 0 0 8px; }

/* --- Ficha del aviso (item) --- */
#item-content h1 { font-size: 26px; color: #0060BF; margin-bottom: 14px; line-height: 1.25; }
#item-content .item-header { color: #777; font-size: 13px; margin-top: 10px; margin-bottom: 20px; }
#item-content .item-header #item_location { list-style: none; padding: 0; margin: 4px 0 0; }

/* Fotos */
.item-photos .main-photo img { max-width: 100%; height: auto; border-radius: 8px; }
.item-photos .thumbs { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.item-photos .thumbs a img { border-radius: 4px; border: 1px solid #e6e6e6; }

/* Descripcion y campos */
#item-content #description { line-height: 1.55; color: #444; }
#item-content #custom_fields .meta { padding: 3px 0; }
/* WhatsApp como boton verde */
#item-content #custom_fields .meta a[href^="https://wa.me"] {
	display: inline-block;
	background: #25D366;
	color: #ffffff !important;
	padding: 4px 12px;
	border-radius: 4px;
	font-weight: 600;
	text-decoration: none;
}
#item-content #custom_fields .meta a[href^="https://wa.me"]:hover { background: #1ebe5a; }

/* Botones principales (Contactar, etc.) en azul del sitio */
.ui-button-main,
a.ui-button-main {
	background: #0060BF !important;
	border-color: #00477f !important;
	color: #ffffff !important;
}
.ui-button-main:hover,
a.ui-button-main:hover { background: #00477f !important; }

/* Caja de informacion util */
#useful_info.bordered-box {
	border: 1px solid #e6e6e6;
	border-radius: 8px;
	background: #fafafa;
	padding: 12px 16px;
	font-size: 13px;
	color: #666;
}
#useful_info font { color: #c0392b !important; font-weight: 600; }

/* Avisos similares */
.similar_ads h2 { color: #004D71; margin-top: 20px; }

/* --- Bloque "Guia de Villa Gesell" (widget de enlaces internos, en todas las paginas) --- */
.ag-guia {
	max-width: 768px;
	margin: 26px auto 12px;
	padding: 18px 15px 4px;
	border-top: 1px solid #e6e6e6;
	text-align: center;
}
.ag-guia-home {
	display: inline-block;
	background: #0060BF;
	color: #ffffff !important;
	font-weight: 700;
	font-size: 15px;
	padding: 10px 22px;
	border-radius: 24px;
	text-decoration: none;
	margin-bottom: 14px;
	transition: background .15s ease;
}
.ag-guia-home:hover,
.ag-guia-home:focus { background: #00477f; color: #ffffff !important; }
.ag-guia-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}
.ag-guia-links a {
	display: inline-block;
	border: 1px solid rgba(0,96,191,0.35);
	border-radius: 20px;
	padding: 8px 16px;
	font-size: 14px;
	color: #01589b;
	background: #f4f9ff;
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.ag-guia-links a:hover,
.ag-guia-links a:focus {
	background: #0060BF;
	color: #ffffff;
}

/* --- Formulario de publicar / editar aviso --- */
body.item-post .form-container.form-horizontal {
	background: #fff;
	border: 1px solid #e6e6e6;
	border-radius: 8px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.06);
	padding: 4px 22px 22px;
}
body.item-post .form-container .header h1 {
	font-size: 24px;
	color: #0060BF;
	margin: 14px 0 6px;
}
body.item-post .form-container h2 {
	font-size: 16px;
	color: #004D71;
	border-bottom: 1px solid #e6e6e6;
	padding-bottom: 6px;
	margin: 22px 0 14px;
}
body.item-post .control-group { margin-bottom: 14px; }
body.item-post .control-label {
	font-weight: 600;
	color: #333;
}
/* inputs, textareas y selects del formulario */
body.item-post .controls input[type="text"],
body.item-post .controls input[type="email"],
body.item-post .controls input[type="number"],
body.item-post .controls textarea,
body.item-post .controls select {
	border: 1px solid #cfd6dd;
	border-radius: 4px;
	padding: 7px 9px;
	max-width: 100%;
	box-sizing: border-box;
	transition: border-color .15s ease, box-shadow .15s ease;
}
body.item-post .controls input[type="text"]:focus,
body.item-post .controls input[type="email"]:focus,
body.item-post .controls input[type="number"]:focus,
body.item-post .controls textarea:focus,
body.item-post .controls select:focus {
	border-color: #0060BF;
	box-shadow: 0 0 0 2px rgba(0,96,191,0.15);
	outline: none;
}
/* leyenda del formato de WhatsApp */
body.item-post .wa-hint {
	color: #777;
	font-size: 12px;
	margin-top: 4px;
}

/* --- Zona de carga de imagenes / fotos (centrada + identidad azul) --- */
body.item-post .photos_div { text-align: center; }
body.item-post .form-container .ui-drop-files,
body.item-post .ui-drop-files {
	width: 100%;
	max-width: 420px;
	margin: 6px auto 0;
	height: auto;
	min-height: 90px;
	padding: 20px 16px;
	box-sizing: border-box;
	line-height: 1.4;
	font-size: 15px;
	font-weight: 600;
	color: #0060BF;
	background: #f0f6fc;
	border: 2px dashed #9cc3e8;
	border-radius: 8px;
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
}
body.item-post .form-container .ui-drop-files:hover,
body.item-post .ui-drop-files:hover {
	background: #e4eefb;
	border-color: #0060BF;
}
body.item-post .photos_div a { color: #0060BF; }

/* --- Responsive: en movil las etiquetas van arriba del campo --- */
@media (max-width: 767px) {
	body.item-post .control-label {
		float: none;
		width: auto;
		text-align: left;
		margin-bottom: 4px;
	}
	body.item-post .controls {
		margin-left: 0;
	}
	body.item-post .wa-hint { margin-left: 0 !important; }
}