html body.cs-magnasweets header {background: #de007e;}
html body.cs-magnasweets header .cs-logo {max-width: 200px;margin-top: 4px;}
html body.cs-magnasweets .cs-categoriesTop ul.cs-categories2 ul {right: -14em;}
html body.cs-magnasweets .cs-categoriesTop ul li .cs-menuItem .cs-categorieName svg path{fill: #fff;}
html body.cs-magnasweets .cs-categoriesTop > ul.cs-categories1 > li:hover > ul.cs-categories2 {left: 0.5em;}
html body.cs-magnasweets header .cs-headerContent {margin: unset;margin-left: auto;padding: 6px 0 5px 0;flex-wrap: wrap;}
html body.cs-magnasweets header .cs-headerContent .cs-categoriesBox {flex: 1 1 100%;width: 100%;background: #de007e;margin-bottom: 0;}
html body.cs-magnasweets header .cs-headerContent .cs-categoriesBox .cs-container {padding: 0;justify-content: right;display: flex;}
html body.cs-magnasweets header .cs-miniButtons {position: relative;display: flex;justify-content: right;}
html body.cs-magnasweets header .cs-miniButtons > ul > li {margin: 0;margin-left: 10px;}
html body.cs-magnasweets .cs-container {max-width: 1400px !important;padding: 0 32px;}
html body.cs-magnasweets section.cs-main {min-height: 66vh;}
html body.cs-magnasweets .cs-miniButtons .cs-svgIcon {width: 1.1em;height: 1.1em;}
html body.cs-magnasweets .cs-miniButtons .cs-svgIcon path {fill: #fff;}
html body.cs-magnasweets .cs-categoriesMegaMenu .cs-megaMenu > ul > li > a {color: #fff;text-transform: uppercase;font-size: 21px;padding: 10px 0 10px 30px;font-weight: 500;}
html body.cs-magnasweets .cs-categoriesMegaMenu .cs-megaMenu > ul > li {margin-right: 0;}
html body.cs-magnasweets .cs-topPages > ul > li a {padding: 0;font-size: 0.85rem;color: #fff;font-weight: 400;text-transform: uppercase;padding-left: 20px;}
html body.cs-magnasweets .cs-topPages svg {display: none;}
html body.cs-magnasweets .cs-topPages svg path {fill: #fff;}
html body.cs-magnasweets .cs-topContent {border-right: 1px solid #fff;padding-right: 10px;margin-right: 10px;}
html body.cs-magnasweets .cs-headerContent .cs-lang {max-width: 19px;padding-top: 5px;margin-right: 0;margin-left: 6px;}
html body.cs-magnasweets .cs-miniwk span {color: #fff;}
html body.cs-magnasweets header .cs-headerContent .cs-categoriesBox .cs-categoriesMegaMenu {margin-top: 2px;}
html body.cs-magnasweets footer .cs-footerRow.top {background: #de007e;color: #fff;}
html body.cs-magnasweets footer .cs-footerRow.top a {color: #fff;}
html body.cs-magnasweets footer .cs-footerBox .cs-footerBoxHeader {font-size: 22px;}
html body.cs-magnasweets .cs-categoryBox {displaY: flex;justify-content: space-between;}
html body.cs-magnasweets .cs-categoryPreview .cs-categoryName{position:relative;bottom:auto;left:auto;font-size:17px;font-weight:600;background:#eee;min-width:unset;text-align:unset;-webkit-transform:none;transform:none}
html body.cs-magnasweets .cs-categoryBox img,
html body.cs-magnasweets .cs-categoryBox a {displaY: block;}
html body.cs-magnasweets .cs-categoryButton {text-align: center;position: absolute;margin-top: auto;bottom: 1.5em;}
html body.cs-magnasweets .cs-categoryButton a {background: #e30081;padding: 10px 30px;color: #fff;border-bottom: 5px solid #780044;font-size: 16px;}
html body.cs-magnasweets .cs-categoryPreview .cs-categoryName a {padding: 0;font-size: 24px;font-weight: 600;margin-bottom: 1em;}
html body.cs-magnasweets .cs-categoryPreview .cs-categoryContent {padding: 2em;width: 69%;}
html body.cs-magnasweets .cs-categoryPreview .cs-categoryText {font-size: 17px;}
html body.cs-magnasweets .cs-articleDetail .basketBlock .cs-articleAmount {display: block;}

html body.cs-magnasweets .cs-searchBar select {visibility: hidden;max-height: 1px;max-width: 1px;margin: 0;}

.visually-hidden {
  border: 0;
  clip-path: inset(50%);
  height: 1px;
  margin: 0;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

html body.cs-magnasweets #cookieAlertWrapper{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;backdrop-filter:blur(8px);background:rgba(0,0,0,.3);z-index:9999;max-width:unset}
html body.cs-magnasweets #cookieAlertWrapper #cookieAlert{background:#fff;padding:30px 0 30px 30px;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.15);display:flex;flex-direction:row;align-items:center;gap:30px;max-width:700px;width:100%}
html body.cs-magnasweets #cookieAlertWrapper #cookieAlert .leftside{flex:1;font-family:sans-serif;line-height:1.5;color:#333}
html body.cs-magnasweets #cookieAlertWrapper #cookieAlert .rightside a{display:inline-flex;align-items:center;gap:8px;background:#de007e;color:#fff;padding:12px 24px;border-radius:50px;text-decoration:none;font-weight:600;transition:background .3s ease}
html body.cs-magnasweets #cookieAlertWrapper #cookieAlert .rightside a:hover{background:#bbb}

html body.cs-magnasweets .cs-articlePager {display: flex;gap: 5px;}
html body.cs-magnasweets .cs-articlePager > a,
html body.cs-magnasweets .cs-articlePager > span {background: #f7f7f7;padding: 5px 10px;border-radius: 3px;}
html body.cs-magnasweets .cs-articlePager > .listpagerButtonActive {background: #de007e;color: #fff;}
html body.cs-magnasweets .cs-articlePager > a .listpagerButtonNext {background: #f7f7f7;border-radius: 3px;}
html body.cs-magnasweets .cs-articlePager > a {displaY: inline-block;}

html body.cs-magnasweets .ui-button:focus .ui-icon {filter: brightness(0) invert(1);}

html body.cs-magnasweets .cs-startTextBox {padding: 1em 0;background: #ffffff;}

html body.cs-magnasweets .cs-categoriesMegaMenu .cs-megaMenu svg path {fill: #fff;}

html body.cs-magnasweets .cs-categoriesMegaMenu .cs-megaMenu > ul > li:hover .cs-megaMenuContainer {border-radius: 5px;border: 0px solid #de007e;background: #ffffff;color: #de007e;right: 0;left: auto;padding-left: 15px;padding-bottom: 12px;padding-top: 17px;border-top: 2px solid #ff0091;}
html body.cs-magnasweets .cs-categoriesMegaMenu .cs-megaMenu > ul > li:hover .cs-megaMenuContainer a {display: flex;height: 95%;display: block;margin-bottom: 4px;background: #de007e;color: #fff;padding-left: 10px;font-size: 18px;width: 100%;border-radius: 5px;text-decoration: none;}
html body.cs-magnasweets .cs-categoriesMegaMenu .cs-megaMenu > ul > li:hover .cs-megaMenuContainer a:hover {background: #bf0d72;color: #ffffff;}

html body.cs-magnasweets #magna_attributes {margin-top: 3em;}

html body.cs-magnasweets [role="tooltip"] {border-radius: 5px !important;box-shadow: none;width: auto !important;}
html body.cs-magnasweets .cs-articlePictureBox .cs-addPicBox .cs-galleryImageBox {border: 1px solid #dadadd;border-radius: 5px;padding: 3px;}

html body.cs-magnasweets .cs-propertys {display: flex;gap: 10px;margin-top: 1em;}
html body.cs-magnasweets .cs-propertys img {max-width: 60px;max-height: 60px;}

html body.cs-magnasweets article.cs-articlePreview {border: 1px solid #dadadd;border-radius: 3px;padding: 0 10px 10px 10px;}
html body.cs-magnasweets article.cs-articlePreview:hover {border-color: #de007e;}

html body.cs-magnasweets .cs-topPages > ul > li.cs-heandlerLogin {background: #fff;color: #000;border-radius: 5px;}
html body.cs-magnasweets .cs-topPages > ul > li.cs-heandlerLogin a {color: #de007e;padding-right: 20px;font-weight: 600;}
html body.cs-magnasweets .cs-topPages > ul > li.cs-heandlerLogin:hover {top: 1px;right:0;}

html body.cs-magnasweets.cs-checkout .cs-basektLeftBox .articletable .cartTableRow.cs-wkHeader {background: #de007e;color: #fff;padding: 6px 9px;border-radius: 5px 5px 0 0;margin: 0;margin-top: 0;}

html body.cs-magnasweets .cs-orders .cs-orderButton a {padding: 7px 9px 2px 9px;display: flex;align-items: center;gap: 10px;}

html body.cs-magnasweets.cs-checkout .cs-basektLeftBox {padding-top: 0;}

html body.cs-loginpagebody .cs-header {background: #de007e;padding: 1em;}
html body.cs-magnasweets article.cs-articlePreview .cs-hoverlay {display: none !important;}

html body.cs-magnasweets .specialButtons {margin-top: 4px;}
html body.cs-magnasweets .cs-actionButtons > input[type="submit"] {cursor: pointer;}
html body.cs-magnasweets .cs-actionButtons > input[type="submit"]:hover {background: #f1f1f1;}

html body.cs-magnasweets .cc_comboline {display: flex;}

html body.cs-magnasweets.cs-checkout .cs-wkHeader {background: #de007e;color: #fff;padding: 6px 9px;border-radius: 5px 5px 0 0;margin: 0;margin-top: 0;margin-bottom: 1em;}
html body.cs-magnasweets.cs-checkout .cs-cartRow,
html body.cs-magnasweets.cs-checkout .cartTableRow {border: 0;}

/* tmp */
html body.cs-magnasweets .cs-categoryHeaderBox,
html body.cs-magnasweets .cs-categoryRubText.cs-container,
html body.cs-magnasweets #staffelTabelle {display: none;}
/* tmp */

html body.cs-magnasweets.cs-start header .cs-miniButtons > ul > li.cs-searchBar {display: none;}

html body.cs-magnasweets .cs-articleDetail .basketBlock #mengenEingabeContainer.cs-articleAmount .cs-primaryButton {margin-bottom: 5px;}
html body.cs-magnasweets .cs-categoryList {display: flex;justify-content: space-between;}
html body.cs-magnasweets .cs-main article.cs-categoryPreview {width: calc(100%/2 - 1em);margin: 0;margin-bottom: 2em;}
html body.cs-magnasweets .cs-articleDetail .basketBlock #mengenEingabeContainer.cs-articleAmount .cs-bestellButtons {margin-top: 1em;}

html body.cs-magnasweets aside.cs-aside {display: none;}
html body.cs-magnasweets section.cs-mainContent {width: 100%;}

html body.cs-magnasweets .cs-box {max-width: 1336px;padding: 0 5px;}
html body.cs-magnasweets .cs-articleDetail .cs-articleDetailMiddleBox .cs-articleLeftBox {position: sticky;top: 2em;height: 100%;overflow: hidden;padding-bottom: 0;z-index: 99;}
html body.cs-magnasweets .cs-box .cs-container {padding: 0 5px;}

html body.cs-magnasweets header .cs-headerContent .cs-categoriesBox .cs-categoriesTop > ul >  li > div > a svg.cs-svgIcon path {fill: #ffffff;}
html body.cs-magnasweets header .cs-headerContent .cs-categoriesBox .cs-categoriesTop > ul >  li > div > a {color: #fff;font-weight: 500;font-size: 1.3rem;padding: 0.7em 7px 0.5em 1em;}
html body.cs-magnasweets header .cs-headerContent .cs-categoriesBox .cs-categoriesTop > ul >  li > div > a svg.cs-svgIcon {top: 6px;}

html body.cs-magnasweets .cs-articleDetail .cs-articleDetailMiddleBox .cs-articleRightBox {max-width: 56%;width: 100%;}
html body.cs-magnasweets .cs-articleDetail .cs-articleDetailMiddleBox .cs-articleLeftBox {max-width: 37%;}
html body.cs-magnasweets .cs-graduation .articleBlockPrice {width: 28%;display: flex;}
html body.cs-magnasweets .cs-amountBox .cs-blockPriceVpeLeft, 
html body.cs-magnasweets .cs-amountBox .cs-blockPriceLeft {width: 29%;}
html body.cs-magnasweets .cs-articleDetail .cs-deliveryTime {color: #de007e;display: inline-block;padding: 0;}
html body.cs-magnasweets header .cs-headerContent .cs-categoriesBox .cs-categoriesMegaMenu {width: 100%;}
html body.cs-magnasweets .cs-categoriesMegaMenu .cs-megaMenu {width: 100%;display: flex;justify-content: right;}
html body.cs-magnasweets .cs-categoriesTop > ul.cs-categories1 > li {margin-left: 1em;margin-right: 0;}
html body.cs-magnasweets .cs-categoriesTop ul.cs-categories1 ul {width: 14em;background: #de007e;}
html body.cs-magnasweets .cs-categoriesTop ul.cs-categories1 > li > ul > li > ul {border: 1px solid #bebebe;border-width: 0 1px 1px 0;}

html body.cs-magnasweets .cs-articleDetail .cs-articleName {font-size: 1.6rem;}

html body.cs-magnasweets .cs-bannerRow {margin-bottom: 2em;margin-top: 3em;}

html body.cs-magnasweets .cs-categoriesTop ul a {color: #fff;}
html body.cs-magnasweets .cs-categoriesTop ul > li > ul li:hover {background: #f7f7f7;}
html body.cs-magnasweets .cs-categoriesTop ul > li > ul li:hover a {color: #444;}

html body.cs-magnasweets .cs-productListing, .cs-categoryList {margin-left: 0;margin-right: 0;}
html body.cs-magnasweets.cs-checkout .cs-footer ul li {margin-right: 0;margin: 0 1em;}
html body.cs-magnasweets.cs-checkout header {background: #de007e;height: 111px;margin-bottom: 2em;}
html body.cs-magnasweets.cs-checkout {display: flex;flex-direction: column;min-height: 100vh;}
html body.cs-magnasweets.cs-checkout .cs-footer {margin-top: auto;padding-bottom: 1em;}

hhtml body.cs-magnasweets .cs-bestellButtons .specialButtons {display: grid; grid-template-columns: 1fr 1fr; gap: 5px;max-width: 50%;}
hhtml body.cs-magnasweets .cs-bestellButtons #special_submit_2 {grid-column: 1 / 3;}
hhtml body.cs-magnasweets .cs-bestellButtons .specialButtons .cs-primaryButton {margin: 0 !important;}

/* tables */
html body.cs-magnasweets #magna_template_table{max-width:100%;margin:0 auto;background-color:#fff;border-radius:8px}
html body.cs-magnasweets #magna_template_table .table_title {color: #de007e;font-size: 28px;font-weight: 700;margin-bottom: 25px;margin-top: 0;text-transform: uppercase;letter-spacing: .5px;margin-top: 12px;background: #fff;border: 0;padding: 0;font-size: 1.2rem !important;margin-top: 2em;}
html body.cs-magnasweets #magna_template_table table{width:100%;border-collapse:collapse;border:none;font-size:15px}
html body.cs-magnasweets #magna_template_table table tr:first-child{background-color:#de007e;color:#fff}
html body.cs-magnasweets #magna_template_table table tr:first-child td{font-weight:600;padding:15px 12px;text-align:center;border:none;font-size:14px;text-transform:uppercase;letter-spacing:.3px;color:#fff}
html body.cs-magnasweets #magna_template_table table tr:first-child td:first-child{text-align:left;padding-left:20px;color:#fff}
html body.cs-magnasweets #magna_template_table table tr:not(:first-child){border-bottom:1px solid #e0e0e0}
html body.cs-magnasweets #magna_template_table table tr:not(:first-child):hover{background-color:#f9f9f9}
html body.cs-magnasweets #magna_template_table table td{padding:14px 12px;text-align:center;border:none;color:#333}
html body.cs-magnasweets #magna_template_table table tr:not(:first-child) td:first-child{text-align:left;font-weight:600;padding-left:20px;color:#444}
html body.cs-magnasweets #magna_template_table table tr:not(:first-child) td:not(:first-child){font-weight:600;color:#de007e}

/* attributes and propertys */
html body.cs-magnasweets .cs-summaryAttributes .table_title {justify-content: space-between;cursor: pointer;letter-spacing:.5px;margin-top: 11px;display: flex;align-items: center;background: #f7f7f7;color: #111;text-transform: none;font-weight: 400;font-size: 100% !important;max-width: 350px;padding: 0.9em;border: 1px solid #dadadd;width: 100%;}
html body.cs-magnasweets .cs-summaryAttributes .table_title svg {width: 12px;height: 12px;margin-left: 15px;}
html body.cs-magnasweets .cs-summaryAttributes #magna_template_attribute {display: none;align-items: center;gap: 1em;border-bottom:0 solid #e0e0e0;margin-bottom: 5px;}
html body.cs-magnasweets .cs-summaryAttributes #magna_template_property {display: none;align-items: center;gap: 1em;border-bottom:0 solid #e0e0e0;margin-bottom: 5px;}
html body.cs-magnasweets .cs-summaryAttributes #magna_template_attribute > img,
html body.cs-magnasweets .cs-summaryAttributes #magna_template_property > img {background: #de007e;max-width: 2em;padding: 4px;border-radius: 8px 8px 0 8px;display: flex;align-items: center;justify-content: center;}
html body.cs-magnasweets .cs-summaryAttributes #magna_template_attribute.icon_only img {background: none;max-width: 4em;}
html body.cs-magnasweets .cs-summaryAttributes #magna_template_template {background: #f7f7f7;border-radius: 5px;margin-top: 10px;}
html body.cs-magnasweets .cs-summaryAttributes #magna_template_template > a {displaY: flex;align-items: center;gap: 0.5em;padding: 9px;}
html body.cs-magnasweets .cs-summaryAttributes #magna_template_template:hover {background: #f1f1f1;}
html body.cs-magnasweets .cs-summaryAttributes #magna_template_template .table_title {color:#de007e;font-size:28px;font-weight:700;margin-bottom:25px;margin-top:0;text-transform:uppercase;letter-spacing:.5px;margin-top: 1em;}

html body.cs-magnasweets .cs-summaryAttributes .cs-attributesContent > div,
html body.cs-magnasweets .cs-summaryAttributes .cs-propertyContent > div {display: flex !important;}
html body.cs-magnasweets .cs-summaryAttributes .cs-attributesContent,
html body.cs-magnasweets .cs-summaryAttributes .cs-propertyContent {display: none;background: #f7f7f7;padding: 1em;border: 1px solid #dadadd;margin-top: 3px;}

/* hint */
html body.cs-magnasweets .magna_hint {background: #f7f7f7;padding: 10px;border-radius: 5px;border: 1px solid #dadadd;margin-top: 0;display: inline-block;color: #de007e;margin-bottom: 2em;}
html body.cs-magnasweets .magna_hint a {text-decoration: underline;}

/* colors */
body.cs-body.cs-loginpagebody .cs-wrapper .cs-lang {top: 0;position: relative;float: right;}
html body.cs-body .cs-overlayButton.cs-overlayMenuButton,
html body.cs-body .cs-topPages .cs-informationsHeader, 
html body.cs-body .cs-mobileCategorys .cs-mobileCategorysHeader, 
html body.cs-body .cs-compareHeader,
html body.cs-body #bestandsbenachrichtigung .requestBtn,
html body.cs-body .cs-button1,
html body.cs-body .cs-button1:hover,
html body.cs-body footer .cs-footerNewsletterBox.input .cs-newsletterSubmit,
html body.cs-body .wkAddLayer .cs-checkoutBtn {background: #009fe3;border-bottom: 4px solid #0069b4;}

html body.cs-body .ui-dialog .ui-dialog-titlebar,
html body.cs-body .ui-dialog .ui-dialog-titlebar-close,
html body.cs-body .cs-filterButton {background: #009fe3 !important;border-bottom: 4px solid #0069b4;}

html body.cs-body .cs-overlayButton.cs-overlayMenuButton,
html body.cs-body .cs-topPages .cs-informationsHeader, 
html body.cs-body .cs-mobileCategorys .cs-mobileCategorysHeader, 
html body.cs-body .cs-compareHeader,
html body.cs-body #bestandsbenachrichtigung .requestBtn,
html body.cs-body .cs-button1,
html body.cs-body .cs-button1:hover,
html body.cs-body footer .cs-footerNewsletterBox.input .cs-newsletterSubmit,
html body.cs-body .wkAddLayer .cs-checkoutBtn,
html body.cs-body .cs-filterButton {background: #009fe3;border-bottom: 4px solid #0069b4;}

/* kasse */
html body.cs-onePageCheckout #cosmoCheckout .cs-ccDataLine.firstName,
html body.cs-onePageCheckout #cosmoCheckout .cs-ccDataLine.street,
html body.cs-onePageCheckout #cosmoCheckout .cs-ccDataLine.zip {margin-right: 5px;}

html body.cs-onePageCheckout #cosmoCheckout .cs-ccDataLine[style*="display: block"] {display: flex !important;}
html body.cs-onePageCheckout #cosmoCheckout .cs-articleVariant a,
html body.cs-onePageCheckout #cosmoCheckout .cs-cartBoxArticleId a,
html body.cs-onePageCheckout #cosmoCheckout .cs-labelColumnWide .cs-shippingTime,
html body.cs-onePageCheckout #cosmoCheckout .cs-articletable .cs-articleName a {margin: 0;text-decoration: underline;}

/* menu */
html body.cs-body .cs-categoriesMegaMenu .cs-megaMenuContainer {box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;padding-right: 1em;}
html body.cs-body .cs-categoriesMegaMenu .cs-megaMenuContainer .cs-megamenu > div > ul {display: grid;grid-template-columns: repeat(auto-fill, minmax(315px, 1fr));grid-auto-rows: auto;column-gap: 4px;row-gap: 0;transition: all 0.5s;}

/* wex */
html body.cs-body .cs-wexOrders svg {max-width: 40px;width: 40px;}
html body.cs-body .cs-wexOrders .cs-wexOrdersDelete {display: flex;align-items: center;justify-content: center;}
html body.cs-body .cs-wexOrders button.import_item_delete_button,
html body.cs-body .cs-wexOrders .cs-wexOrderOrder button {margin-left: auto;cursor: pointer;display: flex;justify-content: center;align-items: center;background: #fff;border: 1px solid #dadadd;padding: 5px 10px;gap: 10px;}
html body.cs-body .cs-wexOrders .cs-wexOrderOrder button {padding: 8px 10px 8px 13px;}
html body.cs-body .cs-wexOrderImport form {align-items: center;padding: 1em;border-radius: 5px;background: #de007e;margin-bottom: 10px;display: flex;justify-content: center;gap: 1em;font-size: 17px;font-weight: 700;color: #fff;}
html body.cs-body .cs-wexOrderImport .cs-errorBox,
html body.cs-body .cs-wexOrderImport .cs-successBox {border: 1px solid #f00;border-radius: 5px;background: #fff2f2;font-weight: 700;text-align: center;}
html body.cs-body .cs-wexOrderImport .cs-errorBox ul,
html body.cs-body .cs-wexOrderImport .cs-successBox ul {margin: 0;padding: 0;list-style: none;}
html body.cs-body .cs-wexOrderImport [type=submit] {background: #fff;border-radius: 5px;border: 0;padding: 8px 14px;color: #de007e;font-weight: 500;}

html body.cs-body .cs-orders.cs-wexOrders table th:nth-of-type(3),
html body.cs-body .cs-orders.cs-wexOrders table th:nth-of-type(4) {text-align: right;}

html body.cs-body .cs-logoUploadBox .cs-logo-container{font-family:sans-serif;max-width:500px;padding:20px;border:1px solid #e1e1e1;border-radius:8px;background-color:#f9f9f9}
html body.cs-body .cs-logoUploadBox .cs-title{margin-top:0;font-size:1.5rem;color:#333}
html body.cs-body .cs-logoUploadBox .cs-info-box{font-size:.9rem;color:#666;margin-bottom:20px;line-height:1.4}
html body.cs-body .cs-logoUploadBox .cs-preview-area{background:#fff;border:2px dashed #ccc;border-radius:6px;padding:20px;text-align:center;margin-bottom:20px;min-height:100px;display:flex;align-items:center;justify-content:center}
html body.cs-body .cs-logoUploadBox .cs-logo-preview{max-width:100%;max-height:150px;height:auto}
html body.cs-body .cs-logoUploadBox .cs-placeholder{color:#999;font-style:italic}
html body.cs-body .cs-logoUploadBox .cs-upload-form{margin-bottom:15px}
html body.cs-body .cs-logoUploadBox input[type=file]#customer_logo_upload_file{display:none}
html body.cs-body .cs-logoUploadBox .cs-file-label{display:inline-block;padding:10px 20px;background-color:#de007e;color:#fff;border-radius:4px;cursor:pointer;font-weight:700;transition:background .3s}
html body.cs-body .cs-logoUploadBox .cs-file-label:hover{background-color:#de007e}
html body.cs-body .cs-logoUploadBox .cs-actions{margin-top:10px}
html body.cs-body .cs-logoUploadBox .cs-delete-link{color:#dc3545;text-decoration:none;font-size:.85rem}
html body.cs-body .cs-logoUploadBox .cs-delete-link:hover{text-decoration:underline}
html body.cs-body .cs-logoUploadBox .cs-error-msg{margin-top:15px;padding:10px;background-color:#f8d7da;color:#721c24;border-radius:4px;border:1px solid #f5c6cb}
html body.cs-body .cs-logo-container.cs-logoUploadBox{padding:0 10px}

/* logoupload */
html body.cs-body .cs-logoUploadContainer{margin:20px 0}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-info-section{margin-bottom:20px;display:flex;justify-content:space-between;align-items:flex-end}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-meta-item{font-size:14px;margin-bottom:5px}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-label{font-weight:700;margin-right:5px}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-preview{text-align:right}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-img{max-height:80px;display:block;margin-bottom:5px;border:1px solid #ddd;margin: 0 auto;}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-delete-link{color:#e20074;font-size:12px;text-decoration:underline}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-bar{background-color:#e20074;padding:25px 40px;border-radius:4px;display:flex;align-items:center}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-form{display:flex;align-items:center;width:100%;gap:20px}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-input-label{color:#fff;font-weight:700;font-size:18px;white-space:nowrap}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-input-wrapper{flex-grow:1}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-file-input{color:#fff}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-submit-btn{background-color:#fff;color:#e20074;border:none;padding:10px 25px;border-radius:4px;font-weight:700;cursor:pointer;font-size:16px;transition:opacity .2s}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-submit-btn:hover{background-color:#fdfdfd;opacity:.9}
html body.cs-body .cs-logoUploadContainer .cs-logoUpload-error{color:#d32f2f;background:#ffebee;padding:10px;margin-bottom:15px;border-radius:4px;border-left:5px solid #d32f2f}

/* wex ftp konfiguration */
html body.cs-body .cs-ftpConfig-container{max-width:800px;margin:20px 0;color:#333}
html body.cs-body .cs-ftpConfig-title{font-size:2.2rem;font-weight:500;margin-bottom:20px}
html body.cs-body .cs-ftpConfig-backBtn{display:inline-block;padding:10px 20px;border:1px solid #333;text-decoration:none;color:#333;margin-bottom:30px;transition:background .2s}
html body.cs-body .cs-ftpConfig-backBtn:hover{background:#f5f5f5}
html body.cs-body .cs-ftpConfig-errorBox{background:#fff2f2;border:1px solid red;padding:15px;font-weight:700;color:red;margin-bottom:20px;border-radius:4px}
html body.cs-body .cs-ftpConfig-form{display:flex;flex-direction:column;gap:15px}
html body.cs-body .cs-ftpConfig-row{display:grid;grid-template-columns:250px 1fr;align-items:center;gap:10px}
html body.cs-body .cs-ftpConfig-row-checkbox{grid-template-columns:auto 1fr;justify-content:start;gap:15px}
html body.cs-body .cs-ftpConfig-row label{font-weight:700;font-size:16px}
html body.cs-body .cs-ftpConfig-row input[type=password],.cs-ftpConfig-row input[type=text],.cs-ftpConfig-row select{width:100%;max-width:400px;padding:8px 12px;border:1px solid #ccc;border-radius:4px;font-size:16px}
html body.cs-body .cs-ftpConfig-row input[type=checkbox]{width:20px;height:20px;cursor:pointer}
html body.cs-body .cs-ftpConfig-action{margin-top:20px;padding-top:20px;border-top:1px solid #eee}
html body.cs-body .cs-ftpConfig-submitBtn{background-color:#e20074;color:#fff;border:none;padding:12px 25px;border-radius:4px;font-weight:700;font-size:16px;cursor:pointer;transition:opacity .2s}
html body.cs-body .cs-ftpConfig-submitBtn:hover{opacity:.9}

/* virtual Addon */
html body.cs-body #magna_virtual_addon.addon-card{width:100%;max-width:390px;box-sizing:border-box;background-color:#f7f7f7;border:1px solid #dadada;border-radius:2px;margin:15px 0;padding:15px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:background-color .2s ease,border-color .2s ease}
html body.cs-body #magna_virtual_addon.addon-card:hover{background-color:#f0f0f0;border-color:#c5c5c5}
html body.cs-body #magna_virtual_addon .addon-content{display:flex;flex-direction:column;gap:8px}
html body.cs-body #magna_virtual_addon .addon-row{display:flex;align-items:center}
html body.cs-body #magna_virtual_addon .addon-label{font-weight:600;margin-right:8px;white-space:nowrap}
html body.cs-body #magna_virtual_addon .addon-value{font-weight:400}
html body.cs-body #magna_virtual_addon .addon-checkbox-wrapper{display:flex;align-items:center;padding-left:15px}
html body.cs-body #magna_virtual_addon .addon-checkbox-wrapper input {width: 20px;height: 20px;cursor: pointer;}
html body.cs-body #magna_virtual_addon .addon-svg-icon{transition:transform .2s ease-in-out;display:none}
html body.cs-body #magna_virtual_addon .icon-cross{fill:#b0b0b0;opacity:1;transition:opacity .2s ease}
html body.cs-body #magna_virtual_addon .icon-check{fill:#4caf50;opacity:0;transition:opacity .2s ease}
html body.cs-body #magna_virtual_addon .addon-checkbox:checked+.addon-svg-icon{transform:scale(1.05)}
html body.cs-body #magna_virtual_addon .addon-checkbox:checked+.addon-svg-icon .icon-cross{opacity:0}
html body.cs-body #magna_virtual_addon .addon-checkbox:checked+.addon-svg-icon .icon-check{opacity:1}
html body.cs-body #magna_virtual_addon .addon-row:first-of-type .addon-label {font-size: 17px;}

/* my account - custimer section */
#myCustomerLists{width:100%;margin:0 auto;box-sizing:border-box}
#myCustomerLists h1.contactFormHeader{font-size:26px;font-weight:700;color:#000;margin:0 0 15px;display:inline-block}
#myCustomerLists a.cs-accountBackButton{display:inline-block;float:left;padding:10px 16px;font-size:14px;text-decoration:none;background-color:#fff;color:#333;border:1px solid #ccc;border-radius:4px;transition:all .2s ease}
#myCustomerLists a.cs-accountBackButton:hover{background-color:#f0f0f0;border-color:#b5b5b5}
#myCustomerLists .distanceHolder{clear:both;height:20px}
#myCustomerLists select#listSelect{width:100%;max-width:390px;padding:12px;font-size:15px;background-color:#f7f7f7;border:1px solid #dadada;border-radius:4px;color:#333;outline:0;cursor:pointer;transition:border-color .2s ease}
#myCustomerLists select#listSelect:focus{border-color:#009ee3}
#myCustomerLists .customerListHeader{font-size:20px;font-weight:700;margin:10px 0 15px;padding-bottom:8px}
#myCustomerLists .cs-row .allArticles .button{display:inline-block;padding:11px 20px;background-color:#333;color:#fff;font-size:14px;font-weight:500;border-radius:4px;cursor:pointer;transition:background-color .2s ease;margin-bottom:20px}
#myCustomerLists .cs-row .allArticles .button:hover{background-color:#222}
#myCustomerLists .cs-customerListBox{display:flex;flex-wrap:wrap;gap:20px;margin-top:10px}
#myCustomerLists .cs-memoryListArticleBox{flex:1 1 calc(50% - 10px);min-width:300px;background-color:#f7f7f7;border:1px solid #dadada;border-radius:4px;padding:20px;box-sizing:border-box;display:grid;grid-template-columns:100px 1fr;grid-template-rows:auto auto auto;gap:15px;max-width:49%}
#myCustomerLists .cs-memoryListArticleBox .pic{grid-row:1 / span 2}
#myCustomerLists .cs-memoryListArticleBox .pic img{width:100%;height:auto;border:1px solid #e0e0e0;background-color:#fff;border-radius:2px}
#myCustomerLists .cs-artPreviewName{font-size:16px;font-weight:700;color:#000;text-decoration:none;display:block;margin-bottom:6px}
#myCustomerLists .cs-artPreviewName:hover{color:#009ee3}
#myCustomerLists .priceRow .price{font-size:15px;font-weight:700;color:#333;margin-bottom:4px}
#myCustomerLists .priceStars{color:#d32f2f}
#myCustomerLists .cs-lieferzeit{font-size:13px;color:#666;margin-bottom:10px}
#myCustomerLists .noselect{font-size:14px;font-weight:500;display:flex;gap:1px;user-select:none;align-items:center;display: none;}
#myCustomerLists .noselect .cs-menge input{margin:0}
#myCustomerLists .cs-mengeMinus,#myCustomerLists .cs-mengePlus{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background-color:#fff;border:1px solid #ccc;border-radius:3px;cursor:pointer;font-weight:700;font-size:16px;transition:all .15s ease}
#myCustomerLists .cs-mengeMinus:hover,#myCustomerLists .cs-mengePlus:hover{background-color:#f0f0f0;border-color:#b5b5b5}
#myCustomerLists .cs-menge input[type=number]{width:70px;height:28px;text-align:center;font-size:14px;border:1px solid #ccc;border-radius:3px;box-sizing:border-box;-moz-appearance:textfield}
#myCustomerLists .cs-menge input[type=number]::-webkit-inner-spin-button,#myCustomerLists .cs-menge input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#myCustomerLists .cs-variant{grid-column:1 / span 2;font-size:13px;line-height:1.6;color:#555;padding:12px 0;border-top:1px dashed #dadada;border-bottom:1px dashed #dadada}
#myCustomerLists .cs-actions{grid-column:1 / span 2;display:flex;justify-content:space-between;align-items:center;margin-top:5px}
#myCustomerLists .cs-actions .cs-button3{padding:10px 20px;background-color:#009ee3;color:#fff;font-size:14px;font-weight:500;border-radius:3px;cursor:pointer;transition:background-color .2s ease}
#myCustomerLists .cs-actions .cs-button3:hover{background-color:#008cc9}
#myCustomerLists .cs-delete a.cs-deleteButton{font-size:13px;color:#777;text-decoration:underline;transition:color .2s ease}
#myCustomerLists .cs-delete a.cs-deleteButton:hover{color:#d32f2f}
#customerList .cs-umbennenen {background: #f7f7f7;color: #111;font-size: 15px;font-weight: 400;padding: 3px 10px;border-radius: 2px;border: 1px solid #dadadd;display: inline-block;cursor: pointer;}

/* orderdetail */
.cs-orderDetailView h1[role=heading]{font-weight:600;color:#111827;margin-bottom:1.5rem;border-bottom:1px solid #e5e7eb;padding-bottom:.75rem}
.cs-orderDetailView .cs-orderDetail{line-height:1.5;color:#374151;}
.cs-orderDetailView .cs-orderBestellnummer,.cs-orderDetailView .cs-orderDatum,.cs-orderDetailView .cs-orderStatus{color:#111827}
.cs-orderDetailView .cs-orderBestellnummer span,.cs-orderDetailView .cs-orderDatum span,.cs-orderDetailView .cs-orderStatus span{font-weight:600;color:#6b7280;margin-right:.5rem;display:inline-block;min-width:140px}
.cs-orderDetailView .cs-orderStatus{display: flex;align-items: center;justify-content: left;background-color:#f9fafb;border:1px solid #e5e7eb;padding:1rem;border-radius:6px;margin-top:1rem;margin-bottom:1.5rem}
.cs-orderDetailView .cs-orderStatus > .reOrder {margin-left: auto;}
.cs-orderDetailView .cs-button1{display:inline-block;background-color:#111827;color:#fff;border:none;padding:.5rem 1rem;font-size:.875rem;font-weight:500;border-radius:4px;cursor:pointer;margin-left:.5rem;transition:background-color .2s ease}
.cs-orderDetailView .cs-button1:hover{background-color:#374151}
.cs-orderDetailView .cs-form{display:none}
.cs-orderDetailView .cs-orderData.cs-row.cs-flex{display:flex;flex-wrap:wrap;gap:2rem;margin-top:2rem;margin-bottom:2rem}
.cs-orderDetailView .cs-column-50{flex:1 1 calc(50% - 1rem);min-width:280px;background:#fff;border:1px solid #e5e7eb;padding:1.25rem;border-radius:6px}
.cs-orderDetailView .cs-lieferanschrift,.cs-orderDetailView .cs-rechnungsanschrift{font-weight:600;font-size:1.1rem;color:#111827;margin-bottom:.75rem;border-bottom:1px solid #f3f4f6;padding-bottom:.5rem}
.cs-orderDetailView .cs-row{margin-bottom:.25rem}
.cs-orderDetailView .cs-orderData{margin-bottom:2rem}
.cs-orderDetailView .cs-bold{font-weight:600;color:#111827;margin-top:1rem;margin-bottom:.25rem}
.cs-orderDetailView .cs-orderButton a,.cs-orderDetailView .orderListBox a,.cs-orderDetailView .trackingUrl{display:inline-block;color:#2563eb;text-decoration:none;margin-right:1rem;margin-top:.25rem;font-weight:500}
.cs-orderDetailView .cs-orderButton a:hover,.cs-orderDetailView .orderListBox a:hover,.cs-orderDetailView .trackingUrl:hover{text-decoration:underline}
.cs-orderDetailView .cs-orderListDetail table,.cs-orderDetailView table{width:100%;border-collapse:collapse;margin-top:.75rem;margin-bottom:1.5rem}
.cs-orderDetailView table caption{text-align:left;font-size:19px;color:#9ca3af;margin-top:.5rem;caption-side:top;font-weight: 600;}
.cs-orderDetailView table td{padding:.75rem 0;border-bottom:1px solid #f3f4f6;vertical-align:top}
.cs-orderDetailView table td:last-child{text-align:right;font-weight:500}
.cs-orderDetailView table td a{color:#111827;text-decoration:none;font-weight:500}
.cs-orderDetailView table td a:hover{text-decoration:underline}
.cs-orderDetailView table hr{border:none;border-top:1px solid #e5e7eb;margin:.5rem 0}
.cs-orderDetailView table tr:last-of-type td{font-weight:600;font-size:1.1rem;color:#111827;border-bottom:none;padding-top:1rem}
.cs-orderDetailView table td[style*="background-color:cyan;"]{background-color:#eff6ff!important;padding:.5rem .75rem!important;border-radius:4px;font-size:.875rem}
.cs-orderDetailView .reorder_checkbox{margin-right:.5rem;cursor:pointer}
.cs-orderDetailView .modal_preview_png,.cs-orderDetailView a[href*=printess]{font-size:.85rem;color:#6b7280;text-decoration:none;display:inline-block;margin-top:.25rem}
.cs-orderDetailView .modal_preview_png:hover{color:#111827}
.cs-orderDetailView .cs-rows {display: flex;align-items: center;gap: 10px;}
.cs-orderDetailView .cs-rows .cs-bold {margin: 0;}
.cs-orderDetailView label {cursor: pointer;}
.cs-orderDetailView .cs-orderBottom {border: 1px solid #dadadd;padding: 1em;border-radius: 7px;}
.cs-orderDetailView label {cursor: pointer;}
.cs-orderDetailView .printess_download_url_local svg {width: 32px;margin-left: -2px;}
.cs-orderDetailView .printess_download_url_local a {display: flex !important;gap: 10px;height: 50px;align-items: center;}

/* tmp unter weiser Vorraussicht - https://svn.cosmoshop.org/issues/47650 - SD: Die auf die Liste Funktion dropdowns bitte ausblenden.*/
html body.cs-body .customerListSelectContainer {display: none;}