:root {
    --fs-green: #2E7D32;
    --fs-green-dark: #256628;
    --fs-green-light: #e8f5e9;
    --fs-green-secondary: #4CAF50;
    --fs-navy: #1F2937;
    --fs-gold: #f5b300;
    --fs-red: #DC2626;

    /* ---- Design tokens: spacing scale ---- */
    --fs-space-1: 4px;
    --fs-space-2: 8px;
    --fs-space-3: 16px;
    --fs-space-4: 20px;
    --fs-space-5: 24px;
    --fs-space-6: 32px;

    /* Semantic aliases used throughout this file */
    --fs-page-padding: 12px;                /* equal L/R/T around main content */
    --fs-card-padding: 14px;                /* compact card body/header */
    --fs-section-gap: 12px;                 /* space between cards / sections */
    --fs-field-gap: var(--fs-space-2);      /* 8px */
    --fs-button-gap: var(--fs-space-2);     /* 8px */

    /* ---- Radius / shadow / motion ---- */
    --fs-radius-sm: 6px;
    --fs-radius: 10px;
    --fs-radius-lg: 14px;
    --fs-radius-xl: 16px;
    --fs-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
    --fs-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    --fs-shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.12);
    --fs-transition: 150ms ease-in-out;
    --fs-modal-duration: 200ms;

    /* ---- Surfaces ---- */
    --fs-body-bg: #F5F7FA;
    --fs-card-bg: #ffffff;
    --fs-border: #E5E7EB;

    /* ---- Status / text colours ---- */
    --fs-gray: #6B7280;
    --fs-gray-light: #eef0f3;
    --fs-text: #1F2937;

    /* Popup tokens live primarily in admin_popup.css (single source of truth).
       Keep aliases here so older rules that still reference them don't break. */
    --fs-popup-primary: #2E7D32;
    --fs-popup-secondary: #4CAF50;
    --fs-popup-bg: #F8FAFC;
    --fs-popup-card: #FFFFFF;
    --fs-popup-border: #E5E7EB;
    --fs-popup-text: #1F2937;
    --fs-popup-muted: #6B7280;
    --fs-popup-danger: #DC2626;
    --fs-popup-overlay: rgba(0, 0, 0, 0.45);
    --fs-popup-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);
    --fs-popup-radius: 14px;
    --fs-popup-gap: 12px;
    --fs-popup-field-gap: 8px;
    --fs-popup-pad-x: 16px;
    --fs-popup-pad-y: 12px;
    --fs-popup-input-h: 38px;
    --fs-popup-header-pad: 16px 24px;
    --fs-popup-footer-h: 60px;
    --fs-popup-width-sm: 650px; 
    --fs-popup-width-md: 850px;
    --fs-popup-width-lg: 1050px;
}

/* =====================================================================
   DESIGN SYSTEM - GLOBAL
   Consistent page background, card surface, spacing and typography used
   across every admin page (changelist, change form, custom tabs, etc.).
   Everything below only restyles existing Bootstrap4/AdminLTE (Jazzmin)
   markup - no HTML structure, routes or behaviour is changed.
   ===================================================================== */

body,
.content-wrapper {
    background-color: var(--fs-body-bg) !important;
}

* {
    scrollbar-width: thin;
}

.content-header {
    padding: var(--fs-page-padding) var(--fs-page-padding) 0 !important;
}

/* Page title + breadcrumb strip (Dashboard / Home > _ ) */
.content-wrapper>.content.border-bottom {
    background-color: #ffffff !important;
    border-bottom: 1px solid var(--fs-border) !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
}

.content-wrapper>.content.border-bottom>.container-fluid {
    padding: var(--fs-page-padding) 2rem !important;
}

/* Kill AdminLTE / Bootstrap default content padding so L/R aren't doubled */
.content-wrapper>.content {
    padding: 0 !important;
    margin: 0 !important;
}

.content>.container-fluid,
.content>.container {
    padding: var(--fs-page-padding) !important;
    width: 100%;
}

/* Nested Jazzmin <section id="content" class="content"> adds a second gutter */
.content .container-fluid>section.content,
section#content.content {
    padding: 0 !important;
    margin: 0 !important;
}

/* Main listing/form content - same top gap as left/right */
.content-wrapper>.content:not(.border-bottom)>.container-fluid,
.content-wrapper>.content:not(.border-bottom)>.container {
    padding: 2rem !important;
}

.card,
.small-box,
.info-box {
    background-color: var(--fs-card-bg);
    border: 1px solid var(--fs-border);
    /* border-radius: var(--fs-radius) !important; */
    box-shadow: var(--fs-shadow-sm);
    transition: box-shadow var(--fs-transition), transform var(--fs-transition);
}

.card {
    margin-bottom:10px;
}

.card .card-header {
    background-color: var(--fs-card-bg);
    border-bottom: 1px solid var(--fs-border);
    border-top-left-radius: var(--fs-radius) !important;
    border-top-right-radius: var(--fs-radius) !important;
    padding: var(--fs-space-3) var(--fs-card-padding);
    font-weight: 600;
}

.card .card-body {
    padding: var(--fs-card-padding);
}

.card .card-footer {
    background-color: var(--fs-card-bg);
    border-top: 1px solid var(--fs-border);
    border-bottom-left-radius: var(--fs-radius) !important;
    border-bottom-right-radius: var(--fs-radius) !important;
}

/* Fieldset "cards" inside change forms (Jazzmin renders each fieldset as
   its own .card inside the tab content) get the same spacing rhythm. */
.tab-content .card {
    box-shadow: none;
    border: 1px solid var(--fs-border);
}

h1, h2, h3, h4, h5, h6,
.card-title {
    color: var(--fs-navy);
    font-weight: 600;
    letter-spacing: -0.01em;
}

/* Visible keyboard focus ring everywhere (accessibility) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible {
    outline: 0px solid var(--fs-navy);
    outline-offset: 0px;
}

/* =====================================================================
   HEADER (top navbar)
   ===================================================================== */

/* Navbar */
.main-header.navbar-success,
.navbar-success {
    background-color: var(--fs-green) !important;
    border-color: var(--fs-green-dark) !important;
    box-shadow: var(--fs-shadow-sm);
}

.main-header .navbar-nav .nav-link, .main-header .navbar-nav .nav-link:focus, .main-header .navbar-nav .nav-link:hover {
    color: #ffffff !important;
    background: rgba(255,255,255,0.1);
}

.main-header.navbar {
    min-height: 56px;
    display: flex;
    align-items: center;
    padding-left: 2rem;
    padding-right: 2rem;
}

.main-header .nav-item {
    display: flex;
    align-items: center;
}

.main-header .nav-link {
    border-radius: var(--fs-radius-sm);
    transition: background-color var(--fs-transition);
}

.main-header .nav-item:not(.dropdown) > .nav-link:hover,
.main-header .nav-link.dropdown-toggle:hover {
    background-color: rgba(255, 255, 255, 0.14);
}

/* Breadcrumbs */
.content-header .breadcrumb {
    background: transparent;
    padding: 0;
    margin: var(--fs-space-1) 0 0;
    font-size: 0.8125rem;
}

.content-header .breadcrumb-item + .breadcrumb-item::before {
    color: var(--fs-gray);
}

.content-header .breadcrumb-item a {
    color: var(--fs-gray);
}

.content-header .breadcrumb-item.active {
    color: var(--fs-navy);
    font-weight: 500;
}

.content-header h1 {
    font-size: 1.5rem;
    margin-bottom: 2px;
}

/* User dropdown */
.dropdown-menu {
    border-radius: var(--fs-radius) !important;
    border: 1px solid var(--fs-border);
    box-shadow: var(--fs-shadow);
    padding: var(--fs-space-2) 0;
    animation: fs-fade-in 120ms ease-out;
}

.dropdown-item {
    padding: var(--fs-space-2) var(--fs-space-3);
    transition: background-color var(--fs-transition), padding-left var(--fs-transition);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--fs-green-light);
    color: var(--fs-navy);
    padding-left: calc(var(--fs-space-3) + 4px);
}

@keyframes fs-fade-in {
    from { opacity: 0; transform: translateY(-4px);}
    to { opacity: 1; transform: translateY(0);}
}

/* =====================================================================
   SIDEBAR
   ===================================================================== */

/* Logged-in user row under the logo */
.main-sidebar .user-panel {
    border-bottom: 1px solid rgba(46, 125, 50, 0.12);
    background: var(--fs-green);
    padding: 5px !important;
    margin: 0px !important;
    width: calc(100% + 0px);
    position: relative;
    overflow: visible;
    margin-bottom: 8px !important;
}
.main-sidebar .user-panel:before {
    position: absolute;
    content: "";
    background: var(--fs-green);
    width: 100%;
    height: 101%;
    top: 0px;
    left: -8px;
    z-index: -1;
}
.main-sidebar .user-panel:after {
    position: absolute;
    content: "";
    background: var(--fs-green);
    width: 100%;
    height: 101%;
    top: 0px;
    right: -8px;
    z-index: -1;
}

.main-sidebar .user-panel .image {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 0.15rem;
}

.main-sidebar .user-panel .fs-user-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.15rem;
    height: 2.15rem;
    border-radius: 999px;
    background: var(--fs-green);
    color: #ffffff;
    font-size: 0.95rem;
    box-shadow: var(--fs-shadow-sm);
}

.main-sidebar .user-panel .info {
    padding-left: 0.65rem;
    line-height: 1.2;
}

.main-sidebar .user-panel .info a,
.main-sidebar .user-panel .info .fs-user-name {
    color: var(--fs-navy) !important;
    font-weight: 600;
    font-size: 0.95rem;
}

.main-sidebar .user-panel .info .fs-user-name::before {
    content: '\f007';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    margin-right: 6px;
    color: var(--fs-green);
}

/* .main-sidebar .user-panel .info a:hover {
    color: var(--fs-green) !important;
}
 */

.sidebar-light-success .nav-sidebar > .nav-item > .nav-link.active,
.sidebar-light-success .nav-sidebar .nav-treeview > .nav-item > .nav-link.active {
    background-color: var(--fs-green) !important;
    color: #ffffff !important;
    box-shadow: var(--fs-shadow-sm);
}

.sidebar-light-success .nav-sidebar > .nav-item > .nav-link:hover,
.sidebar-light-success .nav-sidebar .nav-treeview > .nav-item > .nav-link:hover {
    background-color: var(--fs-green-light) !important;
    color: var(--fs-navy) !important;
}

.sidebar-light-success .nav-header {
    color: var(--fs-green);
    font-weight: 600;
    letter-spacing: 0;
    font-size: 16px;
    padding-top: var(--fs-space-3);
    white-space: normal !important;
}

.nav-sidebar .nav-item {
    margin-bottom: 2px;
}

/* Keep active green pill inset from sidebar edges (not flush to border) */
.main-sidebar .sidebar > nav.mt-2 {
    padding-left: 0.35rem;
    padding-right: 0.35rem;
}

.main-sidebar .nav-sidebar > .nav-item > .nav-link,
.main-sidebar .nav-sidebar .nav-treeview > .nav-item > .nav-link {
    border-radius: 10px !important;
    margin: 0rem !important;
    width: calc(100% - 0rem) !important;
    max-width: calc(100% - 0rem) !important;
    min-height: 42px;
    display: flex;
    padding: .5rem .5rem !important;
    align-items: center;
    box-sizing: border-box;
    transition: background-color var(--fs-transition), color var(--fs-transition), transform var(--fs-transition);
    gap: 5px;
    row-gap: 0;
}

.nav-sidebar .nav-link:active {
    transform: scale(0.99);
}

.nav-sidebar .nav-icon {
    width: 1.4rem;
    text-align: center;
    margin-right: var(--fs-space-2);
    transition: transform var(--fs-transition);
}

.nav-sidebar .nav-link:hover .nav-icon {
    transform: translateX(1px) scale(1.05);
}

.nav-sidebar .nav-treeview {
    transition: opacity 180ms ease-in-out;
}

.nav-sidebar .nav-treeview .nav-link {
    min-height: 38px;
    font-size: 0.92rem;
}

.nav-sidebar .right.badge {
    border-radius: 999px;
}

/* Collapse/expand caret rotates smoothly instead of snapping */
.nav-sidebar .nav-item > .nav-link > .right.fa-angle-left {
    transition: transform var(--fs-transition);
}

.main-sidebar {
    box-shadow: var(--fs-shadow-sm);
    transition: margin-left var(--fs-transition), width var(--fs-transition);
}

/* Collapsed sidebar: expand ONLY via hamburger click - never on hover */
body.sidebar-mini.sidebar-collapse .main-sidebar,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused {
    width: 4.6rem !important;
    margin-left: 0 !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar .nav-link p,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .nav-sidebar .nav-link p,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .nav-sidebar .nav-link p {
    width: 0 !important;
    margin-left: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    display: none !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar .brand-text,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .brand-text,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .brand-text {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar .user-panel .info,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .user-panel .info,
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .user-panel .info {
    display: none !important;
}

/* Keep content margin stable while collapsed (no hover push) */
body.sidebar-mini.sidebar-collapse .content-wrapper,
body.sidebar-mini.sidebar-collapse .main-footer,
body.sidebar-mini.sidebar-collapse .main-header {
    margin-left: 4.6rem !important;
}

/* =====================================================================
   BUTTONS
   Equal height, consistent radius/spacing and a subtle hover "lift" for
   every button variant (Save, Delete, Add, row actions, etc.) without
   touching any of the underlying <button>/<a> markup or click behaviour.
   ===================================================================== */

.btn-success,
.btn-success:hover,
.btn-success:focus,
.btn-success:active {
    background-color: var(--fs-green) !important;
    border-color: var(--fs-green-dark) !important;
    color: #ffffff !important;
}

.btn-primary {
    background-color: var(--fs-navy) !important;
    border-color: var(--fs-navy) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #023072 !important;
    border-color: #023072 !important;
}

.btn-danger {
    background-color: var(--fs-red) !important;
    border-color: #b01500 !important;
}

.btn,
input[type="submit"].btn,
a.button {
    border-radius: var(--fs-radius-sm) !important;
    min-height: 38px;
    height: 38px;
    padding: 0 1rem !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--fs-button-gap);
    font-weight: 500 !important;
    font-size: 1rem;
    letter-spacing: 0.01em;
    box-shadow: var(--fs-shadow-sm);
    transition: transform var(--fs-transition), box-shadow var(--fs-transition), filter var(--fs-transition);
    box-sizing: border-box;
    line-height: 1.2;
}

.btn.btn-sm,
a.button {
    min-height: 38px;
    height: 38px;
    padding: 0 1rem;
    font-size: 1rem;
}

/* Shared equal-size button used on changelist / forms */
.fs-btn,
.page-actions .btn,
#search_group .btn,
.fs-actions .btn,
.fs-form-actions .btn,
.dashboard .btn-group > .btn {
    min-width: 88px;
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 1rem !important;
    font-size: 0.875rem !important;
}

.btn i,
.btn .fas,
.btn .far,
.btn .fab {
    font-size: 0.9em;
}

.btn:hover,
a.button:hover {
    transform: translateY(-1px);
    box-shadow: var(--fs-shadow);
    filter: brightness(1.04);
    text-decoration: none;
}

.btn:active {
    transform: translateY(0);
    filter: brightness(0.98);
}

.btn:disabled,
.btn.disabled {
    transform: none;
    box-shadow: none;
    filter: none;
}

/* Buttons placed next to each other (e.g. Upload & Import / Cancel,
   Search / Reset) get a consistent gap instead of relying on stray
   margin utility classes. */
/* Dashboard model cards: space between Add and Change buttons */
.dashboard .btn-group {
    display: inline-flex;
    gap: var(--fs-button-gap);
}

.dashboard .btn-group > .btn {
    border-radius: var(--fs-radius-sm) !important;
    margin: 0 !important;
}

.dashboard .btn-group > .btn:not(:first-child) {
    margin-left: 0 !important;
}

a {
    color: var(--fs-green);
}

a:hover {
    color: var(--fs-green-dark);
}

/* =====================================================================
   TABLES (all admin tables - changelist, inlines, related tabs, dashboard)
   Same structure & colour format everywhere: striped rows, sticky uppercase
   header, green hover, status badges, full width.
   ===================================================================== */

.content-wrapper .table,
#result_list,
.card .table,
.tabular .table,
.dashboard .table {
    width: 100% !important;
    margin-bottom: 0;
    background-color: #ffffff;
    border-collapse: separate;
    border-spacing: 0;
}

.content-wrapper .table th,
.content-wrapper .table td,
#result_list th,
#result_list td,
.tabular .table th,
.tabular .table td {
    padding: var(--fs-space-2) !important;
    vertical-align: middle !important;
    border-color: var(--fs-border) !important;
    font-size: 1rem;
}

/* Django/Jazzmin wraps cell content in <p> - remove extra gap */
.content-wrapper .table td p,
.content-wrapper .table th p,
#result_list td p,
#result_list th p,
.tabular .table td p,
.tabular .table th p,
.card .table td p,
.card .table th p {
    margin: 0 !important;
    padding: 0 !important;
}

.content-wrapper .table thead th,
#result_list thead th,
.tabular .table thead th {
    position: sticky;
    top: 0px;
    z-index: 2;
    background-color: #ffffff !important;
    border-bottom: 1px solid var(--fs-border) !important;
    border-top: none !important;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--fs-gray) !important;
    white-space: nowrap;
}

.content-wrapper .table thead th a,
#result_list thead th .text a {
    color: var(--fs-gray) !important;
}

