/* =====================================================
   MEDINOR CUSTOM DESIGN
   Loaded after template.css and theme.css
   ===================================================== */


/* =====================================================
   01. Variables
   ===================================================== */

:root {
    --mdn-teal: #007C7C;
    --mdn-teal-hover: #006B6B;
    --mdn-teal-dark: #176669;
    --mdn-teal-menu: #2f7a7b;
    --mdn-teal-soft: #EEF8F8;
    --mdn-teal-soft-hover: #f5fbfb;

    --mdn-navy: #071B33;
    --mdn-text: #46545C;
    --mdn-muted: #7A8793;
    --mdn-border: #D9EAEA;
    --mdn-border-soft: #DDE8EA;

    --mdn-warning-bg: #FFF4D8;
    --mdn-warning-border: #F3D998;
    --mdn-warning-text: #8A6400;
    --mdn-warning-icon: #C78900;

    --mdn-cnav-top: 80px;
    --mdn-cnav-col1: 340px;
    --mdn-cnav-col2: 360px;
    --mdn-cnav-col3: 420px;
    --mdn-cnav-ease: cubic-bezier(0.22, 1, 0.36, 1);
}


/* =====================================================
   02. Frontpage/category cards without images
   ===================================================== */

.category-item--text {
    margin-bottom: 20px;
}

.category-item--text .category-item-content {
    display: block;
    height: 100%;
    background: #ffffff !important;
    border: 1px solid #d9e3e3 !important;
    border-radius: 6px !important;
    box-shadow: none;
    overflow: hidden;
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.category-item--text .category-item-content:hover {
    border-color: var(--mdn-teal-menu) !important;
    background: var(--mdn-teal-soft-hover) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.category-item--text .category-item-title {
    display: block;
    margin: 0 !important;
    padding: 0 !important;
}

.category-item--text .category-item-title a.category-item-link {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-height: 86px;
    height: 100%;
    padding: 18px !important;
    box-sizing: border-box;
    color: var(--mdn-teal-menu) !important;
    text-decoration: none !important;
}

.category-item--text .category-item-title h4 {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 15px;
    line-height: 1.25;
    font-weight: 600;
    white-space: normal;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
}

.category-item--text .category-item-arrow {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    line-height: 1;
    color: var(--mdn-teal-menu) !important;
}


/* =====================================================
   03. Flat 3-column category navigation
   ===================================================== */

.mdn-cnav {
    display: inline-flex;
    align-items: center;
    position: relative;
    z-index: 70030;
}

.mdn-cnav-trigger {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 44px;
    padding: 0 18px;
    border: 1px solid var(--mdn-teal-menu);
    border-radius: 4px;
    background: #ffffff;
    color: var(--mdn-teal-menu);
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.16s ease, color 0.16s ease, border-color 0.16s ease;
}

body.mdn-cnav-open .mdn-cnav-trigger,
.mdn-cnav-trigger:hover,
.mdn-cnav-trigger:focus {
    background: var(--mdn-teal-menu);
    color: #ffffff;
    border-color: var(--mdn-teal-menu);
}

.mdn-cnav-trigger-icon {
    font-size: 17px;
    line-height: 1;
}

.mdn-cnav-backdrop {
    position: fixed;
    inset: var(--mdn-cnav-top) 0 0 0;
    z-index: 69980;
    background: rgba(20, 40, 45, 0.22);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 220ms ease, visibility 0ms linear 220ms;
}

body.mdn-cnav-open .mdn-cnav-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 220ms ease, visibility 0ms linear 0ms;
}

.mdn-cnav-panel {
    display: block !important;
    position: fixed !important;
    top: var(--mdn-cnav-top) !important;
    left: 0 !important;
    z-index: 70000 !important;
    height: calc(100vh - var(--mdn-cnav-top)) !important;
    max-height: calc(100vh - var(--mdn-cnav-top)) !important;
    width: var(--mdn-cnav-col1);
    background: transparent;
    overflow: hidden !important;
    box-shadow: 12px 0 34px rgba(0, 0, 0, 0.18);
    transform: translateX(-105%);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        transform 260ms var(--mdn-cnav-ease),
        opacity 180ms ease,
        visibility 0ms linear 260ms,
        width 200ms var(--mdn-cnav-ease);
}

body.mdn-cnav-open .mdn-cnav-panel {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition:
        transform 260ms var(--mdn-cnav-ease),
        opacity 180ms ease,
        visibility 0ms linear 0ms,
        width 200ms var(--mdn-cnav-ease);
}

body.mdn-cnav-open.mdn-cnav-state-1 .mdn-cnav-panel {
    width: var(--mdn-cnav-col1) !important;
}

body.mdn-cnav-open.mdn-cnav-state-2 .mdn-cnav-panel {
    width: calc(var(--mdn-cnav-col1) + var(--mdn-cnav-col2)) !important;
}

body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-panel {
    width: calc(var(--mdn-cnav-col2) + var(--mdn-cnav-col3)) !important;
}

.mdn-cnav-panel ul,
.mdn-cnav-panel li {
    list-style: none;
    padding: 0;
    margin: 0;
}

.mdn-cnav-col {
    position: absolute;
    top: 0;
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.mdn-cnav-col::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}

.mdn-cnav-col-l1 {
    left: 0;
    width: var(--mdn-cnav-col1);
    background: linear-gradient(180deg, #1f7475 0%, var(--mdn-teal-dark) 100%);
    color: #ffffff;
    transition: transform 220ms var(--mdn-cnav-ease), opacity 160ms ease;
}

.mdn-cnav-col-l2 {
    left: var(--mdn-cnav-col1);
    width: var(--mdn-cnav-col2);
    background: linear-gradient(180deg, #246f78 0%, #205f6d 100%);
    color: #ffffff;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-22px);
    transition:
        transform 220ms var(--mdn-cnav-ease),
        opacity 160ms ease,
        visibility 0ms linear 220ms;
}

.mdn-cnav-col-l3 {
    left: var(--mdn-cnav-col2);
    width: var(--mdn-cnav-col3);
    background: #ffffff;
    color: #333333;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(-22px);
    transition:
        transform 220ms var(--mdn-cnav-ease),
        opacity 160ms ease,
        visibility 0ms linear 220ms;
}

body.mdn-cnav-open.mdn-cnav-state-2 .mdn-cnav-col-l1 {
    left: 0;
    width: var(--mdn-cnav-col1);
    transform: translateX(0);
    opacity: 1;
}

body.mdn-cnav-open.mdn-cnav-state-2 .mdn-cnav-col-l2.is-active {
    left: var(--mdn-cnav-col1);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition:
        transform 220ms var(--mdn-cnav-ease),
        opacity 160ms ease,
        visibility 0ms linear 0ms;
}

body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-col-l1 {
    transform: translateX(-100%);
    opacity: 0;
    pointer-events: none;
}

body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-col-l2.is-active {
    left: 0;
    width: var(--mdn-cnav-col2);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition:
        left 220ms var(--mdn-cnav-ease),
        transform 220ms var(--mdn-cnav-ease),
        opacity 160ms ease,
        visibility 0ms linear 0ms;
}

body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-col-l3.is-active {
    left: var(--mdn-cnav-col2);
    width: var(--mdn-cnav-col3);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition:
        transform 220ms var(--mdn-cnav-ease),
        opacity 160ms ease,
        visibility 0ms linear 0ms;
}

.mdn-cnav-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 58px;
    padding: 0 28px;
    color: inherit;
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}

.mdn-cnav-head strong {
    font-size: 16px;
    font-weight: 700;
}

.mdn-cnav-head-white {
    color: #245f60;
    background: #ffffff;
    border-bottom: 1px solid #e4eeee;
}

.mdn-cnav-close,
.mdn-cnav-back {
    appearance: none;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font-size: 26px;
    line-height: 1;
    padding: 0;
}

.mdn-cnav-back {
    font-size: 30px;
}

.mdn-cnav-list {
    padding: 14px 0 30px;
}

.mdn-cnav-link {
    appearance: none;
    border: 0;
    background: transparent;
    width: 100%;
    min-height: 48px;
    padding: 0 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    color: inherit;
    cursor: pointer;
    text-decoration: none;
    text-align: left;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 500;
    transition: background-color 0.12s ease, color 0.12s ease;
}

.mdn-cnav-col-l1 .mdn-cnav-link,
.mdn-cnav-col-l1 .mdn-cnav-link:link,
.mdn-cnav-col-l1 .mdn-cnav-link:visited,
.mdn-cnav-col-l1 .mdn-cnav-link:active,
.mdn-cnav-col-l1 .mdn-cnav-link span,
.mdn-cnav-col-l2 .mdn-cnav-link,
.mdn-cnav-col-l2 .mdn-cnav-link:link,
.mdn-cnav-col-l2 .mdn-cnav-link:visited,
.mdn-cnav-col-l2 .mdn-cnav-link:active,
.mdn-cnav-col-l2 .mdn-cnav-link span {
    color: #ffffff !important;
    text-decoration: none !important;
    opacity: 1 !important;
}

.mdn-cnav-col-l1 .mdn-cnav-link:hover,
.mdn-cnav-col-l1 .mdn-cnav-link:focus,
.mdn-cnav-col-l1 .mdn-cnav-item.is-active > .mdn-cnav-link,
.mdn-cnav-col-l2 .mdn-cnav-link:hover,
.mdn-cnav-col-l2 .mdn-cnav-link:focus,
.mdn-cnav-col-l2 .mdn-cnav-item.is-active > .mdn-cnav-link {
    background: rgba(255, 255, 255, 0.14) !important;
    color: #ffffff !important;
    text-decoration: none;
}

.mdn-cnav-item-l1 > .mdn-cnav-link {
    font-size: 17px;
    font-weight: 700;
}

.mdn-cnav-arrow {
    flex: 0 0 auto;
    font-size: 25px;
    line-height: 1;
    opacity: 0.9;
}

.mdn-cnav-col-l1 .mdn-cnav-arrow,
.mdn-cnav-col-l2 .mdn-cnav-arrow {
    color: #ffffff !important;
    opacity: 1 !important;
}

.mdn-cnav-col-l3,
.mdn-cnav-col-l3 .mdn-cnav-list,
.mdn-cnav-col-l3 .mdn-cnav-item,
.mdn-cnav-col-l3 .mdn-cnav-link {
    background: #ffffff !important;
}

.mdn-cnav-col-l3 .mdn-cnav-link {
    color: #444444 !important;
    min-height: 46px;
    font-size: 15px;
    font-weight: 500;
}

.mdn-cnav-col-l3 .mdn-cnav-link:hover,
.mdn-cnav-col-l3 .mdn-cnav-link:focus {
    background: var(--mdn-teal-soft-hover) !important;
    color: var(--mdn-teal-menu) !important;
}

.navbar-placeholder,
.navbar,
.site-header {
    position: relative;
    z-index: 70010;
}

body.mdn-cnav-open .mdn-cnav,
body.mdn-cnav-open .mdn-cnav-trigger {
    z-index: 70030;
}

html.mdn-cnav-scroll-lock,
body.mdn-cnav-scroll-lock {
    overflow: hidden !important;
    height: 100% !important;
}

body.mdn-cnav-open {
    overscroll-behavior: contain;
}


/* =====================================================
   04. Filter and panel headings
   ===================================================== */

.productfilter .panel-heading,
.productfilter.panel .panel-heading {
    background: var(--mdn-teal-soft) !important;
    color: var(--mdn-teal-dark) !important;
    border-bottom: 1px solid #d9e5e5 !important;
}

.productfilter .panel-heading .h5,
.productfilter .panel-heading *,
.productfilter.panel .panel-heading .h5,
.productfilter.panel .panel-heading * {
    color: var(--mdn-teal-dark) !important;
}

.productfilter .filter-collapse-btn {
    width: 26px !important;
    height: 26px !important;
    border-radius: 4px !important;
    background: var(--mdn-teal-dark) !important;
    color: #ffffff !important;
    border: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.productfilter .filter-collapse-btn svg,
.productfilter .filter-collapse-btn i {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
}

.panel .panel-heading,
.box .box-heading,
.module .module-heading,
.widget .widget-heading {
    background: var(--mdn-teal-soft) !important;
    color: var(--mdn-teal-dark) !important;
    border-bottom: 1px solid #d9e5e5 !important;
}

.panel .panel-title,
.box .box-title,
.module .module-title,
.widget .widget-title {
    color: var(--mdn-teal-dark) !important;
}


/* =====================================================
   05. Product page: base layout
   ===================================================== */

.m-product-information.product-information {
    max-width: 680px;
}

.m-product-title.product-title {
    color: var(--mdn-navy);
    font-size: 30px;
    line-height: 1.25;
    font-weight: 700;
    margin-bottom: 14px;
}

.m-product-title.page-title::after {
    content: "";
    display: block;
    width: 34px;
    height: 2px;
    background: #A0A8AD;
    margin: 18px 0 24px;
}

.m-product-price {
    color: var(--mdn-navy);
    font-size: 26px;
    line-height: 1.1;
    font-weight: 700;
}

.m-product-price-vat {
    color: var(--mdn-muted);
    font-size: 13px;
    margin-top: 5px;
}

.m-product-image {
    min-height: 460px !important;
    max-height: 460px !important;
    margin-top: 0 !important;
    padding-top: 100px !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
}

.m-product-image > a,
.m-product-image .image-zoom,
.m-product-image .cloudzoom-blank {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.m-product-image img,
.m-product-image .cloudzoom {
    max-height: 410px !important;
    width: auto !important;
    object-fit: contain !important;
}


/* =====================================================
   06. Product page: title split and return notice
   ===================================================== */

.med-product-title-main {
    display: block;
    color: var(--mdn-navy);
    font-size: 34px;
    line-height: 1.15;
    font-weight: 800;
    margin-bottom: 6px;
}

.med-product-title-sub {
    display: block;
    color: var(--mdn-navy);
    font-size: 25px;
    line-height: 1.25;
    font-weight: 700;
}

.med-product-return-notice {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 4px 0 18px;
    padding: 12px 15px;
    border: 1px solid var(--mdn-warning-border);
    border-radius: 3px;
    background: var(--mdn-warning-bg);
    color: var(--mdn-warning-text);
    font-size: 14px;
    line-height: 1.4;
    font-weight: 700;
}

.med-product-return-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--mdn-warning-icon);
    color: #ffffff;
    font-size: 14px;
    line-height: 1;
    font-weight: 800;
}


/* =====================================================
   07. Product page: essentials, packaging and stock
   ===================================================== */

.med-product-essentials {
    display: grid;
    grid-template-columns: minmax(190px, 0.85fr) minmax(270px, 1.15fr);
    gap: 16px;
    margin: 20px 0 16px;
}

.med-product-unit-card,
.med-product-packaging-card {
    border: 1px solid var(--mdn-border);
    border-radius: 3px;
    padding: 18px 20px;
    min-height: 112px;
    background: #ffffff;
}

.med-product-unit-card {
    background: var(--mdn-teal-soft);
}

.med-card-label {
    color: var(--mdn-navy);
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 8px;
}

.med-product-unit-value {
    color: var(--mdn-teal);
    font-size: 32px;
    line-height: 1;
    font-weight: 700;
}

.med-packaging-lines {
    color: var(--mdn-text);
    font-size: 14px;
    line-height: 1.7;
}

.med-packaging-line {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-bottom: 3px;
}

.med-packaging-check {
    color: var(--mdn-teal);
    font-weight: 700;
    line-height: 1.7;
}

.med-product-stock-card {
    border-radius: 3px;
    margin: 14px 0 16px;
}

.med-product-stock-card .panel-body {
    padding: 13px 16px;
}

.med-product-stock-card--instock {
    background: var(--mdn-teal-soft);
    border: 1px solid #D4EEEE;
    color: var(--mdn-teal);
}

.med-product-stock-card--soldout {
    background: var(--mdn-warning-bg);
    border: 1px solid var(--mdn-warning-border);
    color: var(--mdn-warning-text);
}


/* =====================================================
   08. Product page: icons
   ===================================================== */

.med-product-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 22px !important;
    align-items: flex-start;
    margin: 10px 0 22px !important;
    padding: 4px 0 2px !important;
}

.med-product-icon-item {
    width: 74px;
    min-height: 56px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
}

.med-product-icon-item img {
    width: 54px !important;
    height: 54px !important;
    object-fit: contain;
    display: block;
    margin-bottom: 7px;
}

.med-product-icon-item span {
    display: none !important;
}


/* =====================================================
   09. Product page: wishlist
   ===================================================== */

.m-product-wishlist {
    margin-top: 14px !important;
}

.m-product-wishlist-button {
    color: var(--mdn-teal) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
}


/* =====================================================
   10. Product page: long description and tabs
   ===================================================== */

.m-product-additional-info {
    margin-top: 44px !important;
}

.m-product-additional-separator {
    border: 0 !important;
    border-top: 1px solid var(--mdn-border-soft) !important;
    margin: 0 0 14px !important;
}

.m-product-additional-info-tabs {
    border-bottom: 1px solid var(--mdn-border-soft) !important;
    margin-bottom: 0 !important;
}

.m-product-additional-info-tabs > li > a {
    color: var(--mdn-teal) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 12px 18px !important;
    border: 1px solid transparent !important;
    background: transparent !important;
}

.m-product-additional-info-tabs > li.active > a,
.m-product-additional-info-tabs > li > a:hover {
    color: var(--mdn-navy) !important;
    background: #ffffff !important;
    border: 1px solid var(--mdn-border-soft) !important;
    border-bottom-color: #ffffff !important;
}

.m-product-additional-info-content {
    border: 1px solid var(--mdn-border-soft) !important;
    border-top: 0 !important;
    background: #ffffff !important;
    padding: 0 !important;
}

.med-long-description {
    color: var(--mdn-text);
    font-size: 14px;
    line-height: 1.65;
}

.med-description-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(320px, 0.85fr);
    gap: 34px;
    padding: 30px 34px;
}

