/* Styles used by the PHLEX aplication framework
   @name phlex.css
   @author frank@reichartonline.de
   @since Unknown
   @version 2025-01-10
*/

/* ///////////////////////////////////////////////

/* Generic pseudo classes
   May be combined in any way. Some may contradict each other
   Maintain alphabetical order */

.absolute
{
    position: absolute
    /* z-index: 3; */
}

.background
{
    background-color: #f9f9f9
}

.appear
{
    transition: opacity 1s
}

.background_beige
{
    background-color: #f8f7e6
}

.background_blue
{
    background-color: #3465a4
}

.background_light_green
{
/*    background-color: #cbfdc7 */
    background-color: #ecf5ec
}

.background_light_grey
{
    background-color: #f3f3f3
}

.background_light_red
{
/*    background-color: #f79c96 */
    background-color: #f5eceb
}

.background_white
{
    background-color: #ffffff
}

.black
{
    color: #000000
}

.blue
{
    color: #000099
}

.bold
{
    font-weight: 600
}

.border_1
{
    border: 1px solid #000000
}

.border_blue
{
    border-color: #1506a0
}

.border_radius_5
{
    border-radius: 5px
}

.border_radius_10
{
    border-radius: 5px
}

.border_radius_15
{
    border-radius: 15px
}

.bottom
{
    vertical-align: bottom
}

.break_word
{
    -ms-word-break: break-all
    /* breaks all words anywhere */
    /* word-break: break-all; */

    /* non standard for webkit */
    word-break: break-word;

    /* unknown to FF
    overflow-wrap: break-word; */
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    word-wrap: break-word;
    text-overflow: ellipsis
}

/* TODO replace with .background_white */
.bright
{
    background-color: #ffffff
}

