/**
 * @version 2026-06-03
 *
 * mobile/profile/styles.css
 *
 * Skin "mobile"
 */

/*** iam()->extendedInfo() ***/
section.iam-extended-info {
    container-type: inline-size;

    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;

	margin-bottom: 1em;
	/*max-width: 600px;*/
	background: #fafafa;
	padding: 1em 1.2em;
	box-shadow: 2px 2px #f1f1f1;
}

section.iam-extended-info > div {
	font-style: italic;

    margin: 0;
    padding-right: 1em;
}

section.iam-extended-info section.login-info div div {
	font-style: normal;
}

section.iam-extended-info section.login-info .public-name,
section.iam-extended-info section.login-info .login-name,
section.iam-extended-info div.label {
	font-size: 1em;
}

section.iam-extended-info section.login-info .public-name > div,
section.iam-extended-info section.login-info .login-name > div {
	margin-top: 5px;
	margin-bottom: 15px;
}

section.iam-extended-info address {
	margin-top: 5px;
	font-style: normal;
	font-weight: 600;
}

section.iam-extended-info address > .vatId {
	margin-top: 1em;
}




/*** layout title ***/
div.layout-title > .col-1 {
    width: 35%;
}

div.layout-title > .col-2 {
    width: 64%;
}

/** table.downloads-files **/
table.downloads-files tbody td {
	vertical-align: top;
}
table.downloads-files .col-i {
    width: 5%;
    text-align: right;
}
table.downloads-files .col-icon {
    width: 16px;
    text-align: center
}
/*
table.downloads-files .col-file-name {

}
*/
table.downloads-files .col-file-name .responsive {
	display: none;
	text-align: left;
}
table.downloads-files .col-file-name .responsive > span {
	display: block;
}
table.downloads-files .col-file-name .responsive > span.file-info {
	padding-top: 1em;
}
table.downloads-files .col-file-name .responsive > span.file-size {
	text-align: right;
}

table.downloads-files .col-file-info {
    width: 50%;
}
table.downloads-files .col-file-size {
    width: 10%;
    text-align: right;
    white-space: nowrap;
}

/*** orders ***/
#ordersSearchForms.ui-accordion {
    container-type: inline-size;
}
/** search form **/
/* grid settings */
#ordersSearchForms.ui-accordion > .ui-accordion-content {
	display: grid;

    gap: 1rem;
	grid-template-areas:
	  "form-search form-search-by-belNr"
	  "form-search form-search-by-internalOrderNumber";
	grid-template-columns: 69% 31%;
}


@container (width < 80rem) {
    #ordersSearchForms.ui-accordion > .ui-accordion-content {
        grid-template-columns: 2fr 1fr;
        grid-template-rows: auto;
    }
}

@container (width < 48.75rem) {
    /*** orders ***/
    /** search form **/
    /* grid settings */
    #ordersSearchForms.ui-accordion > .ui-accordion-content {
        grid-template-areas:
        "form-search"
        "form-search-by-belNr"
        "form-search-by-internalOrderNumber";
        grid-template-columns: 100%;
    }
}

#ordersSearchForms.ui-accordion > .ui-accordion-content > .form-search {
	grid-area: form-search;
	--columns-padding-left: 30%;
}
#ordersSearchForms.ui-accordion > .ui-accordion-content > .form-search-by-belNr {
	grid-area: form-search-by-belNr;
}
#ordersSearchForms.ui-accordion > .ui-accordion-content > .form-search-by-internalOrderNumber {
	grid-area: form-search-by-internalOrderNumber;
}
/** search form **/
/* grid settings */
#ordersSearchForms.ui-accordion > .ui-accordion-content > .form-search > form {
	display: grid;

	grid-template-areas:
	  "dates_from_to"
	  "orders_state"
	  "is_only_shop"
	  "submit_search"
	;
	grid-template-columns: 100%;
}



