/**
 * ownCloud - News
 *
 * @author Bernhard Posselt
 * @copyright 2012 Bernhard Posselt dev@bernhard-posselt.com
 *
 * This library is free software; you can redistribute it and/or
 * modify it under the terms of the GNU AFFERO GENERAL PUBLIC LICENSE
 * License as published by the Free Software Foundation; either
 * version 3 of the License, or any later version.
 *
 * This library 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 library.  If not, see <http://www.gnu.org/licenses/>.
 *
 */

#app-content:after {
	content: '';
	display: block;
	height: 100%;
}

#app-content.autopaging:after {
	content: '';
	background-image: url('%webroot%/core/img/loading.gif');
	background-position: center;
	background-repeat: no-repeat;
	background-size: 18px;
	display: block;
	height: 100%;
}

#app-content.loading {
	background-image: url('%webroot%/core/img/loading.gif');
	background-position: center;
	background-repeat: no-repeat;
}

#app-content.loading > ul {
	display: none;
}


.pull-refresh {
	-webkit-transition: height 0.5s;
	-moz-transition: height 0.5s;
	transition: height 0.5s;
	background-image: url('%webroot%/core/img/loading.gif'), linear-gradient(top, rgb(235,235,235) 0%, rgb(248,248,248) 100%);
	background-image: url('%webroot%/core/img/loading.gif'), -o-linear-gradient(top, rgb(235,235,235) 0%, rgb(248,248,248) 100%);
	background-image: url('%webroot%/core/img/loading.gif'), -moz-linear-gradient(top, rgb(235,235,235) 0%, rgb(248,248,248) 100%);
	background-image: url('%webroot%/core/img/loading.gif'), -webkit-linear-gradient(top, rgb(235,235,235) 0%, rgb(248,248,248) 100%);
	background-image: url('%webroot%/core/img/loading.gif'), -ms-linear-gradient(top, rgb(235,235,235) 0%, rgb(248,248,248) 100%);
	background-position: center 45px, center;
	background-repeat: no-repeat;
	background-size: 18px, 100%;
	height: 0;
	width: 100%;
}

.refresh {
	height: 80px;
}

/**
 * Rules for a single feed item
 */
.feed_item {
	border-top: 1px solid #ccc;
	min-height: 120px;
	background-image: linear-gradient(top, rgb(248,248,248) 0, rgb(255,255,255) 84px);
	background-image: -o-linear-gradient(top, rgb(248,248,248) 0, rgb(255,255,255) 84px);
	background-image: -moz-linear-gradient(top, rgb(248,248,248) 0, rgb(255,255,255) 84px);
	background-image: -webkit-linear-gradient(top, rgb(248,248,248) 0, rgb(255,255,255) 84px);
	background-image: -ms-linear-gradient(top, rgb(248,248,248) 0, rgb(255,255,255) 84px);
	padding: 35px 0 0 0;
	cursor: default;
}

.feed_item.viewed {
	border-right: 5px solid #F28627;
}