.content-wrapper .table thead th a:hover,
#result_list thead th .text a:hover {
    color: var(--fs-navy) !important;
}

/* Sortable column headers - clear affordance + active state */
#result_list thead th.sortable .text {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

#result_list thead th.sortable .fs-sort-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none !important;
    cursor: pointer;
}

#result_list thead th.sortable .fs-sort-icon {
    font-size: 0.75rem;
    opacity: 0.35;
    color: var(--fs-gray);
}

#result_list thead th.sortable:hover .fs-sort-icon,
#result_list thead th.sorted .fs-sort-icon.active {
    opacity: 1;
    color: var(--fs-green);
}

#result_list thead th.sorted {
    color: var(--fs-navy) !important;
}

#result_list thead th.sorted .fs-sort-link {
    color: var(--fs-navy) !important;
}

#result_list thead th .fs-sort-clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    color: var(--fs-gray) !important;
    opacity: 0.55;
    text-decoration: none !important;
}

#result_list thead th .fs-sort-clear:hover {
    opacity: 1;
    color: var(--fs-red) !important;
    background: rgba(218, 26, 0, 0.08);
}

/* Striped rows + hover (same as Crop Master) */
.content-wrapper .table tbody tr:nth-child(even),
#result_list tbody tr.even,
#result_list tbody tr:nth-child(even) {
    background-color: #fff !important;
}

.content-wrapper .table tbody tr,
#result_list tbody tr,
.tabular .table tbody tr {
    transition: background-color var(--fs-transition);
}

.content-wrapper .table tbody tr:hover,
#result_list tbody tr:hover,
.tabular .table tbody tr:hover {
    background-color: #fff !important;
}

/* ID / primary links in green (Crop Master style) */
#result_list tbody th a,
#result_list tbody td.field-id a,
.content-wrapper .table tbody td:first-child a {
    color: var(--fs-green);
    font-weight: 400;
    font-size: 16px;
}

#result_list tbody th a:hover,
.content-wrapper .table tbody td:first-child a:hover {
    color: var(--fs-green-dark);
}

/* Full-width changelist card - no clipped / half-width table */
#changelist .results,
#changelist .card,
#changelist .table-responsive {
    width: 100%;
    max-width: 100%;

}

/* #changelist .table-responsive{
    border-radius: var(--fs-radius) !important;
} */

#changelist #result_list {
    min-width: 100%;
}

/* Checkboxes (bulk-select + Yes/No boolean columns) */
input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--fs-green);
    cursor: pointer;
    vertical-align: middle;
}

/* Pagination (Jazzmin uses Bootstrap .pagination) */
.fs-pagination-info {
    gap: 12px;
    width: 100%;
    padding: var(--fs-space-3) 0;
    color: #6B7280;
    font-size: 1rem;
}

.fs-changelist-pages {
    margin-left: auto !important;
    display: inline-flex;
    align-items: center;
}

.fs-changelist-pages .pagination {
    gap: 4px;
    padding: 0;
    margin: 0;
    float: none !important;
}

.fs-changelist-pages .page-link {
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--fs-border, #E5E7EB);
    border-radius: 6px !important;
    background: #ffffff;
    color: #374151;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
}