.med-description-main {
    min-width: 0;
}

.med-description-side {
    border-left: 1px solid var(--mdn-border-soft);
    padding-left: 34px;
}

.med-description-section {
    margin-bottom: 28px;
}

.med-description-section:last-child {
    margin-bottom: 0;
}

.med-description-layout h2,
.med-description-section h2,
.med-description-side h2 {
    color: var(--mdn-navy) !important;
    font-size: 21px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    margin: 0 0 14px !important;
}

.med-description-intro h2,
.med-product-files-header h2 {
    color: var(--mdn-navy) !important;
    font-size: 28px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    margin: 0 0 18px !important;
}

.med-description-intro h2::after,
.med-product-files-header h2::after {
    content: "";
    display: block;
    width: 34px;
    height: 2px;
    background: var(--mdn-teal);
    margin-top: 14px;
}

.med-description-intro p {
    color: var(--mdn-text);
    font-size: 15px;
    line-height: 1.7;
    max-width: 780px;
    margin: 0;
}

.med-description-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.med-description-list-columns {
    columns: 2;
    column-gap: 38px;
}

.med-description-list li {
    break-inside: avoid;
    position: relative;
    padding-left: 18px;
    margin: 0 0 9px;
    color: var(--mdn-text);
}

.med-description-list strong {
    color: var(--mdn-navy);
    font-weight: 700;
}

.med-description-side .med-description-list li {
    margin-bottom: 13px;
}


/* =====================================================
   11. Product page: files/databløð
   ===================================================== */

.med-product-files-wrap {
    padding: 30px 34px 34px;
}

.med-product-files-header {
    margin-bottom: 28px;
}

.med-product-files-header p {
    color: var(--mdn-text);
    font-size: 15px;
    line-height: 1.6;
    margin: 0;
}

.med-product-files-list {
    border-top: 1px solid var(--mdn-border-soft);
}

.med-product-files-row {
    display: grid;
    grid-template-columns: minmax(300px, 1fr) 120px 140px 160px;
    gap: 18px;
    align-items: center;
    border-bottom: 1px solid var(--mdn-border-soft);
    padding: 16px 0;
}

.med-product-files-row-head {
    color: var(--mdn-text);
    font-size: 14px;
    font-weight: 600;
    padding: 13px 0;
}

.med-product-files-document {
    display: flex;
    align-items: center;
    min-width: 0;
}

.med-product-files-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 48px;
    height: 30px;
    margin-right: 14px;
    border: 1px solid var(--mdn-teal);
    border-radius: 4px;
    color: var(--mdn-teal);
    background: #ffffff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .04em;
}

.med-product-files-document a {
    min-width: 0;
    color: var(--mdn-teal) !important;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none !important;
    overflow-wrap: anywhere;
}

.med-product-files-document a:hover {
    color: var(--mdn-teal-hover) !important;
    text-decoration: underline !important;
}

.med-product-files-type,
.med-product-files-size {
    color: var(--mdn-text);
    font-size: 14px;
}

.med-product-files-download-wrap {
    text-align: right;
}

.med-product-files-download {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 122px;
    height: 38px;
    padding: 0 16px;
    border: 1px solid var(--mdn-teal);
    border-radius: 4px;
    background: #ffffff;
    color: var(--mdn-teal) !important;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none !important;
}

.med-product-files-download:hover {
    background: var(--mdn-teal);
    color: #ffffff !important;
}

.med-download-icon {
    font-size: 18px;
    line-height: 1;
}

.med-product-files-help {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-top: 24px;
    padding: 16px 18px;
    border-radius: 4px;
    background: var(--mdn-teal-soft);
    color: var(--mdn-text);
    font-size: 14px;
    line-height: 1.6;
}

.med-product-files-help-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    border: 2px solid var(--mdn-teal);
    border-radius: 50%;
    color: var(--mdn-teal);
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
}

.med-product-files-help a {
    color: var(--mdn-teal) !important;
    font-weight: 700;
    text-decoration: none !important;
}

.med-product-files-help a:hover {
    color: var(--mdn-teal-hover) !important;
    text-decoration: underline !important;
}


/* =====================================================
   12. Product page: buybox and quantity stepper
   ===================================================== */

.med-product-buybox {
    display: grid !important;
    grid-template-columns: 222px 200px !important;
    gap: 12px !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 434px !important;
    margin-top: 20px !important;
}

.med-product-buybox .m-product-transaction-amount,
.med-product-buybox .m-product-transaction-button {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
}

