/* OTOBO is a web-based ticketing system for service organisations.

Copyright (C) 2001-2020 OTRS AG, https://otrs.com/
Copyright (C) 2019-2024 Rother OSS GmbH, https://otobo.io/

This program is free software: you can redistribute it and/or modify it under
the terms of the GNU General Public License as published by the Free Software
Foundation, either version 3 of the License, or (at your option) any later version.
This program 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 General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see <https://www.gnu.org/licenses/>.
*/

/**
 * @package     Skin "Default"
 * @section     Forms
 */

@media screen,projection,tv,handheld {

/**
 * @subsection  Input focus
 * @note        Does not work in IE6, only partially in IE7 (no focus)
 */

.DynamicFieldDBContainer {
    background-color: #F2F2F2;
    -moz-box-shadow: inset 1px 1px 5px #ccc;
    -webkit-box-shadow: inset 1px 1px 5px #ccc;
    box-shadow: inset 1px 1px 5px #ccc;
    padding: 4px 12px 8px 8px;
    position: relative;
    border-radius: 10px;
    margin: 4px 8px 0 36%;
    box-sizing: border-box;
}

.MultiValue .DynamicFieldDBContainer {
    margin: -44px 24px 0 24px;
    height: 32px;
    padding-left: 15px;
    padding-right: 16px;
    box-shadow: none;
}

.MultiValue .DynamicFieldDBContainer input {
  font-size: 12px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: 0.3px;
}

.DynamicFieldDBContainer input,
.DynamicFieldDBContainer input:hover {
  border: none;
  background: inherit;
  transition: none;
}

.DynamicFieldDBContainer > div {
    margin-top: 5px;
}

.MultiValue .DynamicFieldDBContainer > div {
    margin-top: 2px;
}

.DynamicFieldDBContainer .ResultElementText {
    width: 89%;
    margin-left: 7px;
}

.DynamicFieldDBContainer .ResultElementText {
    transition: background-color 1s ease, border 1s ease;
}

.DynamicFieldDBContainer .ResultElementText.MainCustomer {
    background-color: #F7ECC3;
    border: 1px solid #E8CC8B;
}

.DynamicFieldDBContainer .ResultElementText.Radio {
    width: calc( 100% - 40px );
    margin-left: 0px;
}

.DynamicFieldDBContainerProcess {
    margin: 5px 0 0 235px;
}

.DynamicFieldDB + a {
    display: inline-block;
    position: relative;
    left: -54px;
    width: 14px;
}

.DynamicFieldDB + a.RemoveButton {
    left: 0px;
}

.DynamicFieldDB + a.oooWithTT {
    left: -78px;
}

.DynamicFieldDB ~ label {
    left: calc( -100% + 2px );
}

.DynamicFieldDB[readonly] ~ label {
    left: calc( -100% + 24px );
}

/*
 * FF3.6 has a problem with setting the position:relative only on :hover state.
 * As a workaround it is set always and a special z-index on hover.
 */
/*.DataTable tbody tr,
.TableSmall tbody tr {
    position: relative;
}

.DataTable tbody tr:hover,
.TableSmall tbody tr:hover {
    z-index: 10;
}

.DataTable tbody td:first-child,
.TableSmall tbody td:first-child {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.DataTable tbody td.Last,
.TableSmall tbody td.Last {
    border-right: none;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.DataTable tbody tr:hover td,
.TableSmall tbody tr:hover td {
    background: #f3960d;
    background: -moz-linear-gradient(top,  #ffe7bd 0%, #fbba49 20%, #f6ad3e 51%, #f3960d 51%, #e98207 95%, #e07006 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffe7bd), color-stop(20%,#fbba49), color-stop(51%,#f6ad3e), color-stop(51%,#f3960d), color-stop(95%,#e98207), color-stop(100%,#e07006));
    background: -webkit-linear-gradient(top,  #ffe7bd 0%,#fbba49 20%,#f6ad3e 51%,#f3960d 51%,#e98207 95%,#e07006 100%);
    background: -o-linear-gradient(top,  #ffe7bd 0%,#fbba49 20%,#f6ad3e 51%,#f3960d 51%,#e98207 95%,#e07006 100%);
    background: -ms-linear-gradient(top,  #ffe7bd 0%,#fbba49 20%,#f6ad3e 51%,#f3960d 51%,#e98207 95%,#e07006 100%);
    background: linear-gradient(to bottom,  #ffe7bd 0%,#fbba49 20%,#f6ad3e 51%,#f3960d 51%,#e98207 95%,#e07006 100%);
    -webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.3);
    box-shadow: 0 1px 0 rgba(0,0,0,0.3);
}

.DataTable tbody tr.Last:hover td,
.TableSmall tbody tr.Last:hover td {
    -webkit-box-shadow: 0 0 0;
    box-shadow: 0 0 0;
}

.DataTable tbody tr:active td.Clickable,
.TableSmall tbody tr:active td.Clickable {
    background: #eb8c0b;
    background: -moz-linear-gradient(top,  #ffe4b5 0%, #faa91c 20%, #eb8c0b 95%, #e37b09 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffe4b5), color-stop(20%,#faa91c), color-stop(95%,#eb8c0b), color-stop(100%,#e37b09));
    background: -webkit-linear-gradient(top,  #ffe4b5 0%,#faa91c 20%,#eb8c0b 95%,#e37b09 100%);
    background: -o-linear-gradient(top,  #ffe4b5 0%,#faa91c 20%,#eb8c0b 95%,#e37b09 100%);
    background: -ms-linear-gradient(top,  #ffe4b5 0%,#faa91c 20%,#eb8c0b 95%,#e37b09 100%);
    background: linear-gradient(to bottom,  #ffe4b5 0%,#faa91c 20%,#eb8c0b 95%,#e37b09 100%);
    -webkit-box-shadow: 0 1px 0 rgba(0,0,0,0.3);
    box-shadow: 0 1px 0 rgba(0,0,0,0.3);
} */

/**
 * @subsection  Generic table elements
 */
/*tbody tr.UnreadArticles td {
    font-weight: bold !important;
}

.DataTable td,
.TableSmall td {
    line-height: 15px;
    vertical-align: middle;
}

.DataTable tr:hover,
.TableSmall tr:hover {
    color: #000;
}

table tr.MasterAction {
    cursor: pointer;
} */

/**
 * @subsection  Standard DataTable
 */
/*.DataTable {
    width: 100%;
    background-color: #FDFDFD;
    border: 1px solid #C9C9C9;
    border-top-color: #C0C0C0;
    clear: both;
    border-collapse: separate;
    -webkit-box-shadow: 0 1px 0 #FFF;
    box-shadow: 0 1px 0 #FFF;
}

.DataTable.VariableWidth {
    width: auto;
}

.DataTable thead {
    background: #eeeeee;
    background: -moz-linear-gradient(top,  #eeeeee 0%, #e0e0e0 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#e0e0e0));
    background: -webkit-linear-gradient(top,  #eeeeee 0%,#e0e0e0 100%);
    background: -o-linear-gradient(top,  #eeeeee 0%,#e0e0e0 100%);
    background: -ms-linear-gradient(top,  #eeeeee 0%,#e0e0e0 100%);
    background: linear-gradient(to bottom,  #eeeeee 0%,#e0e0e0 100%);
}

.DataTable thead th {
    padding: 4px 10px 3px;
    color: #4B4B4B;
    font-size: 11px;
    text-transform: uppercase;
    background: none;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #BBB;
    border-right: 1px solid #CCC;
    vertical-align: bottom;
    white-space: nowrap;
}

.RTL .DataTable thead th {
    border-left: 1px solid #CCC;
    border-right:none;
}

.DataTable thead th label {
    color: #4B4B4B !important;
}

.DataTable thead th.Last {
    background: none;
    border-right: none;
}

.RTL .DataTable thead th.Last {
    border-left: none;
}

.DataTable thead th a {
    background-image: none;
    color: #444;
    font-size: 11px;
    height: 12px;
    line-height: 12px;
    display: block;
}

.DataTable thead .SortAscending a,
.DataTable thead .SortDescending a {
    color: #2A2A2A;
    padding-right: 15px;
}

.DataTable thead .SortAscending a {
    background: #979797;
    background: -moz-linear-gradient(top,  #b2b2b2 0%, #adadad 50%, #979797 50%, #959595 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2b2b2), color-stop(50%,#adadad), color-stop(50%,#979797), color-stop(100%,#959595));
    background: -webkit-linear-gradient(top,  #b2b2b2 0%,#adadad 50%,#979797 50%,#959595 100%);
    background: -o-linear-gradient(top,  #b2b2b2 0%,#adadad 50%,#979797 50%,#959595 100%);
    background: -ms-linear-gradient(top,  #b2b2b2 0%,#adadad 50%,#979797 50%,#959595 100%);
    background: linear-gradient(to bottom,  #b2b2b2 0%,#adadad 50%,#979797 50%,#959595 100%);
}

.DataTable thead .SortDescending > a:after,
.TableSmall thead .SortDescending > a:after {
    content: "\25BC";
    display: block;
    position: absolute;
    left: 2px;
    top: 2px;
    text-shadow: 1px 1px 0px #fff;
}

.DataTable thead .SortAscending > a:after,
.TableSmall thead .SortAscending > a:after {
    content: "\25B2";
    display: block;
    position: absolute;
    left: 2px;
    top: 2px;
    text-shadow: 1px 1px 0px #fff;
}

.DataTable thead .SortDescending a {
    background: #979797;
    background: -moz-linear-gradient(top,  #b2b2b2 0%, #adadad 50%, #979797 50%, #959595 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2b2b2), color-stop(50%,#adadad), color-stop(50%,#979797), color-stop(100%,#959595));
    background: -webkit-linear-gradient(top,  #b2b2b2 0%,#adadad 50%,#979797 50%,#959595 100%);
    background: -o-linear-gradient(top,  #b2b2b2 0%,#adadad 50%,#979797 50%,#959595 100%);
    background: -ms-linear-gradient(top,  #b2b2b2 0%,#adadad 50%,#979797 50%,#959595 100%);
    background: linear-gradient(to bottom,  #b2b2b2 0%,#adadad 50%,#979797 50%,#959595 100%);
}

.DataTable tbody {
    -webkit-box-shadow: 0 1px 2px #E8E8E8 inset;
    box-shadow: 0 1px 2px #E8E8E8 inset;
}

.DataTable tbody tr.Invalid {
    color: #CCC;
}

.DataTable tbody td {
    padding: 0 10px;
    border-right: 1px dotted #CCC;
}

.RTL .DataTable tbody td {
    border-left: 1px dotted #CCC;
    border-right: none;
}

.DataTable tbody td.Last {
    border-right: none;
}

.DataTable tbody td:last-child {
    border-right: none;
}

.RTL .DataTable tbody td.Last {
    border-left: none;
}

.RTL .DataTable tbody td:last-child {
    border-left: none;
}

.DataTable tr td {
    line-height: 20px;
}

.DataTable tr:first td {
    border-top: 1px solid #EEE;
}

.DataTable tr td.Highlight {
    background-color: #EEE;
}

.DataTable tr.Even td {
    background-color: #F5F5F5;
}

.DataTable tr:nth-child(even) td {
    background-color: #F5F5F5;
}

.DataTable tr.Even td.Highlight {
    background-color: #E5E5E5;
}

.DataTable tr:nth-child(even) td.Highlight {
    background-color: #E5E5E5;
}

.DataTable tr:hover td a {
    color: #000;
}

.DataTable td:first-child input {
    margin: 0;
}*/


/**
 * @subsection  QueueOverviewTotals DataTable
 */

/*.DataTable thead th.QueueOverviewTotals,
.Row td.QueueOverviewTotals,
.Row a.QueueOverviewTotals {
    font-weight: bold;
}

.DataTable .Row td.QueueOverviewTotals {
    text-transform: uppercase;
    color: #4B4B4B;
    border-top: 1px dotted #CCCCCC;
} */

/**
 * @subsection  Sortable DataTable
 */

/*.Sortable.DataTable th {
    padding: 0;
}

.Sortable.DataTable th a,
.Sortable.DataTable th span {
    padding: 4px 10px 3px;
    display: block;
    position: relative;
}

.Sortable.DataTable th.SortAscending a,
.Sortable.DataTable th.SortDescending a {
    padding-left: 15px;
}

.Sortable.DataTable .SortAscending,
.Sortable.DataTable .SortDescending {
    border-top-color: #DDD;
    border-right-color: #AAA;
    border-bottom-color: #999;
} */

@media only screen and (min-width: 0px) and (max-width: 1024px) {

    .DynamicFieldDBContainer {
        margin: 5px;
    }
} 

} /* end @media */