/*
 * Zafferano Leprotto - WordPress specific styles.
 * Everything that Joomla extensions (widgetkit, mod_postit, ZOO rating, com_contact) added inline
 * or from their own assets, plus WordPress markup that has no Warp counterpart.
 */

/* Header bubble (was widgetkit slideset)
----------------------------------------------------------------------------------------------------*/
.slideset-top-a-leprotto .lep-bubble { position: relative; height: 0; }
#block-header #top-a .module.mod-box { background: none; box-shadow: none; border: 0; min-height: 20px; }

/* Logo */
#logo p { margin: 0; }
#logo img { border: 0; }

/* Menu: the dropdown is opened by :hover (CSS) or by the .remain class (touch) */
.menu-dropdown li.parent > a.level1 { cursor: pointer; }
.lep-menu-toggle, .lep-offcanvas { display: none; }

/* Sidebar
----------------------------------------------------------------------------------------------------*/
.lep-social { margin: 0 auto; width: 50%; overflow: hidden; text-align: center; }
.lep-social a { display: inline-block; margin: 0 6px; }
.lep-social img { border: 0; vertical-align: middle; }
#sidebar-b .lep-block-html img { max-width: 100%; height: auto; }

/* Post-it (was mod_postit) */
.lep-postit {
	position: relative;
	margin: 20px 8px 10px;
	padding: 20px 10px 10px;
	background-color: #fae989;
	color: #3751a3;
	font-family: "Comic Sans MS", "Comic Sans", "Chalkboard SE", cursive;
	line-height: 24px;
	-webkit-box-shadow: 5px 5px 7px #cbab1a;
	box-shadow: 5px 5px 7px #cbab1a;
}
.lep-postit .lep-pin { position: absolute; top: -15px; left: 55%; width: 31px; height: 42px; margin-left: -15px; }
.lep-postit .lep-postit-body p { margin: 0 0 8px; color: inherit; font: inherit; }
.lep-postit .lep-postit-body p:last-child { margin-bottom: 0; }
.lep-postit a { color: #ed1c24; text-decoration: none; }
.lep-postit a:hover { text-decoration: underline; }

/* Content
----------------------------------------------------------------------------------------------------*/
#system .content img { max-width: 100%; height: auto; }
#system .content img[style*="float: left"], #system .content img.align-left { margin: 0 10px 10px 0; }
#system .lep-section-list { margin: 10px 0 0 20px; }
#system .lep-section-list li { margin-bottom: 6px; }
#system article.item .content h3 { color: #ed1c24; }

/* ZOO rating element: stars sprite (was media/zoo/elements/rating) */
.yoo-zoo.rating .rating-container { position: relative; }
.yoo-zoo.rating .current-rating a.stars { display: block; position: absolute; top: 0; left: 0; height: 20px; cursor: pointer; text-indent: -9999px; }
.yoo-zoo.rating .current-rating a.star1 { width: 20%; z-index: 6; }
.yoo-zoo.rating .current-rating a.star2 { width: 40%; z-index: 5; }
.yoo-zoo.rating .current-rating a.star3 { width: 60%; z-index: 4; }
.yoo-zoo.rating .current-rating a.star4 { width: 80%; z-index: 3; }
.yoo-zoo.rating .current-rating a.star5 { width: 100%; z-index: 2; }
.yoo-zoo.rating .current-rating a.stars:hover { background: url(../images/zoo/rating-stars.png) 0 -40px repeat-x; }
.yoo-zoo.rating[data-interactive="0"] .current-rating a.stars { cursor: default; }
.yoo-zoo.rating.is-busy { opacity: .6; }

/* Recipe page: keep the ZOO layout of positions */
#yoo-zoo .item .pos-header .element-rating { margin-bottom: 5px; }
#yoo-zoo .item .pos-media img { width: 400px; height: auto; max-width: 100%; }
#yoo-zoo .teaser-item .pos-media img { width: 250px; height: auto; }
#yoo-zoo .items .row { margin-left: 0; margin-right: 0; }
#yoo-zoo .items .row .width100 { float: none; width: auto; }

/* Contact page (was com_contact + bootstrap accordion) */
.contact .page-header { border: 0; margin: 0 0 10px; padding: 0; }
.contact .page-header h2 { color: #ed1c24; margin: 0 0 10px; }
.contact .contact-details { margin-bottom: 20px; }
.contact .thumbnail.pull-right { float: right; margin: 0 0 10px 20px; border: 0; padding: 0; box-shadow: none; background: none; }
.contact .contact-address { margin: 0; }
.contact .contact-address dd { margin: 0 0 4px; }
.lep-contact-form .well { background: none; border: 0; box-shadow: none; padding: 0; margin: 0; }
.lep-contact-form legend { display: none; }
.lep-contact-form .control-group { margin-bottom: 8px; }
.lep-contact-form .control-label label { display: block; font-weight: bold; margin-bottom: 2px; }
.lep-contact-form .control-label .star { color: #ed1c24; }
.lep-contact-form input[type="text"], .lep-contact-form input[type="email"] { width: 300px; max-width: 100%; }
.lep-contact-form textarea { width: 100%; max-width: 420px; }
.lep-contact-form .alert { padding: 8px 14px; margin-bottom: 15px; border-radius: 4px; background: #fdefcc; color: #744229; }
.lep-contact-form .alert-success { background: #d4edda; color: #155724; }
.lep-contact-form .alert-error { background: #f8d7da; color: #721c24; }
.lep-contact-form .button { background-color: #ed1c24; color: #fff; padding: 6px 14px; border: 0; border-radius: 4px; cursor: pointer; }
.lep-required-note { font-size: 11px; color: #744229; }

/* Search results */
#system h1.title + p.meta { margin-top: -10px; color: #744229; }

/* Footer */
#footer .desktop-footer-leprotto p { margin: 0; }

/* Screen-reader helpers */
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }

/* WordPress admin bar */
body.admin-bar #block-header { margin-top: 0; }

/* Galleries converted from Joomla widgetkit shortcodes ([widgetkit id=N])
----------------------------------------------------------------------------------------------------*/
.lep-gallery { position: relative; margin: 15px 0 25px; clear: both; }
.lep-gallery figure { margin: 0; text-align: center; }
.lep-gallery figure img { max-width: 100%; height: auto; border: 6px solid #f8d320; box-shadow: 0 0 4px #666; background: #fff; }
.lep-gallery figcaption { margin: 8px 0 0; color: #744229; font-style: italic; font-size: 13px; line-height: 18px; }
/* slideshow: one figure at a time, auto rotating (theme.js) */
.lep-gallery-slideshow-panel figure, .lep-gallery-slideshow figure { display: none; }
.lep-gallery-slideshow-panel figure.is-active, .lep-gallery-slideshow figure.is-active { display: block; }
.lep-gallery .lep-gallery-nav { text-align: center; margin-top: 10px; }
.lep-gallery .lep-gallery-nav button { width: 12px; height: 12px; padding: 0; margin: 0 4px; border: 0; border-radius: 50%; background: #fbe05b; cursor: pointer; box-shadow: 0 0 2px #a97; }
.lep-gallery .lep-gallery-nav button.is-active { background: #ed1c24; }
/* grid / gallery: thumbnails */
.lep-gallery-gallery, .lep-gallery-grid { display: flex; flex-wrap: wrap; gap: 12px; }
.lep-gallery-gallery figure, .lep-gallery-grid figure { flex: 0 0 calc(33.333% - 8px); }