.med-product-buybox .input-group,
.med-product-buybox .med-buy-row {
    display: grid !important;
    grid-template-columns: 42px 64px 42px 74px !important;
    width: 222px !important;
    min-width: 222px !important;
    max-width: 222px !important;
    height: 54px !important;
}

.med-product-buybox .med-qty-btn {
    width: 42px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    border: 1px solid #D9E1E4 !important;
    background: #ffffff !important;
    color: var(--mdn-teal) !important;
    font-size: 22px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    box-shadow: none !important;
    appearance: none !important;
}

.med-product-buybox .med-qty-minus {
    border-right: 0 !important;
    border-radius: 3px 0 0 3px !important;
}

.med-product-buybox .med-qty-plus {
    border-left: 0 !important;
    border-right: 0 !important;
}

.med-product-buybox .med-qty-btn:hover {
    background: var(--mdn-teal-soft) !important;
    color: var(--mdn-teal-hover) !important;
}

.med-product-buybox .m-transaction-input,
.med-product-buybox .med-buy-input {
    width: 64px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    border: 1px solid #D9E1E4 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    text-align: center !important;
    color: var(--mdn-navy) !important;
    font-size: 19px !important;
    line-height: 54px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.med-product-buybox .m-product-transaction-unittitle,
.med-product-buybox .med-buy-unit {
    width: 74px !important;
    min-width: 74px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    border: 1px solid #D9E1E4 !important;
    border-radius: 0 3px 3px 0 !important;
    background: #FAFAFA !important;
    color: var(--mdn-muted) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    line-height: 54px !important;
}

.med-product-buybox .button-primary,
.med-product-buybox .med-buy-button {
    display: block !important;
    width: 200px !important;
    min-width: 200px !important;
    max-width: 200px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    border: 0 !important;
    background: var(--mdn-teal) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    letter-spacing: .02em !important;
    line-height: 54px !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: visible !important;
    box-shadow: none !important;
}

.med-product-buybox .button-primary:hover,
.med-product-buybox .med-buy-button:hover {
    background: var(--mdn-teal-hover) !important;
}


/* =====================================================
   13. Responsive
   ===================================================== */

@media (max-width: 1024px) {
    :root {
        --mdn-cnav-col1: 330px;
        --mdn-cnav-col2: 340px;
        --mdn-cnav-col3: 380px;
    }
}

@media (max-width: 900px) {
    .m-product-title.product-title {
        font-size: 24px;
    }

    .m-product-image {
        min-height: 330px !important;
        max-height: 330px !important;
    }

    .m-product-image img,
    .m-product-image .cloudzoom {
        max-height: 300px !important;
    }

    .med-product-essentials {
        grid-template-columns: 1fr;
    }

    .med-product-buybox {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: none !important;
    }

    .med-product-buybox .input-group,
    .med-product-buybox .med-buy-row {
        grid-template-columns: 44px 1fr 44px 78px !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .med-product-buybox .m-transaction-input,
    .med-product-buybox .med-buy-input {
        width: 100% !important;
    }

    .med-product-buybox .button-primary,
    .med-product-buybox .med-buy-button {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 700px) {
    :root {
        --mdn-cnav-top: 0px;
        --mdn-cnav-col1: 90vw;
        --mdn-cnav-col2: 90vw;
        --mdn-cnav-col3: 90vw;
    }

    body.mdn-cnav-open .mdn-cnav-panel,
    body.mdn-cnav-open.mdn-cnav-state-1 .mdn-cnav-panel,
    body.mdn-cnav-open.mdn-cnav-state-2 .mdn-cnav-panel,
    body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-panel {
        top: 0 !important;
        width: 90vw !important;
        height: 100vh !important;
        max-height: 100vh !important;
    }

    body.mdn-cnav-open .mdn-cnav-backdrop {
        inset: 0 !important;
    }

    .mdn-cnav-col-l1,
    .mdn-cnav-col-l2,
    .mdn-cnav-col-l3,
    body.mdn-cnav-open.mdn-cnav-state-2 .mdn-cnav-col-l2.is-active,
    body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-col-l2.is-active,
    body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-col-l3.is-active {
        left: 0 !important;
        width: 90vw !important;
        height: 100vh !important;
        max-height: 100vh !important;
    }

    body.mdn-cnav-open.mdn-cnav-state-2 .mdn-cnav-col-l1,
    body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-col-l1,
    body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-col-l2.is-active {
        transform: translateX(-100%) !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    body.mdn-cnav-open.mdn-cnav-state-2 .mdn-cnav-col-l2.is-active,
    body.mdn-cnav-open.mdn-cnav-state-3 .mdn-cnav-col-l3.is-active {
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .mdn-cnav-head,
    .mdn-cnav-link {
        padding-left: 22px;
        padding-right: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mdn-cnav-panel,
    .mdn-cnav-backdrop,
    .mdn-cnav-col-l1,
    .mdn-cnav-col-l2,
    .mdn-cnav-col-l3 {
        transition: none !important;
    }
}
/* =====================================================
   MEDINOR - INSERTED CSS
   Frontpage, header, login, dashboard and mobile
   ===================================================== */


/* =====================================================
   01. Hide USP globally
   ===================================================== */

.w-usp {
    display: none !important;
}


/* =====================================================
   02. Header - B2B layout
   ===================================================== */

.mdn-site-header {
    background: #ffffff;
    border-bottom: 1px solid rgba(0, 96, 96, 0.12);
}

.mdn-navbar-content {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: 24px !important;
    align-items: center !important;
    min-height: 82px;
}

.mdn-navbar-left {
    display: flex;
    align-items: center;
    min-width: 0;
}

.mdn-navbar-center {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
    min-width: 0;
}

.mdn-header-search {
    flex: 1 1 auto;
    min-width: 260px;
    max-width: 640px;
}

.mdn-header-search .mdn-search-inline {
    min-height: 46px !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    border-color: rgba(0, 96, 96, 0.18) !important;
}

.mdn-header-search .mdn-search-inline-input {
    font-size: 14px !important;
    padding: 0 16px !important;
}

.mdn-header-search .mdn-search-inline-submit {
    min-width: 52px !important;
    padding: 0 16px !important;
}

.mdn-header-search .mdn-search-inline-submit span {
    display: none !important;
}

.mdn-header-actions {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
    margin: 0 !important;
}

.mdn-header-action {
    display: flex !important;
    align-items: center !important;
}

.mdn-header-action-link {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    min-width: 56px;
    color: #003846 !important;
    text-decoration: none !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    font-weight: 700 !important;
}

.mdn-header-action-link:hover {
    color: #007C7C !important;
    text-decoration: none !important;
}

.mdn-header-action-link svg,
.mdn-header-action-link i {
    color: inherit !important;
}

.mdn-header-action-login .mdn-header-action-link {
    min-width: 68px;
}

.mdn-header-action-cart > * {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.mdn-header-action-cart a {
    color: #003846 !important;
    text-decoration: none !important;
}

.mdn-header-action-cart a:hover {
    color: #007C7C !important;
}

.mdn-header-actions .w-search {
    display: none !important;
}


/* =====================================================
   03. Desktop / tablet login dropdown
   ===================================================== */

.mdn-login-dropdown-wrap {
    position: relative !important;
}

.mdn-login-dropdown-trigger {
    border: 0 !important;
    background: transparent !important;
    cursor: pointer !important;
    font-family: inherit !important;
}

.mdn-login-dropdown {
    display: none !important;
    position: absolute !important;
    top: calc(100% + 14px) !important;
    right: -34px !important;
    z-index: 99999 !important;
    width: 360px !important;
    padding: 22px !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0, 96, 96, 0.14) !important;
    box-shadow: 0 24px 60px rgba(0, 56, 70, 0.18) !important;
    text-align: left !important;
}

.mdn-login-dropdown.is-open {
    display: block !important;
}

.mdn-login-dropdown::before {
    content: "";
    position: absolute;
    top: -8px;
    right: 52px;
    width: 16px;
    height: 16px;
    background: #ffffff;
    border-left: 1px solid rgba(0, 96, 96, 0.14);
    border-top: 1px solid rgba(0, 96, 96, 0.14);
    transform: rotate(45deg);
}

.mdn-login-dropdown-head {
    margin-bottom: 16px !important;
}

.mdn-login-dropdown-head strong {
    display: block !important;
    margin: 0 0 4px !important;
    color: #003846 !important;
    font-size: 22px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
}

.mdn-login-dropdown-head span {
    display: block !important;
    color: #607780 !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
}

.mdn-login-dropdown-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 9px !important;
    margin: 0 !important;
}

.mdn-login-dropdown-form label {
    display: block !important;
    margin: 0 !important;
    color: #003846 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
}

.mdn-login-dropdown-form input[type="text"],
.mdn-login-dropdown-form input[type="password"] {
    display: block !important;
    width: 100% !important;
    min-height: 42px !important;
    margin: 0 !important;
    border: 1px solid rgba(0, 96, 96, 0.18) !important;
    border-radius: 10px !important;
    padding: 0 12px !important;
    color: #003846 !important;
    background: #f8fbfb !important;
    font-size: 14px !important;
    outline: none !important;
    box-sizing: border-box !important;
}

.mdn-login-dropdown-form input[type="text"]:focus,
.mdn-login-dropdown-form input[type="password"]:focus {
    border-color: #007C7C !important;
    background: #ffffff !important;
}

.mdn-login-dropdown-remember {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 2px 0 !important;
    color: #536b74 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.mdn-login-dropdown-remember input {
    width: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
}

.mdn-login-dropdown-form button[type="submit"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 44px !important;
    margin-top: 4px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #007C7C !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    cursor: pointer !important;
}

.mdn-login-dropdown-form button[type="submit"]:hover {
    background: #006B6B !important;
}

.mdn-login-dropdown-links {
    display: grid !important;
    gap: 8px !important;
    margin-top: 16px !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(0, 96, 96, 0.12) !important;
}

.mdn-login-dropdown-links a {
    color: #007C7C !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

.mdn-login-dropdown-links a:hover {
    color: #006B6B !important;
}


/* =====================================================
   04. Mobile full-screen login
   ===================================================== */

body.mdn-mobile-login-open {
    overflow: hidden !important;
}

.mdn-mobile-login {
    display: none !important;
}

@media (max-width: 700px) {
    .mdn-mobile-login {
        display: none !important;
        position: fixed !important;
        inset: 0 !important;
        z-index: 999999 !important;
        background: #ffffff !important;
        color: #003846 !important;
    }

    .mdn-mobile-login.is-open {
        display: block !important;
    }

    .mdn-mobile-login-panel {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: 100% !important;
        background: #ffffff !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .mdn-mobile-login-top {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        min-height: 76px !important;
        padding: 0 70px !important;
        border-bottom: 1px solid rgba(0, 96, 96, 0.10) !important;
        background: #ffffff !important;
    }

    .mdn-mobile-login-top strong {
        color: #003846 !important;
        font-size: 22px !important;
        line-height: 1.2 !important;
        font-weight: 800 !important;
    }

    .mdn-mobile-login-close {
        position: absolute !important;
        right: 22px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 44px !important;
        height: 44px !important;
        border: 0 !important;
        background: transparent !important;
        color: #003846 !important;
        font-size: 38px !important;
        line-height: 1 !important;
        cursor: pointer !important;
    }

    .mdn-mobile-login-content {
        padding: 38px 26px 34px !important;
    }

    .mdn-mobile-login-content h2 {
        margin: 0 0 12px !important;
        color: #003846 !important;
        font-size: 30px !important;
        line-height: 1.1 !important;
        font-weight: 800 !important;
    }

    .mdn-mobile-login-content p {
        margin: 0 0 28px !important;
        color: #607780 !important;
        font-size: 16px !important;
        line-height: 1.5 !important;
    }

    .mdn-mobile-login-form {
        display: grid !important;
        gap: 12px !important;
        margin: 0 !important;
    }

    .mdn-mobile-login-form label {
        margin: 0 !important;
        color: #003846 !important;
        font-size: 14px !important;
        line-height: 1.25 !important;
        font-weight: 800 !important;
    }

    .mdn-mobile-login-form input[type="text"],
    .mdn-mobile-login-form input[type="password"] {
        width: 100% !important;
        min-height: 54px !important;
        margin: 0 !important;
        padding: 0 16px !important;
        border: 1px solid rgba(0, 96, 96, 0.22) !important;
        border-radius: 16px !important;
        background: #f8fbfb !important;
        color: #003846 !important;
        font-size: 16px !important;
        outline: none !important;
        box-sizing: border-box !important;
    }

    .mdn-mobile-login-form input[type="text"]:focus,
    .mdn-mobile-login-form input[type="password"]:focus {
        border-color: #007C7C !important;
        background: #ffffff !important;
    }

    .mdn-mobile-login-remember {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        margin: 2px 0 8px !important;
        color: #536b74 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
    }

    .mdn-mobile-login-remember input {
        width: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
    }

    .mdn-mobile-login-form button[type="submit"] {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-height: 54px !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: #007C7C !important;
        color: #ffffff !important;
        font-size: 16px !important;
        font-weight: 800 !important;
        cursor: pointer !important;
    }

    .mdn-mobile-login-form button[type="submit"]:hover {
        background: #006B6B !important;
    }

    .mdn-mobile-login-links {
        display: grid !important;
        gap: 10px !important;
        margin-top: 22px !important;
        padding-top: 18px !important;
        border-top: 1px solid rgba(0, 96, 96, 0.12) !important;
    }

    .mdn-mobile-login-links a {
        color: #007C7C !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        text-decoration: none !important;
    }

    .mdn-mobile-login-help {
        display: grid !important;
        gap: 7px !important;
        margin-top: 30px !important;
        padding: 18px !important;
        border-radius: 18px !important;
        background: #EEF8F8 !important;
        color: #003846 !important;
    }

    .mdn-mobile-login-help strong {
        font-size: 15px !important;
        font-weight: 800 !important;
    }

    .mdn-mobile-login-help a {
        color: #007C7C !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        text-decoration: none !important;
    }
}


/* =====================================================
   05. Shared frontpage styling
   ===================================================== */

body.frontpage .page-content {
    padding-top: 28px !important;
}

.mdn-frontpage {
    color: #003846;
}

.mdn-eyebrow,
.mdn-login-kicker {
    display: inline-block;
    margin-bottom: 10px;
    color: #087c7b;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mdn-search-inline {
    display: flex;
    width: 100%;
    min-height: 56px;
    border: 1px solid rgba(0, 96, 96, 0.18);
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 14px 34px rgba(0, 56, 70, 0.08);
    overflow: hidden;
}

.mdn-search-inline-input {
    flex: 1;
    min-width: 0;
    border: 0;
    padding: 0 22px;
    color: #003846;
    font-size: 16px;
    outline: none;
}

.mdn-search-inline-submit {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    padding: 0 24px;
    background: #087c7b;
    color: #ffffff;
    font-weight: 700;
    cursor: pointer;
}

.mdn-search-inline-submit:hover {
    background: #006d6c;
}


/* =====================================================
   06. Logged-out frontpage hero and login panel
   ===================================================== */

.mdn-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 32px;
    align-items: stretch;
    padding: 34px 42px !important;
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(8, 124, 123, 0.12), transparent 34%),
        linear-gradient(135deg, #eef8f8 0%, #ffffff 68%);
    border: 1px solid rgba(0, 96, 96, 0.10);
    min-height: auto !important;
}

.mdn-hero h1 {
    max-width: 720px;
    margin: 0 0 14px;
    color: #003846;
    font-size: clamp(36px, 3.55vw, 50px) !important;
    line-height: 1.04 !important;
    font-weight: 800;
}

.mdn-hero-text {
    max-width: 660px;
    margin: 0 0 22px !important;
    color: #536b74;
    font-size: 18px;
    line-height: 1.55;
}

.mdn-hero-search {
    max-width: 720px !important;
}

.mdn-hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

.mdn-hero-tags a {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 16px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid rgba(0, 96, 96, 0.14);
    color: #087c7b;
    font-weight: 700;
    text-decoration: none;
}

.mdn-login-panel {
    align-self: center !important;
    padding: 26px;
    border-radius: 24px;
    background: #ffffff;
    border: 1px solid rgba(0, 96, 96, 0.14);
    box-shadow: 0 18px 48px rgba(0, 56, 70, 0.10);
}

.mdn-login-panel h2 {
    margin: 0 0 8px;
    color: #003846;
    font-size: 25px;
    line-height: 1.15;
}

.mdn-login-panel p {
    margin: 0 0 20px;
    color: #607780;
    line-height: 1.45;
}

.mdn-login-form {
    display: grid;
    gap: 10px;
}

.mdn-login-label {
    color: #003846;
    font-size: 13px;
    font-weight: 700;
}

.mdn-login-input {
    width: 100%;
    min-height: 44px;
    border: 1px solid rgba(0, 96, 96, 0.18);
    border-radius: 12px;
    padding: 0 14px;
    color: #003846;
    background: #f8fbfb;
    outline: none;
}

.mdn-login-input:focus {
    border-color: #087c7b;
    background: #ffffff;
}

.mdn-login-remember {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0;
    color: #536b74;
    font-size: 13px;
}

.mdn-login-submit {
    min-height: 46px;
    border: 0;
    border-radius: 999px;
    background: #087c7b;
    color: #ffffff;
    font-weight: 800;
    cursor: pointer;
}

.mdn-login-submit:hover {
    background: #006d6c;
}

.mdn-login-links {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 16px;
    font-size: 14px;
}

.mdn-login-links a {
    color: #087c7b;
    font-weight: 700;
    text-decoration: none;
}

.mdn-login-request {
    padding-top: 8px;
    border-top: 1px solid rgba(0, 96, 96, 0.12);
}


/* =====================================================
   07. Logged-in B2B dashboard
   ===================================================== */

.mdn-dashboard-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 32px;
    align-items: stretch;
    padding: 34px 42px;
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(8, 124, 123, 0.12), transparent 34%),
        linear-gradient(135deg, #eef8f8 0%, #ffffff 68%);
    border: 1px solid rgba(0, 96, 96, 0.10);
}

.mdn-dashboard-main h1 {
    max-width: 840px;
    margin: 0 0 14px;
    color: #003846;
    font-size: clamp(36px, 3.7vw, 52px);
    line-height: 1.05;
    font-weight: 800;
}

.mdn-dashboard-text {
    max-width: 760px;
    margin: 0 0 22px;
    color: #536b74;
    font-size: 18px;
    line-height: 1.55;
}

.mdn-dashboard-search {
    max-width: 760px;
    margin-bottom: 22px;
}

.mdn-dashboard-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.mdn-dashboard-stat {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 118px;
    padding: 18px;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid rgba(0, 96, 96, 0.12);
    color: #003846;
    text-decoration: none !important;
    box-shadow: 0 10px 24px rgba(0, 56, 70, 0.04);
}

.mdn-dashboard-stat:hover {
    border-color: rgba(8, 124, 123, 0.42);
    box-shadow: 0 16px 34px rgba(0, 56, 70, 0.08);
}

.mdn-dashboard-stat-label {
    color: #007C7C;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.mdn-dashboard-stat strong {
    min-height: 34px;
    color: #003846;
    font-size: 28px;
    line-height: 1;
    font-weight: 800;
}

.mdn-dashboard-stat small {
    color: #607780;
    font-size: 13px;
    line-height: 1.3;
}

.mdn-dashboard-side {
    align-self: center;
    padding: 26px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(0, 96, 96, 0.12);
    box-shadow: 0 18px 48px rgba(0, 56, 70, 0.08);
}

.mdn-dashboard-side .mdn-eyebrow {
    margin-bottom: 14px;
}

.mdn-account-actions {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.mdn-account-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 46px;
    padding: 0 16px;
    border: 1px solid rgba(0, 96, 96, 0.16);
    border-radius: 999px;
    background: #ffffff;
    color: #007C7C !important;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none !important;
    overflow: hidden;
}

.mdn-account-action::after {
    content: "";
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    margin-left: 12px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.85;
}

.mdn-account-action:hover {
    background: #EEF8F8;
    color: #006B6B !important;
    border-color: rgba(0, 124, 124, 0.35);
}

.mdn-account-action-primary {
    background: #007C7C;
    color: #ffffff !important;
    border-color: #007C7C;
}

.mdn-account-action-primary:hover {
    background: #006B6B;
    color: #ffffff !important;
    border-color: #006B6B;
}

.mdn-account-action-logout {
    color: #B42318 !important;
    border-color: rgba(180, 35, 24, 0.28);
}

.mdn-account-action-logout:hover {
    background: rgba(180, 35, 24, 0.06);
    color: #B42318 !important;
    border-color: rgba(180, 35, 24, 0.42);
}

.mdn-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: 18px;
    margin-top: 28px;
    margin-bottom: 30px;
}

.mdn-dashboard-card {
    min-height: 150px;
    padding: 24px;
    border-radius: 22px;
    background: #ffffff;
    border: 1px solid rgba(0, 96, 96, 0.12);
    box-shadow: 0 10px 24px rgba(0, 56, 70, 0.04);
}

.mdn-dashboard-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.mdn-dashboard-card-head h2 {
    margin: 0;
    color: #003846;
    font-size: 26px;
    line-height: 1.2;
}

.mdn-dashboard-card-head a {
    color: #007C7C !important;
    font-weight: 800;
    text-decoration: none !important;
}

.mdn-order-list,
.mdn-reorder-list {
    display: grid;
    gap: 10px;
}

.mdn-order-row {
    display: grid;
    grid-template-columns: 1.1fr 120px 90px auto;
    gap: 14px;
    align-items: center;
    min-height: 64px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(0, 96, 96, 0.10);
}

.mdn-order-row:last-child {
    border-bottom: 0;
}

.mdn-order-row strong,
.mdn-reorder-row strong {
    display: block;
    color: #003846;
    font-size: 15px;
    line-height: 1.25;
}

.mdn-order-row span,
.mdn-reorder-row span {
    display: block;
    color: #607780;
    font-size: 13px;
    margin-top: 3px;
}

.mdn-order-status {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 108px;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    background: #EEF8F8;
    color: #007C7C !important;
    font-size: 13px;
    line-height: 1.15;
    font-weight: 800;
    white-space: nowrap;
    text-align: center;
}

.mdn-order-price {
    color: #003846;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

.mdn-order-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.mdn-order-actions a,
.mdn-reorder-row a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(0, 124, 124, 0.28);
    color: #007C7C !important;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none !important;
}

.mdn-order-actions a:hover,
.mdn-reorder-row a:hover {
    background: #007C7C;
    color: #ffffff !important;
}

.mdn-reorder-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    min-height: 64px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(0, 96, 96, 0.10);
}

.mdn-reorder-row:last-child {
    border-bottom: 0;
}

.mdn-dashboard-empty {
    margin: 0;
    color: #7A8793;
    font-size: 15px;
    line-height: 1.55;
}


/* =====================================================
   08. Support card
   ===================================================== */

.mdn-support-card h2 {
    margin: 0 0 10px;
    color: #003846;
    font-size: 24px;
    line-height: 1.2;
}

.mdn-support-card p {
    margin: 0 0 18px;
    color: #536b74;
    font-size: 15px;
    line-height: 1.5;
}

.mdn-support-contact {
    display: grid;
    gap: 10px;
    margin: 0 0 18px;
    padding: 16px 0;
    border-top: 1px solid rgba(0, 96, 96, 0.12);
    border-bottom: 1px solid rgba(0, 96, 96, 0.12);
}

.mdn-support-contact a {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #003846 !important;
    text-decoration: none !important;
}

.mdn-support-contact a:hover {
    color: #007C7C !important;
}

.mdn-support-icon {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 999px;
    background: #EEF8F8;
    color: #007C7C;
    font-size: 15px;
    line-height: 1;
}

.mdn-support-actions {
    margin-top: 0;
}


/* =====================================================
   09. Reorder product thumbnail
   ===================================================== */

.mdn-reorder-product {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    min-width: 0;
}

.mdn-reorder-image {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
}

.mdn-reorder-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 0;
}

.mdn-reorder-image span {
    color: #007C7C;
    font-weight: 900;
}

.mdn-reorder-info {
    min-width: 0;
}

.mdn-reorder-info strong {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


/* =====================================================
   10. News banner
   ===================================================== */

.mdn-news-banner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    margin-top: 24px;
    padding: 26px 32px;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(8, 124, 123, 0.14), transparent 32%),
        linear-gradient(135deg, #EEF8F8 0%, #ffffff 72%);
    border: 1px solid rgba(0, 96, 96, 0.12);
    box-shadow: 0 10px 24px rgba(0, 56, 70, 0.04);
}

.mdn-news-label {
    display: inline-block;
    margin-bottom: 8px;
    color: #007C7C;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mdn-news-banner h2 {
    margin: 0 0 8px;
    color: #003846;
    font-size: 28px;
    line-height: 1.2;
    font-weight: 800;
}

.mdn-news-banner p {
    max-width: 720px;
    margin: 0;
    color: #536b74;
    font-size: 16px;
    line-height: 1.5;
}

.mdn-news-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 22px;
    border-radius: 999px;
    background: #007C7C;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none !important;
    white-space: nowrap;
}

