﻿/* DigiMenu — Müşteri menü sayfası (admin tema paleti ile uyumlu) */

:root {
    --dm-menu-bg: #ecfeff;
    --dm-menu-bg-soft: #f0fdfa;
    --dm-surface: #ffffff;
    --dm-text: #134e4a;
    --dm-text-muted: #5b7c78;
    --dm-border: #a7f3d0;
    --dm-primary: var(--logo-color, #0d9488);
    --dm-primary-dark: color-mix(in srgb, var(--dm-primary) 82%, #0f766e);
    --dm-accent: var(--color-primary, #14b8a6);
    --dm-radius: 20px;
    --dm-radius-md: 16px;
    --dm-radius-sm: 12px;
    --dm-shadow: 0 4px 24px color-mix(in srgb, var(--dm-primary) 10%, transparent);
    --dm-shadow-card: 0 2px 12px color-mix(in srgb, var(--dm-primary) 8%, transparent);
    --dm-shadow-lift: 0 12px 28px color-mix(in srgb, var(--dm-primary) 14%, transparent);
    --dm-surface-muted: #f4fbfb;
    --dm-primary-soft: color-mix(in srgb, var(--dm-primary) 12%, #fff);
    --dm-on-primary: #ffffff;
    --dm-motion: 0.22s cubic-bezier(0.33, 1, 0.68, 1);
    --dm-font: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;
}

/* Admin tema paleti (lazy-load theme-*.css) → menü tokenları */
html[data-theme] {
    --dm-menu-bg: hsl(var(--nextui-background) / 1);
    --dm-menu-bg-soft: hsl(var(--nextui-content1) / 1);
    --dm-surface: hsl(var(--nextui-default-50) / 1);
    --dm-surface-muted: hsl(var(--nextui-content2) / 1);
    --dm-text: hsl(var(--nextui-foreground) / 1);
    --dm-text-muted: hsl(var(--nextui-foreground-400) / 1);
    --dm-border: hsl(var(--nextui-default-200) / 1);
    --dm-primary: hsl(var(--nextui-primary) / 1);
    --dm-primary-dark: hsl(var(--nextui-primary-700) / 1);
    --dm-accent: hsl(var(--nextui-primary-400) / 1);
    --dm-primary-soft: hsl(var(--nextui-primary-50) / 1);
    --dm-on-primary: hsl(var(--nextui-primary-foreground) / 1);
    --logo-color: hsl(var(--nextui-primary) / 1);
}

body.dm-public-menu {
    font-family: var(--dm-font);
    color: var(--dm-text);
    background: var(--dm-menu-bg);
}

.dm-menu-page.mobile-screen {
    display: flex;
    flex-direction: column;
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
    background:
        radial-gradient(ellipse 120% 80% at 50% -20%, color-mix(in srgb, var(--dm-accent) 18%, transparent) 0%, transparent 55%),
        linear-gradient(180deg, var(--dm-menu-bg) 0%, var(--dm-menu-bg-soft) 35%, var(--dm-surface) 100%);
}

.dm-menu-page .dm-menu-header {
    flex-shrink: 0;
}

.dm-menu-page .restaurant-menu {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 12px 24px;
}

.dm-menu-page .footer-info-text {
    flex-shrink: 0;
}

/* ——— Üst bar ——— */

.dm-menu-page .ms-header.dm-menu-header {
    position: sticky;
    top: 0;
    z-index: 50;
    flex-shrink: 0;
    width: 100%;
    height: auto;
    min-height: 0;
    padding:
        max(0.5rem, env(safe-area-inset-top, 0px))
        0.75rem
        0.625rem;
    background: color-mix(in srgb, var(--dm-surface) 90%, transparent);
    backdrop-filter: blur(14px) saturate(1.15);
    -webkit-backdrop-filter: blur(14px) saturate(1.15);
    border-bottom: 1px solid color-mix(in srgb, var(--dm-primary) 14%, var(--dm-border));
    box-shadow: 0 10px 28px color-mix(in srgb, var(--dm-primary) 7%, transparent);
}

.dm-menu-header__row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.75rem;
}

.dm-menu-header__brand {
    flex: 1 1 auto;
    min-width: 0;
    text-align: center;
    padding: 0 0.15rem;
}

.dm-menu-header__title {
    display: block;
    max-width: 100%;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.02em;
    color: var(--dm-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
    transition: color var(--dm-motion);
}

.dm-menu-header__title:active {
    color: var(--dm-primary);
}

.dm-menu-header__actions {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
}

.dm-menu-header__actions-tray {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem;
    border-radius: 14px;
    background: var(--dm-primary-soft);
    border: 1px solid color-mix(in srgb, var(--dm-primary) 16%, transparent);
}

.dm-menu-header__btn {
    position: relative;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    margin: 0;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--dm-primary) 18%, var(--dm-border));
    border-radius: var(--dm-radius-sm, 12px);
    background: var(--dm-surface);
    color: var(--dm-primary);
    box-shadow: var(--dm-shadow-card);
    cursor: pointer;
    touch-action: manipulation;
    text-decoration: none;
    transition:
        transform var(--dm-motion),
        background var(--dm-motion),
        border-color var(--dm-motion),
        box-shadow var(--dm-motion),
        color var(--dm-motion);
}

.dm-menu-header__actions-tray .dm-menu-header__btn {
    width: 2.5rem;
    height: 2.5rem;
    border-color: color-mix(in srgb, var(--dm-primary) 12%, transparent);
    box-shadow: none;
}

.dm-menu-header__btn--menu {
    background: var(--dm-primary);
    border-color: transparent;
    color: var(--dm-on-primary, #fff);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--dm-primary) 38%, transparent);
}

.dm-menu-header__btn--back {
    background: var(--dm-surface-muted);
}

.dm-menu-header__btn:focus-visible {
    outline: 2px solid var(--dm-primary);
    outline-offset: 2px;
}

.dm-menu-header__btn:active {
    transform: scale(0.96);
}

.dm-menu-header__btn i,
.dm-menu-header__btn svg {
    width: 1.25rem;
    height: 1.25rem;
    display: block;
    stroke: currentColor;
    color: currentColor;
    flex-shrink: 0;
}

.dm-menu-header__badge {
    position: absolute;
    top: -0.2rem;
    right: -0.2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.125rem;
    height: 1.125rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    border: 2px solid var(--dm-surface);
    background: #ef4444;
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 2px 6px color-mix(in srgb, #ef4444 35%, transparent);
}

/* Masa seçimi — .restaurant-menu içinde, kategori listesinin üstünde ayrı bölüm */
.dm-menu-page .restaurant-menu > .mc-table-bar {
    margin: 0.75rem 0 0;
    padding: 0;
}

.dm-menu-page .mc-table-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    width: 100%;
    min-height: 2.75rem;
    padding: 0.45rem 0.85rem;
    border: 1px solid color-mix(in srgb, var(--dm-primary) 20%, var(--dm-border));
    border-radius: var(--dm-radius-sm, 12px);
    background: var(--dm-surface-muted);
    color: var(--dm-text-muted);
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    touch-action: manipulation;
    transition:
        transform var(--dm-motion),
        border-color var(--dm-motion),
        background var(--dm-motion),
        color var(--dm-motion);
}

.dm-menu-page .mc-table-chip svg {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
    stroke: currentColor;
}

.dm-menu-page .mc-table-chip-chevron {
    margin-left: auto;
    opacity: 0.55;
}

.dm-menu-page .mc-table-chip--selected {
    border-color: var(--dm-primary);
    background: var(--dm-primary-soft);
    color: var(--dm-primary);
}

.dm-menu-page .mc-table-chip:active {
    transform: scale(0.99);
}

@media (prefers-reduced-motion: reduce) {
    .dm-menu-header__btn,
    .dm-menu-page .mc-table-chip {
        transition: none;
    }
}

/* ——— Katalog: kategori & ürün (modern, yuvarlak) ——— */

.dm-menu-page .menu-categories {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 10px;
    padding-bottom: 8px;
}

.dm-menu-page .menu-category {
    border-radius: var(--dm-radius);
    overflow: hidden;
    box-shadow: var(--dm-shadow-card);
    border: 1px solid color-mix(in srgb, var(--dm-primary) 12%, transparent);
    background: var(--dm-surface);
    transition: box-shadow var(--dm-motion), border-color var(--dm-motion);
}

.dm-menu-page .menu-category:has(.category-trigger:not(.collapsed)) {
    box-shadow: var(--dm-shadow-lift);
    border-color: color-mix(in srgb, var(--dm-primary) 28%, var(--dm-border));
}

/* Ana kategori başlığı */
.dm-menu-page .restaurant-menu .menu-category .category-trigger {
    height: 8.75rem !important;
    min-height: 8.75rem;
    border-radius: 0;
}

.dm-menu-page .category-trigger .category-bg {
    background-color: var(--dm-primary);
}

.dm-menu-page .category-trigger .category-bg--photo {
    background-size: cover;
    background-position: center;
}

.dm-menu-page .category-trigger .category-bg--fallback {
    background-image:
        linear-gradient(128deg, var(--dm-primary-dark) 0%, var(--dm-primary) 48%, color-mix(in srgb, var(--dm-primary) 50%, #5eead4) 100%);
}

.dm-menu-page .category-trigger .category-bg--fallback::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 88% 18%, rgba(255, 255, 255, 0.26) 0%, transparent 44%),
        radial-gradient(circle at 8% 88%, rgba(0, 0, 0, 0.1) 0%, transparent 40%);
    pointer-events: none;
}

.dm-menu-page .category-trigger .category-bg--fallback::before {
    content: "";
    position: absolute;
    right: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    width: 4rem;
    height: 4rem;
    opacity: 0.18;
    background: url("/Clients/Images/login/menu-pulse.svg") center / contain no-repeat;
    pointer-events: none;
}

.dm-menu-page .category-trigger .category-overlay {
    background-image: linear-gradient(
        to top,
        color-mix(in srgb, var(--dm-primary-dark) 92%, transparent) 0%,
        color-mix(in srgb, var(--dm-primary) 42%, transparent) 52%,
        transparent 100%
    ) !important;
}

.dm-menu-page .category-trigger .category-content-wrapper {
    padding: 0 1.25rem 1.25rem !important;
}

.dm-menu-page .category-trigger .category-content-wrapper .category-name {
    font-size: 1.375rem !important;
    line-height: 1.2 !important;
    font-weight: 700;
    letter-spacing: -0.03em;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
    margin-bottom: 0.2rem;
}

.dm-menu-page .category-trigger .category-content-wrapper .category-desc {
    font-size: 0.8125rem;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.92);
    line-height: 1.4;
    max-width: 85%;
}

.dm-menu-page .category-trigger .category-icon {
    top: 1rem !important;
    right: 1rem !important;
    width: 2.75rem;
    height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    background: rgba(255, 255, 255, 0.22) !important;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 999px !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}

.dm-menu-page .category-trigger .category-icon svg {
    width: 1.35rem !important;
    height: 1.35rem !important;
}

.dm-menu-page .category-trigger:hover .category-bg {
    transform: scale(1.03);
}

.dm-menu-page .restaurant-menu .menu-category .category-items.show,
.dm-menu-page .restaurant-menu .menu-category .category-itemss.show {
    border-top: 1px solid color-mix(in srgb, var(--dm-primary) 10%, transparent);
}

/* Alt kategori */
.dm-menu-page .sub-category-accordion {
    margin-bottom: 0 !important;
    border-radius: var(--dm-radius-md);
    overflow: hidden;
    background: var(--dm-surface);
    border: 1px solid color-mix(in srgb, var(--dm-primary) 10%, transparent);
    box-shadow: 0 1px 6px color-mix(in srgb, var(--dm-primary) 5%, transparent);
}

.dm-menu-page .sub-category-trigger {
    min-height: 4.75rem !important;
    height: 4.75rem !important;
    border-radius: var(--dm-radius-md) var(--dm-radius-md) 0 0;
    overflow: hidden;
}

.dm-menu-page .sub-category-trigger .sub-category-bg {
    background-color: var(--dm-primary);
}

.dm-menu-page .sub-category-trigger .sub-category-bg--photo {
    background-size: cover;
    background-position: center;
}

.dm-menu-page .sub-category-trigger .sub-category-bg--fallback {
    background-image: linear-gradient(
        115deg,
        color-mix(in srgb, var(--dm-primary) 70%, #fff) 0%,
        var(--dm-primary) 100%
    );
}

.dm-menu-page .sub-category-trigger .sub-category-overlay {
    background-image: linear-gradient(
        to right,
        color-mix(in srgb, var(--dm-primary-dark) 78%, transparent) 0%,
        color-mix(in srgb, var(--dm-primary) 28%, transparent) 72%,
        transparent 100%
    ) !important;
}

.dm-menu-page .sub-category-trigger .sub-category-header {
    padding-left: 1rem !important;
}

.dm-menu-page .sub-category-trigger .sub-category-header .sub-category-name {
    font-size: 1.0625rem !important;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.dm-menu-page .sub-category-trigger .sub-category-icon {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    padding: 0.35rem;
}

/* Ürün listesi alanı */
.dm-menu-page .menu-items,
.dm-menu-page .sub-category-items {
    background: var(--dm-surface-muted) !important;
    padding: 14px !important;
    gap: 14px !important;
}

.dm-menu-page .sub-category-items {
    border-radius: 0 0 var(--dm-radius-md) var(--dm-radius-md);
}

/* Ürün kartı */
.dm-menu-page .restaurant-menu .menu-category .menu-item {
    border-radius: var(--dm-radius-md) !important;
    border: 1px solid color-mix(in srgb, var(--dm-primary) 14%, transparent) !important;
    box-shadow: var(--dm-shadow-card) !important;
    background: var(--dm-surface) !important;
    overflow: hidden;
    gap: 0 !important;
    align-items: stretch !important;
    min-height: 6.75rem;
    transition: border-color var(--dm-motion), box-shadow var(--dm-motion), transform var(--dm-motion);
    touch-action: manipulation;
}

.dm-menu-page .restaurant-menu .menu-category .menu-item:hover {
    border-color: color-mix(in srgb, var(--dm-primary) 35%, var(--dm-border)) !important;
    box-shadow: var(--dm-shadow-lift) !important;
    transform: translateY(-2px) !important;
}

.dm-menu-page .restaurant-menu .menu-category .menu-item:active {
    transform: scale(0.995) !important;
}

.dm-menu-page .restaurant-menu .menu-category .menu-item:hover .item-image img {
    transform: scale(1.05);
}

.dm-menu-page .menu-item .item-details {
    padding: 0.875rem 1rem !important;
}

.dm-menu-page .menu-item .item-header {
    align-items: center !important;
    gap: 0.5rem !important;
    margin-bottom: 0.35rem !important;
}

.dm-menu-page .menu-item .item-title {
    color: var(--dm-text) !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    line-height: 1.3 !important;
}

.dm-menu-page .menu-item .item-price {
    color: var(--dm-primary) !important;
    font-weight: 700 !important;
    font-size: 0.9375rem !important;
    line-height: 1 !important;
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    background: var(--dm-primary-soft);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.dm-menu-page .menu-item .item-description {
    color: var(--dm-text-muted) !important;
    font-size: 0.8125rem !important;
    line-height: 1.5 !important;
    -webkit-line-clamp: 2;
}

/* Ürün görseli — kart yüksekliğine orantılı (4:5, 640×800 uyumlu) */
.dm-menu-page .restaurant-menu .menu-category .menu-item .item-image {
    width: clamp(6.25rem, 30vw, 7.75rem) !important;
    min-width: clamp(6.25rem, 30vw, 7.75rem) !important;
    max-width: 7.75rem;
    height: unset !important;
    min-height: 6.75rem;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    align-self: stretch !important;
    flex-shrink: 0;
    border-radius: 0 !important;
    border-top-left-radius: var(--dm-radius-md) !important;
    border-bottom-left-radius: var(--dm-radius-md) !important;
    overflow: hidden !important;
    background: linear-gradient(160deg, var(--dm-primary-soft) 0%, var(--dm-surface-muted) 100%) !important;
    cursor: pointer;
    position: relative;
    box-shadow: inset -1px 0 0 color-mix(in srgb, var(--dm-primary) 8%, transparent);
}

.dm-menu-page .menu-item .item-image img {
    width: 100% !important;
    height: 100% !important;
    min-height: inherit;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
    border-top-left-radius: var(--dm-radius-md) !important;
    border-bottom-left-radius: var(--dm-radius-md) !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block;
    transition: transform 0.35s cubic-bezier(0.33, 1, 0.68, 1);
}

.dm-menu-page .menu-item .item-image::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, transparent 55%, rgba(255, 255, 255, 0.35) 100%);
    opacity: 0.5;
}

.dm-menu-page .menu-item .item-image-zoom {
    position: absolute;
    right: 0.45rem;
    bottom: 0.45rem;
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--dm-surface) 94%, transparent);
    color: var(--dm-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--dm-shadow-card);
    border: 1px solid color-mix(in srgb, var(--dm-primary) 14%, transparent);
    opacity: 0.85;
    z-index: 2;
    pointer-events: none;
    transition: opacity var(--dm-motion), transform var(--dm-motion);
}

.dm-menu-page .menu-item .item-image-zoom svg {
    width: 0.9rem;
    height: 0.9rem;
}

.dm-menu-page .restaurant-menu .menu-category .menu-item:hover .item-image-zoom {
    opacity: 1;
    transform: scale(1.05);
}

.dm-menu-page .menu-item .item-image--empty {
    display: flex;
    align-items: center;
    justify-content: center;
}

.dm-menu-page .menu-item .item-image--empty .item-image__placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: var(--dm-primary);
    opacity: 0.45;
}

