:root {
  --swiss-black: #000000;
  --swiss-white: #ffffff;
  --swiss-gray-900: #000000;
  --swiss-gray-800: #1a1a1a;
  --swiss-gray-700: #333333;
  --swiss-gray-600: #666666;
  --swiss-gray-500: #999999;
  --swiss-gray-400: #cccccc;
  --swiss-gray-300: #e5e5e5;
  --swiss-gray-200: #f5f5f5;
  --swiss-gray-100: #ffffff;
  --primary-color: var(--swiss-black);
  --secondary-color: var(--swiss-gray-600);
  --success-color: var(--swiss-black);
  --warning-color: var(--swiss-gray-600);
  --danger-color: var(--swiss-black);
  --light-color: var(--swiss-white);
  --dark-color: var(--swiss-black);
}

body {
  font-family: 'Helvetica Neue', Arial, sans-serif;
  background-color: var(--swiss-white);
  color: var(--swiss-black);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.3px;
}

.navbar-brand { font-weight: 700; font-size: 1.75rem; letter-spacing: -0.5px; color: var(--swiss-black) }
.navbar-brand img { max-height: 32px; width: auto; filter: none }
.logo-white { filter: brightness(0) invert(1) }
.logo-primary { filter: none }
.main-content { min-height: calc(100vh - 200px); padding: 2rem 0 }

.card { border: 2px solid var(--swiss-black); border-radius: 0; background-color: var(--swiss-white); box-shadow: none; transition: none }
.card:hover { box-shadow: none; transform: none }

.btn { border-radius: 0; font-weight: 700; padding: 0.75rem 1.5rem; border: 2px solid var(--swiss-black); letter-spacing: 1px; text-transform: uppercase; transition: none }
.btn-primary { background-color: var(--swiss-black); border-color: var(--swiss-black); color: var(--swiss-white) }
.btn-primary:hover { background-color: var(--swiss-white); border-color: var(--swiss-black); color: var(--swiss-black) }
.btn-secondary { background-color: var(--swiss-white); border-color: var(--swiss-black); color: var(--swiss-black) }
.btn-secondary:hover { background-color: var(--swiss-black); border-color: var(--swiss-black); color: var(--swiss-white) }

.form-control, .form-select { border-radius: 0; border: 2px solid var(--swiss-black); background-color: var(--swiss-white); color: var(--swiss-black); font-weight: 400; padding: 0.75rem 1rem }
.form-control:focus, .form-select:focus { border-color: var(--swiss-black); box-shadow: none; background-color: var(--swiss-white) }
.form-label { font-weight: 700; color: var(--swiss-black); letter-spacing: 0.5px; text-transform: uppercase; font-size: 0.875rem }

.footer { background-color: var(--swiss-black); color: var(--swiss-white); padding: 2rem 0; margin-top: auto; border-top: 2px solid var(--swiss-black) }
.loading { opacity: 0.6; pointer-events: none }
.htmx-request { opacity: 0.6 }
.htmx-indicator { display: none }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { display: inline }

h1, .h1 { font-size: 2.5rem; font-weight: 700; color: var(--swiss-black); letter-spacing: -0.5px; margin-bottom: 1rem }
h2, .h2 { font-size: 2rem; font-weight: 700; color: var(--swiss-black); letter-spacing: -0.3px; margin-bottom: 0.875rem }
h3, .h3 { font-size: 1.5rem; font-weight: 700; color: var(--swiss-black); letter-spacing: 0px; margin-bottom: 0.75rem }
h4, .h4 { font-size: 1.25rem; font-weight: 700; color: var(--swiss-black); letter-spacing: 0.5px; text-transform: uppercase; margin-bottom: 0.5rem }
h5, .h5 { font-size: 1.125rem; font-weight: 700; color: var(--swiss-black); letter-spacing: 0.5px; text-transform: uppercase; margin-bottom: 0.5rem }
h6, .h6 { font-size: 1rem; font-weight: 700; color: var(--swiss-black); letter-spacing: 1px; text-transform: uppercase; margin-bottom: 0.5rem }

.alert { border-radius: 0; border: 2px solid var(--swiss-black); background-color: var(--swiss-white); color: var(--swiss-black); font-weight: 400 }
.alert-success { border-color: var(--swiss-black); background-color: var(--swiss-white); color: var(--swiss-black) }
.alert-danger { border-color: var(--swiss-black); background-color: var(--swiss-white); color: var(--swiss-black) }
.alert-warning { border-color: var(--swiss-gray-600); background-color: var(--swiss-white); color: var(--swiss-gray-600) }
.alert-info { border-color: var(--swiss-gray-600); background-color: var(--swiss-white); color: var(--swiss-gray-600) }