.button
{
    font-size: 10px;
    border-radius: 5px;
    margin-left: 20px;
    margin-right: 20px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.center_align
{
    text-align: center
}

.center_horizontal {
    left: 50%
}

.center_window_fixed {
    position: fixed;
    top: 50%;
    left: 50%;
}

.window_centered {
  height: 100%;
  width: 100%;
  display: flex;
  position: fixed;
  align-items: center;
  justify-content: center
}

.child_1
{
    background-color: #dedede
}

.comment
{
    background-color: #ffffff;
    padding: 3px;
    font-style: italic
}

.dark
{
    background-color: #e4e4e4
}

.disappear
{
    transition: opacity 0.5s
}

.disabled
{
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none
}

.drag_target_style_text
{
    /* color: #007d00; */
    color: red
}

.drag_target_style_border
{
    border: 2px solid red
}

.drop_target
{
}

.entry_bright
{
    background-color: #ffffff;
    vertical-align: top;
    padding-top: 3px;
    padding-bottom: 3px;
}
.entry_bright:hover
{
    background-color: #cecece;
    cursor: crosshair
}

.entry_dark
{
    background-color: #e4e4e4;
    vertical-align: top;
    padding-top: 3px;
    padding-bottom: 3px;
}
.entry_dark:hover
{
    background-color: #cecece;
    cursor: crosshair;
}

.fatal
{
    color: #ac0d0d
}

.fixed
{
    position: fixed;
    z-index: 4
}

.flat
{
    margin-top: 0px;
    margin-bottom: 0px
}

.following
{
    top: 0px
}

.following_function_bar
{
    top: 140px
}

.following_function_bar_preselection
{
    top: 190px
}

.following_page_header
{
    top: 57px;
    border: 0px solid;
    padding-top: 5px
}

.following_table_header
{
    top: 205px
}

.following_table_header_preselection
{
    top: 278px
}

.font_size_8
{
    font-size: 8pt
}

.font_size_10
{
    font-size: 10pt
}

.font_size_12
{
    font-size: 12pt
}

.font_size_14
{
    font-size: 14pt
}

.font_size_15
{
    font-size: 15pt
}

.font_size_16
{
    font-size: 16pt
}

.font_size_17
{
    font-size: 17pt
}

.font_size_18
{
    font-size: 18pt
}

.font_size_19
{
    font-size: 19pt
}

.font_size_20
{
    font-size: 20pt
}

.font_size_21
{
    font-size: 21pt
}

.font_size_22
{
    font-size: 22pt
}

.font_size_23
{
    font-size: 23pt
}

.font_size_24
{
    font-size: 24pt
}

.font_size_25
{
    font-size: 25pt
}

.font_size_26
{
    font-size: 26pt
}

.font_size_27
{
    font-size: 27pt
}

.font_size_28
{
    font-size: 28pt
}

.font_size_29
{
    font-size: 29pt
}

.font_size_30
{
    font-size: 30pt
}

.font_size_31
{
    font-size: 31pt
}

.font_size_32
{
    font-size: 32pt
}

.font_size_33
{
    font-size: 33pt
}

.global_and_local_search
{
    background-color: #b9f6f3
}

.global_search
{
    background-color: #ffe6c6
}

.green
{
    color: #167b16
}

.header
{
    font-size: 10pt;
    font-weight: 700;
}

.height_20
{
    height: 18px
}

.height_25
{
    height: 25px
}

.hidden
{
    display: none;
    visibility: hidden
}

.indent_level_1
{
    text-indent: 10px
}

.indent_level_2
{
    text-indent: 20px
}

.information
{
    color: #140f70
}

/* Will only break if also the preceding (left) element bears this class,
   not just the subsequent one */
.inline_break
{
    display: inline-block;	
    vertical-align: top
}

.inline_break_1300px {}
@media screen and ( max-width: 1300px )
{
    .inline_break_1300px
    {
        display: inline-block
    }
}

.inline_break_851_1150px {}
@media screen and ( min-width: 851px ) and ( max-width: 1150px )
{
    /* adressing more than a single at once does not work at least in ff 52 */
    .inline_break_851_1150px
    {
        display: inline-block
    }
}

.inline_break_850px {}
@media screen and ( max-width: 850px )
{
    /* adressing more than a single width at once does not work at least in ff 52 */
    .inline_break_850px
    {
        display: inline-block
    }
}

.inline_break_650px {}
@media screen and ( max-width: 650px )
{
    /* adressing more than a single width at once does not work at least in ff 52 */
    .inline_break_650px
    {
        display: inline-block
    }
}

.inline_break_550px {}
@media screen and ( max-width: 550px )
{
    /* adressing more than a single width at once does not work at least in ff 52 */
    .inline_break_550px
    {
        display: inline-block
    }
}

.inner
{
    right: 0px;
    left: 0px
}

.invisible
{
    visibility: hidden
}

.italic
{
    font-style: italic
}

.last
{
    min-height: 100%
}

.left_align
{
    text-align: left
}

.left_float
{
    float: left
}

.local_search
{
    background-color: #dce6ff
}

.margin_top_5
{
    margin-top: 5px
}

.margin_left_20
{
    margin-left: 20px
}

.margin_bottom_3
{
    margin-bottom: 3px
}

.margin_bottom_5
{
    margin-bottom: 5px
}

.margin_bottom_10
{
    margin-bottom: 10px
}

.margin_bottom_20
{
    margin-bottom: 20px
}

.margin_right_10
{
    margin-right: 10px
}

.max_length_exceeded
{
    background-color: #F4D0B8
}

.middle
{
    vertical-align: middle
}

.mandatory
{
    background-color: #f0e6e6
}

.no_border
{
    border: none
}

.no_padding
{
    padding: 0px
}

.normal
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
    font-weight: 400
}

.opaque
{
    opacity: 1
}

.orange
{
    color: #f67604
}

.overlay
{
    z-index: 10;
    position: absolute
}

.padding_10
{
    padding: 10px
}

.padding_bottom_2
{
    padding-bottom: 2px
}

.padding_left_10
{
    padding-left: 10px
}

.padding_right_10
{
    padding-right: 10px
}

.padding_top_2
{
    padding-top: 2px
}

.page_width
{
    width: 100%
}

.paginator
{
	
}

.pointer
{
    cursor: pointer
}

.radius_5
{
    border-radius: 5px;
}

.red, .error
{
    color: #f31818
}