.dm-menu-page .menu-item .item-image--empty .item-image__placeholder svg {
    width: 2rem;
    height: 2rem;
    stroke: currentColor;
}

/* Ürün kartı — diğer temalarla ortak .product-card/.product-add deseni */
.dm-menu-page .restaurant-menu .menu-category .menu-item .product-card {
    all: unset;
    box-sizing: border-box;
    display: flex;
    flex: 1 1 0%;
    flex-direction: row;
    align-items: stretch;
    width: 100%;
    min-width: 0;
    cursor: pointer;
    text-align: left;
}

.dm-menu-page .restaurant-menu .menu-category .menu-item .product-card:focus-visible {
    outline: 2px solid var(--dm-primary);
    outline-offset: -2px;
    z-index: 1;
}

.dm-menu-page .menu-item .product-add {
    align-self: flex-end;
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    min-height: 2.75rem;
    margin-top: 0.5rem;
    border-radius: 999px;
    background: var(--dm-primary);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--dm-primary) 45%, transparent);
    cursor: pointer;
    transition: transform var(--dm-motion), box-shadow var(--dm-motion);
}

.dm-menu-page .menu-item .product-add svg {
    width: 1.15rem;
    height: 1.15rem;
    stroke: #fff;
    color: #fff;
}

.dm-menu-page .menu-item .product-add:active {
    transform: scale(0.94);
}