.mdn-news-button:hover {
    background: #006B6B;
    color: #ffffff !important;
}


/* =====================================================
   11. Category cards, quick links and trust section
   ===================================================== */

.mdn-category-section,
.mdn-quick-section,
.mdn-trust-section {
    margin-top: 28px !important;
}

.mdn-section-head {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: end;
    margin-bottom: 18px;
}

.mdn-section-head h2 {
    margin: 0;
    color: #003846;
    font-size: 30px;
    line-height: 1.2;
}

.mdn-section-link {
    color: #087c7b;
    font-weight: 800;
    text-decoration: none;
}

.mdn-category-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.mdn-category-card {
    display: grid;
    grid-template-columns: 38px 1fr auto;
    gap: 12px;
    align-items: center;
    min-height: 88px;
    padding: 18px;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid rgba(0, 96, 96, 0.12);
    color: #003846;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(0, 56, 70, 0.04);
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.mdn-category-card:hover {
    transform: translateY(-2px);
    border-color: rgba(8, 124, 123, 0.42);
    box-shadow: 0 16px 34px rgba(0, 56, 70, 0.08);
}

.mdn-category-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
    background: #eef8f8;
    color: #087c7b;
    font-weight: 900;
}

.mdn-category-title {
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
}

.mdn-category-arrow {
    color: #087c7b;
    font-weight: 900;
}