.fs-changelist-pages .page-item.active .page-link {
    background: var(--fs-green, #2E7D32) !important;
    border-color: var(--fs-green, #2E7D32) !important;
    color: #ffffff !important;
}

.fs-changelist-pages .page-item:not(.active):not(.disabled) .page-link:hover {
    background: var(--fs-green-light, #e8f5e9);
    border-color: rgba(46, 125, 50, 0.35);
    color: var(--fs-green-dark, #256628);
    text-decoration: none;
}

.fs-changelist-pages .page-item.disabled .page-link,
.fs-changelist-pages .page-item.previous.disabled .page-link,
.fs-changelist-pages .page-item.next.disabled .page-link {
    opacity: 0.45;
    pointer-events: none;
}

.fs-per-page {
    flex: 0 0 auto;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    font-size: 1rem;
    white-space: nowrap;
    width: auto !important;
    max-width: none !important;
    position: relative;
}

/* Compact custom per-page picker (replaces native select popup) */
.fs-per-page-picker {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
    vertical-align: middle;
}

.fs-per-page-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    max-width: 44px;
    height: 28px;
    padding: 0 4px;
    margin: 0;
    border: 1px solid var(--fs-border, #E5E7EB);
    border-radius: 6px;
    background: #ffffff;
    color: #374151;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    box-shadow: none;
}

.fs-per-page-trigger:hover {
    border-color: #D1D5DB;
    background: #F9FAFB;
}

.fs-per-page-trigger:focus,
.fs-per-page-picker.is-open .fs-per-page-trigger {
    border-color: var(--fs-green) !important;
    box-shadow: 0px 0px 0px 0px rgba(46, 125, 50, 0.15);
    outline: none;
}

.fs-per-page-menu {
    position: absolute;
    left: 0;
    bottom: calc(100% + 4px);
    z-index: 1050;
    min-width: 44px;
    width: 44px;
    margin: 0;
    padding: 4px;
    list-style: none;
    background: #ffffff;
    border: 1px solid var(--fs-border, #E5E7EB);
    border-radius: 8px;
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.12);
}

.fs-per-page-menu[hidden] {
    display: none !important;
}

.fs-per-page-menu li {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 26px;
    margin: 0px;
    padding: 0px;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    user-select: none;
}

.fs-per-page-menu li:hover {
    background: var(--fs-green-light, #e8f5e9);
    color: var(--fs-green-dark, #256628);
}

.fs-per-page-menu li.is-active,
.fs-per-page-menu li[aria-selected="true"] {
    background: var(--fs-green, #2E7D32);
    color: #ffffff;
}

/* Prevent any leftover native select from showing beside the picker */
.fs-per-page-picker select,
.fs-per-page select.fs-per-page-select,
.fs-pagination-info select.fs-per-page-select,
.fs-inline-pagination select.fs-per-page-select {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.pagination,
.paginator {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: var(--fs-space-3) 0;
    margin: 0px;
    flex-wrap: wrap;
    list-style: none;
}

.pagination .page-item .page-link,
.paginator a,
.paginator .this-page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0px 10px;
    border-radius: var(--fs-radius-sm) !important;
    border: 1px solid var(--fs-border);
    background: #ffffff;
    color: var(--fs-navy);
    font-weight: 500;
    transition: background-color var(--fs-transition), color var(--fs-transition), border-color var(--fs-transition);
}

.pagination .page-item .page-link:hover,
.paginator a:hover {
    background-color: var(--fs-green-light);
    border-color: rgba(60, 142, 63, 0.35);
    color: var(--fs-green-dark);
    text-decoration: none;
}

.pagination .page-item.active .page-link,
.paginator .this-page {
    background-color: var(--fs-green) !important;
    border-color: var(--fs-green) !important;
    color: #ffffff !important;
    font-weight: 600;
}

.fs-changelist-results .row {
    align-items: center;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--fs-border);
}

.fs-changelist-results .dataTables_info {
    color: var(--fs-gray);
    font-size: 1rem;
    padding: var(--fs-space-3) 0;
}

/* Status badges - solid green Active / gray Inactive (same as Crop Master) */
.fs-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    line-height: 1.6;
    white-space: nowrap;
}

.fs-badge i {
    font-size: 0.55rem;
}

.fs-badge-success {
    background-color: var(--fs-green) !important;
    color: #ffffff !important;
}

.fs-badge-gray {
    background-color: var(--fs-gray-light) !important;
    color: var(--fs-gray) !important;
}

.fs-badge-warning {
    background-color: var(--fs-gold) !important;
    color: var(--fs-navy) !important;
}

.fs-badge-danger {
    background-color: var(--fs-red) !important;
    color: #ffffff !important;
}

.content-header h1,
.login-box-msg {
    color: var(--fs-navy) !important;
}

.badge-success,
.bg-success {
    background-color: var(--fs-green) !important;
}

.text-success {
    color: var(--fs-green) !important;
}

.login-page,
.jazzmin-login-page {
    background: linear-gradient(135deg, #f0f8f0 0%, var(--fs-green-light) 100%) !important;
}

.login-box .btn-primary {
    background-color: var(--fs-green) !important;
    border-color: var(--fs-green-dark) !important;
}

.login-box .btn-primary:hover {
    background-color: var(--fs-green-dark) !important;
}

/* ========== Sidebar brand / home logo ========== */
.main-sidebar .brand-link.farmsaarthi-brand,
.main-sidebar a.brand-link#jazzy-logo,
.farmsaarthi-brand {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: auto !important;
    min-height: 110px !important;
    max-height: none !important;
    padding: 0.85rem 0.75rem !important;
    margin: 0px !important;
    background: #ffffff !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
    white-space: normal !important;
    overflow: visible !important;
}

.main-sidebar .farmsaarthi-sidebar-logo,
.farmsaarthi-sidebar-logo {
    float: none !important;
    display: block !important;
    width: 55% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    margin: 0px auto !important;
    padding: 0px !important;
    line-height: normal !important;
    object-fit: contain !important;
    opacity: 1 !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0px !important;
    background: transparent !important;
    filter: none !important;
}

/* Expanded: full wordmark at medium size. Collapsed: compact FS cube icon. */
.main-sidebar .brand-link .farmsaarthi-sidebar-logo-icon {
    display: none !important;
}

.main-sidebar .brand-link .farmsaarthi-sidebar-logo-full {
    display: block !important;
    width: 150px !important;
    max-width: 150px !important;
}

.main-sidebar .brand-text {
    display: none !important;
}

/* Collapsed sidebar brand uses the compact FS logo */
body.sidebar-mini.sidebar-collapse .main-sidebar .brand-link.farmsaarthi-brand,
body.sidebar-mini.sidebar-collapse .main-sidebar a.brand-link#jazzy-logo {
    min-height: 4.6rem !important;
    height: 4.6rem !important;
    max-height: 4.6rem !important;
    padding: 0.55rem 0.35rem !important;
    overflow: hidden !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar .brand-link .farmsaarthi-sidebar-logo-full {
    display: none !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar .brand-link .farmsaarthi-sidebar-logo-icon {
    display: block !important;
    width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    object-fit: contain !important;
}

/* Collapsed (mini) sidebar: center icons, proper green active tile */
.sidebar-mini.sidebar-collapse .main-sidebar .sidebar>nav.mt-2 {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar .user-panel {
    display: none !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item {
    margin: 0px 0px 4px !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item>.nav-link,
.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link {
    margin: 0px auto !important;
    width: 2.85rem !important;
    max-width: 2.85rem !important;
    min-height: 2.85rem !important;
    height: 2.85rem !important;
    padding: 0px !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link {
    width: 2rem !important;
    max-width: 2rem !important;
    min-height: 2rem !important;
    height: 2rem !important;
}


.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item>.nav-link .nav-icon,
.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link .nav-icon {
    margin: 0px !important;
    width: auto !important;
    font-size: 1.15rem !important;
    text-align: center !important;
    color: inherit !important;
}
body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link  i.nav-icon {
    font-size: 1rem !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item>.nav-link p,
.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item>.nav-link .right {
    display: none !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item>.nav-link.active,
body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link.active {
    background-color: var(--fs-green) !important;
    color: #ffffff !important;
    box-shadow: var(--fs-shadow-sm);
}

body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item>.nav-link.active .nav-icon,
body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar .nav-treeview>.nav-item>.nav-link.active .nav-icon {
    color: #ffffff !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item>.nav-link:hover {
    background-color: var(--fs-green-light) !important;
    color: var(--fs-navy) !important;
}

body.sidebar-mini.sidebar-collapse .main-sidebar .nav-sidebar>.nav-item>.nav-link:hover .nav-icon {
    color: var(--fs-navy) !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar .nav-header {
    display: none !important;
}

/* ========== Login / Logout logo ========== */
.login-box {
    width: 440px;
    margin-top: 3vh;
}

.login-box .card {
    border: none;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(1, 33, 88, 0.1);
}

.login-logo {
    margin: 0px auto 0.75rem !important;
    padding: 0px !important;
    text-align: center;
    background: transparent !important;
}

.login-logo h1 {
    margin: 0;
    font-size: inherit;
}

.farmsaarthi-login-logo,
.login-logo img {
    display: block !important;
    width: 360px !important;
    max-width: 90vw !important;
    height: auto !important;
    max-height: none !important;
    margin: 0px auto !important;
    object-fit: contain !important;
    opacity: 1 !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0px !important;
    background: transparent !important;
    filter: none !important;
}

.login-card-body,
.register-card-body {
    padding-top: 0.75rem;
}

.alert-warning,
.badge-warning {
    background-color: var(--fs-gold) !important;
    color: var(--fs-navy) !important;
}

/* =====================================================================
   TABS
   Change-form top-level tabs (General / Crop Stage Master / Crop Pests /
   Crop Diseases, Farmer's General / Farmer Farms / Farmer Crops) and the
   inline listing tabs inside each of those - same Bootstrap nav-tabs
   markup, just a more modern look with a smooth active-state transition.
   ===================================================================== */

.nav-tabs {
    border-bottom: 1px solid var(--fs-border);
    gap: 2px;
}

.nav-tabs .nav-link {
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    padding: 0.65rem 1.1rem;
    color: var(--fs-gray);
    font-weight: 600;
    font-size: 1rem;
    background: transparent;
    transition: color var(--fs-transition), border-color var(--fs-transition), background-color var(--fs-transition);
}

.nav-tabs .nav-link:hover {
    color: var(--fs-green-dark);
    border-color: transparent;
    background-color: var(--fs-green-light);
    border-top-left-radius: var(--fs-radius-sm);
    border-top-right-radius: var(--fs-radius-sm);
}

.nav-tabs .nav-link.active {
    color: var(--fs-green-dark);
    background: transparent;
    border-color: transparent transparent var(--fs-green);
    border-top-left-radius: var(--fs-radius-sm);
    border-top-right-radius: var(--fs-radius-sm);
}

.tab-content>.tab-pane {
    transition: opacity 180ms ease-in-out;
}

/* Nested "tabular" tab-like fieldset cards (Vegetation Indices, Soil
   Conditions, etc. inside Crop Stage Master's own form) */
.card-header+.card-body,
.nav-pills .nav-link.active {
    transition: background-color var(--fs-transition), color var(--fs-transition);
}

/* =====================================================================
   FORMS - two-column layout
   Django field tuples e.g. ('category', 'crop_name') render as one
   .fs-form-group-multi row with two equal columns (label above each
   control). Lone wide fields (textarea / CKEditor / map / address)
   stay full width. Unpaired short fields still share a 2-col CSS grid.
   ===================================================================== */

.form-group {
    margin-bottom: var(--fs-field-gap);
}

.form-group>.row {
    align-items: flex-start;
}

.form-group label {
    font-weight: 600;
    font-size: 13px;
    line-height: 1.25;
    color: #3a3f4b;
    padding-top: 5px;
    margin-bottom: 0px;
}

.form-group label .text-red {
    color: var(--fs-red) !important;
    font-weight: 700;
}

/* Fallback grid for any leftover unpaired short fields */
.fs-form-grid,
.change-form .card-body:has(> .form-group),
.change-form .p-5:has(> .form-group),
body.popup .card-body:has(> .form-group),
body.popup .p-5:has(> .form-group),
body.popup .fs-popup-card-body:has(> .form-group) {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1rem;
    row-gap: 8px;
    align-items: start;
}

.change-form .card-body:has(> .form-group)>.fs-form-actions,
.change-form .card-body:has(> .form-group)>.fs-popup-title,
.change-form .card-body:has(> .form-group)>.fs-popup-actions,
.change-form .card-body:has(> .form-group)>.nav,
.change-form .card-body:has(> .form-group)>.tab-content,
.change-form .card-body:has(> .form-group)>.alert,
body.popup .card-body:has(> .form-group)>.fs-form-actions,
body.popup .card-body:has(> .form-group)>.fs-popup-title,
body.popup .card-body:has(> .form-group)>.fs-popup-actions,
body.popup .fs-popup-card-body:has(> .form-group)>.fs-form-actions,
body.popup .fs-popup-card-body:has(> .form-group)>.fs-popup-title,
body.popup .fs-popup-card-body:has(> .form-group)>.fs-popup-actions,
body.popup .fs-popup-card-body:has(> .form-group)>.nav,
body.popup .fs-popup-card-body:has(> .form-group)>.tab-content {
    grid-column: 1 / -1;
}

.fs-form-grid>.form-group,
.change-form .card-body:has(> .form-group)>.form-group,
.change-form .p-5:has(> .form-group)>.form-group,
body.popup .card-body:has(> .form-group)>.form-group,
body.popup .p-5:has(> .form-group)>.form-group,
body.popup .fs-popup-card-body:has(> .form-group)>.form-group {
    margin-bottom: 0;
    min-width: 0;
}

/* Label stacked above control */
.fs-form-grid .form-group>.row,
.change-form .form-group>.row,
body.popup .form-group>.row {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    margin-left: 0px;
    margin-right: 0px;
}

.fs-form-grid .form-group>.row>label.col-sm-3,
.fs-form-grid .form-group>.row>label.col-auto,
.change-form .form-group>.row>label.col-sm-3,
.change-form .form-group>.row>label.col-auto,
body.popup .form-group>.row>label.col-sm-3,
body.popup .form-group>.row>label.col-auto {
    flex: 0 0 auto;
    max-width: 100%;
    width: 100%;
    padding: 0px 0px 4px !important;
    margin: 0px;
    font-size: 13px;
    line-height: 1.25;
    font-weight: 600;
    color: #3a3f4b;
}

.fs-form-grid .form-group>.row>.col-sm-7,
.fs-form-grid .form-group>.row>.col-auto.fieldBox,
.change-form .form-group>.row>.col-sm-7,
.change-form .form-group>.row>.col-auto.fieldBox,
body.popup .form-group>.row>.col-sm-7,
body.popup .form-group>.row>.col-auto.fieldBox {
    flex: 0 0 auto;
    max-width: 100%;
    width: 100%;
    padding: 0px !important;
    margin: 0px !important;
}

.change-form .form-group>.row>.col-sm-7 .form-control,
.change-form .form-group>.row>.col-sm-7 input:not([type="checkbox"]):not([type="radio"]),
.change-form .form-group>.row>.col-sm-7 select,
.change-form .form-group>.row>.col-sm-7 textarea,
.change-form .form-group>.row>.col-sm-7 .select2-container,
.change-form .form-group>.row>.col-sm-7 .related-widget-wrapper,
body.popup .form-group>.row>.col-sm-7 .form-control,
body.popup .form-group>.row>.col-sm-7 input:not([type="checkbox"]):not([type="radio"]),
body.popup .form-group>.row>.col-sm-7 select,
body.popup .form-group>.row>.col-sm-7 textarea,
body.popup .form-group>.row>.col-sm-7 .select2-container,
body.popup .form-group>.row>.col-sm-7 .related-widget-wrapper {
    width: 100% !important;
    max-width: 100% !important;
}

/* Full-width only for genuinely wide content (NOT file inputs) */
.fs-form-grid>.form-group.fs-form-group-multi,
.fs-form-grid>.form-group:has(textarea),
.fs-form-grid>.form-group:has(.ck),
.fs-form-grid>.form-group:has(.ck-editor),
.fs-form-grid>.form-group:has(.django_ckeditor_5),
.fs-form-grid>.form-group:has(.fs-boundary-map-widget),
.fs-form-grid>.form-group.field-description,
.fs-form-grid>.form-group.field-remarks,
.fs-form-grid>.form-group.field-damage_symptoms,
.fs-form-grid>.form-group.field-symptoms,
.fs-form-grid>.form-group.field-chemical_management,
.fs-form-grid>.form-group.field-natural_management,
.fs-form-grid>.form-group.field-risk_condition,
.fs-form-grid>.form-group.field-boundary_coordinates,
.fs-form-grid>.form-group.field-address,
.change-form .card-body:has(> .form-group)>.form-group.fs-form-group-multi,
.change-form .card-body:has(> .form-group)>.form-group:has(textarea),
.change-form .card-body:has(> .form-group)>.form-group:has(.ck),
.change-form .card-body:has(> .form-group)>.form-group:has(.django_ckeditor_5),
.change-form .card-body:has(> .form-group)>.form-group:has(.fs-boundary-map-widget),
.change-form .card-body:has(> .form-group)>.form-group.field-description,
.change-form .card-body:has(> .form-group)>.form-group.field-remarks,
.change-form .card-body:has(> .form-group)>.form-group.field-boundary_coordinates,
.change-form .card-body:has(> .form-group)>.form-group.field-address,
body.popup .form-group.fs-form-group-multi,
body.popup .form-group:has(textarea),
body.popup .form-group:has(.ck),
body.popup .form-group:has(.django_ckeditor_5),
body.popup .form-group:has(.fs-boundary-map-widget),
body.popup .form-group.field-description,
body.popup .form-group.field-remarks,
body.popup .form-group.field-damage_symptoms,
body.popup .form-group.field-symptoms,
body.popup .form-group.field-chemical_management,
body.popup .form-group.field-natural_management,
body.popup .form-group.field-risk_condition,
body.popup .form-group.field-boundary_coordinates,
body.popup .form-group.field-address {
    grid-column: 1 / -1;
}

/* Explicit two-column row from Django field tuples */
.form-group.fs-form-group-multi>.row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1rem;
    row-gap: 0px;
    flex-direction: unset;
    align-items: start;
}

.form-group.fs-form-group-multi>.row>label:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
}

.form-group.fs-form-group-multi>.row>.fieldBox:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
    min-width: 0px;
}

.form-group.fs-form-group-multi>.row>label:nth-child(3) {
    grid-column: 2;
    grid-row: 1;
}

.form-group.fs-form-group-multi>.row>.fieldBox:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
    min-width: 0px;
}

.form-group.fs-form-group-multi>.row>.fieldBox .form-control,
.form-group.fs-form-group-multi>.row>.fieldBox input:not([type="checkbox"]):not([type="radio"]),
.form-group.fs-form-group-multi>.row>.fieldBox select,
.form-group.fs-form-group-multi>.row>.fieldBox textarea,
.form-group.fs-form-group-multi>.row>.fieldBox .select2-container,
.form-group.fs-form-group-multi>.row>.fieldBox .related-widget-wrapper {
    width: 100% !important;
    max-width: 100% !important;
}

/* Keep FK related-object icons compact so paired rows stay even */
.related-widget-wrapper {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
}

.related-widget-wrapper>select,
.related-widget-wrapper>.select2-container {
    flex: 1 1 auto;
    min-width: 0px;
    max-width: 100%;
}

.form-group .related-widget-wrapper>select,
.form-group .related-widget-wrapper>.select2-container,
body.popup .form-group .related-widget-wrapper>select,
body.popup .form-group .related-widget-wrapper>.select2-container {
    width: auto !important;
    max-width: none !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

.manage-dropdown-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 5px;
    flex: 0 0 auto;
    height: 38px;
    padding: 0 10px !important;
    margin: 0px !important;
    border-radius: 8px !important;
    border: 1px solid var(--fs-green) !important;
    background: var(--fs-green-light) !important;
    color: var(--fs-green) !important;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none !important;
    box-shadow: none !important;
}

.manage-dropdown-btn i {
    font-size: 12px;
}

.manage-dropdown-btn:hover,
.manage-dropdown-btn:focus {
    background: var(--fs-green) !important;
    border-color: var(--fs-green-dark) !important;
    color: #ffffff !important;
}

/* Globally hide all standard Django FK action buttons (add/change/delete/view icons) */
.related-widget-wrapper>.related-widget-wrapper-link,
.related-widget-wrapper>a[id^="add_id_"],
.related-widget-wrapper>a[id^="change_id_"],
.related-widget-wrapper>a[id^="delete_id_"],
.related-widget-wrapper>a[id^="view_id_"] {
    display: none !important;
}

/* Farmer Farm FK dropdowns - select only, no add/change/view/delete icons */
body.model-farmerfarm.change-form .field-package .related-widget-wrapper-link,
body.model-farmerfarm.change-form .field-farming_type .related-widget-wrapper-link,
body.model-farmerfarm.change-form .field-soil_type .related-widget-wrapper-link,
body.model-farmerfarm.change-form .field-farmer .related-widget-wrapper-link,
body.popup.model-farmerfarm.change-form .field-package .related-widget-wrapper-link,
body.popup.model-farmerfarm.change-form .field-farming_type .related-widget-wrapper-link,
body.popup.model-farmerfarm.change-form .field-soil_type .related-widget-wrapper-link,
body.popup.model-farmerfarm.change-form .field-farmer .related-widget-wrapper-link {
    display: none !important;
}

/* Farmer add/edit - location selects only, no related-widget / Manage extras */
body.model-farmer.change-form .field-state .related-widget-wrapper-link,
body.model-farmer.change-form .field-district .related-widget-wrapper-link,
body.model-farmer.change-form .field-taluka_city .related-widget-wrapper-link,
body.model-farmer.change-form .field-state .manage-dropdown-btn,
body.model-farmer.change-form .field-district .manage-dropdown-btn,
body.model-farmer.change-form .field-taluka_city .manage-dropdown-btn,
body.model-farmerfarm.change-form .field-farmer .manage-dropdown-btn,
body.model-farmerfarm.change-form .field-package .manage-dropdown-btn,
body.model-farmercrop.change-form .field-farm .related-widget-wrapper-link,
body.model-farmercrop.change-form .field-crop .related-widget-wrapper-link,
body.model-farmercrop.change-form .field-farm .manage-dropdown-btn,
body.model-farmercrop.change-form .field-crop .manage-dropdown-btn {
    display: none !important;
}

.form-group .help-block {
    margin: 2px 0 0 !important;
    padding: 0px !important;
    line-height: 1.3;
    min-height: 0;
}

.form-group .help-block.red:not(:has(*)),
.form-group .help-block.text-red:not(:has(*)) {
    display: none !important;
    margin: 0px !important;
}


/* edit popup  06-08-2026*/
body #user_form input[type="password"] {
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    box-shadow: inset 0 0 0 transparent;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

body .page-link:focus {
    box-shadow: 0 0 0;
}

body .fas {
    line-height: normal !important;
}


body.popup .content-wrapper .content>.container-fluid {
    padding: 0px !important;
}

body.popup .content-wrapper .content>.container-fluid .fs-popup-page {
    padding: 0px;
}

/* delete popup */

body.popup .fs-delete-page {
    width: 100%;
}

/* sidebar */
.sidebar-mini .wrapper aside.elevation-4 {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 4px !important;
}

/* select field */
body .select2-container--default .select2-results__option--selected,
body .select2-container--admin-autocomplete .select2-results__option--highlighted[aria-selected] {
    background-color: var(--fs-green);
    color: #ffffff;
}

body .select2-container--admin-autocomplete .select2-selection--single .select2-selection__arrow {
    height: 25px;
    position: absolute;
    top: auto;
    right: 5px;
    width: 25px;
    bottom: auto;
}

/* table css */
body .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, .0);
}
body .content-wrapper .table tbody tr:hover, body  #result_list tbody tr:hover, body .tabular .table tbody tr:hover {
    background-color: transparent;
}

body .form-control:focus,body .vTextField:focus,body .vLargeTextField:focus,body select:focus,body textarea:focus {
    border-color: var(--fs-green) !important;
    box-shadow: 0 0;
    outline: none;
}

/* add input field button */

tr.add-row .btn.btn-sm.btn-default.float-right {
    background: var(--fs-green);
    color: #fff;
    font-size: 14px;
}
.btn.fs-btn-cancel.active {
    background: #f2f2f2;
}

/* 07-08-2026 */
.selector-chosen h2 {
    background: var(--fs-green);
    color: #fff;
    border: none;
}
body .selector ul.selector-chooser {
    float: left;
    width: 22px;
    background-color: transparent;
    border-radius: 10px;
    margin: 3rem 2px;
    padding: 0px;
}

body .dropdown-footer,body .dropdown-header {
    display: block;
    font-size: 1rem;
    padding: .5rem 1rem;
    text-align: left;
    font-weight: 600;
    color: var(--fs-green);
}
body .calendar td.selected a,
body .calendar td a:focus,
body .timelist a:focus,
body .calendar td a:hover,
body .timelist a:hover {
    background: var(--fs-green);
    color: #fff !important;
}
body .calendar caption, body .calendarbox h2, body .clockbox h2 {
    background: var(--fs-green);
    color: #fff !important;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 10px;
}
body .selector-available,body .selector-chosen{
    width: 45%;
}
body .delete a.inline-deletelink{
    margin: 0px;
}
body .timeline>div>.fas::before {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    line-height: 30px;
}
body .timeline>.time-label>span.bg-info {
    background: var(--fs-green) !important;
}

/*11-08-2026*/
body .model-card-icon{background: var(--fs-green);}


/*18-08-2026*/
body .fs-fancy-card:hover {
    box-shadow: 0 0px 0px rgba(46, 125, 50, 0.16);
    border-color: var(--fs-green);
}
body .selector .selector-filter label {
    display: none !important;
}
.selector-add,.selector-remove {
    background: none !important;
}
.fs-popup-form .form-group.fs-form-group-multi.field-farming_type.field-soil_type .col-auto.fieldBox span.select2.select2-container {
    width: calc(100% - 90px) !important;
}
body.popup .fs-popup-form .form-group .fs-map-search-box input[type="text"],
body.model-droneservice .fs-popup-form .form-group .fs-map-search-box input[type="text"] {
    border: none !important;
}
.fs-popup-form button.fs-map-search-clear {
    position: absolute;
    top: 0px;
    right: 10px;
    justify-content: center;
    align-items: center;
    bottom: 0px;
}
body.popup .fs-map-search-overlay .fs-map-search-box,
body.model-droneservice .fs-map-search-overlay .fs-map-search-box {
    border-radius: 8px;
    box-shadow: 0 0px 0px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--fs-popup-input-border);
}

.main-sidebar .user-panel .info{
    display: flex;
    align-items: center;
}
.main-sidebar .user-panel .info a {
    color: #fff !important;
    text-transform: capitalize;
}
.main-sidebar .user-panel .image{
    padding-left: 0px;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    padding-right: 20px;
    color: #495057;
    font-weight: 400;
}
body.popup .manage-dropdown-btn{
    float: right;
}

.related-widget-wrapper .selector select#id_permissions_from, .related-widget-wrapper .selector select#id_permissions_to {
    min-height: 400px !important;
    height: 400px !important;
}
body.model-group .card .card-body .fs-form-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}
.selector .selector-chooseall {
    margin-top: 24px;
}
body .selector-available, body .selector-chosen {
    width: 49%;
}
body .selector-chosen {
    float: right;
}

/* user */
.model-user .related-widget-wrapper {
    flex-direction: column;
}

/* Dropdowns tab */
#dropdown-options-tab .tabular.inline-related.last-related .table tr.form-row,
.model-supportticket.change-form #status_logs-group .form-row,
.change-form.model-supportticket.change-form #images-group .form-row {
    display: table-row !important;
}
#dropdown-options-tab .tabular.inline-related.last-related .table tr#options-empty,
.model-supportticket.change-form #status_logs-group .form-row#status_logs-empty {
    display: none !important;
}
#dropdown-options-tab td.field-name {
    margin: 0px !important;
}
/* droneservice tab */
.model-droneservice .related-widget-wrapper{
    margin: 0px 0 10px;
}
.model-droneservice .fs-map-search-box input[type="text"] {
    border: none;
}

/* model-supportticket tab */

body.model-supportticket .fs-form-grid {
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-top: 0px !important;
}

body.app-farm_admin .alert-success button.close,
body.app-farm_admin .alert-success button.close:hover{
    color: #ffffff;
    opacity: 1;
}

/*19-08-2026*/
body.model-farmer .bg-light> .btn.btn-success.btn-sm {
    color: #ffffff !important;
    border-color: var(--fs-green-dark) !important;
}
.calendar tr:nth-child(1) th {
    padding: 30px 9px;
    padding-bottom: 10px;
}
body.accent-success a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.btn) {
    color: #444444;
}
body .ck.ck-editor__editable.ck-focused:not(.ck-editor__nested-editable), body .ck.ck-balloon-panel.ck-powered-by-balloon[class*=position_border] {
    border: 1px solid #c2c2c2;
    box-shadow: 0 0 0;
}
body.delete-confirmation .content-wrapper .col-xl-6, body.delete-confirmation .content-wrapper .col-lg-8{
    flex: 0 0 100%;
    max-width: 100%;
}
.model-user .card {
    margin-bottom: var(--fs-card-padding);
}
body .timeline>div>.timeline-item>.timeline-header {
    font-weight: 400;
}
body h1.h4.m-0.pr-3.mr-3.border-right:empty {
    display: none;
}
.date-hierarchy .btn {
    margin-right: 5px;
}
.date-hierarchy .btn:last-child {
    margin-right: 0;
}
body .table-hover tbody tr:hover{
    background-color: transparent;
}