/* Sepet kontrolleri (ürün satırı içi — eski adet stepper, artık kullanılmıyor, ölü kod) */
.dm-menu-page .menu-item .item-qty-wrapper .btn-outline-secondary {
    min-width: 2.75rem;
    min-height: 2.75rem;
    border-radius: var(--dm-radius-sm) !important;
    border-color: color-mix(in srgb, var(--dm-primary) 25%, transparent) !important;
    color: var(--dm-primary) !important;
    font-weight: 600;
    font-size: 1rem;
}

.dm-menu-page .menu-item .item-qty {
    min-width: 1.5rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.dm-menu-page .menu-item .item-action-btn.add-to-cart-btn,
.dm-menu-page .menu-item .mc-add-btn {
    width: 2.75rem !important;
    height: 2.75rem !important;
    min-width: 2.75rem;
    min-height: 2.75rem;
    border-radius: 999px !important;
    padding: 0 !important;
    background: var(--dm-primary) !important;
    border: none !important;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--dm-primary) 45%, transparent) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--dm-motion), box-shadow var(--dm-motion);
}

.dm-menu-page .menu-item .item-action-btn.add-to-cart-btn:active,
.dm-menu-page .menu-item .mc-add-btn:active {
    transform: scale(0.94);
}

.dm-menu-page .menu-item .item-action-btn.add-to-cart-btn svg,
.dm-menu-page .menu-item .mc-add-btn svg {
    width: 1.15rem;
    height: 1.15rem;
    stroke: #fff;
    color: #fff;
}

.dm-menu-page .menu-item small.text-muted {
    color: var(--dm-text-muted) !important;
    font-size: 0.75rem;
    font-weight: 500;
}

/* Sepet / modal */
.dm-menu-page .btn-primary {
    background-color: var(--dm-primary) !important;
    border-color: var(--dm-primary) !important;
    border-radius: var(--dm-radius-sm);
}