.mdn-quick-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.mdn-quick-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 126px;
    padding: 22px;
    border-radius: 20px;
    background: #eef8f8;
    color: #003846;
    text-decoration: none;
}

.mdn-quick-card strong {
    font-size: 18px;
}

.mdn-quick-card span {
    color: #536b74;
    line-height: 1.4;
}

.mdn-trust-section {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 26px;
    padding: 34px;
    border-radius: 26px;
    background: #003846;
    color: #ffffff;
}

.mdn-trust-content h2 {
    margin: 0 0 12px;
    color: #ffffff;
    font-size: 30px;
    line-height: 1.2;
}

.mdn-trust-content p {
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.55;
}

.mdn-trust-cards {
    display: grid;
    gap: 14px;
}

.mdn-trust-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.mdn-trust-card strong {
    color: #ffffff;
}

.mdn-trust-card span {
    color: rgba(255, 255, 255, 0.72);
}


/* =====================================================
   12. Responsive
   ===================================================== */

@media (max-width: 1180px) {
    .mdn-navbar-content {
        gap: 16px !important;
    }

    .mdn-header-search {
        max-width: 520px;
    }

    .mdn-header-actions {
        gap: 14px !important;
    }

    .mdn-dashboard-hero {
        grid-template-columns: 1fr;
    }

    .mdn-dashboard-side {
        align-self: stretch;
    }

    .mdn-dashboard-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1100px) {
    .mdn-hero {
        grid-template-columns: 1fr;
        padding: 30px !important;
    }

    .mdn-hero h1 {
        font-size: 42px !important;
    }

    .mdn-category-grid,
    .mdn-quick-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mdn-trust-section {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    .mdn-navbar-content {
        grid-template-columns: auto 1fr auto !important;
    }

    .mdn-header-search {
        display: none !important;
    }

    .mdn-header-action-link span {
        display: none !important;
    }

    .mdn-header-action-link {
        min-width: 34px;
    }

    .mdn-login-dropdown {
        right: -70px !important;
    }
}

@media (max-width: 900px) {
    .mdn-order-row {
        grid-template-columns: 1fr;
    }

    .mdn-order-status {
        justify-content: flex-start;
        width: fit-content;
        min-width: 0;
        padding: 7px 12px;
    }
}

@media (max-width: 760px) {
    .mdn-dashboard-hero {
        padding: 24px;
        border-radius: 20px;
    }

    .mdn-dashboard-main h1 {
        font-size: 32px;
    }

    .mdn-dashboard-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mdn-order-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .mdn-order-price,
    .mdn-order-actions {
        text-align: left;
        justify-content: flex-start;
    }

    .mdn-news-banner {
        grid-template-columns: 1fr;
        padding: 22px;
        border-radius: 20px;
    }

    .mdn-news-banner h2 {
        font-size: 24px;
    }

    .mdn-news-button {
        width: fit-content;
    }
}

@media (max-width: 700px) {
    body.frontpage .page-content {
        padding-top: 20px !important;
    }

    .mdn-navbar-content {
        min-height: 62px !important;
        grid-template-columns: auto 1fr auto !important;
        gap: 10px !important;
    }

    .mdn-navbar-center {
        justify-content: flex-end !important;
    }

    .mdn-header-actions {
        gap: 14px !important;
    }

    .mdn-header-action-login {
        display: flex !important;
    }

    .mdn-header-action-login .mdn-header-action-link {
        min-width: 42px !important;
    }

    .mdn-header-action-login .mdn-header-action-link span {
        display: block !important;
        font-size: 11px !important;
        line-height: 1.1 !important;
    }

    .mdn-login-dropdown {
        display: none !important;
    }

    .mdn-cnav {
        display: block !important;
    }

    .mdn-cnav-trigger {
        height: 40px !important;
        padding: 0 12px !important;
    }

    .mdn-cnav-trigger span:last-child {
        display: none !important;
    }

    .mdn-hero {
        padding: 24px !important;
        border-radius: 20px;
    }

    .mdn-hero h1 {
        font-size: 32px !important;
    }

    .mdn-hero-text {
        font-size: 16px;
    }

    .mdn-search-inline {
        border-radius: 18px;
    }

    .mdn-search-inline-submit span {
        display: none;
    }

    .mdn-section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .mdn-trust-section {
        padding: 24px;
        border-radius: 20px;
    }
}

@media (max-width: 520px) {
    .mdn-category-grid,
    .mdn-quick-grid {
        grid-template-columns: 1fr;
    }

    .mdn-dashboard-stats {
        grid-template-columns: 1fr;
    }

    .mdn-reorder-row {
        grid-template-columns: 1fr;
    }
}
/* =====================================================
   MEDINOR - HEADER ACCOUNT + MOBILE POLISH
   Company label, account dropdown and mobile header order
   ===================================================== */


/* =====================================================
   01. Account label in header
   Desktop/tablet: company name
   Mobile: icon only
   ===================================================== */

.mdn-account-link {
    min-width: 86px !important;
}

.mdn-account-label {
    display: block !important;
    max-width: 120px;
    color: inherit;
    font-size: 12px;
    line-height: 1.1;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


/* =====================================================
   02. Account dropdown
   ===================================================== */

.mdn-account-dropdown-trigger {
    border: 0 !important;
    background: transparent !important;
    cursor: pointer !important;
    font-family: inherit !important;
}

.mdn-account-dropdown {
    display: none !important;
    position: absolute !important;
    top: calc(100% + 14px) !important;
    right: -22px !important;
    z-index: 99999 !important;
    width: 260px !important;
    padding: 18px !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0, 96, 96, 0.14) !important;
    box-shadow: 0 24px 60px rgba(0, 56, 70, 0.18) !important;
    text-align: left !important;
}

.mdn-account-dropdown.is-open {
    display: block !important;
}

.mdn-account-dropdown::before {
    content: "";
    position: absolute;
    top: -8px;
    right: 42px;
    width: 16px;
    height: 16px;
    background: #ffffff;
    border-left: 1px solid rgba(0, 96, 96, 0.14);
    border-top: 1px solid rgba(0, 96, 96, 0.14);
    transform: rotate(45deg);
}

.mdn-account-dropdown-head {
    padding-bottom: 14px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(0, 96, 96, 0.12);
}

.mdn-account-dropdown-head strong {
    display: block;
    color: #003846;
    font-size: 16px;
    line-height: 1.25;
    font-weight: 900;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mdn-account-dropdown-head span {
    display: block;
    margin-top: 4px;
    color: #607780;
    font-size: 13px;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mdn-account-dropdown-nav {
    display: grid;
    gap: 2px;
    padding-bottom: 8px !important;
    margin-bottom: 8px !important;
    border-bottom: 1px solid rgba(0, 96, 96, 0.12) !important;
}

.mdn-account-dropdown-nav a,
.mdn-account-dropdown-logout {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 40px !important;
    padding: 0 10px !important;
    border-radius: 10px !important;
    color: #003846 !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

.mdn-account-dropdown-nav a::after,
.mdn-account-dropdown-logout::after {
    content: "";
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    margin-left: 12px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.65;
}

.mdn-account-dropdown-nav a:hover,
.mdn-account-dropdown-nav a:focus {
    background: #EEF8F8 !important;
    color: #007C7C !important;
}

.mdn-account-dropdown-logout {
    margin-top: 10px !important;
    background: transparent !important;
    color: #B42318 !important;
    border: 0 !important;
}

.mdn-account-dropdown-logout:hover,
.mdn-account-dropdown-logout:focus {
    background: rgba(180, 35, 24, 0.06) !important;
    color: #B42318 !important;
}


/* =====================================================
   03. Mobile header order and icon sizing
   Logo | account/actions | category menu
   ===================================================== */

@media (max-width: 700px) {
    .mdn-navbar-content {
        grid-template-columns: auto 1fr auto !important;
        gap: 8px !important;
    }

    .mdn-navbar-left {
        grid-column: 1 !important;
    }

    .mdn-navbar-right {
        grid-column: 2 !important;
        order: 2 !important;
        justify-self: end !important;
    }

    .mdn-navbar-center {
        grid-column: 3 !important;
        order: 3 !important;
        justify-content: flex-end !important;
        margin-left: 0 !important;
    }

    .mdn-header-actions {
        gap: 14px !important;
        align-items: center !important;
    }

    .mdn-account-label,
    .mdn-header-actions .mdn-header-action-link span {
        display: none !important;
        visibility: hidden !important;
        width: 0 !important;
        max-width: 0 !important;
        overflow: hidden !important;
    }

    .mdn-header-actions .mdn-header-action-link {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 !important;
        line-height: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .mdn-header-actions .mdn-header-action-link i,
    .mdn-header-actions .mdn-header-action-link svg,
    .mdn-header-actions .mdn-header-action-link .icon,
    .mdn-header-actions .mdn-header-action-link [class*="icon"] {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        font-size: 24px !important;
        line-height: 24px !important;
        display: block !important;
    }

    .mdn-header-action-login .mdn-header-action-link i,
    .mdn-header-action-login .mdn-header-action-link svg,
    .mdn-header-action-login .mdn-header-action-link .icon,
    .mdn-header-action-login .mdn-header-action-link [class*="icon"] {
        width: 25px !important;
        height: 25px !important;
        min-width: 25px !important;
        font-size: 25px !important;
        line-height: 25px !important;
    }

    .mdn-header-action-cart .basket > a,
    .mdn-header-action-cart .basket > a i,
    .mdn-header-action-cart .basket > a svg,
    .mdn-header-action-cart .basket > a .icon,
    .mdn-header-action-cart .basket > a [class*="icon"] {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        font-size: 24px !important;
        line-height: 24px !important;
    }

    .mdn-header-action-cart .count-bubble {
        top: -4px !important;
        right: -4px !important;
    }

    .mdn-cnav-trigger {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .mdn-cnav-trigger span:last-child {
        display: none !important;
    }

    .mdn-cnav-trigger-icon {
        font-size: 20px !important;
        line-height: 1 !important;
    }
}


/* =====================================================
   04. Mobile account dropdown
   ===================================================== */

@media (max-width: 700px) {
    .mdn-account-dropdown {
        position: fixed !important;
        top: 64px !important;
        right: 14px !important;
        left: 14px !important;
        width: auto !important;
        max-width: none !important;
        padding: 18px !important;
        border-radius: 18px !important;
    }

    .mdn-account-dropdown::before {
        display: none !important;
    }

    .mdn-account-dropdown-head strong {
        font-size: 17px;
    }

    .mdn-account-dropdown-nav a,
    .mdn-account-dropdown-logout {
        min-height: 46px !important;
        padding: 0 12px !important;
        border-radius: 12px !important;
        font-size: 15px !important;
    }
}
/* =====================================================
   MEDINOR - USER EDIT PAGE
   Tínar upplýsingar / account details
   ===================================================== */


/* =====================================================
   01. Page layout
   ===================================================== */

.m-useredit,
.m-userremove {
    max-width: 1180px;
    margin: 0 auto;
    color: #003846;
}

.m-useredit-article,
.m-userremove-article {
    margin-top: 8px;
}

.m-useredit-header.page-title {
    margin-bottom: 20px;
    text-align: center;
}

.m-useredit-headline {
    color: #003846 !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
}

.m-useredit-description {
    max-width: 1180px;
    margin: 0 auto 14px;
    color: #607780;
    font-size: 15px;
    line-height: 1.5;
}


/* =====================================================
   02. Main cards
   ===================================================== */

#m-useredit .panel.panel-border,
#m-userremove .panel.panel-border {
    border: 1px solid rgba(0, 96, 96, 0.12) !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    box-shadow: 0 14px 34px rgba(0, 56, 70, 0.05) !important;
    overflow: hidden !important;
}

#m-useredit .panel-body {
    padding: 28px !important;
}

#m-useredit .panel-footer {
    padding: 18px 28px !important;
    border-top: 1px solid rgba(0, 96, 96, 0.10) !important;
    background: #F4FAFA !important;
}


/* =====================================================
   03. Headings and labels
   ===================================================== */

#m-useredit h5,
#m-userremove h5 {
    margin: 0 0 18px !important;
    color: #003846 !important;
    font-size: 20px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
}

#m-useredit #deliveryContactInfoContainer > h5,
#m-useredit .deliveryContactInfoContainer > h5,
#m-useredit .mdn-useredit-section-title {
    display: block !important;
    margin: 0 0 16px !important;
    min-height: 16px !important;
    color: #007C7C !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
}

#m-useredit #deliveryContactInfoContainer > h5,
#m-useredit .deliveryContactInfoContainer > h5 {
    transform: translateY(20px) !important;
}