/*20-08-2026*/
ol ol, ol ul, ul ol, ul ul{
    list-style: disc;
    padding: 0 0 0 16px;
}
dl, ol, ul{
    padding: 0 0 0 16px;
}
*:focus-visible {
    outline: none;
    box-shadow: 0 0 0;
}
body.sidebar-mini.sidebar-collapse .main-sidebar.sidebar-focused .brand-link,
body.sidebar-mini.sidebar-collapse .main-sidebar:hover .brand-link{
    width: auto;
}
body .tabular .table td.field-status {
    padding-left: 0px !important;
}
.main-footer{
    text-align: center;
}
.nav-sidebar .nav-link p {
    font-size: 14px;
}
.model-farmer .table thead th,
.model-farmer .table thead td {
    border-bottom: none;
    font-size: 0.72rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--fs-gray);
    white-space: nowrap;
}
.model-farmer .table thead th{
    font-weight: 700;
}
.model-farmer .table thead td{
    color: #212529;
}
.modal-footer button.btn.btn-secondary {
    background: #ffffff !important;
    border: 1px solid var(--fs-popup-border) !important;
    color: var(--fs-popup-muted) !important;
    box-shadow: 0 0 0;
    outline: none;
}
body span.select2-selection__clear {
    margin-left: 10px;
}

/* .btn.fs-btn-cancel.active,
.fs-submit-row .btn.fs-btn-cancel {
    background: #f2f2f2 !important;
    border: 1px solid #e7dfdf !important;
    box-shadow: 0 0 0;
    outline: none;
} */

/*21-08-2026*/
.card-primary.card-outline {
    border-top: 1px solid var(--fs-border);
    box-sizing: border-box;
}
.card-primary.card-outline .fa-cloud-sun-rain:before{color: var(--fs-green);}
.model-weatherforecast .align-items-center.justify-content-end.page-actions {
    gap: 12px;
}
.model-farmsatellitedata .form-group.field-is_cloudy_fallback .field-is_cloudy_fallback {
    display: flex;
    gap:5px;
}

/*25-08-2026*/
.vTextField, .vLargeTextField, .vURLField, .vIntegerField, .vBigIntegerField,.vForeignKeyRawIdAdminField, .vDateField, .vTimeField, input[type="number"], input[type="text"]{
    border: 1px solid var(--fs-border) !important;
    border-radius: var(--fs-radius-sm) !important;
}

/* .form-group select {
    appearance: none;
    background: url(https://icons.veryicon.com/png/o/application/chi-shang-3_0/arrow-23.png);
    background-size: 10px;
    background-repeat: no-repeat;
    background-position: center right 10px;
} */

/*select with button*/
body .form-group.fs-form-group-multi > .row > .fieldBox.field-soil_type .select2-container, 
body .form-group.fs-form-group-multi > .row > .fieldBox.field-farming_type .select2-container {
    width: calc(100% - 90px) !important;
}
body .form-group.fs-form-group-multi > .row > .fieldBox.field-soil_type .manage-dropdown-btn,
body .form-group.fs-form-group-multi > .row > .fieldBox.field-farming_type .manage-dropdown-btn{
    float: right;
}
.fs-map-search-box input.fs-map-address-input {
    border: none;
}
.btn-outline-info:hover {
    background-color: var(--fs-green);
    border-color: var(--fs-green);
}
.fs-map-search-overlay input.fs-map-address-input {
    border: none !important;
    padding: 0;
}

.form-control,
.vTextField,
.vLargeTextField,
select,
textarea {
    border-radius: var(--fs-radius-sm) !important;
    border: 1px solid var(--fs-border);
    padding: 0.5rem 0.75rem;
    font-size: 1rem;
    transition: border-color var(--fs-transition), box-shadow var(--fs-transition);
}

.form-control:focus,
.vTextField:focus,
.vLargeTextField:focus,
select:focus,
textarea:focus {
    border-color: var(--fs-green);
    box-shadow: 0 0 0 0px rgba(60, 142, 63, 0.15);
    outline: none;
}

/* 26-08-2026 */

/* .selector select {
    -webkit-appearance: none !important;
    appearance: none !important;
} */

.selector select option:hover, .selector select option:focus, .selector select option:active, .selector select option:checked {
    background: var(--fs-green) !important;
    background-image: linear-gradient(var(--fs-green), var(--fs-green)) !important;
    color: #fff !important;
}
.change-form .form-group textarea.form-control {
    height: 100px !important;
    min-height: 100px !important;
}

/* 27-08-2026 */
.select2-container--default .select2-selection--single .select2-selection__clear {
    margin-right: 10px !important;
}
.btn-outline-info:not(:disabled):not(.disabled).active, .btn-outline-info:not(:disabled):not(.disabled):active, .show>.btn-outline-info.dropdown-toggle{
    background-color: var(--fs-green);
    border-color: var(--fs-green);
}
.btn-outline-info { 
    color: var(--fs-green);
    border-color: var(--fs-green);
}

.navbar-expand .navbar-nav .dropdown-menu:before {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    top: 0;
    border-left: 10px solid #fff;
    border-right: 10px solid transparent;
    border-bottom: 10px solid transparent;
    transform: rotateZ(45deg);
    right: 0;
}


/*01-09-2026*/
/* .main-header.navbar{
    position: -webkit-sticky;
    position: sticky;
    top: 0;
} 
.content-wrapper>.content.border-bottom {
    position: -webkit-sticky;
    position: sticky;
    top: 57px;
    z-index: 1;
} */

/*02-09-2026*/
.fs-map-search-clear i {
    display: flex;
    justify-content: center;
    align-items: center;
}
.farm-item .badge-info {
    background-color: #6c757d;
    font-weight: 400;
}
.farm-item .crop-tag{
    font-weight: 400;
}
body .chat-header .badge-success {
    background: #6c757d !important;
    font-weight: 400;
}

/*03-09-2026*/
body {
    overflow: hidden;
}
.content-wrapper {
    overflow: auto;
    min-height: calc(100vh - 115px) !important;
    height: calc(100vh - 115px);
    scrollbar-color: rgba(46, 125, 50, 0.35) transparent; 
}
.main-sidebar .sidebar > nav.mt-2{
    height: calc(100vh - 220px);
    overflow: auto;
    padding-bottom: 1rem;
}
.content-wrapper>.content.border-bottom {
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    z-index: 11;
}

body.popup .filtered .row, body.popup .filtered .row .col-12 {
    overflow: visible;
}
.alert-danger button.close {
    color: #fff;
    opacity: 1;
    font-weight: 400;
}
/*16-09-2026*/
button#sidebar-search-btn {
    border: none !important;
    padding: 0 10px !important;
    color: #fff !important;
    background: var(--fs-green) !important;
    min-height: 36px;
}
.sidebar .form-inline .input-group {
    width: calc(100% - 8px) !important;
}
body #sidebar-menu-search:focus{
    box-shadow: 0 0 0 0rem rgba(22, 101, 52, 0.2) !important;
}
body .input-group-append {
    margin-left: 5px;
}
.model-admintransaction h5 {
    color: #fff;
}
.model-admintransaction select#fs-year-select {
    color: #495057 !important;
}
.d-flex.align-items-center.gap-2 {
    gap: 0.5rem;
}
.badge.badge-info {
    padding: 5px 16px;
}


/*17-09-2026*/
body [class*=sidebar-light-] .nav-sidebar>.nav-item.menu-open>.nav-link,
body [class*=sidebar-light-] .nav-sidebar>.nav-item:hover>.nav-link {
    background-color: var(--fs-green-light) !important;
    color: var(--fs-navy) !important;
}
.change-form .form-group input[type="date"],
body.popup .form-group input[type="date"] {
    padding-right: 0 !important;
}
.fs-coords-display-box .input-group {
    flex-wrap: nowrap;
}
.field-password .fs-password-container .btn-success {
    line-height: 33px;
}
.model-state th.column-name.required {
    width: 80%;
}
body .card .fs-tab-link.active{
    box-shadow: 0 0px 0px rgba(46, 125, 50, 0.25) !important;
}
.model-supportticket .fs-form-grid {
    margin-bottom: 18px;
}
body #id_youtube_preview_placeholder {
    flex-direction: column;
    text-align: center;
    padding: 0 10px;
}
.field-map_image_thumbnail img {
    padding: 4px;
    box-sizing: border-box;
}
.model-weatherforecast .date-hierarchy a {
    margin: 0 5px 7px 0;
}
.sidebar-collapse .main-sidebar .sidebar > nav.mt-2 {
    height: calc(100vh - 85px);
}

.sidebar-collapse #sidebar-menu-search,body.sidebar-collapse .input-group-append {
    display: none;
}

.main-sidebar .sidebar > nav.mt-2{
  scrollbar-color: rgba(46, 125, 50, 0.35) transparent; 
}

/* checkbox status */
#general-tab .field-status .field-status,.field-is_read .field-is_read,.field-is_send .field-is_send,
.field-is_active,.field-is_superuser,.field-is_upgrade .field-is_upgrade{
    display: flex;
    gap: 5px;
}

.model-droneservice #general-tab .field-status .field-status {
    display: inline;
}

/* ---- Uniform field size: every control fills its column equally ----
   Overrides Django admin defaults (.vTextField { width: 20em }, narrow
   selects, size= attributes) so text / select / select2 / file all match. */
.change-form .form-group .form-control,
.change-form .form-group .vTextField,
.change-form .form-group .vURLField,
.change-form .form-group .vIntegerField,
.change-form .form-group .vForeignKeyRawIdAdminField,
.change-form .form-group input[type="text"],
.change-form .form-group input[type="number"],
.change-form .form-group input[type="email"],
.change-form .form-group input[type="url"],
.change-form .form-group input[type="password"],
.change-form .form-group input[type="date"],
.change-form .form-group input[type="datetime-local"],
.change-form .form-group input[type="file"],
.change-form .form-group select,
.change-form .form-group textarea,
.change-form .form-group .select2-container,
.change-form .form-group .related-widget-wrapper,
.change-form .form-group .related-widget-wrapper>select,
body.popup .form-group .form-control,
body.popup .form-group .vTextField,
body.popup .form-group .vURLField,
body.popup .form-group .vIntegerField,
body.popup .form-group input[type="text"],
body.popup .form-group input[type="number"],
body.popup .form-group input[type="email"],
body.popup .form-group input[type="url"],
body.popup .form-group input[type="password"],
body.popup .form-group input[type="date"],
body.popup .form-group input[type="datetime-local"],
body.popup .form-group input[type="file"],
body.popup .form-group select,
body.popup .form-group textarea,
body.popup .form-group .select2-container,
body.popup .form-group .related-widget-wrapper,
body.popup .form-group .related-widget-wrapper>select {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.change-form .form-group .form-control,
.change-form .form-group .vTextField,
.change-form .form-group .vURLField,
.change-form .form-group .vIntegerField,
.change-form .form-group input[type="text"],
.change-form .form-group input[type="number"],
.change-form .form-group input[type="email"],
.change-form .form-group input[type="url"],
.change-form .form-group input[type="password"],
.change-form .form-group input[type="date"],
.change-form .form-group input[type="datetime-local"],
.change-form .form-group select,
.change-form .form-group .select2-container .select2-selection--single,
body.popup .form-group .form-control,
body.popup .form-group .vTextField,
body.popup .form-group .vURLField,
body.popup .form-group .vIntegerField,
body.popup .form-group input[type="text"],
body.popup .form-group input[type="number"],
body.popup .form-group input[type="email"],
body.popup .form-group input[type="url"],
body.popup .form-group input[type="password"],
body.popup .form-group input[type="date"],
body.popup .form-group input[type="datetime-local"],
body.popup .form-group select,
body.popup .form-group .select2-container .select2-selection--single {
    height: 38px !important;
    min-height: 38px !important;
    line-height: 1.35 !important;
}

.change-form .form-group textarea,
.change-form .form-group .vLargeTextField,
body.popup .form-group textarea,
body.popup .form-group .vLargeTextField {
    height: auto !important;
    min-height: 80px !important;
}

.change-form .form-group input[type="checkbox"],
.change-form .form-group input[type="radio"],
body.popup .form-group input[type="checkbox"],
body.popup .form-group input[type="radio"] {
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
}

.change-form .form-group .select2-container--default .select2-selection--single .select2-selection__rendered,
body.popup .form-group .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 36px !important;
    padding-left: 0px;
}

