@import './default.less';
@import './mixins.less';
//DON'T ADD IMPORTS, ABOVE ARE TO MAKE INTELLISENSE WORK

@royal-blue: #1e77bd;
@charcoal-grey: #353d40;

#dataset-releases
{
	position: relative;

	#overlay
	{
		display: none;
		z-index: 1;
		position: absolute;
		left: 0;
		top: 0;
		background: white;
		width: 100%;
		height: 100%;
		opacity: .6;
	}

	.controls
	{
		#filter, #type, .ui-button
		{
			margin-bottom: 10px;
			font-size: 14px;
		}

		#filter, #type
		{
			padding: 4px;
		}

		#filter
		{
			width: 610px;
			margin-right: 4px;
		}

		#notification
		{
			padding-right: 0;
			padding-left: 0;
		}

		#notification, #type
		{
			width: 120px;
		}

		#type
		{
			border: 1px solid #aaa;
		}
	}

	#storage
	{
		font-size: 14px;
		margin-bottom: 10px;
	}

	.ui-button
	{
		padding-top: 6px;
		padding-bottom: 5px;

		.ui-button-text
		{
			line-height: normal;
		}
	}

	th
	{
		background-position: left 50%;
		padding-left: 12px;

		html[dir='rtl'] &
		{
			background-position: right;
			padding-left: 0;
			padding-right: 12px;
		}

		&#number
		{
			width: 35px;
		}

		&#name
		{
			width: auto;
		}

		&#actuality
		{
			width: 140px;
		}

		&#date
		{
			width: 90px;
		}

		&#update-priority
		{
			width: 120px;
		}
	}

	tr
	{
		border-top: 1px solid white;
		cursor: pointer;

		&.ready-for-update
		{
			background-color: #ffb8b8;
		}

		&.expired
		{
			background-color: #fcc;
		}

		&.expecting-update
		{
			background-color: #ffc;
		}

		&.expiring
		{
			background-color: #ffffe5;
		}

		td
		{
			word-break: normal;
			padding: 8px 4px 8px 12px;
			vertical-align: top;

			html[dir='rtl'] &
			{
				padding-left: 0;
				padding-right: 12px;
			}

			.details
			{
				display: none;
				margin-bottom: -8px;
				padding: 10px 0 10px 15px;
				margin-right: -320px;
				cursor: auto;

				html[dir='rtl'] &
				{
					padding: 10px 15px 5px 0;
					margin-right: auto;
					margin-left: -140px;
				}

				.title, .dataset-list-custom-field b
				{
					font-weight: bold;

					html[dir='rtl'] &
					{
						float: right;
					}
				}

				.description
				{
					margin-top: 1em;
					text-align: justify;
				}

				a.ui-button
				{
					display: inline-block;
					padding: 4px 12px;
					margin-top: 1em;
				}

				.loading
				{
					background: none;
				}
			}

			&.name
			{
				position: relative;
				padding-right: 18px;

				a
				{
					.arrow
					{
						display: inline-block;
						vertical-align: middle;
						width: 15px;
						height: 9px;
						background: url('/img/v2/dsbrowser/arrows-datasets.png') no-repeat 0 0px;

						html[dir='rtl'] &
						{
							-moz-transform: scaleX(-1);
							-o-transform: scaleX(-1);
							-webkit-transform: scaleX(-1);
							transform: scaleX(-1);
						}
					}

					&.active .arrow
					{
						background-position: 0 -18px;
					}
				}

				html[dir='rtl'] &
				{
					padding-right: 12px;
					padding-left: 18px;
				}
			}
		}

		&.knoema td.name .knoema-sign
		{
			font-weight: bold;
			position: absolute;
			top: 9px;
			right: 0;
			line-height: 1em;
			color: #999;
			background-repeat: no-repeat;
			width: 12px;
			height: 12px;
			.hires('/img/v4/ico_k');

			html[dir='rtl'] &
			{
				right: auto;
				left: 0;
			}
		}
	}

	#pager
	{
		margin-top: 10px;
		text-align: center;
	}
}

#datasets-notification
{
	h3
	{
		font-weight: normal;
	}

	ul
	{
		max-height: 500px;
		padding: 5px 0;
		overflow: auto;

		li
		{
            font-size: 14px;
			margin-top: .5em;
		}
	}
}