#ordersSearchForms.ui-accordion > .ui-accordion-content > .form-search > form > .dates_from_to {
	grid-area: dates_from_to;
}
#ordersSearchForms.ui-accordion > .ui-accordion-content > .form-search > form > .orders_state {
	grid-area: orders_state;
}
#ordersSearchForms.ui-accordion > .ui-accordion-content > .form-search > form > .is_only_shop {
	grid-area: is_only_shop;
}
#ordersSearchForms.ui-accordion > .ui-accordion-content > .form-search > form > .submit_search {
	grid-area: submit_search;
}
/** simple search forms **/
/* grid settings */
#ordersSearchForms.ui-accordion > .ui-accordion-content > [class^="form-search-by-"] > form {
    display: flex;
    flex-wrap: nowrap;

    gap: 1em;

	align-items: end;
}
#ordersSearchForms.ui-accordion > .ui-accordion-content > [class^="form-search-by-"] > form > .text {
    flex-grow: 1;
}



/** orders search options **/

#ordersSearchForms.ui-accordion .ym-form .ym-fbox > label {
	font-weight: 600;
	width: var(--columns-padding-left);
	line-height: var(--button-normal-height);
    white-space: nowrap;
}

#ordersSearchForms.ui-accordion .ym-form .ym-fbox.belNr > label,
#ordersSearchForms.ui-accordion .ym-form .ym-fbox.internalOrderNumber > label {
    line-height: 1em;
}

section.search-forms .ui-buttonset {
    min-width: 40em;
}


section.search-forms .ym-form .ym-fbox.ym-fbox-button.field-submit {
    /*margin-top: 1em; */ /* 01.04.2022 OFF because of grid */
    text-align: right;
}

section.search-forms .ym-form.ym-columnar .ym-fbox.ym-fbox-button.field-submit {
    text-align: left;
    /*margin-left: 30%;*/ /* 01.04.2022 EXPERIMENTAL OFF */
}

/* section.search-forms .form-search */

/** widget 'dates-from-to' **/
ul.dates-from-to {
    max-width: 24em;
}

ul.dates-from-to li {
    width: 40%;
    text-align: center;
}
ul.dates-from-to li.delimiter {
	width: 5%;
	height: var(--button-normal-height);
	line-height: var(--button-normal-height);
}

ul.dates-from-to input[type="date"],
ul.dates-from-to input[type="number"],
ul.dates-from-to input[type="text"] {
	/*padding-top: 10;*/
    width: 100%;
    text-align: center;
}

section.search-forms [class^="form-search-by-"] {
    /* width: 33%; */ /* 01.04.2022 OFF because of grid */
    float: right;
    position: relative;
}

.type-1-3 section.search-forms [class^="form-search-by-"] .ym-fbox.ym-fbox-button i[class^="fa"] {
    display: none;
}

section.search-forms [class^="form-search-by-"] .ym-fbox.ym-fbox-button button {
    width: 100%;
}

section.search-forms [class^="form-search-by-"] .ym-fbox.ym-fbox-button button > .caption {
    white-space: nowrap;
}


/** section.search-results **/
section.search-results {
    margin-bottom: 1em;
}

section.search-results section.info-search {
    margin-top: 1em;
	margin-bottom: 1em;
}

section.search-results section.info-search > ul > li div.from-date-to-date {
	display: inline;
}
section.search-results section.info-search > ul > li {
    padding-right: 0.5em;
}
section.search-results section.info-search > ul > li.last {
    padding-right: 0;
}
section.search-results section.info-search > ul > li:AFTER {
	content: ',';
}
section.search-results section.info-search > ul > li.last:AFTER {
	content: '';
}
/*
section.search-results section.info-search > ul > li {

}
*/

/* section.search-results table.belegs */
section.search-results table.belegs tr.closed :where(td, td a),
section.search-results table.belegs tr.closed.offer :where(td, td a) {
	background: var(--button-final-color);
	color: var(--button-final-color-opposite);
}

:where(section.search-results, .ui-tooltip) table.belegs tr.closed i.fa-duotone.fa-circle {
    --fa-primary-color: var(--button-final-color-opposite);
    --fa-secondary-color: var(--button-final-color-opposite);
}

.ui-tooltip i.fa-duotone.fa-circle,
section.search-results table.belegs tr.closed.offer-opened i.fa-duotone.fa-circle {
    --fa-primary-color: var(--button-final-color);
    --fa-secondary-color: var(--button-final-color);
}