.change-form .form-group .select2-container--default .select2-selection--single .select2-selection__arrow,
body.popup .form-group .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px !important;
}

.change-form .form-group .readonly,
body.popup .form-group .readonly {
    display: block;
    width: 100%;
    min-height: 38px;
    padding: 6px 12px;
    border: 1px solid var(--fs-border);
    border-radius: var(--fs-radius-sm);
    background: #fbfdfb;
    box-sizing: border-box;
    line-height: 1.4;
}

/* Disable manual resizing so form layouts stay predictable; CKEditor
    fields render their own toolbar/body and are unaffected. */

textarea {
    resize: none;
}

.form-group.errors .form-control,
.form-group.errors input,
.form-group.errors textarea,
.form-group.errors select {
    border-color: var(--fs-red);
}

.form-group .help-block.red,
.form-group .help-block.text-red {
    font-size: 12px;
    color: var(--fs-red) !important;
    margin-top: 2px !important;
}

.form-group .help-block:not(.red):not(.text-red) {
    font-size: 12px;
    color: var(--fs-gray);
    margin-top: 2px !important;
    margin-bottom: 2px !important;
}

/* File inputs (plain <input type="file">, e.g. crop image / calendar
   upload) get a styled "choose file" button via the standard
   ::file-selector-button pseudo-element instead of the raw OS control. */

input[type="file"] {
    display: block;
    padding: 1px;
    border: 1px solid var(--fs-border) !important;
    border-radius: var(--fs-radius-sm) !important;
}

input[type="file"]::file-selector-button {
    border: 1px solid var(--fs-border);
    border-radius: var(--fs-radius-sm);
    background: var(--fs-green-light);
    color: var(--fs-green-dark);
    padding: 0.4rem 0.9rem;
    margin-right: var(--fs-space-3);
    font-weight: 600;
    font-size: 0.82rem;
    cursor: pointer;
    transition: background-color var(--fs-transition);
}

input[type="file"]::file-selector-button:hover {
    background: var(--fs-green);
    color: #ffffff;
}

/* Existing image thumbnails / preview widgets (crop image preview,
   boundary map screenshots, etc.) get a consistent "card" frame.
   Leaflet map tiles are excluded - padding/white bg washes out satellite. */

.readonly img,
.field-image_preview img,
.form-group img {
    border-radius: var(--fs-radius);
    /* border: 1px solid var(--fs-border); */
    /* box-shadow: var(--fs-shadow-sm); */
    padding: 4px;
    background: #ffffff;
}

.form-group .fs-boundary-map img,
.form-group .leaflet-container img,
.fs-boundary-map .leaflet-tile,
.leaflet-container .leaflet-tile {
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    border-radius: 0 !important;
    max-width: none !important;
    max-height: none !important;
}

/* Select2 dropdowns (autocomplete_fields) */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-radius: var(--fs-radius-sm) !important;
    border: 1px solid var(--fs-border) !important;
    min-height: 38px;
}

/* Select2 results - green highlight (replace default blue) */
.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted {
    background-color: var(--fs-green) !important;
    color: #ffffff !important;
}

.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: var(--fs-green-light) !important;
    color: var(--fs-green-dark) !important;
}

.select2-container--default .select2-results__option[aria-selected="true"].select2-results__option--highlighted {
    background-color: var(--fs-green) !important;
    color: #ffffff !important;
}

/* .select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: var(--fs-green) !important;
    box-shadow: 0 0 0 3px rgba(46, 125, 50, 0.15) !important;
} */

.select2-dropdown {
    border-color: var(--fs-border) !important;
    border-radius: var(--fs-radius-sm) !important;
    box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.08);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid var(--fs-border) !important;
    border-radius: var(--fs-radius-sm) !important;
    outline: none !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--fs-green) !important;
    box-shadow: 0 0 0 0px rgba(46, 125, 50, 0.15) !important;
}

/* Native selects - green focus ring (toolbar filters) */
select.form-control:focus,
select.custom-select:focus,
.fs-inline-status-filter:focus,
.fs-inline-extra-filter:focus {
    border-color: var(--fs-green) !important;
    box-shadow: 0 0 0 0px rgba(46, 125, 50, 0.15) !important;
    outline: none !important;
}

/* ========== Inline listing row actions (Edit / Delete) ========== */
.fs-row-actions {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    white-space: nowrap;
}

.fs-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin-right: 0px;
    border-radius: 50%;
    text-decoration: none !important;
    border: 1px solid transparent;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: all 0.15s ease-in-out;
    cursor: pointer;
}

.fs-action-btn:last-child {
    margin-right: 0;
}

.fs-action-btn i {
    font-size: 13px;
}

.fs-action-edit {
    background-color: #d7f0d8;
    color: var(--fs-green-dark) !important;
    border-color: rgba(60, 142, 63, 0.5);
}

.fs-action-edit:hover,
.fs-action-edit:focus {
    background-color: var(--fs-green);
    border-color: var(--fs-green-dark);
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(60, 142, 63, 0.4);
}

.fs-action-delete {
    background-color: #fbdedb;
    color: var(--fs-red) !important;
    border-color: rgba(218, 26, 0, 0.45);
}

.fs-action-delete:hover,
.fs-action-delete:focus {
    background-color: var(--fs-red);
    border-color: #b01500;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(218, 26, 0, 0.4);
}

.fs-action-view {
    background-color: #e3ecfa;
    color: var(--fs-navy) !important;
    border-color: rgba(1, 33, 88, 0.25);
}

.fs-action-view:hover,
.fs-action-view:focus {
    background-color: var(--fs-navy);
    border-color: var(--fs-navy);
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(1, 33, 88, 0.35);
}

.fs-action-btn {
    transform: translateY(0);
}

.fs-action-btn:hover {
    transform: translateY(-1px);
}

.fs-row-hint {
    font-size: 12px;
    font-style: italic;
    color: #9aa0a6;
}

/* ========== Quick Action Tooltip ========== */
.fs-quick-tooltip {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999999;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(4px) scale(0.96);
    transition: opacity 0.12s cubic-bezier(0.16, 1, 0.3, 1), transform 0.12s cubic-bezier(0.16, 1, 0.3, 1);
    transform-origin: center bottom;
    will-change: transform, opacity;
}

.fs-quick-tooltip.fs-tooltip-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
}

.fs-quick-tooltip.fs-tooltip-instant {
    transition: none !important;
}

.fs-quick-tooltip-content {
    display: inline-block;
    max-width: 290px;
    padding: 5px 10px;
    background: #1e293b;
    color: #ffffff;
    font-size: 11.5px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0.2px;
    border-radius: 6px;
    text-align: center;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.28), 0 1px 3px rgba(0, 0, 0, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.14);
}

.fs-quick-tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    pointer-events: none;
}

.fs-quick-tooltip.fs-placement-top .fs-quick-tooltip-arrow {
    bottom: -5px;
    border-top: 5px solid #1e293b;
}

.fs-quick-tooltip.fs-placement-bottom {
    transform: translateY(-4px) scale(0.96);
    transform-origin: center top;
}

.fs-quick-tooltip.fs-placement-bottom.fs-tooltip-visible {
    transform: translateY(0) scale(1);
}

.fs-quick-tooltip.fs-placement-bottom .fs-quick-tooltip-arrow {
    top: -5px;
    border-bottom: 5px solid #1e293b;
}

/* ========== Farmer Farm boundary map widget ========== */
.fs-boundary-map-widget {
    margin-top: 6px;
}

.fs-boundary-map {
    position: relative;
    height: 320px;
    width: 100%;
    max-width: 100%;
    border-radius: 6px;
    border: 1px solid #dee2e6;
    z-index: 1;
}

body.popup .fs-boundary-map-widget,
body.popup .fs-boundary-map {
    max-width: 100%;
    width: 100%;
}

body.popup .fs-boundary-map {
    height: 280px;
    min-height: 280px;
    border-radius: 10px;
}

/* body.popup .fs-map-search-overlay {
    width: min(100%, calc(100% - 24px));
} */

body.popup .fs-boundary-help {
    max-width: 100%;
}

.fs-boundary-map.leaflet-container {
    height: 100%;
    width: 100%;
    border-radius: 6px;
    background: #1a1a1a;
}

.fs-boundary-map .leaflet-tile-pane,
.fs-boundary-map .leaflet-overlay-pane {
    opacity: 1 !important;
}

.fs-map-search-overlay {
    position: absolute;
    top: 10px;
    left: 52px;
    z-index: 1000;
    width: min(100%, calc(100% - 60px));
    pointer-events: none;
}

.fs-map-search-box {
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 24px;
    /* box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2); */
    overflow: hidden;
    pointer-events: auto;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

.fs-map-search-icon {
    padding: 0px 4px 0 14px;
    color: #6c757d;
    font-size: 14px;
    flex-shrink: 0;
}

.fs-map-address-input {
    flex: 1;
    border: none;
    outline: none;
    padding: 11px 8px;
    font-size: 14px;
    min-width: 0;
    background: transparent;
}

.fs-map-search-loading {
    padding: 0 8px;
    color: var(--fs-green-dark);
    font-size: 14px;
    flex-shrink: 0;
}

.fs-map-autocomplete-list {
    list-style: none;
    margin: 6px 0 0;
    padding: 4px 0;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
    max-height: 280px;
    overflow-y: auto;
    pointer-events: auto;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

.fs-map-autocomplete-item {
    padding: 10px 14px;
    cursor: pointer;
    border-bottom: 1px solid #f1f3f5;
}

.fs-map-autocomplete-item:last-child {
    border-bottom: none;
}

.fs-map-autocomplete-item:hover,
.fs-map-autocomplete-item.is-active {
    background: #f1f8f1;
}

.fs-map-autocomplete-primary {
    display: block;
    font-size: 14px;
    font-weight: 600;
     color: #1e293b;
    line-height: 1.3;
}

.fs-map-autocomplete-secondary {
    display: block;
    font-size: 12px;
    color: #6c757d;
    margin-top: 2px;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fs-map-autocomplete-empty {
    padding: 12px 14px;
    font-size: 13px;
    color: #6c757d;
    font-style: italic;
}

/* Plot polygon - light green fill, visible border, satellite stays clear */
.fs-boundary-map .leaflet-overlay-pane path {
    stroke-linejoin: round;
    stroke-linecap: round;
}

.fs-locate-row {
    display: none;
}

.fs-boundary-map .leaflet-control-layers {
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}

.fs-boundary-help {
    max-width: 720px;
    margin-top: 8px;
}

/* ========== Related-model listing cards (e.g. Farmer Crops) ========== */
.fs-related-tab > .fs-related-card {
    margin-top: 0px;
}

.fs-related-card .card-header {
    background-color: var(--fs-green-light);
    border-bottom: 1px solid rgba(60, 142, 63, 0.25);
}

.fs-related-card .card-title {
    color: var(--fs-navy);
    font-weight: 600;
}

/* ========== Toast notifications (see admin_custom.js) ==========
   Django's own messages are still rendered server-side exactly as before
   (success/error/warning/info `.alert.alert-dismissible` banners) - this
   JS/CSS pair only *also* shows them as auto-dismissing corner toasts and
   hides the inline banner, so nothing about the messages framework
   itself changes. */

.fs-toast-container {
    position: fixed;
    top: 76px;
    right: 20px;
    z-index: 10600;
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 360px;
    width: calc(100% - 24px);
}

.fs-toast {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0px 10px 30px rgba(15, 23, 42, 0.12);
    padding: 14px 14px 14px 12px;
    border-left: 4px solid #64748b;
    animation: fs-toast-in 220ms ease-out;
}

.fs-toast.fs-toast-hide {
    animation: fs-toast-out 200ms ease-in forwards;
}

.fs-toast-success { border-left-color: var(--fs-green);}
.fs-toast-error { border-left-color: var(--fs-red);}
.fs-toast-warning { border-left-color: var(--fs-gold);}
.fs-toast-info { border-left-color: var(--fs-navy);}

.fs-toast-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 0.8rem;
}

.fs-toast-success .fs-toast-icon { background: rgba(60, 142, 63, 0.14); color: var(--fs-green-dark);}
.fs-toast-error .fs-toast-icon { background: rgba(218, 26, 0, 0.12); color: var(--fs-red);}
.fs-toast-warning .fs-toast-icon { background: rgba(245, 179, 0, 0.18); color: #8a6400;}
.fs-toast-info .fs-toast-icon { background: rgba(1, 33, 88, 0.1); color: var(--fs-navy);}

.fs-toast-text {
    flex: 1 1 auto;
    min-width: 0;
    color: #2b2f38;
    word-break: break-word;
}

.fs-toast-title {
    font-size: 0.9rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 2px;
}

.fs-toast-message {
    font-size: 1rem;
    color: #475569;
    line-height: 1.4;
}

.fs-toast-close {
    flex-shrink: 0;
    background: none;
    border: none;
    color: #94a3b8;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    padding: 0px 0px 0px 6px;
}

.fs-toast-close:hover {
    color: var(--fs-navy);
}

.fs-toast-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    width: 100%;
    background: rgba(15, 23, 42, 0.08);
    transform-origin: left center;
    animation: fs-toast-progress 4s linear forwards;
}

.fs-toast-success .fs-toast-progress { background: rgba(60, 142, 63, 0.22);}
.fs-toast-error .fs-toast-progress { background: rgba(218, 26, 0, 0.2);}
.fs-toast-warning .fs-toast-progress { background: rgba(245, 179, 0, 0.24);}
.fs-toast-info .fs-toast-progress { background: rgba(1, 33, 88, 0.18);}

/* SettingModel - value fields hidden until key_type is chosen (setting_admin.js) */
body.model-settingmodel.change-form .form-group.field-text_value,
body.model-settingmodel.change-form .form-group.field-file_value,
body.model-settingmodel.change-form .form-group.field-ckeditor_value,
body.model-settingmodel.change-form .form-group.field-checkbox_value {
    display: none !important;
}

body.model-settingmodel.change-form.fs-setting-type-text .form-group.field-text_value,
body.model-settingmodel.change-form.fs-setting-type-file .form-group.field-file_value,
body.model-settingmodel.change-form.fs-setting-type-ckeditor .form-group.field-ckeditor_value,
body.model-settingmodel.change-form.fs-setting-type-checkbox .form-group.field-checkbox_value,
body.model-settingmodel.change-form .form-group.fs-setting-value-active {
    display: block !important;
}

/* Custom iOS-style Green Toggle Switch for Checkbox fields */
.form-group.field-checkbox_value {
    position: relative;
    margin-bottom: 1.25rem;
}

.form-group.field-checkbox_value label {
    display: block !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    color: #334155 !important;
    margin-bottom: 8px !important;
}

.form-group.field-checkbox_value .form-check,
.form-group.field-checkbox_value .vCheckboxLabel,
.form-group.field-checkbox_value div {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    gap: 10px;
    row-gap: 0;
}

.form-group.field-checkbox_value input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 52px !important;
    height: 28px !important;
    min-width: 52px !important;
    min-height: 28px !important;
    background-color: #CBD5E1 !important;
    border-radius: 20px !important;
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    cursor: pointer !important;
    outline: none !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.1) !important;
    transition: background-color 0.25s ease !important;
}

