/* Mandi Finance & Sales - Custom Styles */

/* Urdu font for RTL mode */
[dir="rtl"] {
    font-family: 'Noto Sans Arabic', sans-serif;
}

[dir="ltr"] {
    font-family: 'Plus Jakarta Sans', sans-serif;
}

/* Urdu text line-height */
[dir="rtl"] body {
    line-height: 1.8;
}

[dir="rtl"] input,
[dir="rtl"] select,
[dir="rtl"] textarea {
    line-height: 1.6;
    font-size: 0.95rem;
}

/* Page background */
body {
    background-color: #E4F0E9;
}

/* Card hover effect */
.card-hover {
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.card-hover:hover {
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
}

/* Pill navbar */
nav > div {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
}

/* Active nav link */
.nav-active {
    background-color: rgba(255, 255, 255, 0.2);
    color: white;
}

/* Mega menu: let Preline/floating-ui handle positioning */

/* Dropdown menus origin */
nav .hs-dropdown > .hs-dropdown-menu {
    transform-origin: top center;
}

/* =========================================
   Preline UI interactive states (plain CSS)
   ========================================= */

/* Dropdown: show menu when open (Preline toggles hidden/block) */
.hs-dropdown.open > .hs-dropdown-menu {
    display: block !important;
}

/* Dropdown: rotate chevron when open */
.hs-dropdown.open > .hs-dropdown-toggle .hs-dropdown-open\:rotate-180 {
    transform: rotate(180deg);
}

/* Accordion: rotate chevron when active */
.hs-accordion.active > .hs-accordion-toggle .hs-accordion-active\:rotate-180 {
    transform: rotate(180deg);
}

/* Accordion: show content when active */
.hs-accordion.active > .hs-accordion-content {
    display: block !important;
}

/* Overlay: slide in when open */
.hs-overlay.open.hs-overlay-open\:translate-x-0 {
    transform: translateX(0) !important;
}

/* Collapse: show when open */
.hs-collapse.open {
    display: block !important;
}

/* Smooth transitions for language switch */
html {
    transition: direction 0.3s ease;
}

/* RTL adjustments for Preline arrows */
[dir="rtl"] .hs-accordion-toggle .hs-accordion-active\:rotate-180,
[dir="rtl"] .hs-dropdown-toggle .hs-dropdown-open\:rotate-180 {
    transform: rotate(0deg);
}
[dir="rtl"] .hs-accordion.active > .hs-accordion-toggle .hs-accordion-active\:rotate-180,
[dir="rtl"] .hs-dropdown.open > .hs-dropdown-toggle .hs-dropdown-open\:rotate-180 {
    transform: rotate(180deg);
}

/* Toast animations */
@keyframes toastSlideUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes toastSlideDown {
    from { opacity: 1; transform: translateY(0); }
    to   { opacity: 0; transform: translateY(20px); }
}
@keyframes toastProgress {
    from { width: 100%; }
    to   { width: 0%; }
}
.toast-item {
    animation: toastSlideUp 0.35s ease-out;
}
.toast-item.removing {
    animation: toastSlideDown 0.35s ease-in forwards;
}
.toast-progress {
    animation: toastProgress 4s linear forwards;
}

/* Delete confirmation modal */
#delete-modal .delete-modal-box {
    transform: scale(0.9);
    opacity: 0;
    transition: transform 0.2s ease, opacity 0.2s ease;
}
#delete-modal.open .delete-modal-box {
    transform: scale(1);
    opacity: 1;
}

/* Translation spinner */
.translate-spinner svg {
    animation: spin 0.7s linear infinite;
}
@keyframes spin {
    to { transform: rotate(360deg); }
}

/* =========================================
   Tom Select — Preline UI style overrides
   ========================================= */

.ts-wrapper {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.ts-wrapper.single .ts-control,
.ts-wrapper.multi .ts-control {
    background-color: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 0.75rem !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.875rem;
    color: #1f2937;
    box-shadow: none !important;
    min-height: auto;
    line-height: 1.25rem;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.ts-wrapper.single .ts-control:hover,
.ts-wrapper.multi .ts-control:hover {
    border-color: #d1d5db !important;
}

.ts-wrapper.single.focus .ts-control,
.ts-wrapper.multi.focus .ts-control {
    border-color: #016630 !important;
    box-shadow: 0 0 0 2px rgba(1, 102, 48, 0.25) !important;
    background-color: #fff !important;
}

.ts-wrapper .ts-control > input {
    font-size: 0.875rem !important;
    color: #1f2937;
    padding: 0 !important;
}

.ts-wrapper .ts-control > input::placeholder {
    color: #9ca3af;
}

.ts-dropdown {
    border: 1px solid #e5e7eb !important;
    border-radius: 0.75rem !important;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05) !important;
    margin-top: 4px !important;
    overflow: hidden;
}

.ts-dropdown .ts-dropdown-content {
    padding: 0.25rem;
    max-height: 220px;
}

.ts-dropdown .option {
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    color: #374151;
    cursor: pointer;
    transition: background-color 0.1s;
}

.ts-dropdown .option:hover,
.ts-dropdown .option.active {
    background-color: rgba(1, 102, 48, 0.06);
    color: #016630;
}

.ts-dropdown .option.selected {
    background-color: rgba(1, 102, 48, 0.1);
    color: #016630;
    font-weight: 500;
}

.ts-wrapper.single .ts-control::after {
    border-color: #9ca3af transparent transparent;
    border-width: 5px 5px 0;
    right: 12px;
}

[dir="rtl"] .ts-wrapper.single .ts-control::after {
    right: auto;
    left: 12px;
}

.ts-wrapper.single .ts-control .item {
    color: #1f2937;
}

/* Input focus ring */
input:focus,
select:focus,
textarea:focus {
    --tw-ring-color: rgba(1, 102, 48, 0.3);
    border-color: #016630;
}

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: #E4F0E9;
}
::-webkit-scrollbar-thumb {
    background: #016630;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: #014d24;
}

/* Responsive table container */
.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* =========================================
   DataTables — Preline UI overrides
   ========================================= */

/* Hide default DataTables UI (search, length, paging) — Preline replaces them */
.dt-layout-row:has(.dt-search),
.dt-layout-row:has(.dt-length),
.dt-layout-row:has(.dt-paging),
.dt-scroll-body thead {
    display: none !important;
}

/* DataTable lazy-load fade transition */
#hs-datatable-party tbody {
    transition: opacity 0.18s ease;
}
#hs-datatable-party tbody.dt-loading {
    opacity: 0.35;
}

/* DataTable pagination active button */
#hs-datatable-party [data-hs-datatable-paging-pages] > .active {
    background-color: rgba(1, 102, 48, 0.1);
    color: #016630;
    font-weight: 600;
}

/* DataTable: remove default DT borders/styles */
.dt-container {
    border: none !important;
    background: transparent !important;
}
table.dataTable {
    border-collapse: collapse !important;
}
table.dataTable thead th {
    border-bottom: none !important;
}
table.dataTable tbody td {
    border-bottom: none !important;
}

/* Mobile-first form grids */
@media (max-width: 640px) {
    .form-grid {
        grid-template-columns: 1fr !important;
    }
}