.relative
{
    position: relative;
    z-index: 1
}

.right_align
{
    text-align: right
}

.right_border
{
    right: 10px
}

.right_float
{
    float: right
}

.section_margin_top
{
    margin-top: 34px
}

.entity_margin_top
{
    margin-top: 5px
}

.tabactive
{
    background-color: #f9f9f9;
    padding-top: 2px;
    padding-left: 5px;
    padding-right: 5px;
    border-top: 3px outset;
    border-left: 2px inset;
    border-right: 4px outset;
    vertical-align: middle;
    font-weight: 600;
    white-space: nowrap
}

.top
{
    vertical-align: top
}

.top_margin_5
{
    margin-top: 5px
}

.transparent
{
    opacity: 0
}

.visible
{
    visibility: visible
}

.warning
{
    color: #f67604
}

/* ///////////////////////////////////////////////////////////////// */

/* attribute selectors */

*[draggable=true]
{
    /* cursor: move; */
}

*[draggable=true]:hover
{
    /* background-color: #c6e6d6; */
}

/* ///////////////////////////////////////////////////////////////// */

/* element specific classes and sub classes */
a
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
    z-index: 2;
    text-decoration: none
}

a:link
{
/*    color: #3f3f5c; */
    color: #000052;
}

a:visited
{
/*    color: #3f3f5c; */
    color: #000052;
}

a:hover
{
    color: #990000;
}

a:active
{
    color: #990000;
}

a:focus
{
    color: #990000;
}

article.rating
{
    width: 335px;
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
}

body
{
    z-index: 0;
    margin-top: 0px;
    padding: 0px;
    border: none;
}

body.zoom
{
    background-color: #f1f1f1;
}

div
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
}
div.filter_field
{
    position:relative;
    z-index: 1;
}

div.entry_selector
{
    position:absolute;
    z-index: 2;
}

/* confirmation object */
div.decision
{
    z-index: 60;
    width: 200px;
    margin-left: -100px;
    height: 80px;
    margin-top: -40px;
    background-color: #ffffff;
    padding: 10px;
    text-align: center;
    white-space: pre-wrap;
    border-top: 2px solid silver;
    border-bottom: 2px solid silver;
    border-left: 2px solid silver;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    box-shadow: 10px 10px 5px #888;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.3s linear, opacity 0.3s linear
}

/* sliding messages */
div.sliding_message
{
    display: flex;
    font-size: 8pt;
    z-index: 40;
    position: fixed;
    width: 200px;
    right: 0px;
    bottom: 25px;
    height: 60px;
    padding-top: 0px;
    padding-right: 5px;
    padding-bottom: 0px;
    padding-left: 5px;
    justify-content: center;
    align-items: center;
    white-space: pre-wrap;
    border-top: 2px solid silver;
    border-bottom: 2px solid silver;
    border-left: 2px solid silver;
    border-top-left-radius: 15px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 0px;
    box-shadow: 5px 5px 5px #777;
    visibility: visible;
    transition: right 0.5s, top 0.4s, bottom 0.4s
}

div.slide_out
{
    right: -195px
}

div.slide_in
{
    right: 0px
}

div.info
{
    background: rgba( 245, 255, 245, 0.8 )
}

div.warn
{
    background: rgba( 254, 250, 235, 0.8 )
}

div.err
{
    background: rgba( 255, 245, 245, 0.8 )
}

div.original_resolution
{
    position: absolute;
    z-index: 56;
    visibility: hidden;
    border: none;
}

div.data_view
{
    background-color: #f7f0e5;	
}

div.top_border
{
    top: 0px;
    padding-top: 5px;
}

div.tab
{
    background-color: #e5eff6;
    padding-top: 2px;
    padding-left: 3px;
    padding-right: 3px;
    border-top: 3px outset;
    border-left: 1px inset;
    border-right: 3px outset;
    border-bottom: 1px solid;
    vertical-align: middle;
    white-space: nowrap;
}

font.bold
{
    font-weight: 600;
    color: #000000;
}

font.checkbox
{
    font-size: 11pt;
}

font.date_format
{
    font-size: 6pt;
}