.feed_item:first-child {
	border-top: 0;
}

	/**
	 * Utils panel
	 */
	.feed_item .item_utils {
		height: 28px;
		margin: 0 0 0 8px;
		float: left;
	}

	/**
	 * Primary feed utils which are always shown
	 */
	.feed_item .primary_item_utils {
		float: left;
	}

		.feed_item .primary_item_utils li {
			display: inline-block;
			line-height: 21px;
			font-size: 14px;
			color: #aaa;
			float: left;
			margin-left: ;
			cursor: default;
		}

		.feed_item .primary_item_utils li:first-child { margin: 0}
		.feed_item .star,
		.feed_item .external {
			background: none;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: 24px 24px;
			width: 24px;
			height: 24px;
			border: none;
			display: block;
			margin: 0;
			padding: 0;
		}

		.feed_item .star {
			background-image: url('%appswebroot%/news/img/inactive_star.svg');
		}

		.feed_item .external {
			background-image: url('%webroot%/core/img/places/link.svg');
			opacity: 0.4;
		}

		.feed_item .external:hover {
			opacity: 1;
		}

		.feed_item .star.important,
		.feed_item .star:hover {
			background-image: url('%appswebroot%/news/img/active_star.svg');
		}
		.feed_item .star.important:hover {
			opacity:1;
		}
		.feed_item .star:hover {
			opacity:0.5;
		}

	/**
	 * Heading for compact view
	 */
	.feed_item.compact .item_body,
	.feed_item.compact .item_title,
	.feed_item.compact .item_author,
	.feed_item.compact .item_date,
	.feed_item.compact .item_utils,
	.feed_item.compact .item_bottom_utils,
	.feed_item .item_heading,
	.feed_item .item_link {
		display: none;
	}
	.feed_item.compact.open .item_body,
	.feed_item.compact.open .item_author,
	.feed_item.compact.open .item_bottom_utils,
	.feed_item.compact .item_heading,
	.feed_item .item_link {
		display: block;
	}

	.item_heading {
		padding: 5px 20px;
		background-color: #fafafa;
	}

	.item_heading h1 a {
		font-weight: bold;
		font-size: 13pt;
		padding: 0 5px;
		margin: 0;
		line-height: 40px;
	}

	.read .item_heading h1 a {
		color: #888;
	}

	.feed_item.compact {
		padding: 0 !important;
		min-height: 0;
	}

	.feed_item.compact .item_body {
		padding-bottom: 40px;
	}

	.feed_item.compact.open .item_heading {
		margin-bottom: 15px;
		border-bottom: 1px dashed #ddd;
	}

	.item_heading .star {
		float: left;
		margin: 7px 12px 0 0;
	}

	.item_heading .external {
		float: left;
		margin: 8px 12px 0 0;
	}

	.item_heading .timeago {
		display: block;
		float: right;
		line-height: 40px;
	}


	/**
	 * Feed title
	 */
	.feed_item .item_title {
		font-size: 19px;
		margin: 0 182px 0 42px;
		font-weight: bold;
		word-wrap: break-word;
	}

		.feed_item .item_title a {
			color: #222;
		}
			.feed_item .item_title a:hover {
				color: #222;
				text-decoration: underline;
			}

	/**
	 * Feed title when read
	 */
	.feed_item.read .item_title {
		font-weight: normal;
	}

		.feed_item.read .item_title a {
			color: #888;
		}

	/**
	 * Title of the feed to which the item belongs
	 */
	.feed_item .item_feed_title {
		color: #aaa;
		font-size: 15px;
		margin-left: 42px;
	}

	/**
	 * Author of the item
	 */
	.feed_item .item_author {
		color: #aaa;
		font-size: 15px;
		margin: 3px 0 0 42px;
	}

		.feed_item .item_author a {
			color: inherit;
		}

			.feed_item .item_author a:hover {
				text-decoration: underline;
			}

	.timestamp {
		display: none;
	}

	/**
	 * Feed timestamp
	 */
	.timeago {
		float: right;
		color: #aaa;
		margin: 0 17px 0 0;
		font-size: 15px;
	}

	/**
	 * Body of the feed item
	 */
	.feed_item .enclosure {
		padding: 14px 42px 0 49px;
	}

	.feed_item .item_body {
		padding: 10px 42px 0 42px;
		max-width: 770px;
		font-size: 14px;
		clear: both;
		overflow-x: auto;
		/*overflow-y: hidden;
		height: 80px;*/
	}

	.feed_item .item_body.opened {

	}

		.feed_item .item_body p {
			line-height: 1.5;
			margin: 7px 0 14px 0;
		}

		.feed_item .item_body img, .feed_item .item_body table {
			max-width: 100%;
			height: auto;
			overflow: auto;
			word-wrap: break-word;
			white-space:normal;
		}

		.feed_item .item_body > img:first-child {
			padding: 0 14px 0 0;
			float: left;
		}

		.feed_item .item_body h1, .feed_item .item_body h2 {
			font-size: 17px;
			font-weight: bold;
			color: #222;
			margin: 21px 0 0 0;
		}

		.feed_item .item_body h3 {
			font-size: 15px;
			font-weight: bold;
			color: #222;
			margin: 21px 0 0 0;
			text-decoration: underline;
		}

		.feed_item .item_body > div {
			margin: 7px 0;
		}

		.feed_item .item_body a {
			color: #0000ff;
			text-decoration: underline;
		}

		.feed_item .item_body ul {
			margin: 7px 0;
			padding-left: 14px;
			list-style-type: disc;
		}

		.feed_item .item_body ol {
			margin: 7px 0;
			padding-left: 21px;
		}

			.feed_item .item_body ul li {
				cursor: default;
				line-height: 21px;
			}

		.feed_item .item_body pre {
			padding: 7px 7px 7px 14px;
			background-color: #dadada;
			border: 1px solid #ccc;
			margin: 7px 0 14px 0;
			overflow-y: auto;
		}
			.feed_item .item_body pre::-webkit-scrollbar {
				height: 10px;
			}

			.feed_item .item_body pre::-webkit-scrollbar-thumb {
				background: #333;
			}

			.feed_item .item_body pre::-webkit-scrollbar-track-piece {
				background: #ddd;
			}

			.feed_item .item_body code,
			.feed_item .item_body pre {
				font-family: monospace;
				font-size: 16px;
			}

		.feed_item .item_body blockquote {
			border-left: 1px solid rgb(210,210,210);
			margin: 25px 0;
			padding: 0 0 0 15px;
			font-style: italic;
		}


/**
 * Line with utils at the bottom
 */
.item_bottom_utils {
	width: 100%;
	height: 35px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
}

	/**
	 * Secondary feed items which are only shown on hover
	 */
	.feed_item .secondary_item_utils {
		float: right;
		margin: 0 17px;
	}


	.feed_item .secondary_item_utils, .feed_item .secondary_item_utils a {
		color: #000;
	}

	.feed_item:hover .secondary_item_utils li {
		display: inline-block;
	}

		.feed_item .secondary_item_utils li {
			padding-left: 25px;
			display: none;
		}

		/**
		 * Secondary feed items which are only shown on hover
		 */
		.feed_item .show_keep_unread .keep_unread{
			display: block;
		}

		.feed_item li.share_link {
			background-image: url('%webroot%/core/img/actions/share.svg');
			background-repeat: no-repeat;
			background-position: right center;
			padding-right: 20px;
		}

		.feed_item:hover .secondary_item_utils li.keep_unread {
			cursor: pointer;
		}

		.feed_item .secondary_item_utils li input[type=checkbox]{
			margin-left: 5px;
		}