#m-useredit .form-label,
#m-userremove .form-label {
    display: block !important;
    margin-bottom: 6px !important;
    color: #003846 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
}

#m-useredit .form-required {
    color: #B42318 !important;
}


/* =====================================================
   04. Fields
   ===================================================== */

#m-useredit .form-group {
    margin-bottom: 14px !important;
}

#m-useredit .form-input,
#m-useredit input[type="text"],
#m-useredit input[type="email"],
#m-useredit input[type="password"],
#m-useredit input[type="tel"],
#m-useredit input[type="date"],
#m-useredit select {
    width: 100% !important;
    min-height: 44px !important;
    border: 1px solid rgba(0, 96, 96, 0.18) !important;
    border-radius: 12px !important;
    padding: 0 14px !important;
    color: #003846 !important;
    background: #f8fbfb !important;
    box-shadow: none !important;
    outline: none !important;
}

#m-useredit .form-input:focus,
#m-useredit input:focus,
#m-useredit select:focus {
    border-color: #007C7C !important;
    background: #ffffff !important;
}


/* =====================================================
   05. Phone fields
   ===================================================== */

#m-useredit .m-useredit-phone .input-group,
#m-useredit .m-useredit-mobilephone .input-group,
#m-useredit .m-useredit-del-phone .input-group,
#m-useredit .m-useredit-del-mobilephone .input-group {
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    width: 100% !important;
    border: 1px solid rgba(0, 96, 96, 0.18) !important;
    border-radius: 12px !important;
    background: #f8fbfb !important;
    overflow: hidden !important;
}

#m-useredit .m-useredit-phone .input-group-addon,
#m-useredit .m-useredit-mobilephone .input-group-addon,
#m-useredit .m-useredit-del-phone .input-group-addon,
#m-useredit .m-useredit-del-mobilephone .input-group-addon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 44px !important;
    border: 0 !important;
    border-right: 1px solid rgba(0, 96, 96, 0.14) !important;
    border-radius: 0 !important;
    background: #EEF8F8 !important;
    color: #007C7C !important;
    font-weight: 900 !important;
}

#m-useredit .m-useredit-phone .input-group-main,
#m-useredit .m-useredit-mobilephone .input-group-main,
#m-useredit .m-useredit-del-phone .input-group-main,
#m-useredit .m-useredit-del-mobilephone .input-group-main {
    min-height: 44px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}


/* =====================================================
   06. Checkbox rows
   ===================================================== */

#m-useredit .input-group:has(input[type="checkbox"]) {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    border: 1px solid rgba(0, 96, 96, 0.18) !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    overflow: visible !important;
}

#m-useredit .input-group:has(input[type="checkbox"]) .input-group-addon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

#m-useredit .input-group:has(input[type="checkbox"]) input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

#m-useredit .input-group:has(input[type="checkbox"]) .input-group-main {
    flex: 1 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #003846 !important;
    font-weight: 800 !important;
}


/* =====================================================
   07. Delivery / right column
   ===================================================== */

#m-useredit #deliveryContactInfoContainer,
#m-useredit .deliveryContactInfoContainer,
#m-useredit .m-useredit-newsletter,
#m-useredit .m-useredit-consent {
    color: #003846;
}

#m-useredit .deliveryContactInfoDisplay {
    margin-top: 38px !important;
}

#m-useredit .deliveryContactInfoDisplay br {
    display: none !important;
}

#m-useredit #m-useredit-del {
    margin-top: 0 !important;
    margin-bottom: 14px !important;
}


/* =====================================================
   08. Account info boxes and newsletter
   ===================================================== */

#m-useredit .m-useredit-email,
#m-useredit .m-useredit-password {
    padding: 14px 16px !important;
    border-radius: 14px !important;
    background: #F8FBFB !important;
    border: 1px solid rgba(0, 96, 96, 0.10) !important;
}

#m-useredit .m-useredit-email a,
#m-useredit .m-useredit-password a {
    color: #007C7C !important;
    font-weight: 800 !important;
    text-decoration: none !important;
}

#m-useredit .m-useredit-email a:hover,
#m-useredit .m-useredit-password a:hover {
    color: #006B6B !important;
}

#m-useredit .m-useredit-newsletter {
    margin-top: 16px !important;
    padding: 16px !important;
    border-radius: 16px !important;
    background: #F8FBFB !important;
    border: 1px solid rgba(0, 96, 96, 0.10) !important;
}

#m-useredit .m-useredit-newsletter .input-group:has(input[type="checkbox"]) {
    margin-top: 10px !important;
}


/* =====================================================
   09. Buttons
   ===================================================== */

#m-useredit .button,
#m-useredit button,
#m-useredit input[type="submit"] {
    min-height: 42px !important;
    border: 0 !important;
    border-radius: 999px !important;
    padding: 0 22px !important;
    background: #007C7C !important;
    color: #ffffff !important;
    font-weight: 900 !important;
    text-transform: none !important;
}

#m-useredit .button:hover,
#m-useredit button:hover,
#m-useredit input[type="submit"]:hover {
    background: #006B6B !important;
}

#m-useredit .panel-footer .button {
    min-width: 118px !important;
    min-height: 46px !important;
    font-size: 14px !important;
}


/* =====================================================
   10. Delete account section
   ===================================================== */

.m-userremove {
    margin-top: 18px;
    margin-bottom: 32px;
}

#m-userremove .panel.panel-border {
    border-color: rgba(180, 35, 24, 0.10) !important;
    background: #ffffff !important;
    box-shadow: 0 10px 24px rgba(0, 56, 70, 0.03) !important;
}

#m-userremove .panel-body {
    padding: 24px !important;
}

#m-userremove .m-userremove-headline {
    color: #B42318 !important;
    font-size: 20px !important;
}