font.message
{
    font-weight: 400;
    color: #140f70;
}

font.debug
{
    font-size: 8pt;
    font-weight: 400;
    color: #140f70;
}

font.hit
{
    font-weight: 500;
    color: #000000;
    background-color: #e7d5e5;
    font-style: normal;
}

font.page
{
    font-weight: 600;
    color: #000000;
    background-color: #ffffcc;
}

hr
{
    width: 100%;
    color: #000000;
    border-top: 1px solid black;
}

img
{
    border: 0px;
/*    draggable: false; */
}
img.navigation
{
    width: 8px;
    height: 8px;
    z-index: 5;
}
img.rating
{
    width: 15px;
    height: 15px;
    z-index: 5;
}
img.preview
{
    width: 200px;
    border-top: 3px outset;
    border-left: 2px inset;
    border-right: 4px outset;
    border-bottom: 2px inset;
    box-shadow: 10px 10px 5px #888;
}
img.tab
{
    width: 14px;
    height: 12px;
    vertical-align: middle;
}
img.logout
{
    vertical-align: middle;
}
img.spinner
{
    width: 25px;
    height: 25px;
    z-index: -1;		
   /* display: none; */
    visibility: hidden;
}
img.dimmer
{
    z-index: -1;
    /* hide to ie8 and below */
    /* display: none\9; */
    /* do not suppress block as transition on opacity won't work */
    /* display: none; */
    visibility: hidden;
	opacity: 0;
    transition: opacity 0.3s linear;
}
img.thumbnail
{
    width: 35px;
    border: 0px;
    vertical-align: middle;
    visibility: visible;
}
img.center_overlay_background
{
    position: absolute;
    z-index: 55;
    visibility: hidden;
}
img.center_overlay_foreground
{
    position: absolute;
    z-index: 56;
    visibility: hidden;
}
img.close_overlay
{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 57;	
}

input
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
    z-index: 2;
}
input.display
{
    width: 93%;
    font-family: system,sans-serif;
    text-align: right;
}
input.save
{
    top: 83px;
    right: 10px;
    z-index: 3;
}

li
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
}

/* floating zoom object */
object.zoom
{
    z-index: 20;
    position: absolute;
    width: 450px;
    height: 200px;
    border-top: 2px solid silver;
    border-bottom: 2px solid silver;
    border-left: 2px solid silver;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    box-shadow: 10px 10px 5px #888;
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.5s linear, opacity 0.5s linear
}

option.image
{
    background-size: 100px;
    background-repeat: no-repeat;
    padding-left: 120px
}

p
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
    font-weight: 400;
}
p.center
{
    text-align: center;
}
p.debug
{
    font-size: 7pt;
}
p.red
{
    color: #cc0000;
}
p.header
{
    padding: 1px;
    margin-top: 5px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 5px;
    border: none;
}

select
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
    background-color: #ffffff;
}
select.entry_selector
{
    background-color: #f8f7e6;
    color: #444444;
    border-style: none;
}

table
{
    padding: 4px;
    border-spacing: 2px;
    border-width: 0px;
}
table.chunk
{
	padding: 1px;
}
table.narrow
{
	border-spacing: 0px;
	border-width: 0px;
	padding: 0px;
}
table.empty
{
    padding: 0px;
    border-spacing: 0px;
    border-width: 0px;
    margin: 0px;
}
table.frame
{
    border-top: 1px ridge;
    border-bottom: 3px outset;
    border-left: 1px ridge;
    border-right: 3px outset;
    border-color: #333333;
    padding: 4px; 
    margin-top: 2px;
    margin-bottom: 7px;
}
table.function_bar
{
    border-top: 1px ridge;
    border-bottom: 3px outset;
    border-left: 1px ridge;
    border-right: 3px outset;
    border-color: #333333;
    border-spacing: 0px;
}
table.navigation
{
    border-spacing: 0px;
    padding-top: 2px;
    padding-bottom: 0px;	
    padding-left: 0px;
}
table.print
{
    padding: 4px;
    border-spacing: 2px;
    border-width: 1px;
}
table.tab
{
    border-spacing: 0px;
    border-width: 0px;
}

