/* =========================================================
   JKYC GANESH PUJA - COLLECTION ADMIN
   PROFESSIONAL GREEN THEME
========================================================= */

*{
    box-sizing:border-box;
}

body{
    margin:0;
    padding:0;
    font-family:Arial, Helvetica, sans-serif;
    background:#f4f8f5;
    color:#17211b;
}

/* =========================================================
   MAIN CONTAINER
========================================================= */

.admin-container{
    width:94%;
    max-width:1400px;
    margin:25px auto;
}

/* =========================================================
   PAGE HEADER
========================================================= */

.page-header{
    background:linear-gradient(135deg,#087f3f,#04572d);
    color:#fff;
    padding:22px 25px;
    border-radius:14px;
    margin-bottom:22px;
    box-shadow:0 8px 22px rgba(0,0,0,.12);
}

.page-header h1{
    margin:0;
    font-size:28px;
    font-weight:800;
}

.page-header p{
    margin:6px 0 0;
    font-size:14px;
    opacity:.9;
}

/* =========================================================
   SUMMARY CARDS
========================================================= */

.dashboard-cards{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
    margin:20px 0;
}

.card{
    background:#fff;
    padding:20px;
    border-radius:14px;
    border:1px solid #d9eadf;
    box-shadow:0 5px 16px rgba(0,0,0,.07);
    text-align:center;
}

.card h3{
    margin:0 0 8px;
    color:#587066;
    font-size:14px;
}

.card strong{
    display:block;
    color:#087f3f;
    font-size:28px;
    font-weight:800;
}

/* =========================================================
   SEARCH / FILTER
========================================================= */

.search-box{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin:20px 0;
}

.search-box input,
.search-box select{
    min-height:44px;
    padding:10px 14px;
    border:1px solid #c9ddd1;
    border-radius:9px;
    background:#fff;
    font-size:14px;
    outline:none;
}

.search-box input:focus,
.search-box select:focus{
    border-color:#087f3f;
    box-shadow:0 0 0 3px rgba(8,127,63,.10);
}

/* =========================================================
   BUTTONS
========================================================= */

button{
    font-family:inherit;
}

.btn,
button{
    cursor:pointer;
}

.primary-btn{
    background:#087f3f;
    color:#fff;
    border:none;
    padding:10px 18px;
    border-radius:8px;
    font-weight:700;
}

.primary-btn:hover{
    background:#04572d;
}

.green-btn{
    background:#087f3f;
    color:#fff;
    border:none;
    padding:9px 15px;
    border-radius:7px;
    font-weight:700;
}

.green-btn:hover{
    background:#04572d;
}

/* =========================================================
   TABLE WRAPPER
========================================================= */

.table-wrapper{
    width:100%;
    overflow-x:auto;
    background:#fff;
    border-radius:12px;
    border:1px solid #dce9e1;
    box-shadow:0 6px 20px rgba(0,0,0,.07);
}

/* =========================================================
   ADMIN TABLE
========================================================= */

.admin-table{
    width:100%;
    border-collapse:collapse;
    border-spacing:0;
    background:#fff;
}

/* TABLE CELLS */

.admin-table th,
.admin-table td{
    border:1px solid #d8e3dc;
    padding:10px 8px;
    text-align:center;
    vertical-align:middle;
    font-size:12px;
}

/* =========================================================
   ⭐ GREEN TABLE HEADER
========================================================= */

.admin-table thead th,
.admin-table th{
    background:#087f3f !important;
    background-color:#087f3f !important;
    color:#ffffff !important;

    font-weight:800;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.2px;

    border-color:#04572d !important;

    padding:11px 8px;
    white-space:nowrap;
}

/* Slightly darker top header */

.admin-table thead tr:first-child th{
    background:linear-gradient(
        135deg,
        #087f3f,
        #04572d
    ) !important;

    color:#fff !important;
}

/* =========================================================
   TABLE BODY
========================================================= */

.admin-table tbody tr{
    background:#fff;
    transition:.18s ease;
}

.admin-table tbody tr:nth-child(even){
    background:#f8fcf9;
}

.admin-table tbody tr:hover{
    background:#edf8f1;
}

.admin-table tbody td{
    color:#27352d;
}

/* =========================================================
   STATUS
========================================================= */

.status-paid{
    display:inline-block;
    padding:4px 9px;
    border-radius:20px;
    background:#e5f7eb;
    color:#087f3f;
    font-weight:800;
    font-size:11px;
}

.status-unpaid{
    display:inline-block;
    padding:4px 9px;
    border-radius:20px;
    background:#fff0f0;
    color:#d32f2f;
    font-weight:800;
    font-size:11px;
}

/* =========================================================
   ACTION BUTTONS
========================================================= */

.edit-btn{
    background:#087f3f;
    color:#fff;
    border:none;
    padding:6px 10px;
    border-radius:6px;
    font-size:11px;
    font-weight:700;
}

.edit-btn:hover{
    background:#04572d;
}

.delete-btn{
    background:#d32f2f;
    color:#fff;
    border:none;
    padding:6px 10px;
    border-radius:6px;
    font-size:11px;
    font-weight:700;
}

.delete-btn:hover{
    background:#a91f1f;
}

.print-btn{
    background:#1261a0;
    color:#fff;
    border:none;
    padding:7px 12px;
    border-radius:6px;
    font-size:11px;
    font-weight:700;
}

.print-btn:hover{
    background:#0b4778;
}

/* =========================================================
   FORM AREA
========================================================= */

.form-card{
    background:#fff;
    border:1px solid #dce9e1;
    border-radius:14px;
    padding:22px;
    margin-bottom:22px;
    box-shadow:0 5px 18px rgba(0,0,0,.06);
}

.form-card h2{
    margin:0 0 18px;
    color:#087f3f;
    font-size:20px;
}

.form-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.form-group{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.form-group label{
    font-size:13px;
    font-weight:700;
    color:#45564c;
}

.form-group input,
.form-group select,
.form-group textarea{
    width:100%;
    padding:10px 12px;
    border:1px solid #cbded2;
    border-radius:8px;
    outline:none;
    background:#fff;
    font-size:14px;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
    border-color:#087f3f;
    box-shadow:0 0 0 3px rgba(8,127,63,.10);
}

/* =========================================================
   REPORT SECTION
========================================================= */

.report-section{
    background:#fff;
    border-radius:14px;
    border:1px solid #dce9e1;
    padding:20px;
    box-shadow:0 5px 18px rgba(0,0,0,.06);
}

.report-section h2{
    margin:0 0 15px;
    color:#087f3f;
}

/* =========================================================
   EMPTY MESSAGE
========================================================= */

.empty-message{
    text-align:center;
    padding:30px;
    color:#718078;
    font-size:14px;
}

/* =========================================================
   PRINT REPORT
========================================================= */

@media print{

    @page{
        size:A4;
        margin:10mm;
    }

    body{
        background:#fff !important;
    }

    .no-print,
    .search-box,
    button,
    .action-btn,
    .edit-btn,
    .delete-btn,
    .print-btn{
        display:none !important;
    }

    .admin-container{
        width:100%;
        max-width:none;
        margin:0;
    }

    .table-wrapper{
        border:none;
        box-shadow:none;
        overflow:visible;
    }

    .admin-table{
        width:100%;
        border-collapse:collapse;
    }

    .admin-table th{
        background:#087f3f !important;
        background-color:#087f3f !important;
        color:#fff !important;

        -webkit-print-color-adjust:exact !important;
        print-color-adjust:exact !important;
    }

    .admin-table td{
        border:1px solid #999 !important;
    }

    .admin-table tbody tr:nth-child(even){
        background:#f8fcf9 !important;
        -webkit-print-color-adjust:exact !important;
        print-color-adjust:exact !important;
    }
}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:900px){

    .dashboard-cards{
        grid-template-columns:repeat(2,1fr);
    }

    .form-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:600px){

    .admin-container{
        width:96%;
        margin:15px auto;
    }

    .page-header{
        padding:18px;
    }

    .page-header h1{
        font-size:21px;
    }

    .dashboard-cards{
        grid-template-columns:1fr 1fr;
        gap:10px;
    }

    .card{
        padding:15px 10px;
    }

    .card strong{
        font-size:22px;
    }

    .admin-table th,
    .admin-table td{
        padding:8px 6px;
        font-size:10px;
    }
}

/* =========================================================
   COLLECTION PAGE - PROFESSIONAL UI OVERRIDE
   Only styles this page; collection functionality unchanged.
========================================================= */
.collection-page{
    width:min(1240px, calc(100% - 32px));
    margin:28px auto 55px;
}

.collection-top{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:22px;
    margin-bottom:20px;
    padding:4px 2px;
}

.collection-top h1{
    margin:0;
    color:#173b2a;
    font-size:clamp(27px,3vw,38px);
    line-height:1.15;
    font-weight:850;
    letter-spacing:-.5px;
}

.collection-top h1 i{color:#087f3f;margin-right:9px}
.collection-top p{margin:8px 0 0;color:#687970;font-size:14px}

.year-box{
    min-width:190px;
    background:#fff;
    border:1px solid #d7e6dc;
    border-radius:14px;
    padding:12px 14px;
    box-shadow:0 7px 22px rgba(20,70,40,.07);
}
.year-box label{display:block;color:#4c6257;font-size:12px;font-weight:800;margin-bottom:6px}
.year-box select{width:100%;padding:10px 12px;border:1px solid #c8dbcf;border-radius:9px;background:#f8fcf9;color:#173b2a;font-weight:700;font-size:14px;outline:none}
.year-box select:focus{border-color:#087f3f;box-shadow:0 0 0 3px rgba(8,127,63,.1)}

.collection-card{
    background:#fff;
    border:1px solid #deebe3;
    border-radius:18px;
    padding:24px;
    margin-bottom:22px;
    box-shadow:0 10px 30px rgba(15,70,40,.07);
}

.card-title,.pdf-header,.list-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    padding-bottom:17px;
    margin-bottom:20px;
    border-bottom:1px solid #e5eee8;
}

.card-title{justify-content:flex-start}
.title-icon{
    width:46px;height:46px;flex:0 0 46px;
    display:grid;place-items:center;
    border-radius:13px;
    background:linear-gradient(135deg,#087f3f,#0ca65a);
    color:#fff;font-size:19px;
    box-shadow:0 7px 16px rgba(8,127,63,.2);
}
.card-title h2,.pdf-header h2,.list-header h2{margin:0;color:#18372a;font-size:21px;font-weight:850}
.card-title p,.pdf-header p,.list-header p{margin:4px 0 0;color:#718078;font-size:13px}

.form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
}
.form-group{display:flex;flex-direction:column;gap:7px}
.form-group label{color:#33493e;font-size:13px;font-weight:800}
.form-group label span{color:#d32f2f}
.form-group label small{font-size:11px;color:#7a8982;font-weight:600}
.form-group input,.form-group select{
    width:100%;min-height:46px;
    padding:11px 13px;
    border:1px solid #cdded4;
    border-radius:11px;
    background:#fbfdfc;
    color:#1c2c24;
    font-size:14px;
    outline:none;
    transition:.18s ease;
}
.form-group input::placeholder{color:#9aa8a1}
.form-group input:focus,.form-group select:focus{background:#fff;border-color:#087f3f;box-shadow:0 0 0 3px rgba(8,127,63,.09)}
.form-group input[readonly]{background:#f2f7f4;color:#365344;font-weight:700}

.form-actions{
    display:flex;
    justify-content:flex-end;
    gap:10px;
    margin-top:20px;
    padding-top:18px;
    border-top:1px solid #edf2ee;
}
.form-actions button{
    min-height:44px;
    border:0;border-radius:10px;
    padding:10px 18px;
    font-weight:800;font-size:14px;
    cursor:pointer;
    transition:.18s ease;
}
.form-actions .btn-secondary{background:#eef3f0;color:#385247}
.form-actions .btn-secondary:hover{background:#e2ebe6}
.form-actions .btn-primary{background:linear-gradient(135deg,#087f3f,#0a9b50);color:#fff;box-shadow:0 7px 16px rgba(8,127,63,.18)}
.form-actions .btn-primary:hover{transform:translateY(-1px);box-shadow:0 9px 20px rgba(8,127,63,.23)}
.form-message{margin:12px 0 0;min-height:18px;color:#087f3f;font-weight:700;font-size:13px}

.pdf-card{background:linear-gradient(180deg,#ffffff,#fbfefc)}
.pdf-buttons{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pdf-btn{
    min-height:52px;
    display:flex;align-items:center;justify-content:center;gap:10px;
    border:0;border-radius:11px;
    padding:12px 16px;
    color:#fff;font-weight:800;font-size:14px;
    cursor:pointer;transition:.18s ease;
}
.pdf-btn:hover{transform:translateY(-1px);filter:brightness(.97)}
.paid-btn{background:linear-gradient(135deg,#087f3f,#0a9b50)}
.unpaid-btn{background:linear-gradient(135deg,#c62828,#e53935)}
.pdf-message{margin:12px 0 0;text-align:center;color:#64756c;font-size:12px;min-height:17px}

.list-header{margin-bottom:14px}
.record-count{padding:7px 12px;border-radius:999px;background:#e9f7ee;color:#087f3f;font-size:12px;font-weight:850;white-space:nowrap}

.collection-search{margin:0 0 15px}
.search-input-wrap{position:relative;max-width:720px}
.search-input-wrap>i{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:#087f3f;font-size:15px;pointer-events:none}
#collectionSearch{
    width:100%;height:46px;
    padding:0 45px 0 42px;
    border:1px solid #cdded4;
    border-radius:12px;
    background:#f8fcf9;
    color:#1b2e24;
    font-size:14px;
    outline:none;
    transition:.18s ease;
}
#collectionSearch:focus{background:#fff;border-color:#087f3f;box-shadow:0 0 0 3px rgba(8,127,63,.09)}
#clearSearch{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;border-radius:8px;background:transparent;color:#718078;cursor:pointer;display:grid;place-items:center}
#clearSearch:hover{background:#e9f2ec;color:#087f3f}

.table-wrap{overflow:auto;border:1px solid #dce9e1;border-radius:13px}
.table-wrap table{width:100%;min-width:760px;border-collapse:separate;border-spacing:0;margin:0}
.table-wrap th,.table-wrap td{padding:12px 11px;border-bottom:1px solid #e8eee9;text-align:left;white-space:nowrap;font-size:13px}
.table-wrap th{background:#087f3f;color:#fff;font-weight:850;font-size:12px;text-transform:uppercase;letter-spacing:.25px}
.table-wrap th:first-child{border-top-left-radius:12px}
.table-wrap th:last-child{border-top-right-radius:12px}
.table-wrap tbody tr:last-child td{border-bottom:0}
.table-wrap tbody tr:nth-child(even){background:#fbfdfb}
.table-wrap tbody tr:hover{background:#eef8f1}
.table-wrap td:nth-child(2){font-weight:800;color:#173b2a}
.table-wrap td:last-child{white-space:nowrap}
.loading-cell{text-align:center!important;color:#74847b;padding:28px!important}
.action-btn{border:0;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:800;cursor:pointer;margin:2px}
.action-edit{background:#e8f5ed;color:#087f3f}
.action-print{background:#e7f0ff;color:#1759a6}
.action-delete{background:#ffebeb;color:#c62828}
.action-btn:hover{filter:brightness(.96);transform:translateY(-1px)}

@media(max-width:800px){
    .collection-page{width:min(100% - 20px,680px);margin:18px auto 40px}
    .collection-top{align-items:stretch;flex-direction:column}
    .year-box{width:100%;min-width:0}
    .collection-card{padding:18px;border-radius:15px}
    .form-grid{grid-template-columns:1fr}
    .pdf-buttons{grid-template-columns:1fr}
    .form-actions{flex-direction:column-reverse}
    .form-actions button{width:100%}
    .card-title h2,.pdf-header h2,.list-header h2{font-size:19px}
}

@media(max-width:520px){
    .collection-top h1{font-size:25px}
    .collection-top p{font-size:13px}
    .collection-card{padding:15px}
    .card-title,.pdf-header,.list-header{align-items:flex-start}
    .record-count{font-size:11px}
    .search-input-wrap{max-width:none}
}


/* Other Member / Guest collection */
.payer-type-badge{display:block;font-size:11px;color:#0b7a35;font-weight:700;margin-top:3px;}
#payerNameGroup[hidden], #memberGroup[hidden]{display:none;}