#m-userremove .m-userremove__text--description,
#m-userremove .m-userremove-description-bottom {
    color: #607780 !important;
    line-height: 1.55 !important;
}

#m-userremove .button {
    min-height: 40px !important;
    border-radius: 999px !important;
    padding: 0 18px !important;
    background: #ffffff !important;
    color: #B42318 !important;
    border: 1px solid rgba(180, 35, 24, 0.28) !important;
    font-weight: 900 !important;
    text-transform: none !important;
}

#m-userremove .button:hover {
    background: rgba(180, 35, 24, 0.06) !important;
}


/* =====================================================
   11. Mobile
   ===================================================== */

@media (max-width: 700px) {
    .m-useredit,
    .m-userremove {
        max-width: none;
        margin-left: 0;
        margin-right: 0;
    }

    .m-useredit-headline {
        font-size: 28px !important;
    }

    #m-useredit .panel.panel-border,
    #m-userremove .panel.panel-border {
        border-radius: 18px !important;
    }

    #m-useredit .panel-body,
    #m-userremove .panel-body {
        padding: 20px !important;
    }

    #m-useredit .panel-footer {
        padding: 16px 20px !important;
    }

    #m-useredit .form-input,
    #m-useredit input[type="text"],
    #m-useredit input[type="email"],
    #m-useredit input[type="password"],
    #m-useredit input[type="tel"],
    #m-useredit input[type="date"],
    #m-useredit select {
        min-height: 48px !important;
        font-size: 16px !important;
    }

    #m-useredit .m-useredit-phone .input-group,
    #m-useredit .m-useredit-mobilephone .input-group,
    #m-useredit .m-useredit-del-phone .input-group,
    #m-useredit .m-useredit-del-mobilephone .input-group {
        grid-template-columns: 58px minmax(0, 1fr) !important;
    }

    #m-useredit .m-useredit-phone .input-group-addon,
    #m-useredit .m-useredit-mobilephone .input-group-addon,
    #m-useredit .m-useredit-del-phone .input-group-addon,
    #m-useredit .m-useredit-del-mobilephone .input-group-addon {
        min-height: 48px !important;
    }

    #m-useredit .button,
    #m-useredit button,
    #m-useredit input[type="submit"] {
        width: 100%;
        min-height: 48px !important;
    }

    #m-useredit #deliveryContactInfoContainer > h5,
    #m-useredit .deliveryContactInfoContainer > h5 {
        transform: none !important;
    }

    #m-useredit .deliveryContactInfoDisplay {
        margin-top: 0 !important;
    }
}
/* =====================================================
   MEDINOR - USER ORDERS / MÍNAR BÍLEGGINGAR
   ===================================================== */

/* 01. Page layout */
.m-user-orders {
    max-width: 1180px;
    min-height: calc(100vh - 520px) !important;
    margin: 0 auto 24px !important;
    color: #003846;
}

.m-user-orders .page-title {
    margin-bottom: 26px;
    text-align: center;
}

.m-user-orders .page-title h1 {
    color: #003846 !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
}

.mdn-userorders {
    max-width: 980px;
    margin: 8px auto 0;
}

/* 02. Tabs */
.mdn-userorders-tabs.nav-tabs {
    display: flex;
    gap: 8px;
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: 0 !important;
}

.mdn-userorders-tabs.nav-tabs > li {
    margin: 0 !important;
}

.mdn-userorders-tabs.nav-tabs > li > a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 42px !important;
    padding: 0 18px !important;
    border: 1px solid rgba(0, 96, 96, 0.14) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #007C7C !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
}

.mdn-userorders-tabs.nav-tabs > li.active > a,
.mdn-userorders-tabs.nav-tabs > li > a:hover {
    background: #007C7C !important;
    color: #ffffff !important;
    border-color: #007C7C !important;
}

/* 03. Remove old template panel styling */
.mdn-userorders-content,
.mdn-userorders-content.t-panel-clean,
.m-user-orders .toggle-content,
.m-user-orders .t-panel-clean,
.m-user-orders .pane,
.m-user-orders .panel,
.m-user-orders .panel-border {
    padding: 0 !important;
    margin-bottom: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* 04. Shared list/cards */
.mdn-order-list,
.mdn-popular-order-list {
    display: grid;
    gap: 14px;
    margin-bottom: 0 !important;
}

.mdn-popular-order-list {
    max-width: 980px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.mdn-order-card,
.mdn-popular-order-card,
.mdn-empty-card {
    display: grid;
    gap: 18px;
    border: 1px solid rgba(0, 96, 96, 0.12) !important;
    border-radius: 22px;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(0, 56, 70, 0.04) !important;
}

.mdn-empty-card {
    display: block;
    padding: 28px;
    color: #607780;
    text-align: center;
}

/* 05. Order history cards */
.mdn-order-card {
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: end !important;
    padding: 24px !important;
}

.mdn-order-card-main {
    display: grid;
    gap: 16px;
}

.mdn-order-card-title-wrap {
    display: grid;
    gap: 4px;
}

.mdn-order-card-eyebrow {
    color: #007C7C;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.mdn-order-card-title {
    color: #003846;
    font-size: 22px !important;
    line-height: 1.1;
    font-weight: 900;
}

.mdn-order-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 12px;
}

.mdn-order-meta-item {
    min-height: 64px !important;
    padding: 14px 16px;
    border: 1px solid rgba(0, 96, 96, 0.10);
    border-radius: 16px;
    background: #F8FBFB;
}

.mdn-order-meta-item span {
    display: block;
    margin-bottom: 4px;
    color: #607780;
    font-size: 12px;
    line-height: 1.2;
    font-weight: 700;
}

.mdn-order-meta-item strong {
    display: block;
    color: #003846;
    font-size: 15px;
    line-height: 1.25;
    font-weight: 900;
}

.mdn-order-status {
    display: inline-flex !important;
    align-items: center;
    width: fit-content;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #EEF8F8;
    color: #007C7C !important;
}

/* 06. Buttons/actions */
.mdn-order-card-actions,
.mdn-popular-order-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.mdn-order-card-actions {
    align-self: end !important;
    flex-wrap: nowrap !important;
    padding-bottom: 16px !important;
}

.mdn-order-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    padding: 0 16px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.mdn-order-action-primary {
    border: 1px solid #007C7C !important;
    background: #007C7C !important;
    color: #ffffff !important;
}

.mdn-order-action-primary:hover {
    border-color: #006B6B !important;
    background: #006B6B !important;
    color: #ffffff !important;
}

.mdn-order-action-secondary {
    border: 1px solid rgba(0, 124, 124, 0.28) !important;
    background: #ffffff !important;
    color: #007C7C !important;
}

.mdn-order-action-secondary:hover {
    background: #EEF8F8 !important;
    color: #007C7C !important;
}

/* 07. Popular reorder product cards */
.mdn-popular-order-card-product {
    grid-template-columns: 86px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
    min-height: 112px !important;
    padding: 20px 24px !important;
}

.mdn-popular-product-image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 86px !important;
    height: 86px !important;
    text-decoration: none !important;
}

.mdn-popular-product-image img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 86px !important;
    max-height: 86px !important;
    object-fit: contain !important;
}

.mdn-popular-order-main {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.mdn-popular-order-title-link {
    display: block !important;
    color: #003846 !important;
    text-decoration: none !important;
}

.mdn-popular-order-title-link:hover .mdn-popular-order-title {
    color: #007C7C !important;
}

.mdn-popular-order-title {
    display: block !important;
    max-width: 620px !important;
    color: #003846 !important;
    font-size: 16px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
}

.mdn-popular-order-subtitle {
    display: block !important;
    margin-top: 3px !important;
    color: #607780 !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
}

.mdn-popular-order-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px 16px !important;
    margin-top: 8px !important;
    color: #607780 !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}

.mdn-popular-order-meta del {
    margin-left: 6px !important;
    color: #8AA0A8 !important;
}

.mdn-popular-order-actions {
    margin: 0 !important;
}

.mdn-popular-order-actions .mdn-order-action,
.mdn-reorder-submit {
    min-width: 126px !important;
}

.mdn-reorder-submit {
    border: 0 !important;
    cursor: pointer !important;
}

/* 08. Quantity control */
.mdn-reorder-qty {
    display: inline-grid !important;
    grid-template-columns: 38px 52px 38px !important;
    align-items: center !important;
    height: 40px !important;
    border: 1px solid rgba(0, 96, 96, 0.18) !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

.mdn-reorder-qty-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 40px !important;
    border: 0 !important;
    background: #EEF8F8 !important;
    color: #007C7C !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    cursor: pointer !important;
}

.mdn-reorder-qty-btn:hover {
    background: #DFF1F1 !important;
}

.mdn-reorder-qty-input {
    width: 52px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border: 0 !important;
    border-left: 1px solid rgba(0, 96, 96, 0.12) !important;
    border-right: 1px solid rgba(0, 96, 96, 0.12) !important;
    background: #ffffff !important;
    color: #003846 !important;
    font-size: 15px !important;
    line-height: 40px !important;
    font-weight: 900 !important;
    text-align: center !important;
    outline: none !important;
}

/* 09. Mobile */
@media (max-width: 700px) {
    .m-user-orders {
        max-width: none;
        min-height: auto !important;
        margin-bottom: 24px !important;
    }

    .m-user-orders .page-title h1 {
        font-size: 28px !important;
    }

    .mdn-userorders-tabs.nav-tabs {
        overflow-x: auto;
        padding-bottom: 4px !important;
    }

    .mdn-userorders-tabs.nav-tabs > li > a {
        min-height: 40px !important;
        padding: 0 14px !important;
        white-space: nowrap;
    }

    .mdn-order-card {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
        padding: 18px !important;
        border-radius: 18px;
    }

    .mdn-order-meta {
        grid-template-columns: 1fr;
    }

    .mdn-order-card-actions {
        align-self: stretch !important;
        justify-content: stretch;
        flex-wrap: wrap !important;
        padding-bottom: 0 !important;
    }

    .mdn-order-action {
        width: 100%;
        min-height: 44px !important;
    }

    .mdn-popular-order-card-product {
        grid-template-columns: 72px minmax(0, 1fr) !important;
        gap: 14px !important;
        padding: 18px !important;
        border-radius: 18px;
    }

    .mdn-popular-product-image {
        width: 72px !important;
        height: 72px !important;
    }

    .mdn-popular-product-image img {
        max-width: 72px !important;
        max-height: 72px !important;
    }

    .mdn-popular-order-actions {
        grid-column: 1 / -1 !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        justify-content: stretch !important;
        gap: 10px !important;
    }

    .mdn-reorder-qty {
        width: 100% !important;
        grid-template-columns: 42px 1fr 42px !important;
        height: 44px !important;
    }

    .mdn-reorder-qty-btn,
    .mdn-reorder-qty-input {
        height: 44px !important;
        min-height: 44px !important;
        line-height: 44px !important;
    }
}
/* =====================================================
   MEDINOR - WISHLIST / YNDISVORUR
   Fastur innkeypslisti
   ===================================================== */


/* -----------------------------------------------------
   01. Page layout
   ----------------------------------------------------- */

.mdn-wishlist {
    max-width: 1180px;
    min-height: calc(100vh - 520px);
    margin: 0 auto 32px;
    color: #003846;
}

.mdn-wishlist-article {
    display: grid;
    gap: 18px;
}


/* -----------------------------------------------------
   02. Hero
   ----------------------------------------------------- */

.mdn-wishlist-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: end;
    margin-bottom: 4px;
}

