:root{--app-primary: #0d9488;--app-primary-light: #14b8a6;--app-primary-dark: #0f766e;--app-primary-contrast: #ffffff;--app-bg-page: #f8fafc;--app-bg-surface: #ffffff;--app-bg-hover: #f1f5f9;--app-bg-muted: #e2e8f0;--app-text-primary: #1e293b;--app-text-secondary: #64748b;--app-text-muted: #94a3b8;--app-text-inverse: #ffffff;--app-status-paid-bg: #dcfce7;--app-status-paid-text: #166534;--app-status-paid-border: #86efac;--app-status-late-bg: #fee2e2;--app-status-late-text: #991b1b;--app-status-late-border: #fca5a5;--app-status-pending-bg: #fef3c7;--app-status-pending-text: #92400e;--app-status-pending-border: #fcd34d;--app-shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--app-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--app-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--app-border-color: #e2e8f0;--app-border-radius: 8px;--app-border-radius-lg: 12px;--app-spacing-xs: .25rem;--app-spacing-sm: .5rem;--app-spacing-md: 1rem;--app-spacing-lg: 1.5rem;--app-spacing-xl: 2rem}.dark-mode{--app-primary: #14b8a6;--app-primary-light: #2dd4bf;--app-primary-dark: #0d9488;--app-primary-contrast: #0f172a;--app-bg-page: #0f172a;--app-bg-surface: #1e293b;--app-bg-hover: #334155;--app-bg-muted: #475569;--app-text-primary: #f1f5f9;--app-text-secondary: #94a3b8;--app-text-muted: #64748b;--app-text-inverse: #0f172a;--app-status-paid-bg: #166534;--app-status-paid-text: #86efac;--app-status-paid-border: #22c55e;--app-status-late-bg: #7f1d1d;--app-status-late-text: #fca5a5;--app-status-late-border: #ef4444;--app-status-pending-bg: #78350f;--app-status-pending-text: #fcd34d;--app-status-pending-border: #f59e0b;--app-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--app-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4);--app-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5);--app-border-color: #334155}html,body{font-family:Cairo,sans-serif;font-size:16px;line-height:1.6;color:var(--app-text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.3;margin:0;color:var(--app-text-primary)}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}h4{font-size:1.125rem}p{margin:0 0 1rem}em,i{font-style:normal;font-weight:700}a{color:var(--app-primary);text-decoration:none;transition:color .2s ease}a:hover{color:var(--app-primary-dark)}small,.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.text-primary{color:var(--app-text-primary)}.text-secondary{color:var(--app-text-secondary)}.text-muted{color:var(--app-text-muted)}.font-normal{font-weight:400}.font-bold{font-weight:700}.ltr{direction:ltr;text-align:left}[dir=rtl] input[type=tel],[dir=rtl] input[type=number],[dir=rtl] input[inputmode=numeric],[dir=rtl] .p-inputnumber,[dir=rtl] .p-inputnumber input,[dir=rtl] .p-inputnumber-input,[dir=rtl] .numeric,[dir=rtl] .amount,[dir=rtl] .phone,[dir=rtl] .civil-id{direction:ltr!important;text-align:right}[dir=rtl] .p-inputnumber-button-group{direction:ltr}.page-container{padding:var(--app-spacing-lg);max-width:1400px;margin:0 auto}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--app-spacing-lg);flex-wrap:wrap;gap:var(--app-spacing-md)}.page-header .page-title{font-size:2rem;font-weight:700;color:var(--app-text-primary);margin:0}.page-header .header-actions{display:flex;gap:var(--app-spacing-sm);align-items:center}.content-surface{background:var(--app-bg-surface);border-radius:var(--app-border-radius-lg);box-shadow:var(--app-shadow-sm);border:1px solid var(--app-border-color);padding:var(--app-spacing-lg);margin-bottom:var(--app-spacing-lg)}.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--app-spacing-md);margin-bottom:var(--app-spacing-xl)}.kpi-card{background:var(--app-bg-surface);border-radius:var(--app-border-radius);padding:var(--app-spacing-lg);box-shadow:var(--app-shadow-sm);border:1px solid var(--app-border-color)}.kpi-card .kpi-label{color:var(--app-text-secondary);font-size:.875rem;margin-bottom:var(--app-spacing-sm)}.kpi-card .kpi-value{font-size:2rem;font-weight:700;color:var(--app-text-primary);display:flex;align-items:baseline}.kpi-card .kpi-value.success{color:var(--app-status-paid-text)}.kpi-card .kpi-value.danger{color:var(--app-status-late-text)}.kpi-card .kpi-value.warning{color:var(--app-status-pending-text)}.kpi-card .kpi-unit{color:var(--app-text-muted);font-size:1rem;margin-inline-start:var(--app-spacing-xs)}.status-badge{display:inline-flex;align-items:center;padding:var(--app-spacing-xs) var(--app-spacing-sm);border-radius:9999px;font-size:.875rem;font-weight:700}.status-badge.paid{background:var(--app-status-paid-bg);color:var(--app-status-paid-text);border:1px solid var(--app-status-paid-border)}.status-badge.late{background:var(--app-status-late-bg);color:var(--app-status-late-text);border:1px solid var(--app-status-late-border)}.status-badge.pending{background:var(--app-status-pending-bg);color:var(--app-status-pending-text);border:1px solid var(--app-status-pending-border)}.form-container{max-width:600px}.form-grid{display:grid;gap:var(--app-spacing-lg)}.form-field{display:flex;flex-direction:column;gap:var(--app-spacing-sm)}.form-field label{font-weight:700;color:var(--app-text-secondary);font-size:.875rem}.form-actions{display:flex;gap:var(--app-spacing-md);margin-top:var(--app-spacing-xl);justify-content:flex-start}.late-list-section{background:var(--app-status-late-bg);border:1px solid var(--app-status-late-border);border-radius:var(--app-border-radius);padding:var(--app-spacing-lg);margin-bottom:var(--app-spacing-xl)}.late-list-section .section-title{color:var(--app-status-late-text);display:flex;align-items:center;gap:var(--app-spacing-sm);margin-bottom:var(--app-spacing-md);font-size:1.25rem}.late-item{display:flex;align-items:center;justify-content:space-between;padding:var(--app-spacing-md);background:var(--app-bg-surface);border-radius:var(--app-spacing-xs);margin-bottom:var(--app-spacing-sm)}.late-item:last-child{margin-bottom:0}.late-item .tenant-info{display:flex;flex-direction:column;gap:var(--app-spacing-xs)}.late-item .tenant-name{font-weight:700}.late-item .tenant-phone{color:var(--app-text-secondary);font-size:.875rem;direction:ltr}.late-item .rent-amount{font-weight:700;font-size:1.125rem;direction:ltr}.month-filter{display:flex;gap:var(--app-spacing-sm);margin-bottom:var(--app-spacing-lg);flex-wrap:wrap}.bulk-actions{display:flex;align-items:center;gap:var(--app-spacing-md);padding:var(--app-spacing-md);background:var(--app-primary);color:var(--app-primary-contrast);border-radius:var(--app-border-radius);margin-bottom:var(--app-spacing-md)}.bulk-actions .selection-count{font-weight:700}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--app-spacing-xl) * 2);text-align:center}.empty-state .pi{font-size:3rem;color:var(--app-text-muted);margin-bottom:var(--app-spacing-md)}.empty-state p{color:var(--app-text-secondary);max-width:300px}@media(max-width:767px){.page-container{padding:var(--app-spacing-md)}.page-header{flex-direction:column;align-items:flex-start}.page-header .page-title{font-size:1.5rem}.kpi-grid{grid-template-columns:1fr}.kpi-card .kpi-value{font-size:1.5rem}.late-item{flex-direction:column;align-items:flex-start;gap:var(--app-spacing-sm)}}.p-datatable .p-datatable-thead>tr>th,.p-datatable .p-datatable-tbody>tr>td{text-align:right}.p-datatable .p-datatable-thead>tr>th.col-date,.p-datatable .p-datatable-thead>tr>th.col-number,.p-datatable .p-datatable-thead>tr>th.col-amount,.p-datatable .p-datatable-thead>tr>th.col-phone,.p-datatable .p-datatable-thead>tr>th.col-id,.p-datatable .p-datatable-thead>tr>th.col-status,.p-datatable .p-datatable-thead>tr>th.col-actions{text-align:center!important}.p-datatable .p-datatable-thead>tr>th.col-date .p-datatable-column-header-content,.p-datatable .p-datatable-thead>tr>th.col-number .p-datatable-column-header-content,.p-datatable .p-datatable-thead>tr>th.col-amount .p-datatable-column-header-content,.p-datatable .p-datatable-thead>tr>th.col-phone .p-datatable-column-header-content,.p-datatable .p-datatable-thead>tr>th.col-id .p-datatable-column-header-content,.p-datatable .p-datatable-thead>tr>th.col-status .p-datatable-column-header-content,.p-datatable .p-datatable-thead>tr>th.col-actions .p-datatable-column-header-content{justify-content:center!important}.p-datatable .p-datatable-tbody>tr>td.col-date,.p-datatable .p-datatable-tbody>tr>td.col-number,.p-datatable .p-datatable-tbody>tr>td.col-amount,.p-datatable .p-datatable-tbody>tr>td.col-phone,.p-datatable .p-datatable-tbody>tr>td.col-id,.p-datatable .p-datatable-tbody>tr>td.col-status,.p-datatable .p-datatable-tbody>tr>td.col-actions{text-align:center!important}.p-dialog{min-width:320px}@media(min-width:768px){.p-dialog{min-width:500px}}.p-dialog .p-dialog-content{padding:var(--app-spacing-lg)!important}.p-dialog .p-dialog-footer{padding:var(--app-spacing-md) var(--app-spacing-lg)!important}.p-datepicker,.p-datepicker-panel{direction:ltr!important;min-width:300px!important}.p-datepicker .p-datepicker-header,.p-datepicker-panel .p-datepicker-header{direction:ltr;display:flex;justify-content:space-between;align-items:center}.p-datepicker .p-datepicker-calendar-container,.p-datepicker-panel .p-datepicker-calendar-container{direction:ltr}.p-datepicker .p-datepicker-calendar,.p-datepicker-panel .p-datepicker-calendar{direction:ltr;width:100%}.p-datepicker .p-datepicker-calendar th,.p-datepicker .p-datepicker-calendar td,.p-datepicker-panel .p-datepicker-calendar th,.p-datepicker-panel .p-datepicker-calendar td{text-align:center;padding:.5rem}.p-datepicker .p-datepicker-calendar th,.p-datepicker-panel .p-datepicker-calendar th{font-weight:700}.p-datepicker .p-datepicker-calendar td span,.p-datepicker-panel .p-datepicker-calendar td span{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;margin:auto}.p-datepicker input,.p-datepicker-panel input{direction:ltr!important;text-align:right}.p-datepicker-input{direction:ltr!important}.date-value,.date-display,.col-date{direction:ltr;unicode-bidi:embed}.p-confirmdialog{min-width:400px}.p-confirmdialog .p-dialog-content{padding:var(--app-spacing-xl)!important}.p-confirmdialog .p-confirmdialog-message{font-size:1rem;line-height:1.6}.touch-target{min-width:48px;min-height:48px;display:inline-flex;align-items:center;justify-content:center}@media(max-width:767px){.p-button{min-height:44px}.p-button.p-button-icon-only{min-width:44px}}.mobile-card-grid{display:grid;gap:var(--app-spacing-md)}@media(min-width:768px){.mobile-card-grid{display:none}}.desktop-table{display:none}@media(min-width:768px){.desktop-table{display:block}}.mobile-card{background:var(--app-bg-surface);border:1px solid var(--app-border-color);border-radius:var(--app-border-radius);padding:var(--app-spacing-md);box-shadow:var(--app-shadow-sm)}.mobile-card .card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--app-spacing-sm);gap:var(--app-spacing-sm)}.mobile-card .card-title{font-weight:700;color:var(--app-text-primary);font-size:1rem}.mobile-card .card-subtitle{color:var(--app-text-secondary);font-size:.875rem}.mobile-card .card-body{display:flex;flex-direction:column;gap:var(--app-spacing-xs)}.mobile-card .card-row{display:flex;justify-content:space-between;align-items:center;padding:var(--app-spacing-xs) 0;border-bottom:1px solid var(--app-border-color)}.mobile-card .card-row:last-child{border-bottom:none}.mobile-card .card-label{color:var(--app-text-secondary);font-size:.875rem}.mobile-card .card-value{font-weight:600;color:var(--app-text-primary)}.mobile-card .card-value.ltr{direction:ltr;unicode-bidi:embed}.mobile-card .card-actions{display:flex;gap:var(--app-spacing-sm);margin-top:var(--app-spacing-md);padding-top:var(--app-spacing-sm);border-top:1px solid var(--app-border-color);justify-content:flex-end}.clickable-card{cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.clickable-card:hover{transform:translateY(-2px);box-shadow:var(--app-shadow-md)}.clickable-card:active{transform:translateY(0)}.mobile-stack{display:flex;flex-direction:column;gap:var(--app-spacing-md)}@media(min-width:768px){.mobile-stack{flex-direction:row;align-items:center}}@media(min-width:768px){.mobile-only{display:none!important}}.desktop-only{display:none!important}@media(min-width:768px){.desktop-only{display:block!important}}.desktop-only-flex{display:none!important}@media(min-width:768px){.desktop-only-flex{display:flex!important}}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom,0)}.safe-area-top{padding-top:env(safe-area-inset-top,0)}@media(max-width:767px){.page-title{font-size:1.5rem!important}h1{font-size:1.5rem}h2{font-size:1.25rem}}.p-anchored-overlay-enter-active{animation:daftar-overlay-in .2s ease-out}.p-anchored-overlay-leave-active{animation:daftar-overlay-out .15s ease-in}@keyframes daftar-overlay-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes daftar-overlay-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(4px)}}.p-dialog-enter-active{animation:daftar-dialog-in .3s ease-out}.p-dialog-leave-active{animation:daftar-dialog-out .2s ease-in}@keyframes daftar-dialog-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes daftar-dialog-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}.p-collapsible-enter-active{animation:daftar-expand .25s ease-out}.p-collapsible-leave-active{animation:daftar-collapse .2s ease-in}@keyframes daftar-expand{0%{opacity:0;grid-template-rows:0fr}to{opacity:1;grid-template-rows:1fr}}@keyframes daftar-collapse{0%{opacity:1;grid-template-rows:1fr}to{opacity:0;grid-template-rows:0fr}}.p-drawer-enter-active{animation:daftar-drawer-in .3s ease-out}.p-drawer-leave-active{animation:daftar-drawer-out .2s ease-in}@keyframes daftar-drawer-in{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes daftar-drawer-out{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(100%)}}@keyframes daftar-drawer-in{0%{opacity:0;transform:translate(-100%)}to{opacity:1;transform:translate(0)}}@keyframes daftar-drawer-out{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-100%)}}.app-spinner{display:inline-flex;align-items:center;justify-content:center}.app-spinner .pi-spinner{font-size:2rem;color:var(--app-primary)}.app-spinner-ring{display:inline-block;width:40px;height:40px;border:3px solid var(--app-border-color);border-top-color:var(--app-primary);border-radius:50%;animation:app-spin .8s linear infinite}@keyframes app-spin{to{transform:rotate(360deg)}}.app-spinner-ring.small{width:20px;height:20px;border-width:2px}.app-spinner-ring.large{width:60px;height:60px;border-width:4px}@media(prefers-reduced-motion:reduce){.p-anchored-overlay-enter-active,.p-anchored-overlay-leave-active,.p-dialog-enter-active,.p-dialog-leave-active,.p-collapsible-enter-active,.p-collapsible-leave-active,.p-drawer-enter-active,.p-drawer-leave-active{animation-duration:0s!important}.app-spinner-ring{animation-duration:1.5s}}*,*:before,*:after{box-sizing:border-box}html,body{height:100%;margin:0;padding:0;background-color:var(--app-bg-page)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--app-bg-muted);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--app-text-muted);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--app-text-secondary)}::selection{background:var(--app-primary-light);color:var(--app-primary-contrast)}:focus-visible{outline:2px solid var(--app-primary);outline-offset:2px}.p-component{font-family:Cairo,sans-serif}.p-button{font-family:Cairo,sans-serif;font-weight:600}.p-datatable{direction:rtl}.p-datatable .p-datatable-thead>tr>th{text-align:start}.p-datatable .p-datatable-tbody>tr>td{text-align:start}.p-dialog{direction:rtl}.p-dialog .p-dialog-header{justify-content:space-between}.p-inputtext{text-align:start}input[dir=ltr],.ltr-input{direction:ltr;text-align:left}
