/**
 * Marmaris Büfe - Minimalist & Kurumsal Şube Dizini CSS (v1.1.6)
 * %100 Kusursuz Mobil Responsive & Taşma Koruması
 */

:root {
    --ms-brand-red: #C41E3A;
    --ms-brand-red-hover: #A61830;
    --ms-text-dark: #111827;
    --ms-text-muted: #6B7280;
    --ms-text-light: #9CA3AF;
    --ms-bg-gray: #F9FAFB;
    --ms-bg-chip: #F3F4F6;
    --ms-border: #E5E7EB;
    --ms-radius: 6px;
    --ms-font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* KESİN GİZLEME */
.ms-hidden,
.md-branch-box.ms-hidden,
.md-branch-box[style*="display: none"] {
    display: none !important;
}

/* ==========================================================================
   1. HARİTA BİLEŞENİ
   ========================================================================== */
.marmaris-map-app {
    position: relative !important;
    width: 100% !important;
    height: var(--map-height, 600px) !important;
    border-radius: var(--ms-radius) !important;
    overflow: hidden !important;
    border: 1px solid var(--ms-border) !important;
    font-family: var(--ms-font) !important;
    box-sizing: border-box !important;
    background: var(--ms-bg-gray) !important;
}

.marmaris-map-app *,
.marmaris-map-app *::before,
.marmaris-map-app *::after {
    box-sizing: border-box !important;
}

.marmaris-map-app .ms-map-canvas {
    width: 100% !important;
    height: 100% !important;
    z-index: 1 !important;
}

.ms-clean-marker {
    background: transparent !important;
    border: none !important;
}

/* Floating Dock */
.marmaris-map-app .ms-floating-dock {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    z-index: 1010 !important;
    display: inline-flex !important;
    align-items: center !important;
    background: #ffffff !important;
    padding: 4px 6px !important;
    border-radius: var(--ms-radius) !important;
    border: 1px solid var(--ms-border) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
    max-width: calc(100% - 32px) !important;
}

.marmaris-map-app .ms-dock-locate-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: var(--ms-brand-red) !important;
    color: #ffffff !important;
    font-family: var(--ms-font) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    padding: 8px 14px !important;
    border-radius: 4px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    white-space: nowrap !important;
    outline: none !important;
}

.marmaris-map-app .ms-dock-locate-btn:hover {
    background: var(--ms-brand-red-hover) !important;
}

.marmaris-map-app .ms-dock-divider {
    width: 1px !important;
    height: 18px !important;
    background: var(--ms-border) !important;
    margin: 0 8px !important;
    flex-shrink: 0 !important;
}

.marmaris-map-app .ms-dock-search {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
}

.marmaris-map-app .ms-dock-sicon {
    position: absolute !important;
    left: 8px !important;
    color: var(--ms-text-light) !important;
    font-size: 12px !important;
    pointer-events: none !important;
}

.marmaris-map-app .ms-dock-search input {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    font-family: var(--ms-font) !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    color: var(--ms-text-dark) !important;
    padding: 6px 22px 6px 28px !important;
    width: 160px !important;
    box-shadow: none !important;
    height: auto !important;
    transition: width 0.2s ease !important;
}

.marmaris-map-app .ms-dock-search input:focus {
    width: 200px !important;
}

.marmaris-map-app .ms-dock-clear {
    position: absolute !important;
    right: 4px !important;
    background: none !important;
    border: none !important;
    color: var(--ms-text-light) !important;
    font-size: 16px !important;
    cursor: pointer !important;
    padding: 0 !important;
}

.marmaris-map-app .ms-search-dropdown {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    left: 0 !important;
    right: 0 !important;
    min-width: 240px !important;
    max-height: 220px !important;
    overflow-y: auto !important;
    background: #ffffff !important;
    border-radius: var(--ms-radius) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
    border: 1px solid var(--ms-border) !important;
    padding: 4px !important;
    z-index: 1020 !important;
}

.marmaris-map-app .ms-dd-item {
    padding: 7px 10px !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
}

.marmaris-map-app .ms-dd-item:hover {
    background: var(--ms-bg-gray) !important;
}

.marmaris-map-app .ms-dd-title {
    font-weight: 600 !important;
    font-size: 12px !important;
    color: var(--ms-text-dark) !important;
}

.marmaris-map-app .ms-dd-sub {
    font-size: 11px !important;
    color: var(--ms-text-muted) !important;
}