.form-group.field-checkbox_value input[type="checkbox"]::after {
    content: '' !important;
    position: absolute !important;
    top: 3px !important;
    left: 3px !important;
    width: 22px !important;
    height: 22px !important;
    background-color: #FFFFFF !important;
    border-radius: 50% !important;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25) !important;
}

.form-group.field-checkbox_value input[type="checkbox"]:checked {
    background-color: #2E7D32 !important;
}

.form-group.field-checkbox_value input[type="checkbox"]:checked::after {
    transform: translateX(24px) !important;
}

.form-group.field-checkbox_value .help-block,
.form-group.field-checkbox_value .help-tooltip,
.form-group.field-checkbox_value small {
    display: block !important;
    margin-top: 8px !important;
    font-size: 12px !important;
    color: #64748B !important;
    position: static !important;
    width: 100% !important;
}

/* Section titles inside popup forms */
.fs-popup-section-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #2E7D32 !important;
    margin: 20px 0 10px 0 !important;
    padding-bottom: 6px !important;
    border-bottom: 2px solid #E2E8F0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    line-height: 1.3 !important;
    letter-spacing: -0.01em !important;
}

.fs-popup-section-title::before {
    content: '' !important;
    display: inline-block !important;
    width: 4px !important;
    height: 16px !important;
    background-color: #2E7D32 !important;
    border-radius: 4px !important;
}

.fs-popup-section-desc {
    font-size: 12px !important;
    color: #64748B !important;
    margin-top: -4px !important;
    margin-bottom: 12px !important;
}

/* Hide empty original column in TabularInlines so ID field aligns under ID header */
.inline-group table th.original,
.inline-group table td.original {
    display: none !important;
}

/* FarmerFarm - payment image fields hidden until payment_type is chosen (farmer_farm_admin.js) */
body.model-farmerfarm.change-form .form-group.field-payment_qr_code,
body.model-farmerfarm.change-form .form-group.field-payment_success_screenshot {
    display: none !important;
}

body.model-farmerfarm.change-form.fs-farm-payment-qr .form-group.field-payment_qr_code,
body.model-farmerfarm.change-form.fs-farm-payment-api .form-group.field-payment_success_screenshot,
body.model-farmerfarm.change-form .form-group.fs-farm-payment-active {
    display: block !important;
}

/* Optional FK selects - muted placeholder when nothing selected */
.select2-selection__rendered.fs-select-placeholder {
    color: #6c757d !important;
}

@keyframes fs-toast-in {
    from { opacity: 0; transform: translateX(24px);}
    to { opacity: 1; transform: translateX(0);}
}

@keyframes fs-toast-out {
    from { opacity: 1; transform: translateX(0);}
    to { opacity: 0; transform: translateX(24px);}
}

@keyframes fs-toast-progress {
    from { transform: scaleX(1);}
    to { transform: scaleX(0);}
}


/* Popup / modal styles moved to farm_admin/css/admin_popup.css
   (single reusable premium design for all admin popups). */

/* Jazzmin fieldset cards use Bootstrap p-5 (huge) - keep inner inset so
   labels/inputs never sit flush against the card border. */

   /* box card old */
   /* .tab-content .card > .p-5,
.card > .p-5.card-body,
div.p-5.card-body,
.change-form .p-5,
.change-form .fs-form-grid {
    padding: 18px 20px !important;
} */

.tab-content .card > .p-5,
.card > .p-5.card-body,
div.p-5.card-body,
.change-form .p-5 {
    padding: 18px 20px !important;
}


body.change-form:not(.popup) .tab-content .card > .p-5,
body.change-form:not(.popup) .change-form .fs-form-grid,
body.change-form:not(.popup) .fs-form-grid {
    row-gap: 1rem;
    column-gap: 1rem;
}

/* =====================================================================
   CHANGELIST TOOLBAR - filters + Search + Go fully visible (wrap, no clip)
   ===================================================================== */

.fs-changelist-card {
    margin-bottom: var(--fs-section-gap);
}

.fs-changelist-card > .card-body {
    padding: var(--fs-card-padding);
    overflow: visible;
}

.fs-changelist-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-bottom: var(--fs-space-3);
    overflow: visible;
}

.fs-toolbar-search {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    margin: 0;
    min-width: 0;
}

.fs-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    flex: 0 0 auto;
    gap: 8px;
}

.fs-actions {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.fs-changelist-form {
    display: block;
}

.fs-changelist-results {
    width: 100%;
    margin-top: 0;
}

.fs-toolbar-search .form-group,
.fs-toolbar-search #search_group {
    margin: 0 !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* Equal-height controls - never clip button text */
.fs-changelist-toolbar .form-control,
.fs-changelist-toolbar select,
.fs-changelist-toolbar input[type="text"],
.fs-changelist-toolbar input[type="search"],
.fs-toolbar-search .form-control,
.fs-toolbar-search select,
.fs-toolbar-search .search-filter,
.fs-actions select {
    height: 38px !important;
    min-height: 38px !important;
    box-sizing: border-box !important;
    padding: 0 0.75rem !important;
    margin: 0 !important;
    font-size: 0.875rem !important;
    line-height: 36px !important;
    border-radius: var(--fs-radius-sm) !important;
    vertical-align: middle;
}

.fs-changelist-toolbar .btn,
.fs-toolbar-search .btn,
.fs-actions .btn,
.page-actions .btn,
#search_group .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 38px !important;
    min-height: 38px !important;
    min-width: auto !important;
    padding: 0 1rem !important;
    margin: 0 !important;
    font-size: 0.875rem !important;
    line-height: 1.2 !important;
    border-radius: var(--fs-radius-sm) !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

.fs-toolbar-search .form-control,
.fs-toolbar-search select,
.fs-toolbar-search .search-filter {
    width: auto !important;
    min-width: 140px;
    max-width: 240px;
    flex-shrink: 0px;
}

.fs-toolbar-search #searchbar {
    min-width: 180px;
    max-width: 260px;
}

/* Select2 filter dropdowns - wide enough for State / District names */
.fs-changelist-toolbar .select2-container,
.fs-toolbar-search .select2-container {
    height: 38px !important;
    min-height: 38px !important;
    width: auto !important;
    min-width: 140px !important;
    max-width: 240px;
    margin: 0 !important;
    flex-shrink: 0;
    vertical-align: middle;
}

/* Keep Select2 filter menu readable above the table */
.select2-container--open .select2-dropdown {
    z-index: 2050 !important;
    min-width: 220px;
}

.fs-changelist-toolbar .select2-container .select2-selection--single,
.fs-toolbar-search .select2-container .select2-selection--single {
    height: 38px !important;
    min-height: 38px !important;
    border: 1px solid var(--fs-border) !important;
    border-radius: var(--fs-radius-sm) !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 8px !important;
    background: #ffffff;
}

.fs-changelist-toolbar .select2-container--default .select2-selection--single .select2-selection__rendered,
.fs-toolbar-search .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 36px !important;
    padding-left: 0 !important;
    padding-right: 20px !important;
    color: #495057;
    font-weight: 400;
}

.fs-changelist-toolbar .select2-container--default .select2-selection--single .select2-selection__arrow,
.fs-toolbar-search .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px !important;
    top: 1px !important;
    right: 4px !important;
}

.fs-actions label {
    margin: 0 !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 38px;
    flex-shrink: 0;
}

.fs-actions select {
    min-width: 140px;
    max-width: 220px;
}

.fs-actions .action-counter,
.fs-actions .all,
.fs-actions .question,
.fs-actions .clear {
    color: var(--fs-gray);
    font-size: 0.8125rem;
    white-space: nowrap;
    line-height: 38px;
    height: 38px;
    flex-shrink: 0;
    overflow: visible;
}

.change-list-actions {
    display: none;
}

.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default .select2-selection--single:focus,
.select2-container--default .select2-selection--single:focus-visible {
    border-color: var(--fs-green) !important;
    box-shadow: 0 0 0;
    outline: none;
}

.fs-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fs-button-gap);
    margin-top: var(--fs-section-gap);
    padding-top: var(--fs-space-4);
    border-top: 1px solid var(--fs-border);
}

.fs-submit-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fs-button-gap);
}

.fs-object-tools {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--fs-button-gap);
}

.fs-form-actions .btn,
.fs-form-actions .btn.btn-block,
.fs-form-actions .btn.btn-sm,
.fs-form-actions .btn.form-control,
.fs-form-actions input.btn,
.fs-form-actions a.btn {
    width: auto !important;
    min-width: 88px;
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 1rem !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0.875rem !important;
    line-height: 1.2 !important;
    box-sizing: border-box;
}

.fs-form-actions .form-group {
    margin: 0;
}

/* =====================================================================
   CropMaster inline listings - Search + Status filter toolbar
   ===================================================================== */

.fs-inline-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.fs-inline-toolbar-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
}

.fs-inline-search-wrap {
    position: relative;
    min-width: 200px;
    flex: 1 1 220px;
    max-width: 320px;
}

.fs-inline-search-wrap > i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #6B7280;
    font-size: 0.85rem;
    pointer-events: none;
}

.fs-inline-search {
    height: 38px !important;
    padding-left: 36px !important;
    border-radius: 10px !important;
    border: 1px solid #E5E7EB !important;
    font-size: 0.875rem !important;
    width: 100% !important;
}

.fs-inline-search:focus {
    border-color: var(--fs-green) !important;
    /* box-shadow: 0 0 0 3px rgba(46, 125, 50, 0.15) !important; */
}

.fs-inline-status-filter,
.fs-inline-extra-filter {
    height: 38px !important;
    min-width: 150px;
    max-width: 180px;
    border-radius: 10px !important;
    border: 1px solid #E5E7EB !important;
    font-size: 0.875rem !important;
    background: #ffffff;
}

.fs-inline-add-btn {
    flex: 0 0 auto;
    border-radius: 10px !important;
    min-height: 38px;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
}

.fs-inline-pagination {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.fs-inline-pagination .fs-pagination-info {
    gap: 12px;
    width: 100%;
    padding: var(--fs-space-3) 0;
    color: #6B7280;
    font-size: 1rem;
}

.fs-inline-pagination .fs-inline-count {
    color: #6B7280;
}

.fs-inline-pages {
    margin-left: auto;
}

.fs-inline-pages .pagination {
    gap: 4px;
    padding: 0;
    margin: 0;
}

.fs-inline-pages .page-link {
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    border: 1px solid var(--fs-border, #E5E7EB);
    border-radius: 6px !important;
    background: #ffffff;
    color: #374151;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
}

.fs-inline-pages .page-item.active .page-link {
    background: var(--fs-green, #2E7D32) !important;
    border-color: var(--fs-green, #2E7D32) !important;
    color: #ffffff !important;
}

.fs-inline-pages .page-item:not(.active):not(.disabled) .page-link:hover {
    background: var(--fs-green-light, #e8f5e9);
    border-color: rgba(46, 125, 50, 0.35);
    color: var(--fs-green-dark, #256628);
}

.fs-inline-pages .page-item.disabled .page-link {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}

.fs-inline-empty td {
    font-size: 0.9rem;
}

/* =====================================================================
   Auth User change form - Groups only (user_permissions hidden via
   UserAdmin.fieldsets). Expand the dual-list to use available width.
   ===================================================================== */
body.app-auth.model-user .tab-pane .form-row.field-groups,
body.app-auth.model-user .tab-pane .fieldBox.field-groups,
body.app-auth.model-user .form-group.field-groups {
    grid-column: 1 / -1;
    max-width: 100%;
}

body.app-auth.model-user .selector {
    width: 100% !important;
    max-width: 100%;
    display: flex;
    flex-wrap: wrap;
    /* align-items: flex-start; */
    gap: 12px;
}

body.app-auth.model-user .selector .selector-available, body.app-auth.model-user .selector .selector-chosen {
    width: calc(50% - 29px) !important;
    flex: 1 1 280px;
    max-width: calc(50% - 29px) !important;
}

body.app-auth.model-user .selector .selector-chooser {
    margin-top: 4rem;
}

body.app-auth.model-user .selector select {
    width: 100% !important;
    min-height: 220px;
}

@media (max-width:1600px) {
    .content-wrapper .table th, .content-wrapper .table td, #result_list th, #result_list td, .tabular .table th, .tabular .table td{
        font-size: 14px;
        padding: var(--fs-space-1) !important;
    }
     .btn.btn-sm, a.button{
        min-height: 35px;
        height: 35px;
     }
     .fs-row-actions{gap: 8px;}
     
}


@media (max-width: 767.98px) {
    body.app-auth.model-user .selector .selector-available,
    body.app-auth.model-user .selector .selector-chosen {
        width: 100% !important;
        flex: 1 1 100%;
    }

    body.app-auth.model-user .selector .selector-chooser {
        margin-top: 0px;
        width: 100%;    
        display: flex;
        justify-content: center;
        gap: 8px;
    }

    .fs-form-grid,
    .change-form .card-body:has(> .form-group),
    .change-form .p-5:has(> .form-group),
    body.popup .card-body:has(> .form-group),
    body.popup .p-5:has(> .form-group),
    body.popup .fs-popup-card-body:has(> .form-group) {
        grid-template-columns: 1fr;
    }

    .form-group.fs-form-group-multi > .row {
        grid-template-columns: 1fr;
    }

    .form-group.fs-form-group-multi > .row > label:nth-child(1),
    .form-group.fs-form-group-multi > .row > .fieldBox:nth-child(2),
    .form-group.fs-form-group-multi > .row > label:nth-child(3),
    .form-group.fs-form-group-multi > .row > .fieldBox:nth-child(4) {
        grid-column: 1;
        grid-row: auto;
    }
}

/* Activity Schedule Modal Styles */
.activity-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
}

.activity-modal-container {
    background: white;
    border-radius: var(--fs-radius-lg);
    width: 80%;
    max-width: 1200px;
    max-height: 90vh;
    height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.activity-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
    border-radius: var(--fs-radius-lg) var(--fs-radius-lg) 0 0;
    flex: 0 0 auto;
    position: sticky;
    top: 0;
    z-index: 5;
}

.activity-modal-title-section {
    flex: 1;
}

.activity-modal-title {
    margin: 0 0 4px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--fs-navy);
}

.activity-modal-subtitle {
    margin: 0;
    font-size: 1rem;
    color: #6b7280;
}

.activity-modal-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.activity-modal-close {
    background: none;
    border: none;
    font-size: 1.25rem;
    color: #6b7280;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: background-color 0.2s;
}

.activity-modal-close:hover {
    background-color: #e5e7eb;
}

.activity-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 24px;
}

.activity-modal-toolbar {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.activity-search-wrap {
    flex: 1;
    min-width: 200px;
    position: relative;
}

.activity-search-wrap i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #9ca3af;
}

.activity-search-input {
    padding-left: 36px !important;
}

.activity-status-filter {
    width: 150px;
}

.activity-table-container {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: var(--fs-radius-sm);
    overflow: hidden;
}

.activity-table {
    margin-bottom: 0;
}

.activity-table thead th {
    background-color: #f9fafb;
    border-bottom: 2px solid #e5e7eb;
    font-weight: 600;
    color: var(--fs-navy);
    padding: 12px 16px;
}

.activity-table tbody td {
    padding: 12px 16px;
    vertical-align: middle;
}

.activity-table tbody tr:hover {
    background-color: #f9fafb;
}

.activity-empty-state {
    text-align: center;
    padding: 40px 20px;
}

.activity-empty-state p {
    font-size: 1rem;
    margin-bottom: 16px;
}

.activity-pagination-container {
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.activity-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    gap: 12px;
}

.pagination-info {
    color: #6b7280;
    font-size: 1rem;
}

.pagination-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pagination-current {
    color: var(--fs-navy);
    font-weight: 500;
    font-size: 1rem;
}

/* =========================================================
   Farmer edit - identity bar, tabs, related Farm/Crop cards
   ========================================================= */
   
.fs-farmer-identity {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 16px;
    padding: 14px 16px;
    background: #F8FAF8;
    border: 1px solid var(--fs-border);
    border-radius: var(--fs-radius);
}

.fs-farmer-identity-main {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.fs-farmer-identity-name {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--fs-text);
    line-height: 1.3;
}

.fs-farmer-identity-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    color: var(--fs-gray);
    font-size: 1rem;
}

.fs-farmer-identity-meta i {
    margin-right: 6px;
    color: var(--fs-green);
}

.fs-farmer-identity-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body.model-farmer.change-form #jazzy-tabs {
    margin-bottom: 12px !important;
    gap: 4px;
}