.dm-menu-page .btn-outline-secondary {
    border-color: var(--dm-border);
    color: var(--dm-primary);
    border-radius: var(--dm-radius-sm);
}

.dm-menu-page .add-to-cart-btn {
    background: var(--dm-primary) !important;
}

.dm-menu-page .footer-info-text {
    margin-top: 16px;
    padding: 12px 16px 24px;
    text-align: center;
    font-size: 0.8125rem;
    color: var(--dm-text-muted);
}

.dm-menu-page .footer-info-text .fit-text {
    background: rgba(255, 255, 255, 0.9);
    border: 1px dashed var(--dm-border);
    border-radius: var(--dm-radius-md);
    padding: 12px 16px;
    line-height: 1.5;
}

@media (min-width: 480px) {
    .dm-menu-page .restaurant-menu .menu-category .menu-item {
        min-height: 7.25rem;
    }

    .dm-menu-page .restaurant-menu .menu-category .menu-item .item-image,
    .dm-menu-page .restaurant-menu .menu-category .menu-item .item-image.item-image--detail {
        width: 7.75rem !important;
        min-width: 7.75rem !important;
    }

    .dm-menu-page .menu-item .item-image img {
        min-height: 7.25rem;
    }

    .dm-menu-page .menu-item .item-title {
        font-size: 1.0625rem !important;
    }
}

/* Layout: masaüstü çerçeve + yan panel */

.dm-public-menu .main.flex {
    min-height: 100dvh;
    background: linear-gradient(135deg, var(--dm-menu-bg) 0%, var(--dm-menu-bg-soft) 45%, var(--dm-surface-muted) 100%);
}

.dm-public-menu .slide-menu-header {
    background: linear-gradient(135deg, var(--dm-primary-dark), var(--dm-primary));
    border-bottom: none;
}

.dm-public-menu .slide-menu-title {
    color: #fff;
    font-weight: 700;
}

.dm-public-menu .slide-close-button {
    color: #fff;
    border-radius: 10px;
    min-width: 44px;
    min-height: 44px;
}

/* ——— Sağ panel (hero + animasyonlu yemekler) ——— */

.dm-right-panel {
    overflow: hidden;
    background: linear-gradient(165deg, var(--dm-primary-dark) 0%, var(--dm-primary) 38%, var(--dm-accent) 72%, var(--dm-primary-soft) 100%);
}

.dm-right-panel__gradient {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        radial-gradient(ellipse 90% 60% at 50% 35%, rgba(94, 234, 212, 0.35) 0%, transparent 60%),
        linear-gradient(180deg, transparent 0%, rgba(15, 118, 110, 0.25) 100%);
    pointer-events: none;
}

.dm-right-panel__photo {
    position: absolute;
    inset: 0;
    z-index: 0;
    background-size: cover;
    background-position: center;
    filter: brightness(0.45) saturate(1.1);
}

.dm-right-panel__photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(165deg, color-mix(in srgb, var(--dm-primary-dark) 75%, transparent) 0%, color-mix(in srgb, var(--dm-primary) 55%, transparent) 100%);
}

.dm-right-panel__scene-deco {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.55;
    z-index: 2;
    pointer-events: none;
    mix-blend-mode: soft-light;
}

.dm-right-panel__orb {
    position: absolute;
    border-radius: 50%;
    z-index: 3;
    pointer-events: none;
    animation: dmOrbPulse 8s ease-in-out infinite;
}

.dm-right-panel__orb--1 {
    width: 280px;
    height: 280px;
    top: -60px;
    right: -80px;
    background: rgba(255, 255, 255, 0.08);
}

.dm-right-panel__orb--2 {
    width: 200px;
    height: 200px;
    bottom: 15%;
    left: -50px;
    background: rgba(94, 234, 212, 0.15);
    animation-delay: -3s;
}

.dm-right-panel__orb--3 {
    width: 140px;
    height: 140px;
    top: 42%;
    right: 10%;
    background: rgba(255, 255, 255, 0.1);
    animation-delay: -5s;
}

@keyframes dmOrbPulse {
    0%, 100% { transform: scale(1); opacity: 0.7; }
    50% { transform: scale(1.08); opacity: 1; }
}

.dm-right-panel__foods {
    position: absolute;
    inset: 0;
    z-index: 4;
    pointer-events: none;
}

.dm-panel-float {
    position: absolute;
    filter: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.15));
    animation: dmPanelFloat ease-in-out infinite;
    will-change: transform;
}

.dm-panel-float--1 { left: 6%; top: 10%; animation-duration: 7s; animation-delay: 0s; }
.dm-panel-float--2 { right: 8%; top: 14%; animation-duration: 8s; animation-delay: -1s; }
.dm-panel-float--3 { right: 12%; top: 48%; animation-duration: 6.5s; animation-delay: -2s; }
.dm-panel-float--4 { left: 10%; top: 52%; animation-duration: 7.5s; animation-delay: -3s; }
.dm-panel-float--5 { left: 4%; bottom: 22%; animation-duration: 8.5s; animation-delay: -1.5s; }
.dm-panel-float--6 { right: 6%; bottom: 18%; animation-duration: 7s; animation-delay: -4s; }
.dm-panel-float--7 { left: 38%; top: 6%; animation-duration: 9s; animation-delay: -2.5s; opacity: 0.85; }
.dm-panel-float--8 { right: 28%; bottom: 8%; animation-duration: 6s; animation-delay: -0.5s; opacity: 0.8; }

@keyframes dmPanelFloat {
    0%, 100% { transform: translateY(0) rotate(-4deg); }
    50% { transform: translateY(-14px) rotate(4deg); }
}

.dm-right-panel__hero {
    position: absolute;
    left: 50%;
    top: 38%;
    transform: translate(-50%, -50%);
    z-index: 5;
    width: 220px;
    height: 220px;
    pointer-events: none;
}

.dm-right-panel__hero-ring {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 200px;
    height: 200px;
    margin: -100px 0 0 -100px;
    border: 2px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    animation: dmHeroRing 4s ease-in-out infinite;
}

.dm-right-panel__hero-ring--2 {
    width: 240px;
    height: 240px;
    margin: -120px 0 0 -120px;
    animation-delay: -2s;
    opacity: 0.6;
}

@keyframes dmHeroRing {
    0%, 100% { transform: scale(1); opacity: 0.5; }
    50% { transform: scale(1.06); opacity: 0.9; }
}

.dm-right-panel__hero-qr {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 180px;
    height: 180px;
    border-radius: 20px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2);
    animation: dmHeroBob 5s ease-in-out infinite;
}

.dm-right-panel__hero-pulse {
    position: absolute;
    right: -8px;
    bottom: -8px;
    width: 64px;
    height: 64px;
    animation: dmHeroSpin 12s linear infinite;
    opacity: 0.9;
}

@keyframes dmHeroBob {
    0%, 100% { transform: translate(-50%, -50%) translateY(0); }
    50% { transform: translate(-50%, -50%) translateY(-8px); }
}