.ui-tooltip i.fa-hourglass-half,
section.search-results table.belegs i.fa-hourglass-half {
    --fa-primary-color: #888;
    --fa-secondary-color: #aaa;
}
/* @package Accessibility */
:root[data-theme='contrast'] .ui-tooltip i.fa-hourglass-half,
:root[data-theme='contrast'] section.search-results table.belegs i.fa-hourglass-half {
    --fa-primary-color: var(--theme-color-black-1);
    --fa-secondary-color: var(--theme-color-black-1);
}
/* @package Accessibility */
:root[data-theme='contrast'] section.search-results table.belegs tr.offer-opened i.fa-hourglass-half,
section.search-results table.belegs tr.offer-opened i.fa-hourglass-half {
    --fa-primary-color: var(--theme-color-bright-opposite);
    --fa-secondary-color: var(--theme-color-bright-opposite);
}
.ui-tooltip i.fa-earth-americas,
section.search-results table.belegs i.fa-earth-americas {
    color: #3b3be6;
}

section.search-results table.belegs tr.offer-opened i.fa-earth-americas {
    color: var(--theme-color-bright-opposite);
}




section.search-results table.belegs tr.offer td,
section.search-results table.belegs tr.offer td a {
    background: none;
	color: var(--theme-color-dark);
}

section.search-results table.belegs tr.offer-opened :where(td, td a) {
    background: var(--theme-color-bright);
	color: var(--theme-color-bright-opposite);
}

section.search-results table.belegs tr.offer.request :where(td, td a) {
	background: none;
	color: var(--theme-color-dark);
}

section.search-results table.belegs :where(.col-status, .col-ordered-from) {
	width: 36px;
	text-align: center;
	vertical-align: middle;
	padding: 0;
	line-height: 1em;
}

section.search-results table.belegs .col-date {
    width: 10%;
    text-align: center;
}
section.search-results table.belegs .col-type {
    width: 36px;
    text-align: center;
}
section.search-results table.belegs .col-order-number {
    width: 15%;
    text-align: right;
}
section.search-results table.belegs .col-order-number .responsive {
	display: none;
}
/*
section.search-results table.belegs .col-internal-number {

}
*/
section.search-results table.belegs .col-price-total {
    width: 15%;
    text-align: right;
}
section.search-results table.belegs .col-valid-until {
    width: 15%;
    text-align: right;
}
section.search-results table.belegs .col-details {
    width: 8%;
    text-align: center;
}
section.search-results table.belegs .col-details .responsive {
	display: none;
}

/*** beleg details: article.order-details ***/
/** section.info-toolbar **/
section.info-toolbar {
    margin-bottom: 1em;
}

section.info-toolbar > .ym-gr button.ui-button {
    margin-top: -0.5em;
}

/** section.belegs **/
/** section.belegs section.beleg **/
section.beleg div.ui-accordion-content {
    /*margin-bottom: 1em;*/
	height: auto !important; /* 04.04.2022 EXPERIMENTAL because of appearing scrollbars sometimes */
}

/** section.belegs section.beleg section.receipt-info **/
section.beleg section.receipt-info {
    margin-bottom: 1em;
}

section.beleg section.receipt-info > ul {
    padding: 0.5em 1em;
}

section.beleg section.receipt-info > ul.odd {
    background: #f7f7f7;
}

section.receipt-info > ul.table-2-cols > li.label {
    line-height: 1.2;

    text-align: left;
    width: 33%;
    white-space: nowrap;

}

section.receipt-info > ul.table-2-cols > li.value {
    line-height: 1.3;

    text-align: left;
    width: 66%;
}

/** DMS downloads **/
section.receipt-info ul.downloads > li {
  display: block;
  float: none;
}

/** section.beleg table.positions **/
section.beleg table.positions thead th {
	background: var(--theme-color-dark-b1);
	color: var(--theme-color-dark-b2-opposite);
}
section.beleg table.positions tr:nth-child(even) {
	background: var(--theme-color-dark-b1);
	color: var(--theme-color-dark-b2-opposite);
}
section.beleg table.positions tr:nth-child(odd) {
	background: var(--theme-color-white);
	color: var(--theme-color-dark);
}

