/* =========================================================
   LEGACY SERVICES - TEMPORARY
   Desktop only
   Legacy = Dark mode only
   ========================================================= */

@media (min-width: 768px) {

    /* =====================================================
       MAIN LEGACY AREA
       ===================================================== */

    .legacy-ui .pricelistlogindo {
    --legacy-width: 1340px;

    display: block !important;

    width: 100% !important;
    max-width: none !important;
    min-height: 100vh !important;

    margin: 0 !important;

    padding-top: 34px !important;
    padding-bottom: 50px !important;

    background: #080D1A !important;

    box-sizing: border-box !important;
}


    /* =====================================================
       HIDE MODERN SERVICES TITLE
       ===================================================== */

    .legacy-ui .dashbig--title {
        display: none !important;
    }


    /* =====================================================
       COMMON WIDTH
       FILTER + TABLE
       ===================================================== */

    .legacy-ui .akarac--tabs.servismobiltabs,
    .legacy-ui .dashpricelist {
        display: block !important;
        float: none !important;

        width: var(--legacy-width) !important;
        max-width: calc(100% - 120px) !important;

        margin-left: auto !important;
        margin-right: auto !important;

        padding-left: 0 !important;
        padding-right: 0 !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       FILTER BAR
       ===================================================== */

    .legacy-ui .akarac--tabs.servismobiltabs {
        margin-top: 0 !important;
        margin-bottom: 10px !important;
        padding: 0 !important;
    }

    .legacy-ui .akarac--tabs.servismobiltabs .rightbar {
        display: flex !important;
        position: relative !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        gap: 0 !important;

        justify-content: flex-start !important;
        align-items: center !important;
    }


    /* Platform filter hidden in Legacy */

    .legacy-ui .platform-filter {
        display: none !important;
    }


    /* =====================================================
       CATEGORY FILTER
       ===================================================== */

    .legacy-ui
    .rightbar
    > .filterbtnlist:not(.platform-filter):not(.currency-filter) {
        display: block !important;

        order: 1 !important;

        margin: 0 !important;
        padding: 0 !important;

        flex: 0 0 auto !important;

        position: relative !important;
        left: 0 !important;
        right: auto !important;
    }

    .legacy-ui
    .rightbar
    > .filterbtnlist:not(.platform-filter):not(.currency-filter)
    .filtrelebtn-new {
        position: relative !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 62px !important;
        min-width: 62px !important;
        max-width: 62px !important;

        height: 50px !important;
        min-height: 50px !important;

        padding: 0 !important;

        border: 0 !important;
        border-radius: 4px !important;

        background: #ff2346 !important;
        color: #ffffff !important;

        box-shadow: none !important;
    }


    /* Category text hidden */

    .legacy-ui #customActiveCategory {
        display: none !important;
    }


    /* Filter icon */

    .legacy-ui
    .rightbar
    > .filterbtnlist:not(.platform-filter):not(.currency-filter)
    .filtrelebtn-new > svg {
        width: 18px !important;
        height: 18px !important;

        margin: 0 !important;
    }

    .legacy-ui
    .rightbar
    > .filterbtnlist:not(.platform-filter):not(.currency-filter)
    .filtrelebtn-new > svg path {
        stroke: #ffffff !important;
    }

    .legacy-ui
    .rightbar
    > .filterbtnlist:not(.platform-filter):not(.currency-filter)
    .filtrelebtn-new i {
        color: #ffffff !important;
    }


    /* Dropdown arrow */

    .legacy-ui
    .rightbar
    > .filterbtnlist:not(.platform-filter):not(.currency-filter)
    .filtrelebtn-new.dropdown-toggle::after {
        width: 8px !important;
        height: 12px !important;

        right: 7px !important;
        top: 19px !important;

        filter: brightness(0) invert(1) !important;

        opacity: .85 !important;
    }


    /* =====================================================
       SEARCH
       ===================================================== */

    .legacy-ui .rightbar .searchbln {
        order: 2 !important;

        margin-left: auto !important;
        margin-right: 0 !important;
        padding: 0 !important;

        width: 280px !important;
        min-width: 280px !important;
        max-width: 280px !important;

        flex: 0 0 280px !important;

        position: relative !important;
        left: auto !important;
        right: 0 !important;
    }

    .legacy-ui .searchbln .input {
        position: relative !important;

        width: 100% !important;
        height: 50px !important;

        border: 0 !important;
        border-radius: 4px !important;

        background: #ffffff !important;

        overflow: hidden !important;
        box-shadow: none !important;
    }

    .legacy-ui .searchbln input {
        width: 100% !important;
        height: 50px !important;

        padding: 0 58px 0 18px !important;

        border: 0 !important;
        border-radius: 4px !important;

        background: #ffffff !important;
        color: #333333 !important;

        font-size: 13px !important;

        box-shadow: none !important;
        outline: none !important;
    }

    .legacy-ui .searchbln input::placeholder {
        color: #c3beb5 !important;
    }

    .legacy-ui .searchbln svg {
        position: absolute !important;

        left: auto !important;
        right: 0 !important;
        top: 0 !important;

        width: 52px !important;
        height: 50px !important;

        padding: 15px !important;

        background: #ff2346 !important;

        box-sizing: border-box !important;
        cursor: pointer !important;
    }

    .legacy-ui .searchbln svg path {
        stroke: #ffffff !important;
    }


    /* =====================================================
       CATEGORY DROPDOWN
       ===================================================== */

    .legacy-ui .filterbtnlist .dropdown-menu {
        margin-top: 5px !important;

        border: 1px solid #d7d1c8 !important;
        border-radius: 3px !important;

        background: #f7f5ef !important;

        box-shadow: 0 5px 15px rgba(0, 0, 0, .18) !important;
    }

    .legacy-ui .filterbtnlist .dropdown-menu li,
    .legacy-ui .filterbtnlist .dropdown-menu li a,
    .legacy-ui .filterbtnlist .dropdown-menu li a span,
    .legacy-ui #filterDropdownMenu li,
    .legacy-ui #filterDropdownMenu li a,
    .legacy-ui #filterDropdownMenu li a span {
        color: #353535 !important;

        opacity: 1 !important;
        visibility: visible !important;
    }

    .legacy-ui .filterbtnlist .dropdown-menu li a {
        border-radius: 0 !important;
    }

    .legacy-ui .filterbtnlist .dropdown-menu li a:hover,
    .legacy-ui #filterDropdownMenu li a:hover {
        background: #eae6de !important;
        color: #353535 !important;
    }

    .legacy-ui
    #filterDropdownMenu
    a[data-custom-category-id="favorites"],
    .legacy-ui
    #filterDropdownMenu
    a[data-custom-category-id="favorites"] span {
        color: #353535 !important;

        opacity: 1 !important;
    }


    /* =====================================================
       MAIN SERVICE TABLE
       ===================================================== */

    .legacy-ui .dashpricelist {
        margin-top: 0 !important;

        padding: 0 !important;

        background: transparent !important;

        border: 0 !important;
        border-radius: 0 !important;

        box-shadow: none !important;

        overflow: visible !important;
    }

    .legacy-ui .dashpricelist > .list {
        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;

        padding: 20px 22px 10px !important;

        background: #f7f5ef !important;

        border: 0 !important;
        border-radius: 4px !important;

        box-sizing: border-box !important;

        overflow: hidden !important;
    }

    .legacy-ui #priceListAccordion {
        width: 100% !important;

        margin: 0 !important;

        background: transparent !important;
    }


    /* =====================================================
       ACCORDION DISABLED IN LEGACY
       ALL CATEGORIES ALWAYS OPEN
       ===================================================== */

    .legacy-ui .accordion-item {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;

        box-shadow: none !important;
    }

    .legacy-ui .accordion-collapse,
    .legacy-ui .accordion-collapse.collapse,
    .legacy-ui .accordion-collapse.collapsing {
        display: block !important;

        height: auto !important;

        visibility: visible !important;

        overflow: visible !important;
    }

    .legacy-ui .accordion-body {
        display: block !important;

        width: 100% !important;

        padding: 0 !important;

        background: transparent !important;
    }


    /* =====================================================
       CATEGORY ROW
       ===================================================== */

    .legacy-ui .accordion-header {
        width: 100% !important;

        margin: 0 !important;
    }

    .legacy-ui .accordion-button,
    .legacy-ui .accordion-button.collapsed,
    .legacy-ui .accordion-button:not(.collapsed) {
        display: flex !important;
        align-items: center !important;

        width: 100% !important;

        min-height: 42px !important;

        padding: 8px !important;

        border: 0 !important;
        border-bottom: 1px solid #ded8cf !important;
        border-radius: 0 !important;

        background: #f7f5ef !important;

        color: #353535 !important;

        font-size: 13px !important;
        font-weight: 700 !important;

        box-shadow: none !important;

        pointer-events: none !important;
    }

    .legacy-ui .accordion-button::after {
        display: none !important;
    }

    .legacy-ui .accordion-button .serivsname {
        display: flex !important;
        align-items: center !important;

        gap: 5px !important;

        color: #353535 !important;
    }

    .legacy-ui .accordion-button .serivsname > span {
        color: #353535 !important;

        font-size: 13px !important;
        font-weight: 700 !important;
    }

    .legacy-ui .accordion-button .serivsname img {
        max-width: 22px !important;
        max-height: 22px !important;
    }


    /* =====================================================
       TABLE HEADER
       Only first header shown
       ===================================================== */

    .legacy-ui .service-header {
        display: none !important;
    }

    .legacy-ui .accordion-item:first-child .service-header {
        display: grid !important;
    }
    
    /* =====================================================
   FIRST TABLE HEADER BEFORE FIRST CATEGORY
   ===================================================== */

