/* Village Hall Groups v1.0.0 — Netchameleon */
:root{--vhg-primary:#2c5f2e;--vhg-primary-hover:#4a8c4d;--vhg-danger:#dc2626;--vhg-border:#e5e7eb;--vhg-bg:#f9fafb;--vhg-radius:10px;}
.vhg-wrap{max-width:960px;margin:0 auto;font-family:inherit}
.vhg-alert{padding:.85rem 1.1rem;border-radius:8px;margin-bottom:1.25rem;font-size:.9rem;font-weight:500}
.vhg-alert--info{background:#dbeafe;color:#1e40af;border:1px solid #93c5fd}
.vhg-alert--success{background:#d1fae5;color:#065f46;border:1px solid #6ee7b7}
.vhg-alert--error{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5}

/* Header */
.vhg-dashboard-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.75rem}
.vhg-dashboard-title{font-size:1.5rem;font-weight:700;color:var(--vhg-primary);margin:0 0 .3rem}
.vhg-dashboard-sub{color:#6b7280;margin:0;font-size:.95rem}
.vhg-header-actions{display:flex;gap:.5rem;flex-wrap:wrap}

/* Stats */
.vhg-stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.75rem}
.vhg-stat{background:var(--vhg-bg);border-radius:8px;padding:1rem;text-align:center}
.vhg-stat__num{display:block;font-size:1.75rem;font-weight:700;color:var(--vhg-primary)}
.vhg-stat__label{display:block;font-size:.72rem;color:#6b7280;text-transform:uppercase;letter-spacing:.05em;margin-top:.2rem}

/* Panels */
.vhg-panel{background:#fff;border:1px solid var(--vhg-border);border-radius:var(--vhg-radius);overflow:visible}
.vhg-panel-header{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1.25rem;border-bottom:1px solid var(--vhg-border)}
.vhg-panel-header h3{margin:0;font-size:.95rem;font-weight:700;color:#111827}
.vhg-panel-link{font-size:.82rem;color:var(--vhg-primary);text-decoration:none}
.vhg-panel-link:hover{text-decoration:underline}

/* Buttons */
button.vhg-btn,a.vhg-btn{display:inline-flex!important;align-items:center;gap:5px;padding:.55rem 1.25rem!important;border-radius:7px!important;border:1.5px solid var(--vhg-border)!important;background:transparent!important;color:#374151!important;font-size:.88rem;font-weight:600;font-family:inherit;cursor:pointer;text-decoration:none!important;transition:background .15s,color .15s;line-height:1.4;box-shadow:none!important;white-space:nowrap}
button.vhg-btn--primary,a.vhg-btn--primary{background:var(--vhg-primary)!important;color:#fff!important;border-color:var(--vhg-primary)!important}
button.vhg-btn--primary:hover,a.vhg-btn--primary:hover{background:var(--vhg-primary-hover)!important;border-color:var(--vhg-primary-hover)!important}
button.vhg-btn--ghost,a.vhg-btn--ghost{background:transparent!important;color:#374151!important;border-color:var(--vhg-border)!important}
button.vhg-btn--ghost:hover,a.vhg-btn--ghost:hover{background:var(--vhg-bg)!important}
button.vhg-btn--danger,a.vhg-btn--danger{background:var(--vhg-danger)!important;color:#fff!important;border-color:var(--vhg-danger)!important}
button.vhg-btn--sm,a.vhg-btn--sm{padding:.3rem .8rem!important;font-size:.8rem}
button.vhg-btn-sm{display:inline-flex!important;align-items:center;gap:3px;padding:.25rem .65rem!important;font-size:.78rem!important;border-radius:6px!important;border:1px solid var(--vhg-border)!important;background:transparent!important;color:#374151!important;font-family:inherit;font-weight:500;cursor:pointer;transition:background .15s;box-shadow:none!important}
button.vhg-btn-sm:hover{background:var(--vhg-bg)!important}
button.vhg-btn-sm.vhg-btn--danger{border-color:#fca5a5!important;color:#991b1b!important}
button.vhg-btn-sm.vhg-btn--danger:hover{background:#fee2e2!important}

/* Table */
.vhg-table{width:100%;border-collapse:collapse;font-size:.85rem}
.vhg-table th{text-align:left;padding:.6rem 1rem;background:var(--vhg-bg);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#6b7280;border-bottom:1px solid var(--vhg-border)}
.vhg-table td{padding:.7rem 1rem;border-bottom:1px solid #f3f4f6;color:#374151;vertical-align:middle}
.vhg-table tr:last-child td{border-bottom:none}
.vhg-dates-row td{background:#f9fafb;padding:.6rem 1rem}
.vhg-dates-list{display:flex;flex-wrap:wrap;gap:.4rem}

/* Status badges */
.vhg-status{display:inline-block;font-size:.72rem;font-weight:700;padding:.2rem .6rem;border-radius:999px}
.vhg-status--pending{background:#fef3c7;color:#92400e}
.vhg-status--approved{background:#d1fae5;color:#065f46}
.vhg-status--rejected{background:#fee2e2;color:#991b1b}
.vhg-status--cancelled{background:#f3f4f6;color:#6b7280}

/* Type badges */
.vhg-type-badge{display:inline-block;font-size:.72rem;font-weight:600;padding:.15rem .55rem;border-radius:5px}
.vhg-type-badge--community{background:#dbeafe;color:#1e40af}
.vhg-type-badge--local{background:#fef3c7;color:#92400e}
.vhg-type-badge--commercial{background:#fce7f3;color:#9d174d}

/* Date chips */
.vhg-date-chip{display:inline-block;font-size:.75rem;padding:.2rem .55rem;border-radius:5px;margin:.1rem;background:#e5e7eb;color:#374151}
.vhg-date-chip--approved{background:#d1fae5;color:#065f46}
.vhg-date-chip--rejected{background:#fee2e2;color:#991b1b}
.vhg-date-chip--selected{background:var(--vhg-primary);color:#fff}
.vhg-admin-note{font-size:.82rem;color:#6b7280;margin:.5rem 0 0;font-style:italic}

/* Form */
.vhg-form-body{padding:1.25rem 1.5rem}
.vhg-form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem 1.25rem;margin-bottom:.75rem}
@media(max-width:600px){.vhg-form-row{grid-template-columns:1fr}}
.vhg-field{display:flex;flex-direction:column;gap:.35rem}
.vhg-field label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#6b7280}
.vhg-field input,.vhg-field select,.vhg-field textarea{border:1.5px solid var(--vhg-border);border-radius:7px;padding:.55rem .8rem;font-size:.9rem;font-family:inherit;background:#fff;color:#111827;outline:none;width:100%;box-sizing:border-box;transition:border-color .2s,box-shadow .2s}
.vhg-field input:focus,.vhg-field select:focus,.vhg-field textarea:focus{border-color:var(--vhg-primary);box-shadow:0 0 0 3px rgba(44,95,46,.1)}
.vhg-field textarea{resize:vertical;min-height:80px}
.vhg-cost-preview{font-size:1.1rem;font-weight:700;color:var(--vhg-primary);padding:.4rem 0}
.vhg-form-footer{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 0;flex-wrap:wrap;gap:.75rem;margin-top:1rem}
.vhg-form-note{font-size:.82rem;color:#6b7280;margin:0;flex:1}

/* Mini calendar */
.vhg-calendar-picker{display:flex;gap:1.5rem;flex-wrap:wrap;margin-bottom:1rem}
.vhg-mini-cal{flex:1;min-width:180px}
.vhg-mini-cal__header{font-size:.85rem;font-weight:700;color:var(--vhg-primary);text-align:center;margin-bottom:.5rem;padding:.4rem;background:#f0f7f0;border-radius:6px}
.vhg-mini-cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.vhg-mini-cal__dow{text-align:center;font-size:.65rem;font-weight:700;color:#9ca3af;text-transform:uppercase;padding:.2rem 0}
.vhg-mini-cal__day{text-align:center;font-size:.78rem;padding:.3rem .1rem;border-radius:4px;cursor:pointer;transition:background .15s,color .15s;color:#374151}
.vhg-mini-cal__day:hover:not(.vhg-mini-cal__day--past){background:#f0f7f0}
.vhg-mini-cal__day--past{color:#d1d5db;cursor:not-allowed}
.vhg-mini-cal__day--selected{background:var(--vhg-primary)!important;color:#fff!important;border-radius:4px}
.vhg-selected-dates{display:flex;flex-wrap:wrap;gap:.35rem;min-height:32px;margin-bottom:.75rem}

/* Account grid */
.vhg-account-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem 2rem;padding:1rem 1.25rem}
.vhg-account-grid>div{display:flex;flex-direction:column;gap:.15rem}
.vhg-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#6b7280;font-weight:600}
.vhg-empty{padding:1.5rem;text-align:center;color:#9ca3af;font-style:italic}

/* Admin active/inactive */
.vhg-badge-active{display:inline-block;background:#d1fae5;color:#065f46;font-size:.72rem;font-weight:700;padding:.2rem .55rem;border-radius:999px}
.vhg-badge-inactive{display:inline-block;background:#f3f4f6;color:#6b7280;font-size:.72rem;font-weight:700;padding:.2rem .55rem;border-radius:999px}
.vhg-admin-actions{display:flex;gap:.4rem;flex-wrap:wrap}

/* Invoice status */
.vhg-status--sent { background:#dbeafe; color:#1e40af; }
.vhg-status--paid { background:#d1fae5; color:#065f46; }

/* ── Invoice viewer (member) ─────────────────────────── */
.vhg-invoice-view-frame { background: #fff; border: 1px solid #e0e0e1; border-radius: 4px; padding: 0; overflow: hidden; }
.vhg-invoice-doc { padding: 2rem; max-width: 700px; margin: 0 auto; }
.vhg-invoice-doc__header { display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 1.25rem; border-bottom: 3px solid #4f0738; margin-bottom: 1.5rem; }
.vhg-invoice-doc__site { font-size: 1.3rem; font-weight: 700; color: #4f0738; margin: 0 0 2px; }
.vhg-invoice-doc__label { font-size: .85rem; color: #6b6b6b; margin: 0; }
.vhg-invoice-doc__number { text-align: right; }
.vhg-invoice-doc__number .vhg-label { display: block; font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: #6b6b6b; }
.vhg-invoice-doc__number strong { font-size: 1.05rem; color: #111; }
.vhg-invoice-doc__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-bottom: 1.5rem; }
.vhg-invoice-doc__meta .vhg-label { display: block; font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: #6b6b6b; margin-bottom: .25rem; }
.vhg-invoice-doc__meta p { margin: 0; font-size: .88rem; color: #333; line-height: 1.5; }
.vhg-invoice-doc__table { margin-bottom: 1.5rem; }
.vhg-invoice-doc__total { display: flex; justify-content: flex-end; align-items: baseline; gap: 1.5rem; padding: 1rem 0; border-top: 2px solid #4f0738; font-size: 1.1rem; }
.vhg-invoice-doc__total strong { font-size: 1.3rem; color: #4f0738; }
.vhg-invoice-doc__terms { background: #f9fafb; border-radius: 4px; padding: .85rem 1rem; font-size: .82rem; color: #6b6b6b; margin-bottom: 1rem; }
.vhg-invoice-doc__footer { font-size: .8rem; color: #9ca3af; border-top: 1px solid #e5e7eb; padding-top: 1rem; }
@media print {
    .vhg-dashboard-header, .vhg-header-actions { display: none !important; }
    .vhg-invoice-view-frame { border: none; }
    .vhg-invoice-doc { padding: 0; }
}
@media(max-width:600px){ .vhg-invoice-doc__meta { grid-template-columns: 1fr; } }