/* section.beleg table.positions BomArticle */
/*
section.beleg table.positions tr.BomArticle {

}
*/
/* section.beleg table.positions BomPosition */
/*
section.beleg table.positions tr.BomPosition {

}
*/

/* BoM */
table.bordertable.positions tr.BomArticle td {
	font-weight: 600;
}

table.bordertable.positions tr.BomPosition td {
	font-size: 0.9em;
}

table.bordertable.positions tr.BomPosition td.col-article-number,
table.bordertable.positions tr.BomPosition td.col-article-name {
	padding-left: 15px;
}
section.beleg table.positions tr.BomPosition td.col-position-number {
	padding-left: 1em;
}

section.beleg table.positions .col-position-number {
    width: 10%;
}
section.beleg table.positions .col-article-number {
    width: 10%;
}
section.beleg table.positions .col-article-name .positionsText {
    font-size: 12px;
	font-weight: 600;
}
section.beleg table.positions .col-article-name .responsive {
	display: none;
}
section.beleg table.positions .col-article-name .responsive.bottom {
	text-align: right;
}
section.beleg table.positions .col-article-name .responsive > span {
	display: block;
}

section.beleg table.positions .col-article-name .responsive span.article-number {
	font-weight: 600;
}

section.beleg table.positions .col-article-name .responsive.bottom span > span.label {
	font-weight: 600;
	padding-right: 1em;
}
section.beleg table.positions .col-article-name .responsive.bottom span > span.label:AFTER {
	content: ':';
}


section.beleg table.positions .col-count-ordered {
    text-align: right;
    width: 10%;
}
section.beleg table.positions .col-price-item {
    text-align: right;
    width: 10%;
}
section.beleg table.positions .col-count-delivered {
    text-align: right;
    width: 10%;
}
section.beleg table.positions .col-count-remained {
    text-align: right;
    width: 10%;
}
section.beleg table.positions .col-price-total {
    text-align: right;
    width: 10%;
}
section.beleg table.positions .col-to-shopcart {
    text-align: center;
    width: 36px;
}
section.beleg table.positions .col-to-shopcart img.icon {
	width: 100%;
}

/** section.receipt-total  **/
/* grid settings */
section.beleg section.receipt-total {
	display: grid;
	grid-template-areas:
  	"buttons info";
	grid-template-columns: 39% 61%;
}
section.beleg section.receipt-total > .ym-gl {
	grid-area: buttons;
}
section.beleg section.receipt-total > .ym-gr {
	grid-area: info;
}
section.beleg section.receipt-total > div {
	width: 100%;
	margin: 0;
	padding: 0;
	float: none;
}
section.receipt-total > .ym-gr ul.table-2-cols {
	margin-bottom: 0.25em;
}
section.receipt-total ul.table-2-cols li.label {
    font-weight: normaL;
    text-align: right;
    width: 61%;
}
section.receipt-total ul.table-2-cols li.value {
    text-align: right;
    width: 38%;
    padding-right: 36px;
}
section.receipt-total ul.table-2-cols.totalAmount {
    border-top: 2px solid var(--theme-color-dark-b1);
	padding-top: 0.25em;
}
section.receipt-total ul.table-2-cols.totalAmount li {
    font-weight: 600;
}

/*  section.receipt-total section.alternates */
section.receipt-total section.alternates > div.button,
section.receipt-total section.alternates > div.info {
    border: 0;
    margin: 0;
    padding: 0;
    background: none;
}

section.receipt-total section.alternates > div.info {
    padding: 0.5em 0 1em 0;
    font-size: 0.9em;
}
/*
section.receipt-total section.alternates > div button {

}
*/


/** section.receipt-order-message **/
section.receipt-order-message > ul.table-2-cols > li {
    text-align: left;
    width: 100%;
}
section.receipt-order-message > ul.table-2-cols > li.value {
    background: #ffffff none repeat scroll 0 0;
    border: 1px dotted #aaaaaa;
    margin: 5px 0;
    padding: 5px 7px;
}
/** button-back **/
article.order-details div.button-back {
    margin: 1em 0 2em 0;
}