.legacy-ui .accordion-item:first-child {
    display: flex !important;
    flex-direction: column !important;
}

.legacy-ui .accordion-item:first-child > .accordion-header {
    order: 2 !important;
}

.legacy-ui .accordion-item:first-child > .accordion-collapse,
.legacy-ui .accordion-item:first-child > .accordion-collapse > .accordion-body,
.legacy-ui .accordion-item:first-child > .accordion-collapse > .accordion-body > .servis_tabloliste {
    display: contents !important;
}

.legacy-ui .accordion-item:first-child .service-header {
    order: 1 !important;
}

.legacy-ui .accordion-item:first-child .service-row {
    order: 3 !important;
}


    /* =====================================================
       GRID COLUMNS
       ===================================================== */

    .legacy-ui .servistablobaslik,
    .legacy-ui .servistabloitem.service-row {
        grid-template-columns:
            42px
            64px
            minmax(350px, 1fr)
            125px
            85px
            115px
            165px
            65px !important;

        column-gap: 0 !important;

        width: 100% !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       TABLE HEADER STYLE
       ===================================================== */

    .legacy-ui .servistablobaslik {
        min-height: 42px !important;

        padding: 0 !important;

        border: 0 !important;
        border-bottom: 1px solid #d4cec5 !important;

        background: #f7f5ef !important;

        color: #353535 !important;
    }

    .legacy-ui .servistablobaslik > span {
        display: flex !important;
        align-items: center !important;

        min-height: 42px !important;

        padding: 0 6px !important;

        color: #353535 !important;

        font-size: 12px !important;
        font-weight: 700 !important;
    }


    /* Price sorting hidden in Legacy */

    .legacy-ui .servistablobaslik .sort-controls {
        visibility: hidden !important;
    }


    /* =====================================================
       SERVICE ROWS
       ===================================================== */

    .legacy-ui .servistabloitem.service-row {
        display: grid !important;
        align-items: center !important;

        min-height: 52px !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
        border-bottom: 1px solid #ded8cf !important;
        border-radius: 0 !important;

        background: #f7f5ef !important;

        color: #353535 !important;

        box-shadow: none !important;
    }

    .legacy-ui .servistabloitem.service-row:hover {
        background: #f2efe8 !important;
    }

    .legacy-ui .servistabloitem.service-row > span {
        display: flex !important;
        align-items: center !important;

        width: auto !important;
        min-width: 0 !important;

        min-height: 52px !important;

        padding: 0 6px !important;
        margin: 0 !important;

        color: #353535 !important;

        font-size: 12px !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       ACTIONS
       Favorite only
       ===================================================== */

    .legacy-ui .service-actions-cell {
        justify-content: center !important;
    }

    .legacy-ui .service-actions {
        display: flex !important;

        justify-content: center !important;
        align-items: center !important;

        width: 100% !important;

        gap: 0 !important;
    }


    /* Notification hidden */

    .legacy-ui .service-notify {
        display: none !important;
    }


    /* Favorite */

    .legacy-ui .service-actions-cell .service-favorite {
        display: inline-flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: 24px !important;
        min-width: 24px !important;
        max-width: 24px !important;

        height: 24px !important;

        flex: 0 0 24px !important;

        padding: 0 !important;

        border: 0 !important;
        border-radius: 0 !important;

        background-color: transparent !important;
        background-size: 16px 16px !important;

        box-shadow: none !important;
    }

   /* Legacy favorite */

body.dark.legacy-ui .service-favorite,
html.legacy-ui body.dark .service-favorite {
    background-image:
        url("https://storage.perfectcdn.com/449b2e/caxiyfjbhrr2drmx.svg")
        !important;

    background-color: transparent !important;
    border: 0 !important;
}

body.dark.legacy-ui .service-favorite::before,
html.legacy-ui body.dark .service-favorite::before {
    display: none !important;
}

body.dark.legacy-ui .service-favorite.favorite-active,
html.legacy-ui body.dark .service-favorite.favorite-active {
    background-image:
        url("https://storage.perfectcdn.com/449b2e/55eqq3t49fff6gub.png")
        !important;

    background-color: transparent !important;
    border: 0 !important;
}

body.dark.legacy-ui .service-favorite.favorite-active::before,
html.legacy-ui body.dark .service-favorite.favorite-active::before {
    display: none !important;
}

    /* =====================================================
       ID
       ===================================================== */

    .legacy-ui .service-id-cell {
        justify-content: flex-start !important;
    }

    .legacy-ui .service-id-cell .idtet {
        display: block !important;

        width: auto !important;
        min-width: 0 !important;

        padding: 0 !important;
        margin: 0 !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;

        color: #353535 !important;

        font-size: 12px !important;
        font-weight: 400 !important;
    }


    /* =====================================================
       SERVICE NAME
       ===================================================== */

    .legacy-ui .service-name-cell {
        display: block !important;

        width: 100% !important;

        padding-left: 6px !important;
        padding-right: 10px !important;
    }

    .legacy-ui .service-name-cell .serivsname {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* Row platform icon hidden */

    .legacy-ui .service-name-cell .service-category-marker {
        display: none !important;
    }

    .legacy-ui .service-name-cell .servistext,
    .legacy-ui .service-name-cell .servistext > span {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        color: #353535 !important;

        font-size: 12px !important;
        font-weight: 400 !important;

        text-align: left !important;
    }


    /* =====================================================
       RATE
       Cart hidden
       ===================================================== */

    .legacy-ui .service-rate-cell {
        display: flex !important;

        align-items: center !important;
        justify-content: flex-start !important;

        gap: 0 !important;
    }

    .legacy-ui .service-buy {
        display: none !important;
    }

    .legacy-ui .service-rate {
        display: block !important;

        width: auto !important;

        padding: 0 !important;
        margin: 0 !important;

        color: #353535 !important;

        font-size: 12px !important;
        font-weight: 400 !important;
    }
.legacy-ui .service-rate-cell {
    gap: 7px !important;
}

.legacy-ui .service-rate-cell .service-buy {
    display: inline-flex !important;

    width: 18px !important;
    min-width: 18px !important;
    max-width: 18px !important;

    height: 18px !important;

    flex: 0 0 18px !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background-color: transparent !important;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23d71935' d='M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45C5.09 14.32 5 14.65 5 15c0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03L20.88 5H6.21l-.94-2H1zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E")
        !important;

    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 14px 14px !important;

    box-shadow: none !important;
}
  
  .legacy-ui .service-rate-cell .service-buy {
    position: relative !important;
    top: -10px !important;
}

    /* =====================================================
       MIN / MAX
       ===================================================== */

    .legacy-ui .service-min-cell,
    .legacy-ui .service-max-cell {
        justify-content: flex-start !important;
    }

    .legacy-ui .service-min,
    .legacy-ui .service-max {
        padding: 0 !important;
        margin: 0 !important;

        color: #353535 !important;

        font-size: 12px !important;
        font-weight: 400 !important;
    }


    /* =====================================================
       AVERAGE TIME
       ===================================================== */

    .legacy-ui .service-time-cell {
        justify-content: flex-start !important;

        white-space: nowrap !important;
    }

    .legacy-ui .teslimsure {
        display: inline !important;

        width: auto !important;

        min-height: 0 !important;

        padding: 0 !important;
        margin: 0 !important;

        border: 0 !important;
        border-radius: 0 !important;

        background: transparent !important;

        color: #353535 !important;

        font-size: 12px !important;
        font-weight: 400 !important;

        box-shadow: none !important;
    }


    /* =====================================================
       VIEW BUTTON
       ===================================================== */

    .legacy-ui .service-detail-cell {
        display: flex !important;

        align-items: center !important;
        justify-content: center !important;
    }

    .legacy-ui .service-detail-cell .service-detail {
        display: inline-flex !important;

        align-items: center !important;
        justify-content: center !important;

        width: auto !important;

        min-width: 45px !important;
        max-width: none !important;

        height: 27px !important;
        min-height: 27px !important;

        padding: 0 7px !important;

        border: 0 !important;
        border-radius: 2px !important;

        background: #ff2346 !important;
        color: #ffffff !important;

        font-size: 11px !important;
        font-weight: 700 !important;

        line-height: 27px !important;
        text-transform: uppercase !important;

        box-shadow: none !important;
    }

    .legacy-ui .service-detail-cell .service-detail:hover {
        background: #e91d3d !important;
        color: #ffffff !important;
    }


    /* =====================================================
       DARK.CSS OVERRIDES
       Legacy always runs inside Dark mode,
       but table itself keeps the old light appearance.
       ===================================================== */

    body.dark.legacy-ui .pricelistlogindo {
    background: #080D1A !important;
}

    body.dark .legacy-ui .dashpricelist > .list,
    body.dark .legacy-ui .accordion,
    body.dark .legacy-ui .accordion-item,
    body.dark .legacy-ui .accordion-body,
    body.dark .legacy-ui .accordion-button,
    body.dark .legacy-ui .servis_tabloliste,
    body.dark .legacy-ui .servistablobaslik,
    body.dark .legacy-ui .servistabloitem.service-row {
        color: #353535 !important;
    }

    body.dark .legacy-ui .dashpricelist > .list,
    body.dark .legacy-ui .servistablobaslik,
    body.dark .legacy-ui .servistabloitem.service-row,
    body.dark .legacy-ui .accordion-button {
        background: #f7f5ef !important;
    }

    body.dark .legacy-ui .accordion-item,
    body.dark .legacy-ui .accordion,
    body.dark .legacy-ui .accordion-body {
        background: transparent !important;
    }

    body.dark .legacy-ui .accordion-button *,
    body.dark .legacy-ui .servistablobaslik *,
    body.dark .legacy-ui .servistabloitem.service-row *,
    body.dark .legacy-ui .service-rate,
    body.dark .legacy-ui .service-min,
    body.dark .legacy-ui .service-max,
    body.dark .legacy-ui .teslimsure {
        color: #353535 !important;
    }

    body.dark .legacy-ui .service-detail-cell .service-detail {
        color: #ffffff !important;
    }
  
  .legacy-ui .service-id-cell .idtet,
.legacy-ui .service-name-cell .servistext,
.legacy-ui .service-name-cell .servistext > span,
.legacy-ui .service-rate,
.legacy-ui .service-min,
.legacy-ui .service-max,
.legacy-ui .teslimsure {
    font-weight: 500 !important;
}
  
}