body.model-farmer.change-form #jazzy-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.fs-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    background: #E8F5E9;
    color: var(--fs-green-dark);
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
}

#jazzy-tabs .nav-link.active .fs-tab-count {
    background: rgba(255, 255, 255, 0.22);
    color: inherit;
}

.fs-related-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.fs-related-toolbar h3 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--fs-text);
}

.fs-related-card-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.fs-related-card {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 16px;
    padding: 16px 18px;
    background: #ffffff;
    border: 1px solid var(--fs-border);
    border-radius: var(--fs-radius);
}

.fs-related-card-body {
    min-width: 0;
    flex: 1 1 220px;
}

.fs-related-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--fs-text);
    margin-bottom: 6px;
}

.fs-related-card-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    color: var(--fs-gray);
    font-size: 1rem;
}

.fs-related-hint {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 10px 0 0;
    padding: 8px 10px;
    border-radius: 8px;
    background: #FFF8E1;
    color: #8A6D1D;
    font-size: 0.8125rem;
    line-height: 1.4;
    width: fit-content;
}

.fs-related-hint i {
    margin-top: 2px;
}

.fs-related-empty {
    text-align: center;
    padding: 28px 18px;
    border: 1px dashed var(--fs-border);
    border-radius: var(--fs-radius);
    background: #FAFBFC;
}

.fs-related-empty > i {
    font-size: 1.6rem;
    color: var(--fs-green);
    margin-bottom: 10px;
}

.fs-related-empty.fs-related-warning > i {
    color: #C9A227;
}

.fs-related-empty h4 {
    margin: 0 0 6px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--fs-text);
}

.fs-related-empty p {
    margin: 0 auto 14px;
    max-width: 420px;
    color: var(--fs-gray);
    font-size: 1rem;
    line-height: 1.45;
}

@media (max-width: 576px) {
    .fs-farmer-identity {
        align-items: flex-start;
    }

    .fs-related-card {
        align-items: flex-start;
    }
    .fs-form-actions,
    .fs-submit-row,
    .fs-object-tools {
        /* flex-direction: column; */
        align-items: stretch;
    }

    .fs-form-actions .btn {
        width: 100% !important;
        justify-content: center;
    }
    .fs-toast-container {
        left: 12px;
        right: 12px;
        top: 64px;
        max-width: none;
        width: auto;
    }
    .fs-inline-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .fs-inline-search-wrap,
    .fs-inline-status-filter,
    .fs-inline-extra-filter {
        max-width: none;
        width: 100%;
    }

    .fs-inline-add-btn {
        width: 100%;
        justify-content: center;
    }
}

/* Farm / Crop popup forms */
body.popup.model-farmerfarm .form-group.field-farmer:has(input[type="hidden"]),
body.popup.model-farmercrop .form-group.field-farm:has(input[type="hidden"]) {
    display: none !important;
}

body.popup.model-farmerfarm .fs-form-grid,
body.popup.model-farmercrop .fs-form-grid {
    row-gap: 4px;
}

body.popup.model-farmerfarm .form-group.field-payment_type,
body.popup.model-farmerfarm .form-group.field-payment_qr_code,
body.popup.model-farmerfarm .form-group.field-payment_success_screenshot,
body.popup.model-farmerfarm .form-group.field-acres_area {
    grid-column: 1 / -1;
}

body.popup.model-farmerfarm .form-group.field-payment_type {
    margin-top: 8px;
    padding-top: 14px;
    border-top: 1px solid var(--fs-popup-border, #E5E7EB);
}

body.popup.model-farmerfarm .form-group.field-farmer_display .readonly,
body.popup.model-farmercrop .form-group.field-farm_display .readonly {
    min-height: 42px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    background: #F3F4F6;
    border: 1px solid var(--fs-popup-border, #E5E7EB);
    border-radius: 8px;
    color: var(--fs-popup-text, #1F2937);
    font-weight: 600;
}

body.popup.model-farmerfarm .fs-popup-scroll,
body.popup.model-farmercrop .fs-popup-scroll {
    padding-top: 12px;
}

/* Globally hide 'Save and continue' and 'Save and add another' buttons across all modules */
button[name="_continue"],
button[name="_addanother"],
button[name="_saveasnew"],
input[name="_continue"],
input[name="_addanother"],
input[name="_saveasnew"],
.submit-row input[name="_continue"],
.submit-row input[name="_addanother"],
.submit-row button[name="_continue"],
.submit-row button[name="_addanother"] {
    display: none !important;
}

/* Align related widget dropdown & Manage option button side-by-side on a single line */
.related-widget-wrapper,
div.related-widget-wrapper {
    display: flex !important;
    align-items: flex-start;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
}

.related-widget-wrapper > select,
.related-widget-wrapper > .select2-container,
.related-widget-wrapper > input {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
}

.related-widget-wrapper > a,
.related-widget-wrapper > button,
.related-widget-wrapper > .related-widget-wrapper-link,
.related-widget-wrapper > .manage-dropdown-btn {
    flex: 0 0 auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

/* ========== Support Ticket Status Tracking Timeline ========== */
.fs-status-timeline-container {
    margin-top: 4px;
}

.fs-status-timeline {
    position: relative;
    padding-left: 8px;
}

.fs-tl-item {
    position: relative;
    display: flex;
    align-items: flex-start;
    padding-bottom: 22px;
}

.fs-tl-item:last-child {
    padding-bottom: 0;
}

.fs-tl-item:not(:last-child)::before {
    content: '';
    position: absolute;
    left: 11px;
    top: 22px;
    bottom: -4px;
    width: 2px;
    background-color: #cbd5e1;
    z-index: 1;
}

.fs-tl-dot {
    position: relative;
    z-index: 2;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    font-size: 16px;
    margin-right: 14px;
    flex-shrink: 0;
}

.fs-tl-done {
    color: #16a34a;
}

.fs-tl-current {
    color: #16a34a;
    font-size: 18px;
}

.fs-tl-pending {
    color: #94a3b8;
}

.fs-tl-content {
    flex: 1;
    padding-top: 2px;
}

/* Hide history button for Support Ticket */
.app-farm_admin.model-supportticket .historylink,
.app-farm_admin.model-supportticket #history-tab,
.app-farm_admin.model-supportticket a[href$="/history/"],
.model-supportticket .historylink,
.model-supportticket #history-tab,
.model-supportticket a[href$="/history/"] {
    display: none !important;
}

/* Force form rows in Group & User admin to break onto full-width separate lines */
/* .model-group .form-row,
.model-user .form-row,
.app-auth .form-row,
.change-form .form-row {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 20px !important;
} */

.model-group .form-row,
.model-user .form-row,
.app-auth .form-row {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 20px !important;
}

/* .model-group .form-row > div,
.model-user .form-row > div,
.app-auth .form-row > div,
.field-name,
.field-permissions,
.field-user_permissions,
.field-groups {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    display: block !important;
    margin-bottom: 16px !important;
} */

.model-group .form-row > div,
.model-user .form-row > div,
.app-auth .form-row > div,
.field-permissions,
.field-user_permissions,
.field-groups {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    display: block !important;
    margin-bottom: 16px !important;
}

.field-permissions > label,
.field-user_permissions > label,
.field-groups > label {
    font-weight: 700 !important;
    font-size: 1rem !important;
    color: #1e293b !important;
    margin-bottom: 8px !important;
    display: block !important;
}

/* ==========================================================================
   Filter Horizontal Dual Selector Widget (Group Permissions & User Permissions)
   ========================================================================== */
.selector {
    display: flex !important;
    flex-direction: row !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    float: none !important;
    clear: both !important;
}

.selector .selector-available,
.selector .selector-chosen {
    flex: 1 1 48% !important;
    min-width: 0 !important;
    width: 48% !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04) !important;
    float: none !important;
}

.selector h2 {
    font-size: 0.9rem !important;
    font-weight: 700 !important;
    color: #fff !important;
    background: var(--fs-green) !important;
    padding: 10px 14px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.selector .selector-filter {
    padding: 8px 12px !important;
    background: #ffffff !important;
    border-bottom: 1px solid #f1f5f9 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    border-left: none;
    border-right: none;
}

.selector .selector-filter input {
    width: 100% !important;
    height: 38px !important;
    padding: 6px 12px !important;
    font-size: 0.85rem !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    background-color: #f8fafc !important;
    color: #1e293b !important;
}

.selector .selector-filter input:focus {
    background-color: #ffffff !important;
    border-color: #2E7D32 !important;
    outline: none !important;
    /* box-shadow: 0 0 0 3px rgba(46, 125, 50, 0.12) !important; */
}

.selector select {
    width: 100% !important;
    min-height: 440px !important;
    height: 480px !important;
    border: none !important;
    padding: 6px !important;
    font-size: 0.86rem !important;
    line-height: 1.5 !important;
    color: #334155 !important;
    background: #ffffff !important;
    outline: none !important;
}

.selector select option {
    padding: 7px 12px !important;
    border-radius: 4px !important;
    margin-bottom: 2px !important;
    white-space: normal !important;
    word-break: break-word !important;
}

/* .selector select option:hover {
    background-color: #f1f5f9 !important;
} */

/* .selector select option:checked {
    background-color: #2E7D32 !important;
    color: #ffffff !important;
} */

.selector .selector-chooser {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    align-items: center !important;
    justify-content: center !important;
    float: none !important;
    flex-shrink: 0 !important;
}

.selector .selector-chooser li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.selector .selector-chooser a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    background-color: #f1f5f9 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 8px !important;
    color: #475569 !important;
    font-size: 90px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    position: relative;
}

.selector .selector-filter label, .inline-group .aligned .selector .selector-filter label {
    float: left;
    margin: 0;
    width: 18px;
    height: 18px;
    padding: 0;
    overflow: hidden;
    line-height: 1;
}
.selector .selector-chooser a.selector-add:before {
    display: block;
    position: absolute;
    width: 10px;
    height: 10px;
    border-right: 2px solid #000;
    border-bottom: 2px solid #000;
    transform: rotate(315deg);
    left: -5px;
    right: 0;
    margin: 0 auto;
}
.selector .selector-chooser a.selector-remove:before {
    display: block;
    position: absolute;
    width: 10px;
    height: 10px;
    border-top: 2px solid #000;
    border-left: 2px solid #000;
    transform: rotate(315deg);
    left: 5px;
    right: 0;
    margin: 0 auto;
}
.selector .selector-chooser a.active:before {
    border-color: var(--fs-green);
}
.selector .selector-chooser a.active {
    background: var(--fs-green-light) !important;
    border-color: var(--fs-green-light) !important;
}
.selector .selector-chooser a.selector-add::before {
    content: '\f061';
    font-family: 'Font Awesome 5 Free', 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 14px;
}

.selector .selector-chooser a.selector-remove::before {
    content: '\f060';
    font-family: 'Font Awesome 5 Free', 'Font Awesome 6 Free';
    font-weight: 900;
    font-size: 14px;
}

.selector .selector-chooseall, .selector .selector-clearall {
    display: inline-table;
    text-align: center !important;
    padding: 8px 12px !important;
    background: #f8fafc !important;
    border-top: 1px solid #e2e8f0 !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    color: var(--fs-green) !important;
    text-decoration: none !important;
    margin-bottom: 0;
    width: 100%;
}

.selector .selector-chooseall:hover,
.selector .selector-clearall:hover {
    background: #f1f5f9 !important;
    color: var(--fs-green) !important;
}

@media (max-width: 768px) {
    .selector {
        flex-direction: column !important;
    }
    .selector .selector-available,
    .selector .selector-chosen {
        width: 100% !important;
    }
    .selector .selector-chooser {
        flex-direction: row !important;
    }
    .selector .selector-chooser a.selector-add::before {
        content: '\f063';
    }
    .selector .selector-chooser a.selector-remove::before {
        content: '\f062';
    }

    .activity-modal-container {
        width: 95%;
        max-height: 95vh;
    }

    .activity-modal-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        
    }

    .activity-modal-actions {
        width: 100%;
        justify-content: space-between;
    }

    .activity-modal-toolbar {
        flex-direction: column;
    }

    .activity-status-filter {
        width: 100%;
    }

    .activity-pagination {
        flex-direction: column;
        text-align: center;
    }

    .activity-table-container {
        overflow-x: auto;
    }
    .fs-toolbar-search #searchbar,
    .fs-toolbar-search .select2-container,
    .fs-toolbar-search .form-control,
    .fs-toolbar-search select,
    .fs-actions select {
        min-width: 0 !important;
        max-width: none !important;
        width: 100% !important;
    }

    .fs-toolbar-search .form-group,
    .fs-toolbar-actions,
    .fs-actions,
    .fs-actions label {
        width: 100%;
    }

    .fs-changelist-toolbar .btn,
    .fs-toolbar-search .btn,
    .fs-actions .btn {
        width: 100% !important;
    }
}

/* Sidebar Collapse Logo Handling */
body.sidebar-mini.sidebar-collapse .brand-link .brand-image {
    content: url('/static/farm_admin/img/favicon.png') !important;
    width: 52px !important;
    height: 52px !important;
    max-height: 52px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
}

/* Hide Jazzmin version in footer */
.main-footer .float-right, .main-footer .d-none.d-sm-inline-block {
    display: none !important;
}

/* Hide default Django calendar/clock icons as we use Flatpickr globally */
.datetimeshortcuts {
    display: none !important;
}

/* Image Preview Clickable Styles across Django Admin */
.fs-image-preview-box img,
.fs-inline-preview-img,
#id_image_preview_img,
#crop_image_preview_img,
#id_youtube_preview_img,
.field-image_preview img,
.field-video_thumbnail_preview img,
.field-thumbnail_preview img,
.field-profile_photo_preview img,
.field-profile_photo img,
td.field-image img,
td.field-image_thumbnail img,
td.field-thumbnail_preview img,
td.field-image_preview img {
    cursor: pointer !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

.fs-image-preview-box img:hover,
.fs-inline-preview-img:hover,
#id_image_preview_img:hover,
#crop_image_preview_img:hover,
#id_youtube_preview_img:hover,
.field-image_preview img:hover,
.field-video_thumbnail_preview img:hover,
.field-thumbnail_preview img:hover,
.field-profile_photo_preview img:hover,
.field-profile_photo img:hover,
td.field-image img:hover,
td.field-image_thumbnail img:hover,
td.field-thumbnail_preview img:hover,
td.field-image_preview img:hover {
    transform: scale(1.04) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18) !important;
}

/* Boundary Map Widget Styles */
.fs-boundary-map-widget {
    width: 100%;
    margin-top: 4px;
}

.fs-boundary-map {
    height: 380px !important;
    min-height: 380px !important;
    width: 100% !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    position: relative !important;
    z-index: 1 !important;
    background: #e2e8f0;
}

/* .fs-map-search-overlay {
    position: absolute;
    top: 10px;
    left: 50px;
    z-index: 1000;
    width: calc(100% - 110px);
    max-width: 460px;
} */

.fs-map-search-box {
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.15);
    padding: 3px 8px;
}

.fs-map-search-icon {
    color: #64748b;
    margin-right: 6px;
    font-size: 13px;
}

.fs-map-address-input {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    width: 100%;
    font-size: 13px;
    padding: 4px 2px;
    background: transparent;
    color: #1e293b;
}

.fs-map-search-clear {
    border: none;
    background: none;
    cursor: pointer;
    font-size: 18px;
    color: #94a3b8;
    line-height: 1;
    padding: 0 4px;
    flex-shrink: 0;
}

.fs-map-search-clear:hover {
    color: #212529;
}

.fs-map-autocomplete-list {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 0 0 6px 6px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
    max-height: 220px;
    overflow-y: auto;
    z-index: 1001;
    margin: 2px 0 0;
    padding: 0;
    list-style: none;
}

.fs-map-autocomplete-item {
    padding: 8px 12px;
    cursor: pointer;
    border-bottom: 1px solid #f1f5f9;
    display: flex;
    flex-direction: column;
    font-size: 12px;
}

.fs-map-autocomplete-item:hover,
.fs-map-autocomplete-item.is-active {
    background: #f1f5f9;
}

.fs-map-autocomplete-secondary {
    color: #64748b;
    font-size: 11px;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.fs-inline-search-btn,
.fs-inline-fetch-btn,
.fs-inline-clear-btn {
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-size: 0.875rem !important;
    font-weight: 500;
    padding: 0 18px !important;
    cursor: pointer;
    transition: all 0.2s ease;
    border: none !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.fs-inline-search-btn,
.fs-inline-fetch-btn {
    background-color: #237A3B !important;
    color: #ffffff !important;
}

.fs-inline-search-btn:hover,
.fs-inline-fetch-btn:hover {
    background-color: #1b632f !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(35, 122, 59, 0.3);
}

.fs-inline-clear-btn {
    background-color: #64748b !important;
    color: #ffffff !important;
}

.fs-inline-clear-btn:hover {
    background-color: #475569 !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(100, 116, 139, 0.3);
}

/* ============================================================
   Inline Formsets - Hide template empty-form & sync Remove button
   ============================================================ */

/* Always ensure django empty-form template rows are strictly hidden */
body .tabular table tbody tr.empty-form,
body .tabular table tbody tr[id$="-empty"],
body .inline-related table tbody tr.empty-form,
body .inline-related table tbody tr[id$="-empty"],
body tr.empty-form,
body tr[id$="-empty"],
tr.empty-form,
tr.form-row.empty-form,
tr[id$="-empty"],
.empty-form {
    display: none !important;
}

/* Only hide remove button on the initial empty first row (-0) */
body tr[id$="-0"].fs-row-empty td.delete .inline-deletelink,
body tr[id$="-0"].fs-row-empty td.delete a,
body tr[id$="-0"].fs-row-empty td.delete button,
body tr[id$="-0"]:not(.has_original):not(.fs-has-data) td.delete .inline-deletelink,
body tr[id$="-0"]:not(.has_original):not(.fs-has-data) td.delete a,
tr[id$="-0"].fs-row-empty td.delete .inline-deletelink,
tr[id$="-0"].fs-row-empty td.delete a,
tr[id$="-0"].fs-row-empty td.delete button,
tr[id$="-0"]:not(.has_original):not(.fs-has-data) td.delete .inline-deletelink,
tr[id$="-0"]:not(.has_original):not(.fs-has-data) td.delete a {
    display: none !important;
}


/* ============================================================
   Image Popup Lightbox Modal (Clean, Borderless)
   ============================================================ */

.fs-image-lightbox-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(0, 0, 0, 0.85) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    z-index: 999999 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    box-sizing: border-box !important;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}

.fs-image-lightbox-overlay.is-active {
    display: flex !important;
    opacity: 1 !important;
}

.fs-image-lightbox-dialog {
    position: relative !important;
    max-width: 90vw !important;
    max-height: 90vh !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    animation: fsLightboxPop 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes fsLightboxPop {
    from {
        transform: scale(0.92);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

.fs-image-lightbox-img {
    max-width: 88vw !important;
    max-height: 88vh !important;
    object-fit: contain !important;
    border-radius: 8px !important;
    border: none !important;
    outline: none !important;
    display: block !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6) !important;
}

.fs-image-lightbox-close {
    position: absolute !important;
    top: -16px !important;
    right: -16px !important;
    width: 26px !important;
    height: 26px !important;
    border-radius: 50% !important;
    background: #ef4444 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.4) !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    line-height: 1 !important;
    z-index: 1000000 !important;
    transition: all 0.15s ease !important;
    padding: 0 !important;
}

.fs-image-lightbox-close:hover {
    background: #dc2626 !important;
    transform: scale(1.12) !important;
    box-shadow: 0 6px 18px rgba(220, 38, 38, 0.5) !important;
}

body.fs-lightbox-active {
    overflow: hidden !important;
}

/* Remove borders from image preview thumbnails across project */
.fs-inline-preview-img,
.fs-image-preview-box img,
.youtube-thumbnail-preview-box img,
img.fs-inline-preview-img,
#id_image_preview_img,
#id_youtube_preview_img,
#crop_image_preview_img {
    border: none !important;
    outline: none !important;
    border-radius: 6px !important;
}

/* Drone Service & Admin Date Picker Calendar Icon */
.model-droneservice input[type="date"]::-webkit-calendar-picker-indicator,
.fs-date-input::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-calendar-picker-indicator {
    display: inline-block !important;
    opacity: 1 !important;
    cursor: pointer !important;
    padding: 4px !important;
    margin-right: 8px !important;
    filter: invert(30%) sepia(85%) saturate(450%) hue-rotate(90deg) brightness(90%) contrast(90%) !important;
}

/* Hide duplicate calendar buttons/shortcuts so only single datepicker icon is shown */
.fs-calendar-append,
.datetimeshortcuts {
    display: none !important;
}
.fs-date-input-group {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
}

.fs-date-input-group input[type="date"] {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    flex: 1 1 auto !important;
}

.fs-calendar-append .fs-calendar-btn {
    border: 1px solid #ced4da !important;
    border-left: 0 !important;
    background-color: #f8fafc !important;
    height: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
}

.fs-calendar-append .fs-calendar-btn:hover {
    background-color: #e2e8f0 !important;
}

/* Compact inline table row padding for Package Features */
.fs-inline-table td,
.fs-inline-table th {
    padding: 8px 12px !important;
    vertical-align: middle !important;
}
.fs-inline-table td.field-description {
    white-space: normal !important;
    max-width: 480px !important;
    line-height: 1.4 !important;
    font-size: 0.875rem !important;
}

/* Farmer listing name column width */
.model-farmer #result_list th.column-farmer_name_display,
.model-farmer #result_list td.field-farmer_name_display {
    min-width: 220px !important;
}

/* =====================================================================
   MODERN CLEARABLE FILE UPLOAD WIDGET
   ===================================================================== */
.fs-file-upload-widget {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    margin: 2px 0 6px;
    box-sizing: border-box;
}

.fs-file-input-row {
    width: 100%;
}

.fs-file-input-row input[type="file"].fs-file-input-field {
    display: block;
    width: 100%;
    max-width: 100%;
    font-size: 0.85rem;
    color: #374151;
    background-color: #ffffff;
    border: 1px solid #d1d5db !important;
    border-radius: 8px !important;
    padding: 2px !important;
    box-sizing: border-box;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    height: auto !important;
    min-height: 38px;
}

.fs-file-input-row input[type="file"].fs-file-input-field:focus {
    border-color: #2E7D32 !important;
    box-shadow: 0 0 0 0px rgba(46, 125, 50, 0.15) !important;
    outline: none !important;
}

.fs-file-input-row input[type="file"].fs-file-input-field::file-selector-button {
    border: none;
    border-right: 1px solid #d1d5db;
    border-radius: 6px 0 0 6px;
    background: #f0fdf4;
    color: #166534;
    padding: 7px 14px;
    margin-right: 12px;
    font-weight: 600;
    font-size: 0.825rem;
    cursor: pointer;
    transition: all 0.15s ease;
}

.fs-file-input-row input[type="file"].fs-file-input-field::file-selector-button:hover {
    background: #2E7D32;
    color: #ffffff;
}

/* Common Card Styling for Uploaded and New Selection */
.fs-file-uploaded-card,
.fs-file-new-selection-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    transition: all 0.2s ease;
    width: 100%;
    box-sizing: border-box;
}

/* Currently Uploaded Card (soft fresh green tone) */
.fs-file-uploaded-card {
    background: #f8fdf9;
    border: 1px solid #bbf7d0;
}

.fs-file-uploaded-card.is-cleared {
    background: #fef2f2 !important;
    border-color: #fca5a5 !important;
    opacity: 0.85;
}

.fs-file-uploaded-card.is-cleared .fs-file-link-text {
    text-decoration: line-through;
    color: #dc2626 !important;
}

.fs-file-uploaded-card.is-cleared .fs-file-uploaded-img {
    filter: grayscale(80%) opacity(60%);
}

.fs-file-uploaded-card.is-cleared .fs-badge-current {
    background: #fee2e2 !important;
    color: #dc2626 !important;
    border-color: #fca5a5 !important;
}

/* New File Selected Card (soft blue tone) */
.fs-file-new-selection-card {
    background: #f0f9ff;
    border: 1px solid #bae6fd;
}

/* Thumbnail Box */
.fs-file-thumb-wrap {
    position: relative;
    width: 52px;
    height: 52px;
    min-width: 52px;
    min-height: 52px;
    border-radius: 6px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    flex-shrink: 0;
}

.fs-file-uploaded-img,
.fs-file-live-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.2s ease;
}

