/* Modern font */
:root {
  --font-family-primary: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body, input, select, textarea, button {
  font-family: var(--font-family-primary) !important;
}

/* Header: black background */
#header {
  background: #111 !important;
  border-bottom: none;
  box-shadow: 0 1px 4px rgba(0,0,0,0.3);
  color: #ccc !important;
}

/* Branding: logo only, no text styling needed */
#branding h1 {
  margin: 0;
}

/* Login page: center and enlarge logo, hide theme toggle */
body.login #header {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 24px 16px;
}
body.login #branding {
  display: flex;
  justify-content: center;
}
body.login #branding h1 img {
  height: 90px !important;
}
body.login .theme-toggle {
  display: none !important;
}

/* User tools */
#user-tools {
  color: #ccc !important;
}
#user-tools strong {
  color: #fff !important;
  font-weight: 600;
}
/* All links and the logout button in the header */
#header a:link,
#header a:visited,
#user-tools a:link,
#user-tools a:visited,
#logout-form button {
  color: #ccc !important;
  border-bottom: none !important;
}
#header a:hover,
#header a:focus,
#user-tools a:hover,
#user-tools a:focus,
#logout-form button:hover,
#logout-form button:focus {
  color: #fff !important;
  border-bottom: none !important;
  text-decoration: underline;
}

/* Breadcrumbs: light gray background, subtle border, no heavy blue */
div.breadcrumbs {
  background: #f5f7f9 !important;
  border-bottom: 1px solid #e0e5e9;
  color: #666 !important;
  font-size: 0.82rem;
}
div.breadcrumbs a {
  color: #417690 !important;
  font-weight: 500;
}
div.breadcrumbs a:hover,
div.breadcrumbs a:focus {
  color: #2d5468 !important;
}

/* Widen the autocomplete user selector in the Owner Association inline */
.inline-group .select2-container {
  width: 300px !important;
}

.geoposition-search { visibility: visible; padding-right: 100px; }
.deletelink { width: 50px; text-align: center; }
.skip-to-content-link { display: none; }

/* Stack labels above inputs so fields align consistently */
.change-form fieldset .form-row > div {
    display: flex;
    flex-direction: column;
}
.change-form fieldset .form-row label {
    float: none !important;
    width: auto !important;
    margin-bottom: 4px;
    font-weight: 600;
}
.change-form fieldset .form-row .field-box,
.change-form fieldset .form-row input,
.change-form fieldset .form-row select,
.change-form fieldset .form-row textarea {
    margin-left: 0 !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* List view: always fill the container width */
#result_list {
    width: 100%;
}

@media (max-width: 767px) {
    /* Override the colMS margin that reserves space for the filter sidebar */
    .colMS {
        margin-right: 0 !important;
    }

    /* Stack the changelist and filter sidebar vertically */
    #changelist {
        flex-direction: column !important;
    }
    #changelist-filter {
        flex: 0 0 auto !important;
        width: 100% !important;
        margin: 16px 0 0 0 !important;
        order: 2 !important;
    }
    #changelist .changelist-form-container {
        width: 100% !important;
        order: 1 !important;
    }

    /* Override Django's .filtered class which sets toolbar and results to width:auto */
    .filtered #toolbar,
    .change-list .filtered .results {
        width: 100% !important;
    }

    /* Search: let the input fill the row, hide the button (use keyboard Go/Search) */
    #searchbar {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        font-size: 16px; /* prevents iOS zoom on focus */
    }
    #changelist-search input[type="submit"] {
        display: none;
    }

    /* Hide middle columns, show name + status only */
    /* columns (no checkbox): 1=name 2=city 3=province 4=hashgacha 5=status */
    #result_list th:nth-child(2),
    #result_list th:nth-child(3),
    #result_list th:nth-child(4),
    #result_list td:nth-child(2),
    #result_list td:nth-child(3),
    #result_list td:nth-child(4) {
        display: none;
    }

    /* Submit row buttons wrap and stretch */
    .submit-row {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }
    .submit-row input,
    .submit-row a {
        flex: 1 1 auto;
        text-align: center;
        box-sizing: border-box;
    }

    /* Inline tables scroll horizontally within their section */
    .inline-group .tabular {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        display: block;
    }
}