/*** sub-users ***/
/** section.profile.subusers.list.header **/
section.profile.subusers.list.header  {
    position: relative;
    margin-bottom: 1em;
}

section.profile.subusers.list.header section.message-info {
    margin: 0;
}

section.profile.subusers.list.header > .ym-gr > section {
    position: absolute;
    bottom: 1em;
    right: 0px;
}

section.profile.subusers.list.header > .ym-gr > section form > ul.table-2-cols {
    width: auto;
}

/** section.subusers.search-results **/
/* grid settings */
section.subusers.search-results {
	display: grid;
	grid-template-areas:
       "search-results search-results"
       "button pages-bar"
       ;
	grid-template-columns: 160px calc(100% - 160px);
}
section.subusers.search-results > table.subusers-search-results {
	grid-area: search-results;
}
section.subusers.search-results > div.pages-bar {
	grid-area: pages-bar;
}
section.subusers.search-results > div.button-replicate {
	grid-area: button;
}

/* grid-area: pages-bar; */
section.subusers.search-results > div.pages-bar.bottom {
	position: relative;
}
section.subusers.search-results > div.pages-bar.bottom > div.ym-gr > ul {
	position: absolute;
	top: 50%;
	bottom: auto;
	right: 0;
	left: auto;
	transform: translateY(-50%);
}

table.subusers-search-results .col-status {
    width: 45px;
    vertical-align: top;
    text-align: center;
	text-align: left;
}
table.subusers-search-results td.col-status img {
    position: relative;
    top: 2px;
}
/* SUB_USER_ENABLED */
:where(table.subusers-search-results, section.subuser-status, .ui-tooltip) i.fa-duotone.fa-user {
    --fa-primary-color: #0a0; /*var(--theme-color-dark);*/
    --fa-secondary-color: #0a0; /*var(--theme-color-bright);*/
}
/* SUB_USER_BLOCKED */
:where(table.subusers-search-results, section.subuser-status, .ui-tooltip) i.fa-duotone.fa-lock {
    --fa-primary-color: #a00;
    --fa-secondary-color: var(--theme-color-dark);
}
/* SUB_USER_ENABLED_SAME_LOGIN */
:where(table.subusers-search-results, section.subuser-status, .ui-tooltip) i.fa-duotone.fa-user-shield {
    --fa-primary-color: #ffcd00; /*var(--theme-color-dark);*/
    --fa-secondary-color: #0a0; /*var(--theme-color-bright);*/
}
/* SUB_USER_BLOCKED_SAME_LOGIN */
:where(table.subusers-search-results, section.subuser-status, .ui-tooltip) i.fa-duotone.fa-triangle-exclamation {
    --fa-primary-color: #fff; /*var(--theme-color-dark);*/
    --fa-secondary-color: #a00; /*var(--theme-color-bright);*/
}
/* SUB_USER_NEED_UPDATE */
:where(table.subusers-search-results, section.subuser-status, .ui-tooltip) i.fa-duotone.fa-right {
    --fa-primary-color: #00c; /*var(--theme-color-dark);*/
    --fa-secondary-color: #00c; /*var(--theme-color-bright);*/
}

/* @package Accessibility : theme "contrast" */
/* common CSS rules: */
:root[data-theme='contrast'] :where(table.subusers-search-results, section.subuser-status, .ui-tooltip) i.fa-duotone {
    --fa-primary-color: var(--theme-color-black);
    --fa-secondary-color: var(--theme-color-black-1);
}
:root[data-theme='contrast'] :where(table.subusers-search-results, section.subuser-status, .ui-tooltip) i.fa-duotone.fa-triangle-exclamation {
    --fa-primary-color: var(--theme-color-white);
    --fa-secondary-color: #a00;
}

