:root {
    --mh-navy: #080617;
    --mh-card: #150d2d;
    --mh-blue: #7c3cff;
    --mh-cyan: #ff4db8;
    --mh-text: #fbf7ff;
    --mh-muted: #baaed1;
    --mh-border: rgba(174, 100, 255, .28);
}

#sp-professional-order,
#sp-professional-order *,
#sp-professional-order *::before,
#sp-professional-order *::after {
    box-sizing: border-box;
}

/*
 * Roxi'nin genel header/section kuralları sipariş kartlarındaki semantik
 * header ve section etiketlerini konumlandırmamalı. Bu alan özellikle
 * scope'lanarak tema ile çakışması engellenir.
 */
#sp-professional-order {
    position: relative !important;
    z-index: 1;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
}
#sp-professional-order section,
#sp-professional-order main,
#sp-professional-order aside {
    position: static;
    inset: auto;
    width: auto;
    height: auto;
    transform: none;
}
#sp-professional-order .mh-order-card {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    transform: none !important;
}
#sp-professional-order .mh-order-card__head {
    position: static !important;
    inset: auto !important;
    z-index: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}
#sp-professional-order .mh-order-card__head::before,
#sp-professional-order .mh-order-card__head::after {
    display: none !important;
    content: none !important;
}

.mh-order-hero {
    padding: 44px 0 34px;
    color: var(--mh-text);
    background:
        radial-gradient(circle at 75% 25%, rgba(255, 61, 171, .18), transparent 33%),
        linear-gradient(120deg, #080617, #251048);
}
.mh-order-hero__inner { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.mh-order-hero h1 { margin:8px 0; color:#fff; font-size:clamp(30px, 4vw, 50px); }
.mh-order-hero p { max-width:760px; margin:0; color:#c6b9da; font-size:17px; }
.mh-order-eyebrow { color:var(--mh-cyan); font-size:12px; font-weight:800; letter-spacing:.14em; }
.mh-order-hero__icon { width:96px; height:96px; display:grid; place-items:center; border:1px solid var(--mh-border); border-radius:26px; background:rgba(91,35,151,.42); font-size:42px; color:var(--mh-cyan); }

.mh-service-tabs { background:#120a27; border-top:1px solid var(--mh-border); border-bottom:1px solid var(--mh-border); }
.mh-service-tabs__scroll { display:flex; gap:8px; overflow:auto; padding-top:12px; padding-bottom:12px; scrollbar-width:none; }
.mh-service-tabs a { flex:0 0 auto; padding:10px 16px; border:1px solid transparent; border-radius:999px; color:#afc1d8; font-weight:700; }
.mh-service-tabs a:hover,.mh-service-tabs a.is-active { color:#fff; border-color:#9f56ff; background:rgba(124,60,255,.20); }

.mh-order-page { padding:34px 0 70px; background:#f3f7fc; }
.mh-order-grid { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:24px; align-items:start; }
.mh-order-main { display:grid !important; gap:20px; }
.mh-order-card,.mh-summary-card { background:#fff; border:1px solid #dce6f2; border-radius:22px; box-shadow:0 18px 48px rgba(24,53,85,.08); }
.mh-order-card { padding:25px; }
.mh-order-card__head { display:flex !important; align-items:flex-start; gap:14px; margin-bottom:22px !important; }
.mh-order-card__head h2 { margin:0 0 5px; color:#13243c; font-size:22px; }
.mh-order-card__head p { margin:0; color:#71829a; }
.mh-step { flex:0 0 40px; height:40px; display:grid; place-items:center; border-radius:13px; color:#fff; background:linear-gradient(135deg,var(--mh-blue),var(--mh-cyan)); font-weight:900; }

.mh-target-box label { display:block; margin-bottom:8px; color:#1a2a42; font-weight:800; }
.mh-target-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; }
.mh-target-row input { width:100%; min-height:58px; padding:0 17px; border:1px solid #cfdaea; border-radius:14px; font-size:16px; outline:none; transition:.2s; }
.mh-target-row input:focus { border-color:var(--mh-blue); box-shadow:0 0 0 4px rgba(124,60,255,.12); }
.mh-target-row button,.mh-add-cart { border:0; border-radius:14px; color:#fff; background:linear-gradient(135deg,var(--mh-blue),var(--mh-cyan)); font-weight:800; }
.mh-target-row button { min-width:145px; padding:0 20px; }
.mh-target-row button:disabled,.mh-add-cart:disabled { cursor:not-allowed; opacity:.48; }
.mh-target-status { min-height:24px; margin-top:10px; color:#657890; font-weight:700; }
.mh-target-status.is-ok { color:#0f9768; }
.mh-target-status.is-warning { color:#a66500; }
.mh-target-status.is-error { color:#d73454; }
.mh-target-preview { margin-top:14px; display:flex; gap:14px; align-items:center; padding:14px; border:1px solid #d7e4f3; border-radius:16px; background:#f8fbff; }
.mh-target-preview[hidden] { display:none; }
.mh-target-preview__media { position:relative; width:76px; height:76px; flex:0 0 76px; overflow:hidden; border:1px solid #d5e2f0; border-radius:15px; background:#eaf1f8; }
.mh-target-preview img { position:relative; z-index:2; width:100%; height:100%; object-fit:cover; background:#eaf1f8; }
.mh-preview-fallback { position:absolute; inset:0; z-index:1; display:grid; place-items:center; background:linear-gradient(145deg,#241044,#7c3cff 55%,#ff4db8); }
.mh-preview-fallback svg { width:38px; height:38px; fill:none; stroke:#fff; stroke-width:1.6; filter:drop-shadow(0 5px 12px rgba(0,0,0,.22)); }
.mh-preview-fallback[hidden] { display:none; }
.mh-target-preview div { min-width:0; display:grid; gap:4px; }
.mh-target-preview strong,.mh-target-preview span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mh-target-preview strong { color:#162942; }
.mh-target-preview span,.mh-target-preview small { color:#6d7f96; }

.mh-package-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.mh-package-option { position:relative; min-height:132px; padding:16px; text-align:left; border:1px solid #d6e0ec; border-radius:16px; background:#fff; color:#1b2c44; transition:.18s; }
.mh-package-option:hover,.mh-package-option.is-selected { transform:translateY(-2px); border-color:var(--mh-blue); box-shadow:0 12px 25px rgba(124,60,255,.14); }
.mh-package-option strong,.mh-package-option span,.mh-package-option b { display:block; }
.mh-package-option strong { font-size:24px; }
.mh-package-option span { margin:4px 0 10px; color:#6c7d94; font-size:13px; }
.mh-package-option b { color:#7c3cff; font-size:17px; }
.mh-package-option em { position:absolute; top:11px; right:11px; padding:4px 7px; border-radius:999px; color:#087b58; background:#ddf8ee; font-size:10px; font-style:normal; font-weight:900; }

.mh-order-summary { position:sticky; top:20px; }
.mh-summary-card { overflow:hidden; padding:25px; color:var(--mh-text); background:
    radial-gradient(circle at 100% 0,rgba(255,61,171,.22),transparent 36%),
    linear-gradient(145deg,#0a0618,#27104b); border-color:var(--mh-border); }
.mh-summary-badge { display:inline-block; padding:7px 10px; border-radius:999px; color:var(--mh-cyan); background:rgba(67,215,255,.1); font-size:12px; font-weight:900; }
.mh-summary-card h2 { margin:14px 0 18px; color:#fff; font-size:24px; }
.mh-summary-card ul { display:grid; gap:11px; padding:0; margin:0 0 20px; list-style:none; }
.mh-summary-card li { display:flex; gap:9px; align-items:flex-start; color:#bfcee0; }
.mh-summary-card li i { color:var(--mh-cyan); font-size:18px; }
.mh-summary-price { display:grid; grid-template-columns:1fr auto; gap:4px 12px; padding:16px 0; border-top:1px solid var(--mh-border); border-bottom:1px solid var(--mh-border); }
.mh-summary-price span { grid-column:1/-1; color:#8ea4bf; font-size:12px; }
.mh-summary-price strong { color:#fff; font-size:18px; }
.mh-summary-price b { color:var(--mh-cyan); font-size:22px; }
.mh-add-cart { width:100%; min-height:58px; margin-top:18px; font-size:17px; }
.mh-add-note { margin:10px 0 0; color:#8da1ba; font-size:12px; text-align:center; }

.mh-trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.mh-trust-grid div { padding:18px; border:1px solid #dce6f2; border-radius:17px; background:#fff; }
.mh-trust-grid i,.mh-trust-grid strong,.mh-trust-grid span { display:block; }
.mh-trust-grid i { color:#7c3cff; font-size:25px; }
.mh-trust-grid strong { margin:8px 0 4px; color:#172a43; }
.mh-trust-grid span { color:#71829a; font-size:12px; }

.mh-cart-overlay { position:fixed; inset:0; z-index:100000; visibility:hidden; opacity:0; background:rgba(7,2,18,.72); transition:.2s; }
.mh-cart-overlay.is-open { visibility:visible; opacity:1; }
.mh-cart-drawer { position:absolute; top:0; right:0; width:min(440px,100%); height:100%; display:flex; flex-direction:column; padding:22px; color:#fbf7ff; background:linear-gradient(160deg,#0b0719,#22103e); box-shadow:-24px 0 70px rgba(0,0,0,.34); transform:translateX(100%); transition:.26s ease; }
.mh-cart-overlay.is-open .mh-cart-drawer { transform:none; }
.mh-cart-drawer__head {
    position:static !important;
    inset:auto !important;
    z-index:auto !important;
    width:auto !important;
    height:auto !important;
    min-height:0 !important;
    display:flex !important;
    align-items:center;
    justify-content:space-between;
    margin:0 !important;
    padding:0 0 18px !important;
    border:0 !important;
    border-bottom:1px solid var(--mh-border) !important;
    background:transparent !important;
    box-shadow:none !important;
    transform:none !important;
}
.mh-cart-drawer__head::before,.mh-cart-drawer__head::after { display:none !important; content:none !important; }
.mh-cart-drawer__head > div {
    position:static !important;
    inset:auto !important;
    display:block !important;
    min-width:0;
    width:auto !important;
    height:auto !important;
    transform:none !important;
}
.mh-cart-drawer__head small {
    position:static !important;
    inset:auto !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 0 5px !important;
    padding:0 !important;
    color:#b6a8cb;
    font-size:11px !important;
    line-height:1.25 !important;
    font-weight:800;
    letter-spacing:.08em;
    transform:none !important;
}
.mh-cart-drawer__head h2 {
    position:static !important;
    inset:auto !important;
    display:block !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    color:#fff;
    font-size:28px !important;
    line-height:1.1 !important;
    transform:none !important;
}
.mh-cart-close { width:40px; height:40px; border:1px solid var(--mh-border); border-radius:12px; color:#fff; background:transparent; }
.mh-cart-drawer__items { flex:1; overflow:auto; padding:14px 0; }
.mh-cart-drawer__item { display:grid; grid-template-columns:1fr auto; gap:10px; padding:15px 0; border-bottom:1px solid var(--mh-border); }
.mh-cart-drawer__item strong,.mh-cart-drawer__item span,.mh-cart-drawer__item small { display:block; }
.mh-cart-drawer__item span,.mh-cart-drawer__item small { color:#9cafc6; }
.mh-cart-drawer__item small { max-width:270px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mh-cart-drawer__remove {
    width:38px;
    height:38px;
    display:inline-grid;
    place-items:center;
    margin:8px 0 0 auto;
    padding:0;
    border:1px solid rgba(255,120,145,.34);
    border-radius:11px;
    color:#ff7891;
    background:rgba(255,120,145,.08);
    cursor:pointer;
}
.mh-cart-drawer__remove:hover { color:#fff; border-color:#ff7891; background:#d83c5d; }
.mh-cart-drawer__remove:disabled { cursor:wait; opacity:.5; }
.mh-cart-drawer__foot {
    position:static !important;
    inset:auto !important;
    z-index:auto !important;
    width:auto !important;
    height:auto !important;
    min-height:0 !important;
    display:block !important;
    margin:0 !important;
    padding:16px 0 0 !important;
    border:0 !important;
    border-top:1px solid var(--mh-border) !important;
    background:transparent !important;
    box-shadow:none !important;
    transform:none !important;
}
.mh-cart-drawer__foot::before,.mh-cart-drawer__foot::after { display:none !important; content:none !important; }
.mh-cart-drawer__total { display:flex; justify-content:space-between; margin-bottom:14px; font-size:20px; font-weight:900; }
.mh-cart-drawer__actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.mh-cart-drawer__actions a,.mh-cart-drawer__actions button { min-height:50px; display:grid; place-items:center; border:1px solid var(--mh-blue); border-radius:13px; color:#fff; background:transparent; font-weight:800; }
.mh-cart-drawer__actions a { border-color:transparent; background:linear-gradient(135deg,var(--mh-blue),var(--mh-cyan)); }
.mh-cart-empty { padding:50px 15px; color:#9eb1c9; text-align:center; }
.mh-payment-continue { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; padding:14px 18px; border:1px solid #d8e4f1; border-radius:16px; background:#fff; }
.mh-payment-continue strong { color:#172a43; }
.mh-payment-continue a { padding:10px 14px; border-radius:11px; color:#fff; background:#7c3cff; font-weight:800; }

@media(max-width:991px) {
    .mh-order-grid { grid-template-columns:1fr; }
    .mh-order-summary { position:static; }
}
@media(max-width:680px) {
    .mh-order-hero { padding:30px 0; }
    .mh-order-hero__icon { display:none; }
    .mh-order-page { padding-top:18px; }
    .mh-order-card,.mh-summary-card { border-radius:17px; }
    .mh-order-card { padding:18px; }
    .mh-target-row { grid-template-columns:1fr; }
    .mh-target-row button { min-height:50px; }
    .mh-package-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .mh-package-option { min-height:120px; padding:13px; }
    .mh-trust-grid { grid-template-columns:1fr; }
    .mh-cart-drawer__actions { grid-template-columns:1fr; }
}