.table { border: 2px solid var(--swiss-black); background-color: var(--swiss-white) }
.table th { background-color: var(--swiss-black); color: var(--swiss-white); font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; border: 1px solid var(--swiss-black) }
.table td { border: 1px solid var(--swiss-black); color: var(--swiss-black) }
.table-striped tbody tr:nth-of-type(odd) { background-color: var(--swiss-white) }

.navbar { border-bottom: 2px solid var(--swiss-black); background-color: var(--swiss-white) }
.navbar-nav .nav-link { color: var(--swiss-black); font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; padding: 0.75rem 1rem }
.navbar-nav .nav-link:hover { color: var(--swiss-gray-600) }
.navbar-nav .nav-link.active { color: var(--swiss-black); background-color: var(--swiss-white) }
.navbar-toggler { border-color: var(--swiss-black) }
.navbar-toggler:focus { box-shadow: 0 0 0 0.25rem rgba(0,0,0,0.1) }

@media (max-width: 768px) {
  .main-content { padding: 1rem 0 }
  .card { margin-bottom: 1rem }
}

.alert-success { border-left: 4px solid var(--success-color); background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%) }
.alert-success .bi-check-circle { color: var(--success-color) }
.alert-success strong { background: linear-gradient(135deg, var(--success-color), #059669); color: #fff; padding: 2px 8px; border-radius: 12px; font-weight: 600; text-shadow: 0 1px 2px rgba(0,0,0,0.1) }

.properties-scroll-container { max-height: 600px; overflow-y: auto; border: 1px solid #e9ecef; border-radius: 10px; padding: 1rem; background: #f8f9fa }
.properties-scroll-container::-webkit-scrollbar { width: 8px }
.properties-scroll-container::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 4px }
.properties-scroll-container::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 4px }
.properties-scroll-container::-webkit-scrollbar-thumb:hover { background: #a8a8a8 }

.properties-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.5rem; padding: 0.5rem }
.property-card { background: #fff; border-radius: 12px; padding: 1.5rem; box-shadow: 0 2px 8px rgba(0,0,0,0.1); transition: all 0.3s ease; border: 1px solid #e9ecef }
.property-card:hover { transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,0.15) }
.property-meta { display: flex; gap: 1rem; margin-bottom: 1rem; font-size: 0.9rem; color: #6c757d }
.property-features { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 1.5rem }
.feature-badge { background: #f8f9fa; color: #6c757d; padding: 0.25rem 0.75rem; border-radius: 20px; font-size: 0.8rem; border: 1px solid #dee2e6 }
.feature-badge.has { background: #d1ecf1; color: #0c5460; border-color: #bee5eb }
.quick-actions { display: flex; gap: 0.75rem }
.quick-actions .btn { flex: 1; font-size: 0.875rem; padding: 0.5rem 1rem }

.dashboard-search .card { border: 1px solid #e9ecef; border-radius: 10px }
.dashboard-search .input-group-text { border-right: none; background-color: #f8f9fa }
.dashboard-search .form-control { border-left: none }
.dashboard-search .form-control:focus { border-color: #3b82f6; box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25); border-left: none }
.dashboard-search .form-select:focus { border-color: #3b82f6; box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25) }
.dashboard-search .btn { font-size: 0.875rem; padding: 0.5rem 0.75rem }
@media (max-width: 768px) {
  .dashboard-search .row { margin: 0 }
  .dashboard-search .col-md-5, .dashboard-search .col-md-3, .dashboard-search .col-md-2 { margin-bottom: 0.5rem }
}

.empty-search-results, .empty-no-properties { padding: 2rem; background: #f8f9fa; border-radius: 12px; border: 1px solid #e9ecef }
.empty-search-results i, .empty-no-properties i { color: #6c757d; margin-bottom: 1rem }
.empty-search-results h3, .empty-no-properties h3 { color: #343a40; font-weight: 600 }
.empty-search-results p, .empty-no-properties p { color: #6c757d; font-size: 1rem }
.empty-search-results .btn, .empty-no-properties .btn { padding: 0.5rem 1.5rem; font-weight: 500 }

.spinner-border.text-primary { width: 3rem; height: 3rem }

.pwa-install-prompt { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); z-index: 1000; background: #fff; border-radius: 15px; box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15); padding: 1rem; max-width: 90%; display: none }
.pwa-install-prompt.show { display: block }