@keyframes dmHeroSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.dm-right-panel.home-right-container {
    justify-content: flex-end;
}

.dm-right-panel__content {
    position: relative;
    z-index: 10;
    max-width: 420px;
    width: 100%;
    padding: 46vh 1.5rem 2rem;
    margin-top: auto;
    margin-bottom: 0;
}

.dm-right-panel__logo-wrap {
    background: rgba(255, 255, 255, 0.95);
    border-radius: 20px;
    padding: 16px 24px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
    margin-bottom: 1.25rem;
}

.dm-right-panel__logo {
    max-width: 220px;
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.dm-right-panel__title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 0.5rem;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

.dm-right-panel__tagline {
    font-size: 0.9375rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.92);
    margin: 0 0 1.25rem;
}

.dm-right-panel__features {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.dm-right-panel__feature {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 14px;
    backdrop-filter: blur(8px);
}

.dm-right-panel__feature-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    color: #fff;
}

.dm-right-panel__feature-icon svg {
    width: 20px;
    height: 20px;
}

.dm-right-panel__feature-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    text-align: left;
    color: #fff;
}

.dm-right-panel__feature-text strong {
    font-size: 0.9375rem;
    font-weight: 600;
}

.dm-right-panel__feature-text small {
    font-size: 0.75rem;
    opacity: 0.85;
}

.dm-right-panel__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 8px 14px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--dm-text);
    background: color-mix(in srgb, var(--dm-surface) 90%, transparent);
    border-radius: 999px;
}

.dm-right-panel__badge svg {
    width: 16px;
    height: 16px;
    color: var(--dm-primary);
}

/* ——— Global modal katmanı (sepet · edit · ürün detay · giriş) ——— */

.mc-modal,
.mc-modal.show,
.mpd-modal,
.mpd-modal.show,
.dm-modal,
.dm-modal.show,
#menuProductDetailModal,
#menuProductDetailModal.show,
#cartModal,
#tableSelectModal,
#phoneModal,
#verifyCodeModal,
#ordersModal,
#editCategoryModal,
#editItemModal,
#deleteModal,
#addCategoryModal,
#imageCropModal,
#loginModal {
    z-index: 99999;
}

body.modal-open > .modal-backdrop.fade.show,
body.dm-public-menu.modal-open .modal-backdrop.show {
    z-index: 99998;
    opacity: 1;
    background-color: color-mix(in srgb, var(--dm-text, #134e4a) 52%, transparent);
}

.dm-modal__dialog {
    max-width: min(96vw, 520px);
    margin: 0.75rem auto;
}

.dm-modal__dialog--sm {
    max-width: min(92vw, 420px);
}

.dm-modal__dialog--crop {
    max-width: min(98vw, 960px);
}

.dm-modal .modal-backdrop.show {
    opacity: 0.55;
}

.dm-modal__content {
    border: none;
    border-radius: var(--dm-radius-md, 16px);
    overflow: hidden;
    background: var(--dm-surface);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--dm-primary) 10%, transparent),
        0 24px 48px color-mix(in srgb, var(--dm-primary) 20%, transparent);
}

.dm-modal__header {
    background: linear-gradient(135deg, var(--dm-primary-dark), var(--dm-primary));
    border-bottom: none;
    padding: 1rem 1.25rem;
    align-items: center;
}

.dm-modal__header--danger {
    background: linear-gradient(135deg, #991b1b, #dc2626);
}

.dm-modal__header--crop {
    background: linear-gradient(135deg, var(--dm-primary-dark), var(--dm-primary));
    padding: 1rem 1.25rem;
    border-bottom: none;
    box-shadow: none;
}

.dm-modal#imageCropModal .crop-modal-header::before,
.dm-modal#imageCropModal .dm-modal__header--crop::before {
    display: none;
}

.dm-modal__title {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--dm-on-primary) !important;
    font-weight: 700;
    font-size: 1.125rem;
    margin: 0;
    line-height: 1.35;
}

.dm-modal__title-icon {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
}

.dm-modal__header .btn-close {
    opacity: 0.88;
    transition: opacity var(--dm-motion), transform var(--dm-motion);
}

.dm-modal__header .btn-close:hover {
    opacity: 1;
    transform: scale(1.05);
}

.dm-modal__body {
    padding: 1.25rem;
    background: var(--dm-menu-bg-soft);
}

.dm-modal__footer {
    padding: 1rem 1.25rem;
    background: var(--dm-surface);
    border-top: 1px solid var(--dm-border);
    gap: 10px;
    flex-wrap: wrap;
}

.dm-modal__footer .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 44px;
    padding: 0.5rem 1.25rem;
    font-weight: 600;
}

.dm-modal__footer .btn svg {
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
}

.dm-modal__label {
    font-weight: 600;
    color: var(--dm-text);
    font-size: 0.875rem;
    margin-bottom: 0.4rem;
}

.dm-modal__input,
.dm-modal__body .form-control {
    border-radius: var(--dm-radius-sm, 12px);
    border: 1px solid color-mix(in srgb, var(--dm-border) 85%, var(--dm-text-muted));
    background: var(--dm-surface);
    color: var(--dm-text);
    min-height: 44px;
    transition: border-color var(--dm-motion), box-shadow var(--dm-motion);
}

.dm-modal__input:focus,
.dm-modal__body .form-control:focus {
    border-color: var(--dm-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--dm-primary) 22%, transparent);
}

.dm-modal__input-addon {
    background: var(--dm-primary-soft);
    border-color: color-mix(in srgb, var(--dm-border) 85%, var(--dm-text-muted));
    color: var(--dm-primary);
    font-weight: 600;
    border-radius: var(--dm-radius-sm, 12px) 0 0 var(--dm-radius-sm, 12px);
}

.dm-modal__hint,
.dm-modal__body .form-text {
    color: var(--dm-text-muted);
    font-size: 0.8125rem;
    margin-top: 0.35rem;
}

.dm-modal__text {
    color: var(--dm-text);
    line-height: 1.55;
}

.dm-modal__delete-name {
    color: var(--dm-text);
}

.dm-modal__btn-primary,
.dm-modal .btn-primary {
    background: var(--dm-primary) !important;
    border-color: var(--dm-primary) !important;
    color: var(--dm-on-primary) !important;
    border-radius: var(--dm-radius-sm, 12px);
}

.dm-modal__btn-primary:hover,
.dm-modal .btn-primary:hover {
    background: var(--dm-primary-dark) !important;
    border-color: var(--dm-primary-dark) !important;
}

.dm-modal__btn-secondary,
.dm-modal .btn-secondary {
    border-radius: var(--dm-radius-sm, 12px);
    border-color: color-mix(in srgb, var(--dm-border) 85%, var(--dm-text-muted));
    background: var(--dm-surface);
    color: var(--dm-text);
}

.dm-modal__btn-secondary:hover,
.dm-modal .btn-secondary:hover {
    background: var(--dm-surface-muted);
    border-color: var(--dm-border);
    color: var(--dm-text);
}