table.subusers-search-results .col-public-name .responsive {
	display: none;
	text-align: right;
}
table.subusers-search-results .col-public-name .responsive > span,
table.subusers-search-results .col-public-name .responsive > span > span {
	display: block;
}
table.subusers-search-results .col-public-name .responsive > span > span.label {
	font-style: italic;
}
table.subusers-search-results .col-public-name .responsive > span > span.label:AFTER {
	content: ':';
}
table.subusers-search-results .col-public-name .responsive > span > span.value {
	font-weight: 600;
}
table.subusers-search-results .col-department {
    width: 15%;
}
table.subusers-search-results .col-email {
    width: 25%;
}
table.subusers-search-results .col-sub-status {
    width: 30px;
}
table.subusers-search-results.without-sub-status .col-sub-status {
    width: 0px;
	display: none;
}
table.subusers-search-results .col-login-name {
    width: 25%;
}

/** article.subuser-details **/
/* "Property Label: Property Value" */
article.subuser-details > section > ul.table-2-cols {
	margin-bottom: 0.5em;
}
article.subuser-details section.contact-person {
    margin-bottom: 1em;
}
article.subuser-details ul.table-2-cols.contact-person > li.label {
    width: 25%;
    text-align: left;
}

article.subuser-details ul.table-2-cols.contact-person > li.value {
    width: auto;
    text-align: left;
}

/** popup "E-Mail preview article.email-preview **/
article.email-preview section.header {
       border-bottom: 1px solid #f0f0f0;
       margin-bottom: 1em;
       padding-bottom: 1em;
}
article.email-preview section.header > ul > li {
    line-height: 2em;
}
article.email-preview section.header > ul > li.label {
   width: 10em;
   text-align: left;
}
article.email-preview section.header > ul > li.value {
   width: auto;
   text-align: left;
}

article.email-preview label.body {
    margin: 1em 0 0.5em 0;
    display: block;
    font-weight: 600;
    font-style: italic;
}

article.email-preview section.body {
    border: 1px solid #f0f0f0;
    padding: 1.5em 2em;
    background: #fafafa;
}

article.email-preview section.body.html ol,
article.email-preview section.body.html ul {
   margin: 10px 0px 0px 10px;
}

article.email-preview section.body.html table {
    border: 0;
    margin: 0;
    padding: 0;
    width: auto;
}

article.email-preview section.body.html table td {
    width: auto;
    padding: 0;
}

/** form.profile-b2c **/
form.profile-b2c {
    display: none;
}
form.profile-b2c ul.profile-b2c > li {
    width: 49%;
}

form.profile-b2c ul.profile-b2c > li.group-0 {
    float: right;
}

form.profile-b2c ul.profile-b2c > li.group-1 {
    float: left;
}

html.logged-in-b2c-incomplete form.profile-b2c.ym-columnar button#submit-cancel-id {
	display: none;
}

/** form.profile-password **/
form.change-password {
    display: none;
}
form.change-password ul.change-password > li {
    width: 49%;
}

form.change-password ul.change-password > li.group-0 {
   float: left;
}

form.change-password ul.change-password > li.group-1 {
    float: right;
}

/** runner-list **/
section.runner-list ul.mode-rows > li.item .toolbar {
  margin: 0 10px -10px 0;
}

/** noted-list **/
.ym-column.type-1-3 div.layout-title section.toolbar {
	display: none;
}

section.buttons-template.for-wizard.count-1 > .col-1 {
	width: 100%;
}

.type-1-3 div.layout-title.noted-list > .col-1,
.type-1-3 section.buttons-template.for-wizard > .col-1 {
    width: 22%;
}

.type-1-3 div.layout-title.noted-list > .col-2,
.type-1-3 section.buttons-template.for-wizard > .col-2 {
    width: 77%;
}

/** orders search forms **/
/** oders search form **/
section.form-search .ui-controlgroup {
    width: 68%;
}

/*** order lists ***/

section.paginable-articles-table.order-lists table.paginable-articles-table {
    margin-bottom: 1em;
}

section.paginable-articles-table.order-lists div.pages-bar.bottom {
    display: none;
}

section.buttons-template.lists section.toolbar.lists > ul {
    display: flex;
    flex-direction: row-reverse;
    gap: var(--items-gap);
}

@container (width < 45rem ) {
	/** toolbar "order lists" at bottom **/

    section.buttons-template.lists section.toolbar.lists > ul {
        flex-direction: column;
    }
    section.buttons-template.lists section.toolbar.lists > ul > li button {
		width: 100%;
	}
}