.marmaris-map-app .ms-dock-icon-btn {
    width: 30px !important;
    height: 30px !important;
    border-radius: 4px !important;
    background: var(--ms-bg-gray) !important;
    border: 1px solid var(--ms-border) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    color: var(--ms-text-muted) !important;
    font-size: 12px !important;
    transition: all 0.15s ease !important;
}

.marmaris-map-app .ms-dock-icon-btn:hover {
    background: #ffffff !important;
    color: var(--ms-brand-red) !important;
    border-color: var(--ms-brand-red) !important;
}

/* Floating En Yakın Şube Kartı */
.marmaris-map-app .ms-nearest-floating-card {
    position: absolute !important;
    bottom: 16px !important;
    left: 16px !important;
    z-index: 1010 !important;
    width: 320px !important;
    max-width: calc(100% - 32px) !important;
    background: #ffffff !important;
    border: 1px solid var(--ms-border) !important;
    border-radius: var(--ms-radius) !important;
    padding: 14px 16px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
}

.marmaris-map-app .ms-close-nearest {
    position: absolute !important;
    top: 8px !important;
    right: 10px !important;
    background: none !important;
    border: none !important;
    color: var(--ms-text-light) !important;
    font-size: 18px !important;
    cursor: pointer !important;
}

.marmaris-map-app .ms-ncard-badge {
    font-size: 10.5px !important;
    font-weight: 700 !important;
    color: #D97706 !important;
    margin-bottom: 2px !important;
}

.marmaris-map-app .ms-ncard-title {
    font-size: 14.5px !important;
    font-weight: 700 !important;
    margin: 0 0 2px 0 !important;
    color: var(--ms-text-dark) !important;
}

.marmaris-map-app .ms-ncard-addr {
    font-size: 11.5px !important;
    color: var(--ms-text-muted) !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.35 !important;
}

.marmaris-map-app .ms-ncard-footer {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding-top: 8px !important;
    border-top: 1px solid #F3F4F6 !important;
    gap: 6px !important;
}

.marmaris-map-app .ms-ncard-dist {
    background: #EFF6FF !important;
    color: #2563EB !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
}

.marmaris-map-app .ms-ncard-actions {
    display: flex !important;
    gap: 4px !important;
}

.marmaris-map-app .ms-ncard-btn {
    font-size: 11.5px !important;
    font-weight: 600 !important;
    padding: 5px 10px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
}

.marmaris-map-app .ms-ncard-btn-route {
    background: var(--ms-brand-red) !important;
    color: #ffffff !important;
}

.marmaris-map-app .ms-ncard-btn-call {
    background: var(--ms-bg-gray) !important;
    color: var(--ms-text-dark) !important;
    border: 1px solid var(--ms-border) !important;
}

/* Pin & Leaflet Popup */
.ms-pin-box {
    position: relative !important;
    width: 34px !important;
    height: 44px !important;
    cursor: pointer !important;
}

.ms-pin-svg {
    width: 100% !important;
    height: 100% !important;
}

.ms-pin-icon-wrap {
    position: absolute !important;
    top: 6px !important;
    left: 6px !important;
    width: 22px !important;
    height: 22px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    font-size: 11px !important;
}

.ms-custom-popup .leaflet-popup-content-wrapper {
    border-radius: var(--ms-radius) !important;
    padding: 0 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
    border: 1px solid var(--ms-border) !important;
}

.ms-custom-popup .leaflet-popup-content {
    margin: 14px 16px !important;
    line-height: 1.4 !important;
    font-family: var(--ms-font) !important;
}

.ms-pop-card {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

.ms-pop-top {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 2px !important;
}

.ms-pop-region {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--ms-text-muted) !important;
}

.ms-pop-region i {
    color: var(--ms-brand-red) !important;
    margin-right: 2px !important;
}

.ms-pop-dist {
    background: #EFF6FF !important;
    color: #2563EB !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
}

.ms-pop-name {
    font-size: 15px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    color: var(--ms-text-dark) !important;
    line-height: 1.3 !important;
}

.ms-pop-address {
    font-size: 11.5px !important;
    color: var(--ms-text-muted) !important;
    margin: 0 !important;
    line-height: 1.35 !important;
}

.ms-pop-btns-row {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-top: 4px !important;
}

.ms-pop-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    padding: 6px 11px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.ms-pop-btn-route {
    background: var(--ms-brand-red) !important;
    color: #ffffff !important;
    flex: 1 !important;
    justify-content: center !important;
}