.dm-modal__btn-danger,
.dm-modal .btn-danger {
    border-radius: var(--dm-radius-sm, 12px);
    min-height: 44px;
    font-weight: 600;
    background: #dc2626 !important;
    border-color: #dc2626 !important;
}

.dm-modal__btn-danger:hover,
.dm-modal .btn-danger:hover {
    background: #b91c1c !important;
    border-color: #b91c1c !important;
}

.dm-modal__alert {
    border-radius: var(--dm-radius-sm, 12px);
    border: 1px solid color-mix(in srgb, #f97316 35%, transparent);
    background: color-mix(in srgb, #fff7ed 88%, var(--dm-surface));
    color: #9a3412;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 0.85rem 1rem;
    margin-bottom: 1rem;
}

.dm-modal__alert svg {
    width: 1.15rem;
    height: 1.15rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.dm-modal__switch .form-check-input {
    width: 2.5rem;
    height: 1.35rem;
    cursor: pointer;
}

.dm-modal__switch .form-check-input:checked {
    background-color: var(--dm-primary);
    border-color: var(--dm-primary);
}

.dm-modal__switch .form-check-label {
    margin-left: 0.35rem;
    cursor: pointer;
}

/* ——— Görsel yükleme alanı (dropzone) ——— */

.dm-upload {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    width: 100%;
    padding: 1.35rem 1rem;
    margin-bottom: 0;
    border-radius: var(--dm-radius-sm, 12px);
    border: 2px dashed color-mix(in srgb, var(--dm-primary) 35%, var(--dm-border));
    background: color-mix(in srgb, var(--dm-primary) 4%, var(--dm-surface));
    text-align: center;
    cursor: pointer;
    transition: border-color var(--dm-motion), background var(--dm-motion), box-shadow var(--dm-motion);
}

.dm-upload:hover,
.dm-upload:focus-within,
.dm-upload.is-dragover {
    border-color: var(--dm-primary);
    background: var(--dm-primary-soft);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--dm-primary) 15%, transparent);
}

.dm-upload.is-dragover {
    border-style: solid;
}

.dm-upload__input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.dm-upload__icon {
    width: 46px;
    height: 46px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    background: var(--dm-primary-soft);
    color: var(--dm-primary);
    pointer-events: none;
    transition: transform var(--dm-motion);
}

.dm-upload:hover .dm-upload__icon,
.dm-upload.is-dragover .dm-upload__icon {
    transform: scale(1.06);
}

.dm-upload__icon svg {
    width: 22px;
    height: 22px;
}

.dm-upload__title {
    font-size: 0.9rem;
    color: var(--dm-text);
    pointer-events: none;
}

.dm-upload__title strong {
    color: var(--dm-primary);
    font-weight: 700;
}

.dm-upload__hint {
    font-size: 0.75rem;
    line-height: 1.45;
    color: var(--dm-text-muted);
    pointer-events: none;
    max-width: 32ch;
}

.dm-modal__preview,
.dm-modal .category-image-preview,
.dm-modal .item-image-preview {
    overflow: hidden;
    border-radius: var(--dm-radius-sm, 12px);
    border: 1px solid var(--dm-border);
    background: var(--dm-surface-muted);
    box-shadow: 0 6px 18px -8px rgba(0, 0, 0, 0.18);
    margin-top: 0.85rem;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
}

.dm-modal__preview:empty,
.dm-modal .category-image-preview:empty,
.dm-modal .item-image-preview:empty {
    display: none;
}

.dm-modal__preview img,
.dm-modal .category-image-preview img,
.dm-modal .item-image-preview img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.dm-modal__preview--wide,
.dm-modal .category-image-preview {
    max-height: 12rem;
    aspect-ratio: 16 / 9;
}

.dm-modal__preview--wide img,
.dm-modal .category-image-preview img {
    max-height: 12rem;
    object-fit: cover;
}

.dm-modal__preview--square,
.dm-modal .item-image-preview {
    max-width: 10rem;
    aspect-ratio: 1 / 1;
}

.dm-modal__preview--square img,
.dm-modal .item-image-preview img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.dm-modal__cart-total {
    font-size: 1.0625rem;
    color: var(--dm-text);
}

.dm-modal__cart-total #cartTotal {
    color: var(--dm-primary);
    font-size: 1.25rem;
}

.dm-modal #categoryEditModal .modal-header-actions .btn-add-category {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.4);
}

/* ——— Kırpma modalı ——— */

.dm-modal#imageCropModal .dm-modal__content--crop {
    border-radius: var(--dm-radius-md, 16px);
    background: var(--dm-menu-bg-soft);
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--dm-primary) 10%, transparent),
        0 24px 56px color-mix(in srgb, var(--dm-text) 18%, transparent);
}

.dm-modal#imageCropModal .dm-modal__header--crop {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.dm-modal__crop-head {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex: 1;
    min-width: 0;
}

.dm-modal__crop-icon {
    width: 3rem;
    height: 3rem;
    border-radius: var(--dm-radius-sm, 12px);
    background: color-mix(in srgb, var(--dm-on-primary) 18%, transparent);
    border: 1px solid color-mix(in srgb, var(--dm-on-primary) 28%, transparent);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dm-modal__crop-icon svg {
    width: 1.35rem;
    height: 1.35rem;
    color: var(--dm-on-primary);
}

.dm-modal__crop-text .modal-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--dm-on-primary) !important;
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    margin: 0;
}

.dm-modal__crop-sub,
.dm-modal#imageCropModal .crop-subtitle {
    color: color-mix(in srgb, var(--dm-on-primary) 88%, transparent);
    margin: 0.15rem 0 0;
    font-size: 0.8125rem;
    font-weight: 500;
}

.dm-modal__crop-close {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    border: 1px solid color-mix(in srgb, var(--dm-on-primary) 35%, transparent);
    background: color-mix(in srgb, var(--dm-on-primary) 12%, transparent);
    color: var(--dm-on-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background var(--dm-motion), transform var(--dm-motion);
    flex-shrink: 0;
}

.dm-modal__crop-close svg {
    width: 1.1rem;
    height: 1.1rem;
}

.dm-modal__crop-close:hover {
    background: color-mix(in srgb, var(--dm-on-primary) 22%, transparent);
}

.dm-modal__crop-close:active {
    transform: scale(0.94);
}

.dm-modal__body--crop {
    padding: 1rem 1.25rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    background: var(--dm-menu-bg-soft);
}

.dm-modal__crop-toolbar,
.dm-modal#imageCropModal .crop-toolbar {
    background: color-mix(in srgb, var(--dm-surface) 94%, transparent);
    backdrop-filter: blur(8px);
    border-radius: var(--dm-radius-sm, 12px);
    border: 1px solid color-mix(in srgb, var(--dm-border) 80%, transparent);
    box-shadow: var(--dm-shadow-card);
    padding: 0.65rem 0.75rem;
}

.dm-modal#imageCropModal .crop-toolbar-section .toolbar-section-label {
    color: var(--dm-text-muted);
    font-size: 0.6875rem;
    letter-spacing: 0.04em;
}