.ui-dialog-content.ui-widget-content
{
    overflow-y: auto;
    font-family: @title-font;

    #select-all-retain, #select-all-update
    {
        margin: 0 1em;
    }

    input[type=radio]
    {
        vertical-align: top;
    }

    .dataset-info-export-columns-header
    {
        margin-left: 0.1em;
        font-size: 16px;
    }

    #select-all-dataset-list-export-columns, #deselect-all-dataset-list-export-columns
    {
        margin: 0 15px 0 0.1em;
        font-size: 14px;
        color: @royal-blue;
        text-decoration: none;

        html[dir='rtl'] &
        {
            margin: 0 0.1em 0 15px;
        }
    }

    .export-datasets-columns-lists
    {
        margin-top: 15px;
        display: table;
        width: 100%;

        .export-datasets-columns-list-column
        {
            display: table-cell;
            vertical-align: top;
            width:50%;

            .export-datasets-columns-list
            {
                padding: 0;
                margin: 0;
                list-style:none;

                li
                {
                    margin: 0 0 15px 0;

                    label
                    {
                        font-size: 14px;
                        font-family: @text-font;

                        input
                        {
                            vertical-align: baseline;
                            margin: 0 8px 0 0;

                            html[dir='rtl'] &
                            {
                                margin: 0 0 0 8px;
                            }
                        }
                    }
                }
            }
        }
    }



    .dataset-info-export-dialog-header
    {
        margin-left: 0.1em;
        font-size: 16px;
        font-family: @text-font;
    }

    .radio-button-label
    {
        font-size: 16px;
        font-weight: bold;
        font-family: @text-font;
    }

    .export-option-description
    {
        margin: 5px 0px 40px 20px;
        width: 330px;
        font-family: @text-font;
    }
}

#populate-datasets-dialog
{
    #ds-browser
    {
        overflow-y: hidden;
        position: absolute;
        left: 0px;
        right: 260px;
        top: 0px;
        bottom: 0px;
        z-index: 0;
        display: block;
        visibility: visible;

        html[dir='rtl'] &
        {
            left: 260px;
            right: 0px;
        }

        .dataset-result-preview
        {
            margin-left: 24px;

            html[dir='rtl'] &
            {
                .margin-left-right(0, 24px);
            }
        }

        .selection
        {
            float: right;
            margin: 5px;
            color: @royal-blue;
            font-size: 14px;
            text-decoration: none;


            html[dir='rtl'] &
            {
                float: left;
            }
        }

        .dataset-results-indent
        {
            top: 110px;
        }
    }

    #selected-datasets
    {
        position: absolute;
        margin: 0px;
        right: 0px;
        top: 0px;
        z-index: 0;
        width: 255px;
        display: block;
        visibility: visible;
        height: 100%;
        overflow: hidden;
        box-sizing: border-box;
        border-top: 1px dotted #c8d7df;
        border-left: 1px dotted #c8d7df;

        .selected-datasets-title
        {
            color: @charcoal-grey;
            font: bold 16px @title-font;
            margin: 10px 0 0 15px;

            html[dir='rtl'] &
            {
                .margin-left-right(0, 15px);
            }
        }

        html[dir='rtl'] &
        {
            left: 0px;
            right: auto;
            border-left: none;
            border-right: 1px dotted #c8d7df;
        }

        .selected-datasets-list-container
        {
            overflow-y: auto;
            overflow-x: hidden;
            position: absolute;
            left: 0;
            right: 0;
            top: 40px;
            bottom: 0;

            .selected-datasets-list
            {
                list-style: none;
                padding: 0;
                height: 100%;
                overflow: auto;
                margin: 0 0 0 10px;

                html[dir='rtl'] &
                {
                    margin: 0 10px 0 0;
                }

                li
                {
                    margin: 15px 0;

                    a
                    {
                        background-image: url('/img/v7/dsbrowser/remove.png');
                        width: 16px;
                        height: 16px;
                        display: inline-block;
                        cursor: pointer;
                        vertical-align: top;
                        margin-left: 2px;

                        html[dir='rtl'] &
                        {
                            .margin-left-right(0, 2px);
                        }
                    }

                    label
                    {
                        font: 14px @title-font;
                        color: @accent-color;
                        display: inline-block;
                        width: calc(100% - 20px);
                        margin-left: 5px;

                        html[dir='rtl'] &
                        {
                            margin-right: 5px;
                        }

                        &:hover
                        {
                            color: #0094ff;
                        }
                    }
                }
            }
        }
    }
}