.ms-pop-btn-route:hover {
    background: var(--ms-brand-red-hover) !important;
}

.ms-pop-btn-call {
    background: var(--ms-bg-chip) !important;
    border: 1px solid var(--ms-border) !important;
    color: var(--ms-text-dark) !important;
}

.ms-pop-order-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-top: 8px !important;
    margin-top: 4px !important;
    border-top: 1px dashed var(--ms-border) !important;
}

.ms-pop-order-lbl {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: var(--ms-text-muted) !important;
}

.ms-pop-apps-flex {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
}

.ms-pop-app-link {
    width: 26px !important;
    height: 26px !important;
    border-radius: 4px !important;
    background: #ffffff !important;
    border: 1px solid var(--ms-border) !important;
    padding: 2px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: transform 0.15s ease !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
}

.ms-pop-app-link:hover {
    transform: translateY(-1px) !important;
    border-color: #CBD5E1 !important;
}

.ms-pop-app-link img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 2px !important;
    display: block !important;
}


/* ==========================================================================
   2. ŞUBE DİZİNİ ([marmaris_sube_listesi])
   ========================================================================== */
.marmaris-directory-app {
    max-width: 1200px !important;
    width: 100% !important;
    margin: 30px auto !important;
    padding: 0 10px !important;
    font-family: var(--ms-font) !important;
    color: var(--ms-text-dark) !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

.marmaris-directory-app *,
.marmaris-directory-app *::before,
.marmaris-directory-app *::after {
    box-sizing: border-box !important;
}

/* 1. Üst Filtre & Arama Kartı */
.md-filter-card {
    background: #ffffff !important;
    border: 1px solid var(--ms-border) !important;
    border-radius: var(--ms-radius) !important;
    padding: 16px 20px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    margin-bottom: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.md-search-bar {
    position: relative !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
}

.md-search-icon {
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: var(--ms-text-light) !important;
    font-size: 14px !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

.md-search-bar input {
    width: 100% !important;
    background: #ffffff !important;
    border: 1px solid var(--ms-border) !important;
    border-radius: var(--ms-radius) !important;
    padding: 10px 36px 10px 42px !important;
    font-family: var(--ms-font) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    color: var(--ms-text-dark) !important;
    outline: none !important;
    height: 44px !important;
    line-height: normal !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    transition: border-color 0.15s ease !important;
}

.md-search-bar input::placeholder {
    color: var(--ms-text-light) !important;
}

.md-search-bar input:focus {
    border-color: #9CA3AF !important;
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.04) !important;
}

.md-clear-icon {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: none !important;
    border: none !important;
    font-size: 18px !important;
    color: var(--ms-text-light) !important;
    cursor: pointer !important;
    padding: 0 !important;
    line-height: 1 !important;
    z-index: 2 !important;
}

/* İlçe Butonları */
.md-pills-row {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    overflow-x: auto !important;
    padding-bottom: 2px !important;
    scrollbar-width: none !important;
    width: 100% !important;
}

.md-pills-row::-webkit-scrollbar {
    display: none !important;
}

button.md-pill,
.md-pill {
    display: inline-flex !important;
    align-items: center !important;
    padding: 6px 13px !important;
    background: var(--ms-bg-chip) !important;
    border: 1px solid var(--ms-border) !important;
    border-radius: var(--ms-radius) !important;
    font-family: var(--ms-font) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #4B5563 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: all 0.15s ease !important;
    box-shadow: none !important;
    text-shadow: none !important;
    outline: none !important;
    height: auto !important;
    line-height: 1.4 !important;
    flex-shrink: 0 !important;
}

button.md-pill:hover,
.md-pill:hover {
    background: #E5E7EB !important;
    border-color: #D1D5DB !important;
    color: var(--ms-text-dark) !important;
}

button.md-pill.active,
.md-pill.active {
    background: var(--ms-brand-red) !important;
    border-color: var(--ms-brand-red) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* 2. Şube Kartları Grid */
.md-grid-container {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
    width: 100% !important;
}

.md-branch-box {
    background: #ffffff !important;
    border: 1px solid var(--ms-border) !important;
    border-radius: var(--ms-radius) !important;
    padding: 16px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
    box-sizing: border-box !important;
    width: 100% !important;
    transition: border-color 0.15s ease !important;
}

.md-branch-box:hover {
    border-color: #CBD5E1 !important;
}

/* Başlık & Bölge */
.md-box-header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin-bottom: 6px !important;
}

.md-box-title-wrap {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    flex: 1 !important;
}

.md-box-name {
    font-size: 15.5px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin: 0 !important;
    line-height: 1.3 !important;
}

.md-sub-region {
    font-size: 12px !important;
    color: var(--ms-text-muted) !important;
    font-weight: 500 !important;
}

.md-sub-region i {
    color: var(--ms-brand-red) !important;
    font-size: 11px !important;
    margin-right: 2px !important;
}

.md-open-status {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    color: #16A34A !important;
    background: #F0FDF4 !important;
    padding: 2px 7px !important;
    border-radius: 4px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.md-status-dot {
    width: 5px !important;
    height: 5px !important;
    border-radius: 50% !important;
    background: #16A34A !important;
}

/* Adres */
.md-box-addr {
    font-size: 12px !important;
    color: var(--ms-text-muted) !important;
    margin: 0 0 14px 0 !important;
    line-height: 1.4 !important;
}

/* Alt Çubuk */
.md-box-footer {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding-top: 12px !important;
    border-top: 1px solid #F3F4F6 !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.md-box-btns {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}

a.md-btn-act,
.md-btn-act {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    padding: 6px 11px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
    white-space: nowrap !important;
    box-shadow: none !important;
}

a.md-btn-primary,
.md-btn-primary {
    background: var(--ms-brand-red) !important;
    color: #ffffff !important;
    border: none !important;
}

a.md-btn-primary:hover,
.md-btn-primary:hover {
    background: var(--ms-brand-red-hover) !important;
    color: #ffffff !important;
}

a.md-btn-sec,
.md-btn-sec {
    background: var(--ms-bg-chip) !important;
    border: 1px solid var(--ms-border) !important;
    color: var(--ms-text-dark) !important;
}

a.md-btn-sec:hover,
.md-btn-sec:hover {
    background: #E5E7EB !important;
    color: var(--ms-text-dark) !important;
}

/* Uygulama Logoları */
.md-apps-cluster {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    flex-wrap: wrap !important;
}

.md-app-link {
    width: 28px !important;
    height: 28px !important;
    border-radius: 4px !important;
    background: #ffffff !important;
    border: 1px solid var(--ms-border) !important;
    padding: 2px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: transform 0.15s ease !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
}

.md-app-link:hover {
    transform: translateY(-1px) !important;
    border-color: #CBD5E1 !important;
}

.md-app-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 2px !important;
    display: block !important;
}

/* Sonuç Bulunamadı */
.md-no-results {
    grid-column: span 2 !important;
    text-align: center !important;
    padding: 40px 20px !important;
    background: #ffffff !important;
    border: 1px dashed var(--ms-border) !important;
    border-radius: var(--ms-radius) !important;
}

.md-no-results i {
    font-size: 28px !important;
    color: var(--ms-text-light) !important;
    margin-bottom: 8px !important;
}

.md-no-results h4 {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--ms-text-dark) !important;
    margin: 0 0 2px 0 !important;
}

.md-no-results p {
    font-size: 12.5px !important;
    color: var(--ms-text-muted) !important;
    margin: 0 !important;
}

/* ==========================================================================
   3. KESİN MOBİL VE TABLET RESPONSIVE
   ========================================================================== */
@media (max-width: 860px) {
    .md-grid-container {
        grid-template-columns: 1fr !important;
    }
    .md-no-results {
        grid-column: span 1 !important;
    }
}

@media (max-width: 600px) {
    .marmaris-directory-app {
        padding: 0 8px !important;
        margin: 20px auto !important;
    }

    .md-filter-card {
        padding: 12px 14px !important;
    }

    .md-branch-box {
        padding: 14px 14px !important;
    }

    /* Alt Çubuğu Mobilde 2 Satır Yap (Butonlar Üstte, Logolar Altta) - ASLA TAŞMAZ */
    .md-box-footer {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }

    .md-box-btns {
        display: flex !important;
        width: 100% !important;
        gap: 6px !important;
    }

    .md-box-btns .md-btn-act {
        flex: 1 !important;
        justify-content: center !important;
        text-align: center !important;
        padding: 8px 6px !important;
        font-size: 11px !important;
    }

    .md-apps-cluster {
        display: flex !important;
        width: 100% !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        padding-top: 4px !important;
    }
}