/* Hostlar header mega menu (client panel, Basic theme). Markup follows the Datawise mega menu on hostlar.com.tr. */
.site-header,.site-drawer{--hmm-light:color-mix(in srgb,var(--basic-primary) 7%,var(--basic-surface-bg));--hmm-card-shadow:0 .65rem 1.6rem rgba(2,60,108,.13);--hmm-accent:#ffb020}

/* top bar */
.site-nav .hmm-li{position:static}
.site-nav .hmm-li>.nav-link{position:relative}
.site-nav .hmm-li.hmm-open>.nav-link{background-color:var(--basic-primary-subtle);color:var(--basic-primary-text)}
.site-nav .hmm-li>.nav-link .nav-chevron{transition:transform .2s ease}
.site-nav .hmm-li.hmm-open>.nav-link .nav-chevron{transform:rotate(180deg)}
.site-nav .nav-link{position:relative}
.hmm-tag{position:absolute;inset-block-start:-.62rem;inset-inline-start:50%;transform:translateX(-50%);z-index:1;padding:0 .4rem;block-size:.95rem;line-height:.95rem;border-radius:.25rem;background:var(--hmm-tag,var(--basic-primary));color:#fff;font-size:.56rem;font-weight:600;white-space:nowrap;pointer-events:none}
.hmm-tag::after{content:"";position:absolute;inset-block-start:100%;inset-inline-start:50%;transform:translateX(-50%);border:3px solid transparent;border-block-start-color:var(--hmm-tag,var(--basic-primary))}

/* desktop panel */
.hmm-panel{position:absolute;inset-inline:0;inset-block-start:100%;display:none;max-block-size:calc(100vh - 5rem);overflow-y:auto;padding:1.25rem 0 1.5rem;background:var(--basic-surface-bg);border-block-start:1px solid var(--basic-border-color);border-radius:0 0 1rem 1rem;box-shadow:0 1.25rem 2.5rem rgba(2,24,48,.16);cursor:default}
.hmm-li.hmm-open>.hmm-panel{display:block;animation:dropdownOpen .18s ease}
@media (prefers-reduced-motion:reduce){.hmm-li.hmm-open>.hmm-panel{animation:none}}

/* mega content */
.hmm-mega{list-style:none;margin:0;padding:0;text-align:start}
.hmm-mega>li.row{--bs-gutter-x:1rem;--bs-gutter-y:1rem}
.hmm-mega .row .row{--bs-gutter-x:.75rem;--bs-gutter-y:.75rem}
.hmm-mega .menu-item{position:relative;block-size:100%}
.hmm-mega .menu-item:not(.menu-list):not(.featured-column)>a:first-of-type{display:flex;align-items:center;gap:.75rem;block-size:100%;min-block-size:4.4rem;padding:.65rem .75rem;border:1px solid var(--basic-border-color);border-radius:.75rem;background:var(--basic-surface-bg);color:var(--basic-heading-color);text-decoration:none;transition:box-shadow .2s ease,border-color .2s ease}
.hmm-mega .menu-item:not(.menu-list):not(.featured-column)>a:first-of-type:hover,.hmm-mega .menu-item:not(.menu-list):not(.featured-column)>a:first-of-type:focus-visible{border-color:transparent;box-shadow:var(--hmm-card-shadow)}
.hmm-mega .menu-item>a>i{flex:0 0 3rem;inline-size:3rem;block-size:3rem;line-height:3rem;text-align:center;font-size:1.35rem;border-radius:.5rem;background:var(--hmm-light);color:var(--basic-primary-text);transition:background-color .25s ease,color .25s ease}
.hmm-mega .menu-item>a:hover>i{background:var(--basic-primary);color:#fff}
.hmm-mega .menu-title{display:block;min-inline-size:0;font-size:.72rem;line-height:1.05rem;color:var(--basic-muted-color)}
.hmm-mega .menu-title>strong.d-block,.hmm-mega .menu-title>.h5{display:block;margin:0 0 .15rem;font-size:.84rem;font-weight:700;line-height:1.2;color:var(--basic-heading-color)}
.hmm-mega .menu-title strong:not(.d-block){color:var(--basic-primary-text)}
.hmm-mega .menu-item>a:hover .menu-title>strong.d-block,.hmm-mega .menu-item>a:hover .menu-title>.h5{color:var(--basic-primary-text)}
.hmm-mega .menu-item.has-buy:not(.menu-list):not(.featured-column)>a:first-of-type{padding-inline-end:5rem}
.hmm-mega .menu-buy{position:absolute;inset-inline-end:.65rem;inset-block-start:50%;transform:translateY(-50%);padding:.25rem .6rem;border-radius:2rem;background:var(--basic-primary);color:#fff;font-size:.68rem;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;transition:background-color .2s ease,box-shadow .2s ease}
.hmm-mega .menu-buy:hover,.hmm-mega .menu-buy:focus-visible{background:var(--basic-primary-hover,var(--basic-primary));color:#fff;box-shadow:0 .25rem .75rem rgba(2,60,108,.3)}
.hmm-mega .fon-ribbon{position:absolute;inset-block-start:-.55rem;inset-inline-end:.75rem;z-index:1;padding:.1rem .45rem;border-radius:.3rem;background:var(--hmm-accent);color:#1f2937;font-size:.6rem;font-weight:700;line-height:1rem;white-space:nowrap}
.hmm-mega .menu-item.has-buy .fon-ribbon{inset-inline-end:5.5rem}

/* link lists (Kurumsal) */
.hmm-mega .menu-list{padding:1rem;border:1px solid var(--basic-border-color);border-radius:.75rem;background:var(--basic-surface-bg)}
.hmm-mega .menu-list>.h4{position:relative;display:flex;align-items:center;gap:.4rem;margin:.15rem 0 .5rem;padding-block-end:.6rem;font-size:.95rem;font-weight:700;color:var(--basic-heading-color)}
.hmm-mega .menu-list>.h4 i{color:var(--basic-primary-text)}
.hmm-mega .menu-list>.h4::before,.hmm-mega .menu-list>.h4::after{content:"";position:absolute;inset-inline-start:0;inset-block-end:0;inline-size:100%;block-size:1px;background:var(--basic-border-color)}
.hmm-mega .menu-list>.h4::after{inline-size:3rem;block-size:3px;inset-block-end:-1px;background:var(--basic-primary)}
.hmm-mega .menu-list>a{position:relative;display:flex;align-items:center;min-block-size:2rem;padding-inline-start:.9rem;font-size:.82rem;color:var(--basic-body-color);text-decoration:none;transition:color .2s ease}
.hmm-mega .menu-list>a+a{border-block-start:1px solid var(--basic-border-color)}
.hmm-mega .menu-list>a::before{content:"\f105";position:absolute;inset-inline-start:0;font:var(--fa-font-solid);font-size:.6rem;transition:transform .2s ease}
.hmm-mega .menu-list>a:hover{color:var(--basic-primary-text)}
.hmm-mega .menu-list>a:hover::before{transform:translateX(3px)}

/* featured boxes */
.hmm-mega .featured-column{display:flex;flex-direction:column;justify-content:center;gap:.9rem;padding:1.25rem 1.5rem;border-radius:.75rem;background-color:var(--basic-primary);background-repeat:no-repeat;background-position:right bottom;background-size:7rem;color:#fff}
.hmm-mega .menu-box{display:flex;align-items:center;gap:.75rem;max-inline-size:13rem}
.hmm-mega .menu-box>i{flex:0 0 2.75rem;block-size:2.75rem;line-height:2.75rem;text-align:center;font-size:1.2rem;border-radius:.5rem;background:rgba(255,255,255,.15);color:#fff}
.hmm-mega .menu-box .menu-title{color:rgba(255,255,255,.8)}
.hmm-mega .menu-box .menu-title .h5{display:block;margin:0;font-size:.84rem;font-weight:700;color:#fff;text-decoration:none}
.hmm-mega .menu-box .menu-title a.h5:hover{text-decoration:underline}
.hmm-mega .featured-row{display:flex;align-items:center;gap:1rem;block-size:100%;padding:1rem 1.5rem;border-radius:.75rem}
.hmm-mega .featured-row>*{flex:1 1 50%;min-inline-size:0}
.hmm-mega .featured-row img{display:block;max-inline-size:100%;block-size:auto}
.hmm-mega .menu-featured-title{display:block;font-size:1.15rem;font-weight:700;line-height:1.25}
.hmm-mega .menu-featured-desc{margin:.75rem 0;font-size:.75rem;color:var(--basic-body-color)}
.hmm-mega .menu-featured-desc i{margin-inline-end:.25rem}
.hmm-mega>li.menu-featured{display:block;margin-block-start:1rem;padding:1rem 1.25rem;border-radius:.75rem;background:var(--basic-primary);color:#fff;font-size:.8rem;line-height:1.3;text-align:center}
.hmm-mega>li.menu-featured>i{margin-inline-end:.4rem}
.hmm-mega>li.menu-featured strong{color:var(--hmm-accent)}

/* Datawise colour helpers used in the content */
.hmm-mega .default-bg{background:var(--hmm-light)!important;color:var(--basic-primary-text)!important}
.hmm-mega .primary-bg{background:color-mix(in srgb,var(--basic-primary) 12%,var(--basic-surface-bg))!important;color:var(--basic-primary-text)!important}
.hmm-mega .danger-bg{background:rgba(220,53,69,.12)!important;color:#dc3545!important}
.hmm-mega .success-bg{background:rgba(25,135,84,.12)!important;color:#198754!important}
.hmm-mega .purple-bg{background:rgba(111,66,193,.12)!important;color:#6f42c1!important}
.hmm-mega .pink-bg{background:rgba(214,51,132,.12)!important;color:#d63384!important}
.hmm-mega .menu-item>a:hover>i.default-hover-bg,.hmm-mega .menu-item>a:hover>i.primary-hover-bg{background:var(--basic-primary)!important;color:#fff!important}
.hmm-mega .menu-item>a:hover>i.danger-hover-bg{background:#dc3545!important;color:#fff!important}
.hmm-mega .menu-item>a:hover>i.success-hover-bg{background:#198754!important;color:#fff!important}
.hmm-mega .menu-item>a:hover>i.purple-hover-bg{background:#6f42c1!important;color:#fff!important}
.hmm-mega .menu-item>a:hover>i.pink-hover-bg{background:#d63384!important;color:#fff!important}
.hmm-mega .btn-purple{--bs-btn-color:#fff;--bs-btn-bg:#6f42c1;--bs-btn-border-color:#6f42c1;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#5e38a4;--bs-btn-hover-border-color:#59359a;--bs-btn-active-bg:#59359a;--bs-btn-active-border-color:#533291;--bs-btn-active-color:#fff}
[data-bs-theme=dark] .hmm-mega .menu-featured-desc{color:var(--basic-body-color)}

/* mobile drawer */
.hmm-drawer-toggle .hmm-tag{position:static;transform:none;margin-inline-start:.35rem}
.hmm-drawer-toggle .hmm-tag::after{display:none}
.hmm-drawer-toggle[aria-expanded=true]{background-color:var(--basic-primary-subtle);color:var(--basic-primary-text)}
.hmm-drawer-toggle .drawer-caret{transform:none}
.hmm-drawer-toggle>.drawer-caret.bi:first-child{font-size:.65rem;color:inherit}
.hmm-drawer-toggle[aria-expanded=true] .drawer-caret{transform:rotate(180deg)}
.hmm-drawer-panel{padding:.35rem 0 .75rem}
.hmm-drawer-panel[hidden]{display:none}
.hmm-drawer-all{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:0 0 .6rem;padding:.5rem .75rem;border-radius:.6rem;background:var(--basic-primary-subtle);color:var(--basic-primary-text);font-size:.82rem;font-weight:600;text-decoration:none}
.hmm-drawer-panel .hmm-mega>li.row{--bs-gutter-x:0;--bs-gutter-y:.5rem;margin-inline:0}
.hmm-drawer-panel .hmm-mega .row .row{--bs-gutter-x:0;--bs-gutter-y:.5rem;margin-inline:0}
.hmm-drawer-panel .hmm-mega .row>*{flex:0 0 100%;inline-size:100%;max-inline-size:100%}
.hmm-drawer-panel .hmm-mega .menu-item:not(.menu-list):not(.featured-column)>a:first-of-type{min-block-size:0;padding:.5rem .6rem;gap:.6rem}
.hmm-drawer-panel .hmm-mega .menu-item.has-buy:not(.menu-list):not(.featured-column)>a:first-of-type{padding-inline-end:4.5rem}
.hmm-drawer-panel .hmm-mega .menu-item>a>i{flex-basis:2.25rem;inline-size:2.25rem;block-size:2.25rem;line-height:2.25rem;font-size:1rem}
.hmm-drawer-panel .hmm-mega .menu-title{font-size:.7rem;line-height:1rem}
.hmm-drawer-panel .hmm-mega .menu-buy{inset-inline-end:.5rem}
.hmm-drawer-panel .hmm-mega .featured-row{padding:.85rem 1rem}
.hmm-drawer-panel .hmm-mega .featured-row>*:last-child:has(img){display:none}
.hmm-drawer-panel .hmm-mega .featured-column{background-image:none!important;padding:1rem}
.hmm-drawer-panel .hmm-mega>li.menu-featured{margin-block-start:.5rem;padding:.75rem;font-size:.75rem}
.hmm-drawer-panel .hmm-mega .menu-list{padding:.75rem}