.mdn-wishlist-hero-main {
    min-width: 0;
}

.mdn-wishlist-title {
    margin: 0 !important;
    color: #003846 !important;
    font-size: 34px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
}

.mdn-wishlist-intro {
    max-width: 620px;
    margin: 12px 0 0;
    color: #607780;
    font-size: 16px;
    line-height: 1.5;
}

.mdn-wishlist-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
    align-items: center;
}

.mdn-wishlist-hero-actions:empty {
    display: none;
}


/* -----------------------------------------------------
   03. Buttons
   ----------------------------------------------------- */

.mdn-wishlist-action,
.mdn-wishlist-buy-button,
.mdn-wishlist-delete-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 42px !important;
    padding: 0 18px !important;
    border-radius: 999px !important;
    font-size: 14px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    font-family: inherit !important;
}

.mdn-wishlist-action-primary,
.mdn-wishlist-buy-button {
    border: 1px solid #007C7C !important;
    background: #007C7C !important;
    color: #ffffff !important;
    cursor: pointer !important;
}

.mdn-wishlist-action-primary:hover,
.mdn-wishlist-buy-button:hover {
    border-color: #006B6B !important;
    background: #006B6B !important;
    color: #ffffff !important;
}

.mdn-wishlist-action-secondary {
    border: 1px solid rgba(0, 124, 124, 0.28) !important;
    background: #ffffff !important;
    color: #007C7C !important;
}

.mdn-wishlist-action-secondary:hover {
    background: #EEF8F8 !important;
    color: #007C7C !important;
}

.mdn-wishlist-delete-button {
    min-width: 90px;
    border: 1px solid rgba(180, 35, 24, 0.28) !important;
    background: #ffffff !important;
    color: #B42318 !important;
}

.mdn-wishlist-delete-button:hover {
    background: rgba(180, 35, 24, 0.06) !important;
    color: #B42318 !important;
}


/* -----------------------------------------------------
   04. Add product by item number / SKU
   ----------------------------------------------------- */

.mdn-wishlist-sku-panel {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) minmax(360px, 520px);
    gap: 22px;
    align-items: center;
    padding: 20px 22px;
    border: 1px solid rgba(0, 96, 96, 0.12);
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(0, 56, 70, 0.04);
}

.mdn-wishlist-sku-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 999px;
    background: #EEF8F8;
    color: #007C7C;
    font-size: 20px;
    font-weight: 900;
}

.mdn-wishlist-sku-text .mdn-eyebrow {
    display: none !important;
}

.mdn-wishlist-sku-text h2 {
    margin: 0 0 4px;
    color: #003846;
    font-size: 19px;
    line-height: 1.2;
    font-weight: 900;
}

.mdn-wishlist-sku-text p {
    max-width: 560px;
    margin: 0;
    color: #607780;
    font-size: 14px;
    line-height: 1.45;
}

.mdn-wishlist-sku-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    margin: 0;
}

.mdn-wishlist-sku-input {
    width: 100%;
    min-height: 46px;
    box-sizing: border-box;
    border: 1px solid rgba(0, 96, 96, 0.18);
    border-radius: 12px;
    padding: 0 16px;
    background: #ffffff;
    color: #003846;
    font-size: 15px;
    outline: none;
}

.mdn-wishlist-sku-input:focus {
    border-color: #007C7C;
}

.mdn-wishlist-sku-message {
    grid-column: 1 / -1;
    display: none;
    margin-top: 2px;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 800;
}

.mdn-wishlist-sku-message.is-visible {
    display: block;
}

.mdn-wishlist-sku-message.is-success {
    background: #EEF8F8;
    color: #007C7C;
}

.mdn-wishlist-sku-message.is-error {
    background: rgba(180, 35, 24, 0.07);
    color: #B42318;
}

.mdn-wishlist-sku-form.is-loading .mdn-wishlist-action {
    opacity: 0.65;
    pointer-events: none;
}


/* -----------------------------------------------------
   05. Product card
   ----------------------------------------------------- */

.mdn-wishlist-products,
.mdn-wishlist-empty {
    border: 1px solid rgba(0, 96, 96, 0.12);
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(0, 56, 70, 0.04);
}

.mdn-wishlist-products {
    padding: 24px;
}

.mdn-wishlist-products-head {
    margin-bottom: 18px;
}

.mdn-wishlist-products-head .mdn-eyebrow {
    display: none !important;
}

.mdn-wishlist-products-head h2 {
    margin: 4px 0 6px;
    color: #003846;
    font-size: 26px;
    line-height: 1.2;
    font-weight: 900;
}

.mdn-wishlist-products-head p {
    margin: 0;
    color: #607780;
    font-size: 14px;
    line-height: 1.45;
}

.mdn-wishlist-count {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    margin-left: 10px;
    padding: 0 10px;
    border-radius: 999px;
    background: #EEF8F8;
    color: #007C7C;
    font-size: 14px;
    font-weight: 900;
    vertical-align: middle;
}

.mdn-wishlist-list {
    display: grid;
    gap: 12px;
    margin: 0 !important;
    padding: 0 !important;
}


/* -----------------------------------------------------
   06. Product rows
   ----------------------------------------------------- */

.mdn-wishlist-row {
    display: grid !important;
    grid-template-columns: 92px minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
    padding: 18px;
    border: 1px solid rgba(0, 96, 96, 0.10);
    border-radius: 20px;
    background: #ffffff;
}

.mdn-wishlist-product-image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 92px !important;
    height: 82px !important;
    text-decoration: none !important;
}

.mdn-wishlist-product-image img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 92px !important;
    max-height: 82px !important;
    object-fit: contain !important;
}

.mdn-wishlist-product-main {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.mdn-wishlist-product-title-link {
    display: block !important;
    color: #003846 !important;
    text-decoration: none !important;
}

.mdn-wishlist-product-title-link:hover .mdn-wishlist-product-title {
    color: #007C7C !important;
}

.mdn-wishlist-product-title {
    display: block;
    max-width: 640px;
    color: #003846;
    font-size: 15px;
    line-height: 1.3;
    font-weight: 900;
}

.mdn-wishlist-product-subtitle {
    display: block;
    margin-top: 3px;
    color: #607780;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 600;
}

.mdn-wishlist-product-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    color: #607780;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 800;
}

.mdn-wishlist-product-meta span:first-child {
    color: #007C7C;
}

.mdn-wishlist-product-meta del {
    margin-left: 6px;
    color: #8AA0A8;
}


/* -----------------------------------------------------
   07. Product actions
   ----------------------------------------------------- */

.mdn-wishlist-product-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.mdn-wishlist-cart-form {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
}

.mdn-wishlist-buy-button {
    min-width: 96px;
}


/* -----------------------------------------------------
   08. Quantity control
   ----------------------------------------------------- */

.mdn-wishlist-qty {
    display: inline-grid;
    grid-template-columns: 38px 52px 38px;
    align-items: center;
    height: 42px;
    border: 1px solid rgba(0, 96, 96, 0.18);
    border-radius: 999px;
    background: #ffffff;
    overflow: hidden;
}

.mdn-wishlist-qty-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 42px !important;
    border: 0 !important;
    background: #EEF8F8 !important;
    color: #007C7C !important;
    font-size: 18px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    cursor: pointer !important;
}

.mdn-wishlist-qty-btn:hover {
    background: #DFF1F1 !important;
}

.mdn-wishlist-qty-input {
    width: 52px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border: 0 !important;
    border-left: 1px solid rgba(0, 96, 96, 0.12) !important;
    border-right: 1px solid rgba(0, 96, 96, 0.12) !important;
    background: #ffffff !important;
    color: #003846 !important;
    font-size: 15px !important;
    line-height: 42px !important;
    font-weight: 900 !important;
    text-align: center !important;
    outline: none !important;
}


/* -----------------------------------------------------
   09. Note
   ----------------------------------------------------- */

.mdn-wishlist-products-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    max-width: 560px;
    margin: 18px auto 0;
    padding: 8px 16px;
    border-radius: 999px;
    background: #EEF8F8;
    color: #607780;
    font-size: 12px;
    line-height: 1.35;
}

.mdn-wishlist-products-note span {
    color: #007C7C;
    font-weight: 900;
}

.mdn-wishlist-products-note p {
    margin: 0;
}


/* -----------------------------------------------------
   10. Empty state
   ----------------------------------------------------- */

.mdn-wishlist-empty {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 28px;
}

.mdn-wishlist-empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    border-radius: 999px;
    background: #EEF8F8;
    color: #007C7C;
    font-size: 24px;
    font-weight: 900;
}

.mdn-wishlist-empty h2 {
    margin: 4px 0 0;
    color: #003846;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 900;
}

.mdn-wishlist-empty p {
    margin: 6px 0 0;
    color: #607780;
    font-size: 14px;
    line-height: 1.45;
}


/* -----------------------------------------------------
   11. Safety cleanup
   ----------------------------------------------------- */

.mdn-wishlist-footer-actions,
.mdn-wishlist-summary,
.mdn-wishlist-panel,
.mdn-wishlist-header {
    display: none !important;
}


/* -----------------------------------------------------
   12. Mobile
   ----------------------------------------------------- */

@media (max-width: 700px) {
    .mdn-wishlist {
        max-width: none;
        min-height: auto;
        margin-bottom: 24px;
    }

    .mdn-wishlist-hero,
    .mdn-wishlist-sku-panel {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .mdn-wishlist-title {
        font-size: 30px !important;
    }

    .mdn-wishlist-hero-actions {
        justify-content: stretch;
    }

    .mdn-wishlist-action {
        width: 100%;
        min-height: 44px !important;
    }

    .mdn-wishlist-sku-panel,
    .mdn-wishlist-products,
    .mdn-wishlist-empty {
        border-radius: 18px;
    }

    .mdn-wishlist-sku-form {
        grid-template-columns: 1fr;
    }

    .mdn-wishlist-row {
        grid-template-columns: 72px minmax(0, 1fr);
        gap: 14px;
        padding: 18px;
        border-radius: 18px;
    }

    .mdn-wishlist-product-image {
        width: 72px !important;
        height: 72px !important;
    }

    .mdn-wishlist-product-image img {
        max-width: 72px !important;
        max-height: 72px !important;
    }

    .mdn-wishlist-product-actions {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 1fr;
        justify-content: stretch;
        gap: 10px;
    }

    .mdn-wishlist-cart-form {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }

    .mdn-wishlist-qty {
        grid-column: 1 / -1;
        width: 100%;
        grid-template-columns: 42px 1fr 42px;
        height: 44px;
    }

    .mdn-wishlist-qty-btn,
    .mdn-wishlist-qty-input {
        height: 44px !important;
        min-height: 44px !important;
        line-height: 44px !important;
    }

    .mdn-wishlist-buy-button,
    .mdn-wishlist-delete-button {
        width: 100%;
        min-height: 44px !important;
    }

    .mdn-wishlist-products-note {
        align-items: flex-start;
        justify-content: flex-start;
        border-radius: 16px;
        text-align: left;
    }

    .mdn-wishlist-empty {
        align-items: flex-start;
        border-radius: 18px;
    }
}