/* /assets/css/city-compare.css */
.mk-compare-main{min-height: 100vh;padding-bottom: 3.5rem;}.compare-page{width: min(100% - (var(--mk-gutter, 24px) * 2), var(--mk-container, 1220px));max-width: var(--mk-container, 1220px);margin: 0 auto;display: flex;flex-direction: column;gap: 1.25rem;box-sizing: border-box;}.compare-hero{position: relative;overflow: hidden;padding: clamp(1.5rem, 3vw, 2.25rem);border-radius: var(--mk-radius-xl, 16px);background: linear-gradient(135deg, #131722 0%, #1f2536 55%, #2a151b 100%);border: 1px solid rgba(255, 255, 255, 0.08);box-shadow: 0 20px 48px rgba(10, 14, 26, 0.25);color: #ffffff;}.compare-hero::before{position: absolute;inset: 0 auto 0 0;width: 4px;background: linear-gradient(180deg, #8f1d1d 0%, #ef4444 100%);content: "";}.compare-hero .hero-bg-pattern{position: absolute;top: -50px;right: -50px;width: 320px;height: 320px;border-radius: 50%;background: radial-gradient(circle, rgba(143, 29, 29, 0.2) 0%, rgba(16, 185, 129, 0.05) 50%, transparent 70%);pointer-events: none;z-index: 1;}.compare-hero .hero-content{position: relative;z-index: 2;display: flex;align-items: center;justify-content: space-between;gap: 2rem;flex-wrap: wrap;}.compare-hero .hero-left{max-width: 680px;}.compare-kicker-bar{display: flex;align-items: center;gap: 0.65rem;margin-bottom: 0.5rem;}.compare-kicker{display: inline-flex;align-items: center;gap: 0.35rem;padding: 0.25rem 0.65rem;border-radius: 6px;background: rgba(143, 29, 29, 0.25);border: 1px solid rgba(239, 68, 68, 0.3);color: #fca5a5;font-size: 0.76rem;font-weight: 600;text-transform: uppercase;letter-spacing: 0.02em;}.compare-back-link{display: inline-flex;align-items: center;gap: 0.3rem;color: #94a3b8;font-size: 0.8rem;font-weight: 700;text-decoration: none;transition: color 0.15s ease;}.compare-back-link:hover{color: #ffffff;}.compare-hero .hero-title{margin: 0 0 0.5rem;color: #ffffff;font-size: clamp(1.75rem, 2.8vw, 2.4rem);font-weight: 750;letter-spacing: -0.022em;line-height: 1.2;display: flex;align-items: center;gap: 0.75rem;}.compare-hero .hero-title span{background: linear-gradient(135deg, #fbbf24 0%, #e5b65a 50%, #fef08a 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}.compare-hero .hero-title svg{color: #f87171;width: 1.15em;height: 1.15em;filter: drop-shadow(0 2px 8px rgba(239, 68, 68, 0.4));}.compare-hero .hero-subtitle{margin: 0;color: #cbd5e1;font-size: 0.95rem;line-height: 1.6;}.compare-hero .hero-stats-grid{display: flex;gap: 0.85rem;flex-wrap: wrap;}.compare-hero .hero-stat-card{display: flex;align-items: center;gap: 0.75rem;padding: 0.85rem 1.15rem;border-radius: 12px;background: rgba(255, 255, 255, 0.06);border: 1px solid rgba(255, 255, 255, 0.1);backdrop-filter: blur(8px);min-width: 130px;}.compare-hero .stat-icon{width: 38px;height: 38px;border-radius: 10px;background: rgba(143, 29, 29, 0.3);border: 1px solid rgba(239, 68, 68, 0.3);color: #fca5a5;display: flex;align-items: center;justify-content: center;flex-shrink: 0;}.compare-hero .stat-icon svg{width: 18px;height: 18px;}.compare-hero .stat-value{font-size: 1.35rem;font-weight: 700;letter-spacing: -0.015em;color: #ffffff;line-height: 1.1;}.compare-hero .stat-denominator{font-size: 0.85rem;color: #94a3b8;font-weight: 600;}.compare-hero .stat-label{font-size: 0.76rem;color: #94a3b8;font-weight: 700;text-transform: uppercase;letter-spacing: 0.03em;margin-top: 2px;}.compare-warning{display: flex;align-items: center;gap: 0.85rem;padding: 0.9rem 1.25rem;border-radius: 12px;background: #fffbeb;border: 1px solid #fde68a;color: #92400e;font-size: 0.88rem;line-height: 1.5;}.compare-warning .warning-icon{width: 22px;height: 22px;flex-shrink: 0;color: #d97706;}.compare-warning strong{color: #b45309;font-weight: 800;}.compare-form-card{background: #ffffff;border: 1px solid #e2e8f0;border-radius: 16px;box-shadow: 0 6px 24px rgba(15, 23, 42, 0.04);padding: 1.35rem 1.5rem;display: flex;flex-direction: column;gap: 1.15rem;}.compare-form-head{display: flex;align-items: center;justify-content: space-between;gap: 1rem;flex-wrap: wrap;border-bottom: 1px solid #f1f5f9;padding-bottom: 0.85rem;}.compare-form-head h2{margin: 0;font-size: 1.1rem;font-weight: 800;color: #0f172a;display: flex;align-items: center;gap: 0.5rem;}.compare-form-head h2 svg{color: #8f1d1d;}.compare-preset-chips{display: flex;align-items: center;gap: 0.45rem;flex-wrap: wrap;}.compare-preset-label{font-size: 0.78rem;font-weight: 700;color: #64748b;}.compare-preset-btn{display: inline-flex;align-items: center;gap: 0.3rem;padding: 0.28rem 0.65rem;border-radius: 6px;background: #f8fafc;border: 1px solid #cbd5e1;color: #334155;font-size: 0.78rem;font-weight: 700;text-decoration: none;transition: all 0.15s ease;}.compare-preset-btn:hover{background: #fef2f2;border-color: #fca5a5;color: #8f1d1d;transform: translateY(-1px);}.compare-slots-grid{display: grid;grid-template-columns: repeat(3, 1fr);gap: 1rem;}@media (max-width: 900px){.compare-slots-grid{grid-template-columns: 1fr;}}.compare-slot-box{position: relative;border: 1.5px solid #e2e8f0;border-radius: 12px;padding: 0.95rem 1rem;background: #f8fafc;display: flex;flex-direction: column;gap: 0.5rem;transition: border-color 0.18s, box-shadow 0.18s;}.compare-slot-box:focus-within{border-color: #8f1d1d;background: #ffffff;box-shadow: 0 0 0 3px rgba(143, 29, 29, 0.12);}.compare-slot-box.is-filled{border-color: #cbd5e1;background: #ffffff;}.compare-slot-header{display: flex;align-items: center;justify-content: space-between;}.compare-slot-tag{display: inline-flex;align-items: center;gap: 0.35rem;font-size: 0.76rem;font-weight: 800;color: #64748b;text-transform: uppercase;letter-spacing: 0.03em;}.slot-num-circle{width: 20px;height: 20px;border-radius: 50%;background: #0f172a;color: #ffffff;display: flex;align-items: center;justify-content: center;font-size: 0.72rem;font-weight: 800;}.compare-slot-box:nth-child(1) .slot-num-circle{background: #8f1d1d;}.compare-slot-box:nth-child(2) .slot-num-circle{background: #0d9488;}.compare-slot-box:nth-child(3) .slot-num-circle{background: #3b82f6;}.compare-slot-input-wrap{position: relative;display: flex;align-items: center;width: 100%;min-height: 48px;background: #ffffff;border: 1.5px solid #cbd5e1;border-radius: 10px;padding: 0 12px 0 14px;transition: all 0.15s ease;box-sizing: border-box;}.compare-slot-input-wrap:focus-within{border-color: #8f1d1d;box-shadow: 0 0 0 3px rgba(143, 29, 29, 0.12);}.compare-slot-icon{position: relative;display: inline-flex;align-items: center;justify-content: center;color: #8f1d1d;flex-shrink: 0;margin-right: 10px;pointer-events: none;z-index: 2;}.compare-slot-icon svg{width: 18px;height: 18px;display: block;}body:not(.mk-shell-backoffice) .compare-slot-input-wrap select.compare-slot-select,.compare-slot-input-wrap .compare-slot-select,select.compare-slot-select{flex: 1 1 auto;width: 100%;height: 44px;min-height: 44px !important;border: none;outline: none;background: transparent;padding: 0 4px;margin: 0;color: #0f172a;font-size: 0.94rem;font-weight: 600 !important;font-family: inherit;appearance: none;-webkit-appearance: none;-moz-appearance: none !important;cursor: pointer;box-shadow: none;line-height: normal;}body:not(.mk-shell-backoffice) .compare-slot-input-wrap select.compare-slot-select:focus,.compare-slot-input-wrap .compare-slot-select:focus{outline: none !important;border: none !important;box-shadow: none !important;}.compare-slot-arrow{position: relative;display: inline-flex;align-items: center;justify-content: center;color: #64748b;flex-shrink: 0;margin-left: 8px;pointer-events: none;z-index: 2;}.compare-slot-arrow svg{width: 16px;height: 16px;display: block;}.compare-form-actions{display: flex;align-items: center;justify-content: flex-end;gap: 0.75rem;padding-top: 0.5rem;}.compare-submit-btn{display: inline-flex;align-items: center;justify-content: center;gap: 0.5rem;height: 44px;padding: 0 1.6rem;border-radius: 10px;background: #8f1d1d;color: #ffffff;border: none;font-size: 0.92rem;font-weight: 800;cursor: pointer;transition: all 0.18s ease;box-shadow: 0 4px 14px rgba(143, 29, 29, 0.25);}.compare-submit-btn:hover{background: #751717;transform: translateY(-1px);box-shadow: 0 6px 18px rgba(143, 29, 29, 0.35);}.compare-reset-btn{display: inline-flex;align-items: center;justify-content: center;gap: 0.4rem;height: 44px;padding: 0 1.15rem;border-radius: 10px;background: #f8fafc;color: #64748b;border: 1px solid #cbd5e1;font-size: 0.88rem;font-weight: 700;text-decoration: none;transition: all 0.15s ease;}.compare-reset-btn:hover{background: #f1f5f9;color: #0f172a;border-color: #94a3b8;}.compare-table-wrap{width: 100%;max-width: 100%;overflow-x: auto;-webkit-overflow-scrolling: touch;border-radius: 16px;box-shadow: 0 8px 30px rgba(15, 23, 42, 0.05);background: #ffffff;border: 1px solid #e2e8f0;padding: 0;}.compare-table{width: 100%;min-width: 760px;border-collapse: collapse;text-align: left;}.compare-table thead th{background: #f8fafc;border-bottom: 2px solid #e2e8f0;padding: 1.15rem 1.25rem;vertical-align: bottom;}.compare-table thead th:first-child{width: 210px;min-width: 210px;background: #f1f5f9;color: #334155;font-size: 0.84rem;font-weight: 700;text-transform: uppercase;letter-spacing: 0.02em;position: sticky;left: 0;z-index: 5;border-right: 1px solid #e2e8f0;}.compare-city-col-head{display: flex;flex-direction: column;gap: 0.35rem;}.city-head-name{font-size: 1.25rem;font-weight: 700;letter-spacing: -0.015em;color: #0f172a;display: flex;align-items: center;gap: 0.5rem;}.city-head-region{display: inline-flex;align-items: center;font-size: 0.74rem;font-weight: 600;text-transform: uppercase;letter-spacing: 0.02em;color: #0d9488;background: #f0fdfa;border: 1px solid #ccfbf1;padding: 0.2rem 0.55rem;border-radius: 6px;width: fit-content;}.city-head-actions{display: flex;align-items: center;gap: 0.4rem;margin-top: 0.4rem;}.city-head-link{display: inline-flex;align-items: center;gap: 0.3rem;font-size: 0.78rem;font-weight: 800;color: #8f1d1d;background: #fef2f2;border: 1px solid #fecaca;padding: 0.25rem 0.65rem;border-radius: 6px;text-decoration: none;transition: all 0.15s ease;}.city-head-link:hover{background: #8f1d1d;color: #ffffff;border-color: #8f1d1d;}.city-remove-btn{display: inline-flex;align-items: center;justify-content: center;width: 26px;height: 26px;border-radius: 6px;background: #f1f5f9;border: 1px solid #cbd5e1;color: #64748b;text-decoration: none;transition: all 0.15s ease;}.city-remove-btn:hover{background: #fee2e2;color: #ef4444;border-color: #fca5a5;}.compare-table tbody td{padding: 1rem 1.25rem;border-bottom: 1px solid #f1f5f9;vertical-align: top;font-size: 0.92rem;line-height: 1.5;color: #334155;}.compare-table tbody tr:hover td{background-color: #fcfdfe;}.compare-table tbody tr td:first-child{font-weight: 800;color: #0f172a;background: #f8fafc;border-right: 1px solid #e2e8f0;position: sticky;left: 0;z-index: 4;white-space: nowrap;}.compare-table tbody tr:hover td:first-child{background: #f1f5f9;}.table-crit-label{display: flex;align-items: center;gap: 0.45rem;font-weight: 800;color: #0f172a;}.table-crit-label svg{color: #64748b;width: 16px;height: 16px;}.score-meter-wrap{display: flex;align-items: center;gap: 0.65rem;}.score-meter-bar{flex: 1;height: 8px;background: #e2e8f0;border-radius: 999px;overflow: hidden;position: relative;max-width: 140px;}.score-meter-fill{height: 100%;border-radius: 999px;transition: width 0.4s ease;}.score-meter-fill.is-high{background: linear-gradient(90deg, #10b981, #059669);}.score-meter-fill.is-mid{background: linear-gradient(90deg, #f59e0b, #d97706);}.score-meter-fill.is-low{background: linear-gradient(90deg, #ef4444, #dc2626);}.score-meter-badge{display: inline-flex;align-items: center;justify-content: center;font-size: 0.8rem;font-weight: 800;padding: 0.2rem 0.55rem;border-radius: 6px;min-width: 44px;}.score-meter-badge.is-high{background: #ecfdf5;color: #065f46;border: 1px solid #a7f3d0;}.score-meter-badge.is-mid{background: #fffbeb;color: #92400e;border: 1px solid #fde68a;}.score-meter-badge.is-low{background: #fef2f2;color: #991b1b;border: 1px solid #fecaca;}.score-meter-badge.is-none{background: #f1f5f9;color: #64748b;border: 1px solid #cbd5e1;}.cost-pill{display: inline-flex;align-items: center;gap: 0.35rem;padding: 0.25rem 0.7rem;border-radius: 999px;font-size: 0.8rem;font-weight: 800;}.cost-pill.is-dusuk{background: #ecfdf5;color: #065f46;border: 1px solid #a7f3d0;}.cost-pill.is-orta{background: #eff6ff;color: #1e40af;border: 1px solid #bfdbfe;}.cost-pill.is-yuksek{background: #fffbeb;color: #92400e;border: 1px solid #fde68a;}.cost-pill.is-cok-yuksek{background: #fef2f2;color: #991b1b;border: 1px solid #fecaca;}.cost-pill.is-belirsiz{background: #f1f5f9;color: #64748b;border: 1px solid #cbd5e1;}.becayis-cell-data{display: flex;flex-direction: column;gap: 0.3rem;}.becayis-count-row{display: flex;align-items: center;gap: 0.5rem;}.becayis-count-badge{font-size: 1.15rem;font-weight: 700;letter-spacing: -0.015em;color: #0f172a;}.becayis-table-link{display: inline-flex;align-items: center;gap: 0.25rem;font-size: 0.78rem;font-weight: 650;color: #8f1d1d;text-decoration: none;transition: color 0.15s ease;margin-top: 0.2rem;}.becayis-table-link:hover{color: #b91c1c;text-decoration: underline;}.becayis-table-link svg{width: 14px;height: 14px;}.verified-section-row td{background: #f8fafc !important;padding: 0.75rem 1.25rem !important;border-top: 2px solid #e2e8f0 !important;border-bottom: 2px solid #e2e8f0 !important;}.verified-section-badge{display: inline-flex;align-items: center;gap: 0.4rem;font-size: 0.78rem;font-weight: 800;color: #0d9488;text-transform: uppercase;letter-spacing: 0.04em;}.compare-notes-section{display: flex;flex-direction: column;gap: 1.25rem;}.note-category-card{background: #ffffff;border: 1px solid #e2e8f0;border-radius: 16px;box-shadow: 0 4px 18px rgba(15, 23, 42, 0.03);padding: 1.25rem 1.5rem;}.note-category-card.is-pros{border-color: #a7f3d0;background: radial-gradient(circle at top right, rgba(16, 185, 129, 0.05), transparent 40%), #ffffff;}.note-category-card.is-cons{border-color: #fde68a;background: radial-gradient(circle at top right, rgba(245, 158, 11, 0.05), transparent 40%), #ffffff;}.note-card-title{margin: 0 0 1rem;font-size: 1.15rem;font-weight: 800;color: #0f172a;display: flex;align-items: center;gap: 0.55rem;border-bottom: 1px solid #f1f5f9;padding-bottom: 0.65rem;}.note-card-title.pros-title svg{color: #10b981;}.note-card-title.cons-title svg{color: #f59e0b;}.note-cols-grid{display: grid;gap: 1.15rem;}.note-cols-grid.cols-1{grid-template-columns: 1fr;}.note-cols-grid.cols-2{grid-template-columns: repeat(2, 1fr);}.note-cols-grid.cols-3{grid-template-columns: repeat(3, 1fr);}@media (max-width: 820px){.note-cols-grid.cols-2,.note-cols-grid.cols-3{grid-template-columns: 1fr;}}.note-city-column{background: #f8fafc;border: 1px solid #e2e8f0;border-radius: 12px;padding: 1rem 1.15rem;display: flex;flex-direction: column;gap: 0.5rem;}.note-city-pill{display: inline-flex;align-items: center;gap: 0.35rem;font-size: 0.86rem;font-weight: 800;color: #0f172a;}.note-city-pill svg{color: #8f1d1d;width: 16px;height: 16px;}.note-city-text{margin: 0;font-size: 0.9rem;line-height: 1.65;color: #334155;white-space: pre-line;}.compare-districts-card{background: #ffffff;border: 1px solid #e2e8f0;border-radius: 16px;box-shadow: 0 4px 18px rgba(15, 23, 42, 0.03);padding: 1.35rem 1.5rem;}.compare-districts-head{margin-bottom: 1.25rem;border-bottom: 1px solid #f1f5f9;padding-bottom: 0.75rem;}.compare-districts-head h2{margin: 0 0 0.25rem;font-size: 1.2rem;font-weight: 800;color: #0f172a;}.compare-districts-head span{font-size: 0.85rem;color: #64748b;}.district-city-group h3{margin: 0 0 0.85rem;font-size: 1.05rem;font-weight: 800;color: #0f172a;display: flex;align-items: center;gap: 0.45rem;}.district-mini-card{background: #ffffff;border: 1px solid #e2e8f0;border-radius: 10px;padding: 0.75rem 0.95rem;margin-bottom: 0.65rem;display: flex;flex-direction: column;gap: 0.35rem;box-shadow: 0 1px 4px rgba(15, 23, 42, 0.02);}.district-mini-card-head{display: flex;align-items: center;justify-content: space-between;}.district-mini-card strong{font-size: 0.92rem;font-weight: 800;color: #0f172a;}.district-score-pill{font-size: 0.74rem;font-weight: 800;padding: 0.15rem 0.45rem;border-radius: 4px;background: #ecfdf5;color: #065f46;border: 1px solid #a7f3d0;}.district-mini-card p{margin: 0;font-size: 0.84rem;line-height: 1.5;color: #475569;}.district-mini-card small{font-size: 0.76rem;color: #64748b;font-weight: 600;}.district-more-link{display: inline-flex;align-items: center;gap: 0.3rem;font-size: 0.82rem;font-weight: 800;color: #8f1d1d;text-decoration: none;margin-top: 0.45rem;}.district-more-link:hover{text-decoration: underline;}.compare-empty-card{background: #ffffff;border: 1.5px dashed #cbd5e1;border-radius: 16px;padding: 3.5rem 1.5rem;text-align: center;display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 0.85rem;}.empty-state-icon{width: 64px;height: 64px;border-radius: 20px;background: #fef2f2;border: 1px solid #fecaca;color: #8f1d1d;display: flex;align-items: center;justify-content: center;margin-bottom: 0.25rem;}.empty-state-icon svg{width: 32px;height: 32px;}.compare-empty-card h2{margin: 0;font-size: 1.35rem;font-weight: 700;letter-spacing: -0.018em;color: #0f172a;}.compare-empty-card p{margin: 0;font-size: 0.94rem;color: #64748b;max-width: 52ch;line-height: 1.6;}.empty-preset-actions{display: flex;align-items: center;gap: 0.65rem;flex-wrap: wrap;justify-content: center;margin-top: 0.75rem;}.empty-preset-btn{display: inline-flex;align-items: center;gap: 0.45rem;padding: 0.55rem 1rem;border-radius: 8px;background: #f8fafc;border: 1px solid #cbd5e1;color: #1e293b;font-size: 0.86rem;font-weight: 750;text-decoration: none;transition: all 0.18s ease;}.empty-preset-btn:hover{background: #fef2f2;color: #8f1d1d;border-color: #fca5a5;transform: translateY(-1px);box-shadow: 0 4px 12px rgba(143, 29, 29, 0.1);}