.dm-modal__crop-tool,
.dm-modal#imageCropModal .crop-tool-btn {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--dm-border) 85%, transparent);
    background: var(--dm-surface);
    color: var(--dm-text);
    transition: border-color var(--dm-motion), background var(--dm-motion), transform var(--dm-motion);
}

.dm-modal#imageCropModal .crop-tool-btn::before {
    display: none;
}

.dm-modal#imageCropModal .crop-tool-btn:hover {
    border-color: color-mix(in srgb, var(--dm-primary) 45%, var(--dm-border));
    background: var(--dm-primary-soft);
    transform: translateY(-1px);
    box-shadow: none;
}

.dm-modal#imageCropModal .crop-tool-btn svg {
    width: 1rem;
    height: 1rem;
    color: var(--dm-text);
}

.dm-modal#imageCropModal .crop-tool-btn:hover svg {
    color: var(--dm-primary);
}

.dm-modal__crop-reset,
.dm-modal#imageCropModal .crop-reset-btn {
    width: auto;
    min-height: 2.5rem;
    padding: 0 0.85rem;
    border: none;
    background: linear-gradient(135deg, var(--dm-primary-dark), var(--dm-primary));
    color: var(--dm-on-primary);
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 600;
}

.dm-modal#imageCropModal .crop-reset-btn span {
    display: inline;
}

.dm-modal#imageCropModal .crop-reset-btn:hover {
    filter: brightness(1.05);
    transform: translateY(-1px);
}

.dm-modal#imageCropModal .crop-toolbar-divider {
    background: color-mix(in srgb, var(--dm-border) 70%, transparent);
}

.dm-modal__crop-canvas,
.dm-modal#imageCropModal .modern-crop-container {
    border-radius: var(--dm-radius-sm, 12px);
    border: 1px solid color-mix(in srgb, var(--dm-border) 80%, transparent);
    background: var(--dm-surface);
    overflow: hidden;
    min-height: 240px;
}

.dm-modal__crop-loader,
.dm-modal#imageCropModal .crop-loader {
    color: var(--dm-text-muted);
}

.dm-modal#imageCropModal .crop-loader-text {
    color: var(--dm-text-muted);
    font-size: 0.875rem;
}

.dm-modal#imageCropModal .spinner-ring {
    border-color: color-mix(in srgb, var(--dm-primary) 35%, transparent);
    border-top-color: var(--dm-primary);
}

.dm-modal__footer--crop,
.dm-modal#imageCropModal .crop-modal-footer {
    background: var(--dm-surface);
    border-top: 1px solid var(--dm-border);
    padding: 1rem 1.25rem;
    gap: 0.75rem;
}

.dm-modal#imageCropModal .crop-action-btn {
    min-height: 44px;
    border-radius: var(--dm-radius-sm, 12px);
    padding: 0.55rem 1.15rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    border: 1px solid transparent;
    transition: background var(--dm-motion), transform var(--dm-motion), border-color var(--dm-motion);
}

.dm-modal#imageCropModal .crop-action-btn::before {
    display: none;
}

.dm-modal#imageCropModal .crop-action-btn.cancel-btn {
    background: var(--dm-surface);
    border-color: color-mix(in srgb, var(--dm-border) 85%, transparent);
    color: var(--dm-text);
}

.dm-modal#imageCropModal .crop-action-btn.cancel-btn:hover {
    background: var(--dm-surface-muted);
}

.dm-modal#imageCropModal .crop-action-btn.save-btn {
    background: var(--dm-primary) !important;
    color: var(--dm-on-primary) !important;
    border-color: var(--dm-primary);
}

.dm-modal#imageCropModal .crop-action-btn.save-btn:hover {
    background: var(--dm-primary-dark) !important;
    border-color: var(--dm-primary-dark);
    transform: translateY(-1px);
}

@media (max-width: 575.98px) {
    .dm-modal__dialog,
    .dm-modal__dialog--crop {
        margin: 0.5rem auto;
    }

    .dm-modal__body,
    .dm-modal__body--crop {
        padding: 1rem;
    }

    .dm-modal__footer,
    .dm-modal__footer--crop {
        padding: 0.85rem 1rem;
    }

    .dm-modal__footer .btn,
    .dm-modal#imageCropModal .crop-action-btn {
        flex: 1 1 calc(50% - 0.5rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .dm-modal__header .btn-close:hover,
    .dm-modal#imageCropModal .crop-tool-btn:hover,
    .dm-modal#imageCropModal .crop-action-btn.save-btn:hover,
    .dm-modal#imageCropModal .crop-reset-btn:hover {
        transform: none;
    }
}

/* Lucide ikonları — boş placeholder ve stroke */
.dm-public-menu i[data-lucide],
.dm-public-menu [data-lucide] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    line-height: 0;
}

.dm-public-menu i[data-lucide] svg,
.dm-public-menu svg.lucide,
.dm-public-menu [data-lucide] svg {
    width: 1.25rem;
    height: 1.25rem;
    stroke: currentColor;
    fill: none;
    flex-shrink: 0;
}

.dm-public-menu .slide-menu i[data-lucide] svg,
.dm-public-menu .slide-menu svg.lucide {
    stroke: currentColor;
}

/* Giriş butonu — gradient rgb() uyumu + ikonlar */
.dm-public-menu .slide-menu .slide-menu-login-btn {
    background-image: linear-gradient(135deg, var(--dm-primary-dark) 0%, var(--dm-primary) 100%) !important;
}

.dm-public-menu .slide-menu .slide-menu-login-icon svg,
.dm-public-menu .slide-menu .slide-menu-login-icon i svg,
.dm-public-menu .slide-menu .slide-menu-login-arrow svg,
.dm-public-menu .slide-menu .slide-menu-login-arrow i svg {
    width: 20px !important;
    height: 20px !important;
    stroke: #fff !important;
    color: #fff !important;
    display: block;
}

.dm-public-menu #loginModal .dm-modal__title-icon svg,
.dm-public-menu #loginModal .dm-modal__title-icon i svg,
.dm-public-menu .dm-modal__header .dm-modal__title-icon svg,
.dm-public-menu .dm-modal__header .dm-modal__title-icon i svg {
    width: 22px !important;
    height: 22px !important;
    stroke: var(--dm-on-primary) !important;
    flex-shrink: 0;
}

.dm-public-menu .dm-modal__footer .btn svg,
.dm-public-menu .dm-modal__footer .btn i svg {
    width: 1rem !important;
    height: 1rem !important;
    stroke: currentColor !important;
    flex-shrink: 0;
}

.dm-modal__title-icon,
.dm-modal__title-icon svg {
    width: 22px;
    height: 22px;
    stroke: #fff;
}