.fs-file-thumb-wrap:hover .fs-file-uploaded-img,
.fs-file-thumb-wrap:hover .fs-file-live-img {
    transform: scale(1.08);
}

.fs-file-zoom-icon {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    opacity: 0;
    transition: opacity 0.15s ease;
    pointer-events: none;
}

.fs-file-thumb-wrap:hover .fs-file-zoom-icon {
    opacity: 1;
}

.fs-file-fallback-icon,
.fs-file-live-icon-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    color: #64748b;
    background: #f1f5f9;
}

/* Info Column */
.fs-file-info-col {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    min-width: 0;
}

.fs-file-badge {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 12px;
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    line-height: 1.2;
}

.fs-badge-current {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #86efac;
}

.fs-badge-new {
    background: #e0f2fe;
    color: #0369a1;
    border: 1px solid #7dd3fc;
}

.fs-file-link-text,
.fs-file-name-text {
    font-size: 0.825rem;
    font-weight: 600;
    color: #1f2937;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 360px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.fs-file-link-text:hover {
    color: #15803d;
    text-decoration: underline;
}

.fs-file-link-text i {
    font-size: 0.725rem;
    color: #6b7280;
}

.fs-file-path-val {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fs-file-preview-hint,
.fs-file-size-text {
    font-size: 0.725rem;
    color: #6b7280;
}

/* Clear & Cancel Actions */
.fs-file-clear-wrap {
    display: inline-flex;
    align-items: center;
    position: relative;
    flex-shrink: 0;
}

.fs-file-clear-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.fs-file-clear-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 6px;
    border: 1px solid #fca5a5;
    background: #ffffff;
    color: #dc2626;
    cursor: pointer;
    user-select: none;
    margin: 0;
    transition: all 0.15s ease;
}

.fs-file-clear-label:hover {
    background: #fee2e2;
    border-color: #f87171;
}

.fs-file-clear-input:checked + .fs-file-clear-label {
    background: #dc2626 !important;
    color: #ffffff !important;
    border-color: #dc2626 !important;
    box-shadow: 0 1px 3px rgba(220, 38, 38, 0.3);
}

.fs-file-cancel-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 5px 10px;
    border-radius: 6px;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #475569;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.15s ease;
}

.fs-file-cancel-btn:hover {
    background: #f1f5f9;
    border-color: #94a3b8;
    color: #0f172a;
}

/* =====================================================================
   2-LEVEL SIDEBAR SUBMENU STYLES
   ===================================================================== */
.nav-sidebar .nav-item.fs-has-submenu {
    position: relative;
}

.nav-sidebar .nav-item.fs-has-submenu > .nav-link .fs-submenu-arrow {
    transition: transform 0.2s ease;
    font-size: 0.75rem;
    margin-top: 3px;
}

.nav-sidebar .nav-item.fs-has-submenu.menu-open > .nav-link .fs-submenu-arrow,
.nav-sidebar .nav-item.fs-has-submenu.fs-menu-open > .nav-link .fs-submenu-arrow {
    transform: rotate(-90deg);
}

.nav-sidebar .nav-item.fs-has-submenu > .fs-submenu-tree {
    list-style: none;
    padding: 2px 0 2px 5px;
    margin: 2px 0 4px 0;
    display: none;
}

.nav-sidebar .nav-item.fs-has-submenu.menu-open > .fs-submenu-tree,
.nav-sidebar .nav-item.fs-has-submenu.fs-menu-open > .fs-submenu-tree {
    display: block;
}

.nav-sidebar .nav-item.fs-has-submenu > .fs-submenu-tree .fs-sub-nav-item {
    margin-bottom: 2px;
}

.nav-sidebar .nav-item.fs-has-submenu > .fs-submenu-tree .fs-child-nav-link {
    font-size: 0.825rem !important;
    padding: 6px 10px !important;
    min-height: 34px !important;
    border-radius: 8px !important;
    color: #4b5563 !important;
    background: transparent;
    display: flex;
    align-items: center;
    transition: all 0.15s ease;
}

.nav-sidebar .nav-item.fs-has-submenu > .fs-submenu-tree .fs-child-nav-link .nav-icon {
    font-size: 0.8rem !important;
    width: 1.4rem !important;
    margin-right: 0.4rem !important;
    color: #9ca3af;
}

.nav-sidebar .nav-item.fs-has-submenu > .fs-submenu-tree .fs-child-nav-link:hover {
    background-color: #f0fdf4 !important;
    color: #166534 !important;
}

.nav-sidebar .nav-item.fs-has-submenu > .fs-submenu-tree .fs-child-nav-link:hover .nav-icon {
    color: #2E7D32 !important;
}

.nav-sidebar .nav-item.fs-has-submenu > .fs-submenu-tree .fs-child-nav-link.active {
    background-color: #2E7D32 !important;
    color: #ffffff !important;
    font-weight: 600;
}

.nav-sidebar .nav-item.fs-has-submenu > .fs-submenu-tree .fs-child-nav-link.active .nav-icon {
    color: #ffffff !important;
}