td
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
    vertical-align: top;
    padding-left: 3px;
    padding-right: 3px
}
td.right_middle
{
    text-align: right;
    vertical-align: middle
}
td.current_image
{
    background-color: #f9f9f9;
    text-align: center;
    vertical-align: middle;
    border-top: 1px ridge;
    border-bottom: 3px outset;
    border-left: 1px ridge;
    border-right: 3px outset;
    border-color: #333333;
    padding: 4px; 
    border-spacing: 2px;
}
td.function_bright
{
    background-color: #ffffff;
    vertical-align: middle;
    text-align: center;
    padding-top: 4px;
    padding-bottom: 3px;
}
td.entry_function_bright
{
    background-color: #ffffff;
    vertical-align: top;
    text-align: center;
    padding-top: 3px;
    padding-bottom: 3px;
}
td.error_background
{
    background-color: #ffdcdc;
    vertical-align: top;
    text-align: center;
    padding-top: 3px;
    padding-bottom: 3px;
}
td.function_dark
{
    background-color: #e4e4e4;
    vertical-align: middle;
    text-align: center;
    padding-top: 4px;
    padding-bottom: 3px;
}
td.entry_function_dark
{
    background-color: #e4e4e4;
    vertical-align: top;
    text-align: center;
    padding-top: 4px;
    padding-bottom: 3px;
}
td.function_error
{
    background-color: #ffefdf;
    vertical-align: middle;
    text-align: center;
    padding-top: 4px;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
}
td.transparent
{
    background-color: #f9f9f9;
}
td.negative
{
    text-align: right;
    background-color: #f5eceb;
}
td.ordered
{
    background-color: #d0d9e6;
}
td.positive
{
    text-align: right;
    background-color: #ecf5ec;
}
td.progress_bar
{
    background-color: silver;
}
td.tabfiller
{
    border-bottom: 1px solid;
    border-bottom-color: #000000;
    text-align: right;
    padding-left: 0px;
    padding-right: 0px;
    white-space: nowrap;
}
td.nowrap
{
    padding-top: 0px;
    padding-bottom: 0px;
    white-space: nowrap;
    border-spacing: 0px;
    text-align: right;
}
td.entry_selector
{
    padding-top: 0px;
    padding-bottom: 0px;
    border-spacing: 0px;
}
td.cloud
{
    text-align: center;
    vertical-align: middle;
    width: 300px;
    border-spacing: 0px;
}
td.legend
{
	padding-left: 20px;
	padding-top: 0px;
}
td.thumbnail
{
    text-align: center;
    vertical-align: middle;
}

textarea
{
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
}

th
{
    font-weight: 500;
    font-size: 8pt;
    font-family: arial,helvetica,sans-serif;
    background-color: #e5eff6;
    vertical-align: top;
    padding: 3px;
    position: sticky;
    top: 0px;
    z-index: 3;
}
th.ordered
{
    z-index: 5;
}
th.left
{
    text-align: left;
    z-index: 5;
}
th.tab
{
    background-color: #e5eff6;
    padding-top: 2px;
    padding-left: 3px;
    padding-right: 3px;
    border-top: 3px outset;
    border-left: 1px inset;
    border-right: 3px outset;
    border-bottom: 1px solid;
    vertical-align: middle;
    text-align: left;
    white-space: nowrap;
}
tr
{
    font-size: 8pt;
    vertical-align: top;
    font-family: arial,helvetica,sans-serif;
}
tr.dark_markable
{
    background-color: #e4e4e4;
}
.dark_markable:hover
{
    background-color: #cecece;
    cursor: crosshair;
}
tr.bright_markable
{
    background-color: #ffffff;
}
.bright_markable:hover
{
    background-color: #cecece;
    cursor: crosshair;
}
/* Use .middle instead */
tr.vcenter
{
    vertical-align: middle;
}
tr.entry_selector
{
    padding-top: 0px;
    padding-bottom: 0px;
    border-spacing: 0px;
}
ul
{
    font-size: 10pt;
    font-family: arial,helvetica,sans-serif;
}