@media (min-width: 768px) {
    .dm-public-menu .dm-menu-page.mobile-screen {
        box-shadow: 0 20px 50px color-mix(in srgb, var(--dm-primary) 15%, transparent);
        border-radius: 20px;
        margin-top: 12px;
        margin-bottom: 12px;
        max-height: calc(100dvh - 24px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .dm-panel-float,
    .dm-right-panel__hero-ring,
    .dm-right-panel__hero-qr,
    .dm-right-panel__hero-pulse,
    .dm-right-panel__orb {
        animation: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dm-menu-page .category-trigger,
    .dm-menu-page .category-trigger .category-bg,
    .dm-menu-page .menu-item,
    .dm-menu-page .menu-item .item-image img,
    .dm-menu-page .menu-item .item-action-btn.add-to-cart-btn {
        transition: none;
    }

    .dm-menu-page .restaurant-menu .menu-category .menu-item:hover {
        transform: none !important;
    }
}

/* ——— Menü admin girişi: Google ——— */
.dm-modal__google-card {
    padding: 0.85rem 0.9rem 1rem;
    border-radius: var(--dm-radius-sm, 12px);
    border: 1px solid color-mix(in srgb, var(--dm-border, #e2e8f0) 90%, transparent);
    background: color-mix(in srgb, var(--dm-surface, #fff) 92%, var(--color-primary, #14b8a6) 8%);
    margin-bottom: 0.85rem;
}

.dm-modal__google-title {
    margin: 0 0 0.2rem;
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--dm-text, #0f172a);
}

.dm-modal__google-desc {
    margin: 0 0 0.75rem;
    font-size: 0.78rem;
    color: var(--dm-text-muted, #64748b);
}

.dm-modal__google-host {
    display: flex;
    justify-content: center;
    min-height: 44px;
}

.dm-modal__google-host > div {
    width: 100% !important;
    max-width: 100%;
}

.dm-modal__divider {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin: 0.15rem 0 0.85rem;
    color: var(--dm-text-muted, #64748b);
    font-size: 0.75rem;
}

.dm-modal__divider::before,
.dm-modal__divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: color-mix(in srgb, var(--dm-border, #e2e8f0) 85%, transparent);
}

.dm-modal__divider span {
    white-space: nowrap;
}

/* ——— Slide-menu dil seçimi akordiyonu (menu_1 yapısı) — tema 2-5 için ———
   menu_1 kendi style.css'indeki kuralları kullanır; buradaki kurallar
   body:not(.dm-public-menu) kapsamı sayesinde menu_1'i etkilemez. */
body:not(.dm-public-menu) .slide-menu {
    --lacc-surface: #f9fafb;
    --lacc-surface-hover: #f3f4f6;
    --lacc-text: #374151;
    --lacc-muted: #6b7280;
    --lacc-accent: #14b8a6;
    --lacc-accent-soft: rgba(20, 184, 166, 0.12);
    --lacc-item-bg: #ffffff;
    --lacc-item-border: #f3f4f6;
}

body.menu-2-page .slide-menu {
    --lacc-accent: var(--primary, #0D9488);
    --lacc-accent-soft: rgba(13, 148, 136, 0.12);
    --lacc-text: var(--foreground, #124B47);
    --lacc-item-border: var(--line, rgba(13, 148, 136, 0.14));
}

body.menu-3-page .slide-menu {
    --lacc-accent: var(--m3-accent, #C8A96A);
    --lacc-accent-soft: rgba(200, 169, 106, 0.16);
    --lacc-text: var(--m3-primary-dark, #0F0F0F);
    --lacc-item-border: var(--m3-line, rgba(15, 15, 15, 0.08));
}

body.menu-4-page .slide-menu {
    --lacc-surface: var(--m4-bg, #FAF7F2);
    --lacc-surface-hover: var(--m4-latte, #EDE4D8);
    --lacc-accent: var(--m4-sage, #7A9B76);
    --lacc-accent-soft: var(--m4-sage-soft, rgba(122, 155, 118, 0.14));
    --lacc-text: var(--m4-text, #3D3229);
    --lacc-item-border: var(--m4-line, rgba(107, 79, 58, 0.1));
}

body.menu-5-page .slide-menu {
    --lacc-surface: rgba(255, 255, 255, 0.06);
    --lacc-surface-hover: rgba(255, 255, 255, 0.1);
    --lacc-text: var(--m5-text, #FDF5E6);
    --lacc-muted: var(--m5-muted, #A0A0A0);
    --lacc-accent: var(--m5-ember, #F57C00);
    --lacc-accent-soft: rgba(245, 124, 0, 0.15);
    --lacc-item-bg: rgba(255, 255, 255, 0.04);
    --lacc-item-border: rgba(255, 255, 255, 0.1);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-section {
    padding: 0.5rem 1rem 0.75rem;
}

body:not(.dm-public-menu) .slide-menu .accordion .accordion-item {
    border: none;
    background: transparent;
}

body:not(.dm-public-menu) .slide-menu .accordion .accordion-header {
    margin: 0;
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-btn {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    background: var(--lacc-surface);
    border: 0;
    color: var(--lacc-text);
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-btn:hover {
    background: var(--lacc-surface-hover);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-btn .slide-menu-btn-content {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-btn .slide-menu-btn-content svg {
    height: 1.25rem;
    width: 1.25rem;
    color: var(--lacc-accent);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-btn .slide-menu-btn-content span {
    font-weight: 500;
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-btn .slide-menu-chevron {
    height: 1rem;
    width: 1rem;
    color: var(--lacc-muted);
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-btn:not(.collapsed) {
    background: var(--lacc-accent-soft);
    color: var(--lacc-text);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-btn:not(.collapsed) .slide-menu-chevron {
    transform: rotate(180deg);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-accordion-body {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 0.75rem;
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    border: 2px solid var(--lacc-item-border);
    background: var(--lacc-item-bg);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    text-decoration: none;
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item:hover {
    border-color: color-mix(in srgb, var(--lacc-accent) 40%, transparent);
    background: var(--lacc-accent-soft);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item div[class*=-flag-svg] {
    height: 1.5rem;
    width: 1.5rem;
    flex-shrink: 0;
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item div[class*=-flag-svg]:before {
    height: 100%;
    width: 100%;
    border-radius: 0.25rem;
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item span {
    flex: 1 1 0%;
    font-weight: 500;
    color: var(--lacc-text);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item .slide-menu-check-icon {
    height: 1.25rem;
    width: 1.25rem;
    color: var(--lacc-accent);
    opacity: 0;
    transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item.active {
    border-color: var(--lacc-accent);
    background: var(--lacc-accent-soft);
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item.active span {
    font-weight: 600;
}

body:not(.dm-public-menu) .slide-menu .slide-menu-lang-item.active .slide-menu-check-icon {
    opacity: 1;
}

/* Bayrak görselleri — menu_1 style.css'te tanımlı; tema 2-5 o dosyayı
   yüklemediği için ortak tanım burada da gerekir (menu_1'de birebir aynı). */
body:not(.dm-public-menu) .tr-flag-svg:before {
    content: "";
    background-image: url("/Clients/views/menuthemes/menu_1/images/flags/tr.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
}

body:not(.dm-public-menu) .en-flag-svg:before {
    content: "";
    background-image: url("/Clients/views/menuthemes/menu_1/images/flags/en.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
}

body:not(.dm-public-menu) .ar-flag-svg:before {
    content: "";
    background-image: url("/Clients/views/menuthemes/menu_1/images/flags/ar.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
}
