/**
* @package phpBB Extension - Horizontal Attachments
* @copyright (c) 2024 Sniper_E - https://www.sniper-e.net
* @license http://opensource.org/licenses/gpl-2.0.php GNU General Public License v2
* @style prosilver */

/* Hide filedownload, dowloadlog and default attachments */ 
div.inline-attachment dl.files,
div.inline-attachment dl.doawnload,
div.inline-attachment dl.filedoawnload,
div.inline-attachment div.download-blocks,
dl.attachbox div.download-blocks,
dl.attachbox dl.filedoawnload,
dl.attachbox dl.file {
	display: none !important;
}

/* Hide filedownload down arrow image */
div.inline-attachment dl::before {
    background: none;
}

/* Begin horizontal attachments */
div.inline-attachment {
	background: transparent;
	display: inline-block;
	font-size: 1.2em;
	vertical-align: middle !important;	
	max-width: 24%;
	margin: 1px 8px 1px 0;
	vertical-align: top;	
	border: none;
}

dl.attachbox {
	background: transparent;
	border: none;
}

div.inline-attachment table.attach-thumbs,
div.inline-attachment table.attach-images {
	font-weight: bold;
	text-align: center;
	margin: 4px 6px 4px 0;
}

/* Prosilver blue download box */
div.inline-attachment table.attach-files,
dl.attachbox table.attach-files {
	background: rgba(0, 0, 0, 0) linear-gradient(170deg, #cadceb 0%, #4BA1CC 50%, #cadceb 100%) repeat scroll 0 0;
	font-size: 0.9em;
	margin: 4px 8px 4px 0;
	border: 1px solid #4BA1CC;
	border-radius: 7px;
	border-collapse: separate;}

/* Optional orange download box eg: <table class="attach-files orange" */ 
div.inline-attachment table.attach-files.orange {
    background: rgba(0, 0, 0, 0) linear-gradient(170deg, #ffc561 0%, #ff8a2b 50%, #ffc561 100%) repeat scroll 0 0;
	border: 1px solid #ff8a2b;
}

/* Add fa-download icon in the download box */
div.inline-attachment table.attach-files th::before,
dl.attachbox table.attach-files th::before {
    float: right;
	font-family: FontAwesome;
	font-size: 2em;
    content: "\f019";
	color: #fff;
	margin: -2px 8px 0 10px;
    text-shadow: -4px 4px 4px rgba(0, 0, 0, 0.4);
}

dl.attachbox table.attach-files th::before {
	margin: 1px 8px 0 10px;
}

div.inline-attachment table.attach-files th,
dl.attachbox table.attach-files th {
	width: 250px;
    padding-top: 2px;
}

/* Attached image border */
div.inline-attachment table.attach-thumbs th img,
div.inline-attachment table.attach-images th img,
dl.attachbox th.attach-image img {
	background: #fff;
	padding: 2px;
	border: 2px solid #3790BD;
	border-radius: 7px;
}

div.inline-attachment table.attach-thumbs th img:hover,
div.inline-attachment table.attach-images th img:hover,
dl.attachbox th.attach-image img:hover {
	background: #E4ECF2;
	border-radius: 7px !important;
}

/* Attached file download links */
div.inline-attachment table.attach-files th a,
dl.attachbox table.attach-files th a {
    text-transform: uppercase;
	color: #105289;
	padding: 5px;
 	border: none !important;
}

div.inline-attachment table.attach-files th a:hover,
dl.attachbox table.attach-files th a:hover {
	color: #D31141;
	text-decoration: underline;
	background: transparent;
}

/* Attached file comments */
div.inline-attachment table.attach-files td,
dl.attachbox table.attach-files td {
	background: transparent;
	color: #fff !important;
	padding: 0 45px 5px 0px;
	text-align: center;
	font-weight: bold;
}

/* Download logs link*/
div.inline-attachment table.attach-files td.attach-logs a {
	margin-top: -5px;
}

/* Begin responsive */
@media (max-width: 1480px) {
	div.inline-attachment {
		max-width: 32% !important;
	}
}

@media (max-width: 1024px) {
	div.inline-attachment {
		max-width: 48% !important;
	}
}

@media (max-width: 600px) {
	div.inline-attachment {
		max-width: 97% !important;
	}
}