.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2)}.login-card{background:#fff;padding:3rem;border-radius:1rem;box-shadow:0 25px 50px -12px #00000040;width:100%;max-width:400px}.login-header{text-align:center;margin-bottom:2rem}.login-title{font-size:1.875rem;font-weight:700;color:#1f2937;margin-bottom:.5rem}.login-subtitle{color:#6b7280;font-size:.9rem}.login-form{display:flex;flex-direction:column;gap:1.5rem}.login-button{padding:.875rem;background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;border:none;border-radius:.5rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.login-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 25px -3px #3b82f64d}.login-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.login-footer{margin-top:2rem;text-align:center}.login-info{color:#6b7280;font-size:.8rem}.dashboard{display:flex;flex-direction:column;gap:2rem}.dashboard-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.stat-card{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;text-align:center}.stat-value{font-size:2rem;font-weight:700;margin-bottom:.5rem}.stat-label{color:#6b7280;font-size:.9rem;font-weight:500}.dashboard-content{display:grid;grid-template-columns:2fr 1fr;gap:2rem}.server-overview,.recent-activity{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a}.server-list{display:flex;flex-direction:column;gap:1rem}.server-item{display:flex;align-items:center;justify-content:space-between;padding:1rem;background:#f8fafc;border-radius:.5rem;border:1px solid #e5e7eb}.server-info{flex:1}.server-name{font-weight:600;color:#1f2937}.server-region{color:#6b7280;font-size:.875rem}.server-metrics{display:flex;gap:1rem}.metric{display:flex;flex-direction:column;align-items:center;gap:.25rem}.metric-label{font-size:.75rem;color:#6b7280}.metric-value{font-weight:600;font-size:.875rem}.server-status{font-weight:600;text-transform:capitalize;font-size:.875rem}.health-metrics{display:flex;flex-direction:column;gap:1rem}.health-item{display:flex;align-items:center;gap:1rem}.health-label{width:120px;font-size:.875rem;color:#6b7280}.health-bar{flex:1;height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden}.health-fill{height:100%;transition:width .3s ease}.health-value{width:60px;text-align:right;font-weight:600;font-size:.875rem}@media(max-width:768px){.dashboard-content{grid-template-columns:1fr}.dashboard-stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}@media(max-width:1024px){.dashboard-content{grid-template-columns:1fr}}.server-fleet{display:flex;flex-direction:column;gap:2rem}.fleet-header{display:flex;justify-content:space-between;align-items:center}.fleet-actions{display:flex;gap:1rem}.fleet-content{display:flex;flex-direction:column;gap:2rem}.servers-section{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a}.servers-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.5rem}.server-card{border:2px solid #e5e7eb;border-radius:.75rem;padding:1.5rem;background:#fff;cursor:pointer;transition:all .2s}.server-card:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626}.server-card.selected{border-color:#3b82f6;background:#eff6ff}.server-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.server-status{display:flex;align-items:center;gap:.5rem;font-weight:600}.status-text{text-transform:capitalize}.server-version{background:#f3f4f6;padding:.25rem .5rem;border-radius:.375rem;font-size:.75rem;font-weight:500}.server-info{margin-bottom:1rem}.server-name{font-weight:600;font-size:1.1rem;margin-bottom:.25rem}.server-details{color:#6b7280;font-size:.875rem}.server-metrics{margin-bottom:1rem}.metric-row{display:flex;justify-content:space-between;margin-bottom:.25rem}.metric-row:last-child{margin-bottom:0}.metric-label{color:#6b7280;font-size:.875rem}.metric-value{font-weight:500;font-size:.875rem}.server-footer{border-top:1px solid #e5e7eb;padding-top:.75rem}.last-heartbeat{color:#6b7280}.commands-section{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a}.command-controls{display:flex;align-items:end;gap:1rem;margin-bottom:2rem;padding:1rem;background:#f8fafc;border-radius:.5rem}.control-group{display:flex;flex-direction:column;gap:.5rem}.control-group label{font-weight:500;color:#374151;font-size:.875rem}.commands-list{margin-top:2rem}.subsection-title{font-size:1.1rem;font-weight:600;margin-bottom:1rem}.commands-table{border:1px solid #e5e7eb;border-radius:.5rem;overflow:hidden}.table-header{display:grid;grid-template-columns:60px 1fr 120px 140px 140px;gap:1rem;padding:.75rem 1rem;background:#f8fafc;border-bottom:1px solid #e5e7eb;font-weight:600;font-size:.875rem;color:#374151}.table-row{display:grid;grid-template-columns:60px 1fr 120px 140px 140px;gap:1rem;padding:.75rem 1rem;border-bottom:1px solid #e5e7eb;font-size:.875rem}.table-row:last-child{border-bottom:none}.table-row:hover{background:#f9fafb}.command-status{text-align:center}.command-type{font-weight:500}@media(max-width:1024px){.servers-grid{grid-template-columns:1fr}}@media(max-width:768px){.commands-table .table-header,.commands-table .table-row{grid-template-columns:1fr;gap:.5rem}.fleet-header{flex-direction:column;align-items:flex-start;gap:1rem}.command-controls{flex-direction:column;align-items:stretch}}.usage-analytics{display:flex;flex-direction:column;gap:2rem}.analytics-header{display:flex;justify-content:space-between;align-items:center}.time-range-selector{display:flex;align-items:center;gap:.5rem}.analytics-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.summary-card{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;text-align:center}.summary-value{font-size:2rem;font-weight:700;margin-bottom:.5rem;color:#1f2937}.summary-label{color:#6b7280;font-size:.9rem;font-weight:500}.analytics-content{display:grid;grid-template-columns:2fr 1fr;gap:2rem}.chart-section{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a}.chart-container{margin-top:1rem}.chart-placeholder{height:300px;display:flex;align-items:center;justify-content:center}.usage-chart{display:flex;align-items:end;justify-content:space-around;height:250px;width:100%;gap:4px}.chart-bar{display:flex;flex-direction:column;align-items:center;flex:1;max-width:40px}.bar-fill{width:100%;background:linear-gradient(180deg,#3b82f6,#1d4ed8);border-radius:2px 2px 0 0;min-height:4px;transition:height .3s ease}.bar-label{font-size:.75rem;color:#6b7280;margin-top:.5rem;writing-mode:vertical-rl;text-orientation:mixed}.region-section{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a}.region-list{display:flex;flex-direction:column;gap:1rem}.region-item{display:flex;align-items:center;gap:1rem;padding:1rem;background:#f8fafc;border-radius:.5rem}.region-info{flex:1}.region-name{font-weight:600;margin-bottom:.25rem}.region-stats{font-size:.875rem;color:#6b7280}.error-count{color:#ef4444}.region-bar{width:100px;height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden}.region-fill{height:100%;background:linear-gradient(90deg,#3b82f6,#1d4ed8);transition:width .3s ease}.metrics-table{grid-column:1 / -1;background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;margin-top:2rem}.table-container{overflow-x:auto}.metrics-table-content{width:100%;border-collapse:collapse}.metrics-table-content th,.metrics-table-content td{text-align:left;padding:.75rem;border-bottom:1px solid #e5e7eb}.metrics-table-content th{background:#f8fafc;font-weight:600;color:#374151}.metrics-table-content tr:hover{background:#f9fafb}@media(max-width:1024px){.analytics-content{grid-template-columns:1fr}}@media(max-width:768px){.analytics-header{flex-direction:column;align-items:flex-start;gap:1rem}}.summary-banner{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;background:linear-gradient(135deg,#1e40af,#3730a3);color:#fff;padding:1.5rem;border-radius:.75rem;margin-bottom:2rem}.summary-item{text-align:center}.summary-value{font-size:1.75rem;font-weight:700}.summary-label{font-size:.875rem;opacity:.8}.customer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:1.5rem}.customer-card{background:#fff;border-radius:.75rem;box-shadow:0 1px 2px #0000000d;transition:all .2s ease-in-out;border:1px solid #f3f4f6}.customer-card:hover{transform:translateY(-2px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.customer-header{display:flex;justify-content:space-between;align-items:flex-start;padding:1rem 1.5rem;border-bottom:1px solid #f3f4f6}.customer-info .customer-name{font-weight:600;color:#111827}.customer-info .customer-email{font-size:.875rem;color:#6b7280}.status-badge.active{background-color:#d1fae5;color:#065f46;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600}.status-badge.inactive{background-color:#fee2e2;color:#991b1b;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600}.customer-details{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;padding:1rem 1.5rem}.customer-details .detail-item{display:flex;flex-direction:column}.detail-label{font-size:.75rem;color:#6b7280;text-transform:uppercase;margin-bottom:.25rem}.tier-badge{padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;font-weight:600;text-transform:uppercase;width:-moz-fit-content;width:fit-content}.tier-badge.tier-free{background:#e5e7eb;color:#4b5563}.tier-badge.tier-standard{background:#dbeafe;color:#1e40af}.tier-badge.tier-premium{background:#fef3c7;color:#92400e}.credits{color:#059669}.customer-actions{padding:1rem 1.5rem;border-top:1px solid #f3f4f6;display:flex;gap:.5rem}.table-footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 0}.pagination{display:flex;gap:.5rem;align-items:center}.form-textarea{padding:.75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:1rem;transition:border-color .2s,box-shadow .2s;width:100%}.form-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}.breadcrumb{display:flex;align-items:center;gap:.5rem;font-size:.875rem;margin-bottom:.5rem}.breadcrumb-link{color:#3b82f6;text-decoration:none}.breadcrumb-link:hover{text-decoration:underline}.breadcrumb-separator{color:#9ca3af}.breadcrumb-current{color:#6b7280}.page-actions{display:flex;gap:.5rem}.customer-detail-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:2rem}.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.detail-item{display:flex;flex-direction:column;gap:.25rem;background:#f9fafb;padding:.75rem;border-radius:.5rem}.detail-label{font-size:.75rem;color:#6b7280;font-weight:500}.detail-value{font-weight:600}.text-success{color:#10b981}.text-danger{color:#ef4444}.api-keys-list,.transactions-list{display:flex;flex-direction:column;gap:1rem}.api-key-item,.transaction-item{background:#f9fafb;padding:1rem;border-radius:.5rem;border:1px solid #f3f4f6}.api-key-info,.transaction-info{display:flex;align-items:baseline;gap:.75rem;margin-bottom:.25rem}.api-key-name,.transaction-type{font-weight:600}.api-key-prefix{font-family:monospace;font-size:.875rem;color:#6b7280}.api-key-status{font-size:.75rem;font-weight:600;padding:.25rem .5rem;border-radius:9999px;text-transform:capitalize}.api-key-status.active{background:#d1fae5;color:#065f46}.api-key-status.unknown{background:#e5e7eb;color:#4b5563}.api-key-meta,.transaction-meta{font-size:.875rem;color:#6b7280}.transaction-amount{font-weight:600;color:#111827}.empty-state{text-align:center;padding:2rem;background:#f9fafb;border-radius:.5rem}.empty-text{font-weight:600;margin-bottom:.5rem}.empty-description{color:#6b7280;font-size:.875rem}.action-buttons{display:flex;gap:1rem}.billing-overview-container{max-width:100%;margin:0 auto;padding:1rem;background:#f8fafc;min-height:100vh}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding:1.5rem;background:linear-gradient(135deg,#1e40af,#3730a3);color:#fff;border-radius:.75rem;box-shadow:0 4px 6px #0000001a}.section-header h2{margin:0;font-size:1.875rem;font-weight:700}.health-score{display:flex;align-items:center;gap:.75rem;background:#ffffff1a;padding:.75rem 1rem;border-radius:.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.score-label{font-size:.875rem;opacity:.9}.score-value{font-size:1.5rem;font-weight:700;padding:.25rem .75rem;border-radius:.375rem}.score-value.excellent{background:#10b981;color:#fff}.score-value.good{background:#f59e0b;color:#fff}.score-value.needs-attention{background:#ef4444;color:#fff}.metrics-section{margin-bottom:2rem;background:#fff;border-radius:.75rem;padding:1.5rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid #f3f4f6}.metrics-section h3{margin:0 0 1.5rem;font-size:1.25rem;font-weight:600;color:#1f2937;border-bottom:2px solid #e5e7eb;padding-bottom:.75rem}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:1rem}.stat-card.primary:before{background:linear-gradient(90deg,#3b82f6,#1d4ed8)}.stat-card.success:before{background:linear-gradient(90deg,#10b981,#059669)}.stat-card.warning:before{background:linear-gradient(90deg,#f59e0b,#d97706)}.stat-card.danger:before{background:linear-gradient(90deg,#ef4444,#dc2626)}.stat-card.info:before{background:linear-gradient(90deg,#06b6d4,#0891b2)}.stat-card.secondary:before{background:linear-gradient(90deg,#6b7280,#4b5563)}.stat-title{font-size:.875rem;font-weight:500;color:#6b7280;margin-bottom:.75rem;display:flex;align-items:center;gap:.5rem}.stat-change{font-size:.75rem;color:#6b7280;display:flex;align-items:center;gap:.25rem}.tier-breakdown{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.tier-item{background:#f8fafc;border-radius:.5rem;padding:1rem;border:1px solid #e5e7eb;transition:all .2s ease}.tier-item:hover{background:#f1f5f9;border-color:#cbd5e1}.tier-name{font-weight:600;color:#374151;margin-bottom:.5rem;text-transform:capitalize}.tier-revenue{font-size:1.25rem;font-weight:700;color:#1f2937;margin-bottom:.25rem}.tier-percentage{font-size:.875rem;color:#6b7280}.product-breakdown{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.product-item{background:#f8fafc;border-radius:.5rem;padding:1rem;border:1px solid #e5e7eb;transition:all .2s ease;display:flex;justify-content:space-between;align-items:center}.product-item:hover{background:#f1f5f9;border-color:#cbd5e1}.product-name{font-weight:600;color:#374151;flex:1}.product-revenue{font-size:1.125rem;font-weight:700;color:#1f2937;margin-right:.75rem}.product-percentage{font-size:.875rem;color:#6b7280;background:#e5e7eb;padding:.25rem .5rem;border-radius:.25rem;font-weight:500}.risk-indicators{display:flex;flex-direction:column;gap:1rem}.risk-item{background:#f8fafc;border-radius:.5rem;padding:1rem;border-left:4px solid #e5e7eb;transition:all .2s ease}.risk-item.low{border-left-color:#10b981;background:#f0fdf4}.risk-item.medium{border-left-color:#f59e0b;background:#fffbeb}.risk-item.high{border-left-color:#ef4444;background:#fef2f2}.risk-type{font-weight:600;color:#374151;margin-bottom:.5rem}.risk-description{color:#6b7280;font-size:.875rem;margin-bottom:.5rem}.risk-severity{display:inline-block;font-size:.75rem;font-weight:600;padding:.25rem .5rem;border-radius:.25rem;text-transform:uppercase}.risk-severity.low{background:#d1fae5;color:#065f46}.risk-severity.medium{background:#fef3c7;color:#92400e}.risk-severity.high{background:#fee2e2;color:#991b1b}.last-updated{text-align:center;color:#6b7280;font-size:.875rem;margin-top:2rem;padding:1rem;background:#fff;border-radius:.5rem;border:1px solid #e5e7eb}@media(max-width:1024px){.stats-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.tier-breakdown{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.product-breakdown{grid-template-columns:1fr}}@media(max-width:768px){.billing-overview-container{padding:.5rem}.section-header{flex-direction:column;text-align:center;gap:1rem}.stats-grid,.tier-breakdown{grid-template-columns:1fr}.stat-value{font-size:1.5rem}.metrics-section{padding:1rem}.product-item{flex-direction:column;align-items:flex-start;gap:.5rem}.product-revenue{margin-right:0}}.table-toolbar{display:flex;gap:1rem;margin-bottom:1.5rem;align-items:center;flex-wrap:wrap}.search-input{flex:1;padding:.875rem 1rem;border:2px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;transition:all .2s ease;background-color:#fafbfc}.search-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a;background-color:#fff}.search-input::-moz-placeholder{color:#9ca3af}.search-input::placeholder{color:#9ca3af}.filter-select{padding:.875rem 1rem;border:2px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;transition:all .2s ease;background-color:#fafbfc;cursor:pointer}.filter-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a;background-color:#fff}.data-table{width:100%}.table-container{width:100%;display:flex;flex-direction:column;gap:1rem}.data-table .table-row{background:#fff;border-radius:.5rem;margin-bottom:1rem;box-shadow:0 1px 2px #0000000d;transition:all .2s ease-in-out}.data-table .table-row:hover{transform:translateY(-2px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.row-content{display:block;padding:1.25rem 1.5rem}.row-meta{width:100%;padding:.5rem 1.5rem 1rem;border-top:1px solid #e5e7eb;display:flex;gap:.5rem 1rem;font-size:.75rem;background-color:transparent;flex-wrap:wrap;align-items:center;justify-content:flex-start}.meta-item{display:flex;gap:.5rem;align-items:center}.meta-label{font-weight:500;color:#6b7280}.meta-value{font-family:monospace;color:#374151;background-color:#f3f4f6;padding:.125rem .375rem;border-radius:.25rem;overflow-wrap:anywhere;word-break:break-all}.payment-details{display:flex;flex-direction:column;gap:.25rem;flex:1;min-width:0}.row-title{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap}.customer-name{font-weight:600;color:#111827;overflow-wrap:break-word}.payment-id-short{font-size:.75rem;color:#6b7280;font-family:monospace}.row-subtitle{display:flex;align-items:baseline;gap:.5rem;font-size:.875rem;color:#6b7280;flex-wrap:wrap}.payment-amount{font-weight:500}.credits-awarded{font-weight:500;color:#059669}.payment-status-and-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-self:end;max-width:none;flex:initial}.payment-actions{display:flex;gap:.5rem;flex-wrap:wrap}.status-badge{padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.status-badge.success{background-color:#dcfce7;color:#166534}.status-badge.danger{background-color:#fecaca;color:#991b1b}.status-badge.warning{background-color:#fef3c7;color:#92400e}.status-badge.info{background-color:#dbeafe;color:#1e40af}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem;border:none;border-radius:.375rem;font-size:.875rem;font-weight:500;text-decoration:none;cursor:pointer;transition:all .2s ease;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-sm{padding:.375rem .75rem;font-size:.75rem}.btn-primary:hover:not(:disabled){background-color:#2563eb}.btn-secondary:hover:not(:disabled){background-color:#4b5563}.btn-danger:hover:not(:disabled){background-color:#dc2626}.btn-spinner{animation:spin 1s linear infinite}.loading-container{display:flex;justify-content:center;align-items:center;padding:4rem 2rem;text-align:center}.loading-text{font-size:1.125rem;color:#6b7280;font-weight:500}.empty-state{display:flex;justify-content:center;align-items:center;padding:4rem 2rem;text-align:center}.empty-text{font-size:1.125rem;color:#6b7280;font-weight:500}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;padding:1rem}.modal-content{background:#fff;border-radius:.75rem;box-shadow:0 25px 50px -12px #00000040;max-width:500px;width:100%;max-height:90vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 1.5rem 0;border-bottom:1px solid #e5e7eb;margin-bottom:1.5rem}.modal-title{font-size:1.25rem;font-weight:600;color:#111827;margin:0}.modal-close{background:none;border:none;font-size:1.5rem;color:#6b7280;cursor:pointer;padding:.25rem;line-height:1;transition:color .2s ease}.modal-body{padding:0 1.5rem}.modal-footer{display:flex;justify-content:flex-end;gap:.75rem;padding:1.5rem;border-top:1px solid #e5e7eb;margin-top:1.5rem}.form-group{margin-bottom:1.5rem}.form-label{display:block;font-size:.875rem;font-weight:500;color:#374151;margin-bottom:.5rem}.form-input,.form-textarea{width:100%;padding:.75rem;border:2px solid #e5e7eb;border-radius:.375rem;font-size:.875rem;transition:all .2s ease;background-color:#fafbfc}.form-input:focus,.form-textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a;background-color:#fff}.form-textarea{resize:vertical;min-height:80px}@media(max-width:1100px){.row-content{grid-template-columns:minmax(360px,1fr) minmax(200px,min(45%,max-content))}.payment-details{min-width:0}}@media(max-width:860px){.row-content{padding-bottom:.25rem}.row-meta{padding-top:.5rem;padding-bottom:.75rem}}.data-table .table-row.transaction-container{background:#fff;border-radius:8px;border:1px solid #e2e8f0;margin-bottom:1rem;box-shadow:0 1px 2px #0000000d;transition:all .2s ease-in-out;display:block;overflow:hidden}.data-table .table-row.transaction-container:hover{transform:translateY(-2px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.transaction-container .transaction-row{display:flex!important;align-items:center;padding:1.25rem 1.5rem;border-bottom:1px solid #e2e8f0;gap:1.5rem;min-height:60px;flex-wrap:nowrap;flex-direction:row}.transaction-container .transaction-row:last-child{border-bottom:none}.transaction-container .row-1{background:#f8fafc}.transaction-container .row-2{background:#fff}.transaction-container .section{display:flex;align-items:center;gap:.75rem;min-width:0;flex-shrink:0}.transaction-container .customer-section{flex:3;min-width:200px}.transaction-container .amount-section{flex:1.5;justify-content:center;min-width:80px}.transaction-container .status-section{flex:1.5;justify-content:center;min-width:100px}.transaction-container .date-section,.transaction-container .credits-section{flex:1.2;justify-content:center;min-width:80px}.transaction-container .actions-section{flex:2.5;justify-content:flex-end;min-width:200px}.customer-info{display:flex;flex-direction:column;gap:.25rem;min-width:0}.customer-email{font-weight:600;font-size:.95rem;color:#1e293b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.customer-id{font-size:.8rem;color:#64748b;font-family:Monaco,Menlo,monospace;overflow-wrap:anywhere}.amount{font-size:1.5rem;font-weight:700;color:#059669}.status-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .8rem;border-radius:20px;font-size:.8rem;font-weight:600;letter-spacing:0;text-transform:none;border:1px solid transparent;white-space:nowrap}.status-badge.success{background:#d1fae5;color:#059669;border-color:#a7f3d0}.status-badge.danger{background:#fee2e2;color:#991b1b;border-color:#fecaca}.status-badge.warning{background:#fef3c7;color:#92400e;border-color:#fde68a}.status-badge.info{background:#dbeafe;color:#1e40af;border-color:#bfdbfe}.status-dot{width:6px;height:6px;background:currentColor;border-radius:50%}.date-info{text-align:center}.date-main{font-weight:600;color:#1e293b;font-size:.9rem}.date-year{font-size:.8rem;color:#64748b}.credits-info{text-align:center}.credits-amount{font-weight:700;color:#0ea5e9;font-size:1.1rem}.credits-label{font-size:.8rem;color:#64748b}.actions{display:flex;gap:.5rem;flex-wrap:wrap}.transaction-container .btn-secondary{background:#f1f5f9;color:#475569;border:1px solid #cbd5e1}.transaction-container .btn-secondary:hover:not(:disabled){background:#e2e8f0}.stripe-section{flex:3;min-width:250px}.stripe-info{display:flex;flex-direction:column;gap:.25rem}.stripe-label{font-size:.8rem;color:#64748b;font-weight:500}.stripe-id{font-family:Monaco,Menlo,monospace;font-size:.8rem;color:#475569;background:#f1f5f9;padding:.25rem .5rem;border-radius:4px;display:inline-block}.id-section{flex:1.5;justify-content:center;min-width:120px}.id-info{text-align:center}.id-label{font-size:.8rem;color:#64748b;font-weight:500}.id-value{font-family:Monaco,Menlo,monospace;font-size:.8rem;color:#475569;font-weight:600}@media(max-width:1200px){.transaction-row{gap:1rem}.customer-section{flex:2.5;min-width:180px}.actions-section{flex:2;min-width:180px}}@media(max-width:900px){.transaction-row{flex-wrap:wrap;gap:.75rem}.actions-section{flex:1 1 100%;justify-content:flex-end;margin-top:.5rem}}@media(max-width:768px){.transaction-row{padding:1rem}.section{min-width:auto}.customer-section,.amount-section,.status-section,.date-section,.credits-section{flex:1 1 auto;min-width:0}}.reconciliation-section{max-width:100%;margin:0 auto;padding:1rem;background:#f8fafc;min-height:100vh}.reconciliation-section .section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding:1.5rem;background:linear-gradient(135deg,#1e40af,#3730a3);color:#fff;border-radius:.75rem;box-shadow:0 4px 6px #0000001a}.reconciliation-section .section-title{margin:0;font-size:1.875rem;font-weight:700}.reconciliation-section .section-description{color:#ffffffe6;font-size:.875rem;opacity:.9}.view-navigation{display:flex;gap:.5rem;margin-bottom:2rem;background:#fff;padding:.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid #f3f4f6}.nav-btn{padding:.75rem 1.5rem;border-radius:.5rem;border:none;background:transparent;font-weight:500;cursor:pointer;transition:all .3s ease;color:#6b7280}.nav-btn:hover{background:#f8fafc;color:#374151}.nav-btn.active{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;box-shadow:0 2px 4px #3b82f64d}.loading-container{display:flex;justify-content:center;align-items:center;padding:3rem;background:#fff;border-radius:.75rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid #f3f4f6}.loading-text{color:#6b7280;font-size:1rem;font-weight:500}.empty-state{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:3rem;background:#fff;border-radius:.75rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid #f3f4f6}.empty-text{color:#6b7280;font-size:1rem;font-weight:500;margin-bottom:1rem}.manual-job-form{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb}.date-inputs{display:grid;grid-template-columns:1fr 1fr auto;gap:1rem;align-items:end}.date-input-group{display:flex;flex-direction:column;gap:.5rem}.date-input-group label{font-size:.875rem;font-weight:500;color:#374151}.form-input{padding:.75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.875rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;border-radius:.5rem;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;max-width:600px;width:90%;max-height:80vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid #e5e7eb}.modal-header h3{margin:0;font-size:1.25rem;font-weight:600}.modal-actions{display:flex;align-items:center;gap:.5rem}.refresh-btn{background:#10b981;border:none;color:#fff;border-radius:.375rem;padding:.5rem;cursor:pointer;font-size:.875rem;transition:background-color .2s ease;display:flex;align-items:center;justify-content:center;width:2rem;height:2rem}.refresh-btn:hover{background:#059669}.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#6b7280;padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center}.modal-close:hover{color:#374151}.modal-body{padding:1.5rem}.dashboard-container{background:#fff;border-radius:.75rem;padding:1.5rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid #f3f4f6;margin-bottom:2rem}.dashboard-container h3{margin:0 0 1.5rem;font-size:1.25rem;font-weight:600;color:#1f2937;border-bottom:2px solid #e5e7eb;padding-bottom:.75rem}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:#fff;border-radius:.75rem;padding:1.5rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid #f3f4f6;transition:all .3s ease;position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#6366f1,#8b5cf6)}.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 6px #0000001a,0 2px 4px #0000000f}.stat-title{font-size:.875rem;font-weight:500;color:#6b7280;margin-bottom:.75rem;text-transform:uppercase;letter-spacing:.05em}.stat-value{font-size:2rem;font-weight:700;color:#1f2937;margin-bottom:.5rem;line-height:1.2}.stat-subtitle{font-size:.875rem;color:#6b7280}.phase-breakdown-section,.recent-jobs-section,.resolution-summary-section{margin-top:2rem}.phase-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.phase-card{background:#f8fafc;border:1px solid #e5e7eb;border-radius:.5rem;padding:1rem;text-align:center}.phase-name{font-size:.75rem;font-weight:600;color:#6b7280;text-transform:uppercase;margin-bottom:.5rem}.phase-count{font-size:1.5rem;font-weight:700;color:#1f2937}.jobs-table{background:#fff;border-radius:.5rem;overflow:hidden;border:1px solid #e5e7eb}.jobs-table .table-header,.jobs-table .table-row{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1.5fr 1fr 1fr;gap:1rem;padding:.75rem 1rem;align-items:center}.jobs-table .table-header{background:#f8fafc;font-weight:600;font-size:.75rem;color:#374151;text-transform:uppercase}.jobs-table .table-row{border-top:1px solid #f3f4f6;font-size:.875rem;cursor:pointer;transition:background-color .2s ease}.jobs-table .table-row:hover{background-color:#f9fafb}.job-id{font-family:monospace;font-size:.8rem}.job-status{padding:.25rem .5rem;border-radius:9999px;font-size:.75rem;font-weight:500;text-transform:capitalize;text-align:center;display:inline-block}.job-status.completed{background-color:#d1fae5;color:#065f46}.job-status.running{background-color:#dbeafe;color:#1e40af}.job-status.failed{background-color:#fee2e2;color:#991b1b}.job-status.pending{background-color:#f3f4f6;color:#374151}.resolution-stats{display:flex;gap:2rem;background:#f8fafc;padding:1rem;border-radius:.5rem}.resolution-stat{display:flex;flex-direction:column}.resolution-stat .stat-label{font-size:.75rem;color:#6b7280;text-transform:uppercase}.resolution-stat .stat-value{font-size:1.25rem;font-weight:600;color:#1f2937}.job-matches{font-size:.75rem}.match-breakdown{display:flex;flex-direction:column;gap:.25rem}.match-breakdown span{display:inline-flex;align-items:center;gap:.25rem;padding:.125rem .375rem;background:#f3f4f6;border-radius:.25rem;font-weight:500;color:#374151;font-size:.75rem}.match-breakdown span:first-child{background:#dbeafe;color:#1e40af}.match-breakdown span:nth-child(2){background:#fef3c7;color:#92400e}.match-breakdown span:nth-child(3){background:#fce7f3;color:#be185d}.jobs-container{background:#fff;border-radius:.75rem;padding:1.5rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid #f3f4f6;margin-bottom:2rem}.filters-section{background:#f8fafc;border-radius:.5rem;padding:1rem;margin-bottom:1.5rem;border:1px solid #e5e7eb}.filter-controls{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.filter-controls select{padding:.5rem .75rem;border:1px solid #d1d5db;border-radius:.375rem;background:#fff;font-size:.875rem;color:#374151;min-width:120px}.filter-controls select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.filter-controls label{font-size:.875rem;font-weight:500;color:#374151;margin-right:.5rem}.filter-group{display:flex;flex-direction:column;gap:.5rem;min-width:150px}.filter-group label{margin-right:0;margin-bottom:.25rem}.mini-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin:1rem 0;padding:1rem;background:#f8fafc;border-radius:.5rem;border:1px solid #e5e7eb}.mini-stat{display:flex;align-items:center;justify-content:center;padding:.75rem;background:#fff;border-radius:.375rem;font-size:.875rem;font-weight:500;color:#374151;box-shadow:0 1px 2px #0000000d}.jobs-table .table-header,.jobs-table .table-row{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1.5fr auto;gap:1rem;padding:1rem;align-items:center;border-bottom:1px solid #f3f4f6}.jobs-table .table-header{background:#f8fafc;font-weight:600;font-size:.875rem;color:#374151}.match-summary{display:flex;align-items:center;gap:.75rem;margin-top:.5rem}.match-breakdown{display:flex;gap:.5rem;align-items:center}.match-item{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;border-radius:.375rem;font-size:.75rem;font-weight:500;color:#fff}.match-item.payment{background-color:#10b981}.match-item.refund{background-color:#f59e0b}.match-item.dispute{background-color:#ef4444}.jobs-table .table-row:hover{background:#f8fafc}.jobs-table .table-row:last-child{border-bottom:none}.jobs-table.detailed{background:#fff;border-radius:.5rem;overflow:hidden;border:1px solid #e5e7eb}.jobs-table.detailed .table-header{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr 2fr 1.5fr 1fr;gap:1rem;padding:1rem;background:#f8fafc;font-weight:600;font-size:.875rem;color:#374151;border-bottom:1px solid #e5e7eb}.jobs-table.detailed .table-row{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr 2fr 1.5fr 1fr;gap:1rem;padding:1rem;border-bottom:1px solid #f3f4f6;font-size:.875rem;align-items:center;transition:background-color .2s ease}.jobs-table.detailed .table-row:hover{background:#f8fafc}.jobs-table.detailed .table-row:last-child{border-bottom:none}.job-priority{padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;font-weight:500;text-transform:uppercase;text-align:center}.job-priority.high{background:#fee2e2;color:#991b1b}.job-priority.medium{background:#fef3c7;color:#92400e}.job-priority.low{background:#dbeafe;color:#1e40af}.job-timeframe{font-size:.75rem;color:#6b7280;min-width:160px}.job-progress{display:flex;flex-direction:column;gap:.5rem;min-width:180px}.progress-details{display:flex;flex-direction:column;gap:.25rem}.phase-indicator{font-size:.75rem;color:#6366f1;font-weight:500;text-transform:capitalize}.data-counts{font-size:.7rem;color:#6b7280}.match-summary{display:flex;gap:.75rem;flex-wrap:wrap}.match-summary .matched{color:#059669;font-weight:600;font-size:.75rem}.match-summary .discrepancies{color:#d97706;font-weight:600;font-size:.75rem}.match-summary .errors{color:#dc2626;font-weight:600;font-size:.75rem}.duration{font-size:.7rem;color:#10b981;font-weight:500}.error-message{font-size:.7rem;color:#dc2626;font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis;cursor:help}.phases-section{margin-top:1.5rem;padding:1rem;background:#f8fafc;border-radius:.5rem;border:1px solid #e5e7eb}.phases-section h4{margin:0 0 1rem;font-size:1rem;font-weight:600;color:#374151}.phase-item{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1rem;padding:.75rem;background:#fff;border-radius:.375rem;margin-bottom:.5rem;align-items:center;border-left:4px solid #e5e7eb}.phase-item:last-child{margin-bottom:0}.phase-item.completed{border-left-color:#10b981}.phase-item.running{border-left-color:#3b82f6}.phase-item.failed{border-left-color:#ef4444}.phase-item.pending{border-left-color:#f59e0b}.phase-name{font-weight:500;color:#374151}.phase-status{padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;font-weight:500;text-transform:uppercase;text-align:center}.phase-status.completed{background:#d1fae5;color:#065f46}.phase-status.running{background:#dbeafe;color:#1e40af}.phase-status.failed{background:#fee2e2;color:#991b1b}.phase-status.pending{background:#fef3c7;color:#92400e}.phase-time{font-size:.875rem;color:#6b7280;text-align:right}.discrepancies-section{margin-top:1.5rem;padding:1rem;background:#f8fafc;border-radius:.5rem;border:1px solid #e5e7eb}.discrepancies-section h4{margin:0 0 1rem;font-size:1rem;font-weight:600;color:#374151}.discrepancy-list{display:flex;flex-direction:column;gap:.5rem}.discrepancy-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem;background:#fff;border-radius:.375rem;border-left:4px solid #e5e7eb}.discrepancy-item.high{border-left-color:#ef4444}.discrepancy-item.medium{border-left-color:#f97316}.discrepancy-item.low{border-left-color:#f59e0b}.discrepancy-info{display:flex;flex-direction:column}.discrepancy-type{font-weight:500;color:#374151;text-transform:capitalize}.discrepancy-amount{font-size:.875rem;color:#6b7280}.discrepancy-status{padding:.25rem .5rem;border-radius:9999px;font-size:.75rem;font-weight:500;text-transform:uppercase}.discrepancy-status.pending{background:#fef3c7;color:#92400e}.discrepancy-status.resolved{background:#d1fae5;color:#065f46}.discrepancy-status.write_off{background:#e5e7eb;color:#4b5563}.more-items{margin-top:.75rem;font-size:.875rem;color:#6b7280;text-align:center}.resolution-queue-container{background:#fff;border-radius:.75rem;box-shadow:0 1px 3px #0000001a;border:1px solid #e5e7eb;padding:1.5rem}.resolution-queue-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid #e5e7eb}.resolution-queue-header h3{margin:0;color:#1f2937;font-size:1.25rem;font-weight:600}.queue-stats{display:flex;gap:1rem}.stat-item{font-size:.875rem;color:#6b7280}.stat-item strong{color:#1f2937;font-weight:600}.resolution-filters{margin-bottom:1.5rem;padding:1rem;background:#f8fafc;border:1px solid #e2e8f0;border-radius:.5rem}.filter-row{display:flex;gap:1rem;align-items:end;flex-wrap:wrap}.filter-group{display:flex;flex-direction:column;gap:.25rem;min-width:200px}.filter-group label{font-size:.875rem;font-weight:500;color:#374151}.filter-input{padding:.5rem;border:1px solid #d1d5db;border-radius:.375rem;font-size:.875rem;transition:border-color .2s ease}.filter-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f61a}.clear-filters-btn{background:#ef4444;color:#fff;border:none;padding:.5rem 1rem;border-radius:.375rem;font-size:.875rem;cursor:pointer;transition:background-color .2s ease;height:-moz-fit-content;height:fit-content}.clear-filters-btn:hover{background:#dc2626}.discrepancies-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:1.5rem}.discrepancy-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:.5rem;padding:1.25rem;transition:all .2s ease}.discrepancy-card:hover{border-color:#3b82f6;box-shadow:0 4px 6px #0000001a}.discrepancy-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.type-badge{display:inline-block;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:600;text-transform:uppercase}.type-badge.missing_local{background:#fef3c7;color:#92400e}.type-badge.missing_stripe{background:#dbeafe;color:#1d4ed8}.type-badge.amount_mismatch{background:#fecaca;color:#991b1b}.discrepancy-amount{font-size:1.125rem;font-weight:700;color:#1f2937}.discrepancy-details{margin-bottom:1rem}.detail-row{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:.875rem}.detail-row .label{color:#6b7280;font-weight:500}.detail-row .value{color:#1f2937;font-weight:400}.resolution-actions{border-top:1px solid #e5e7eb;padding-top:1rem}.resolution-notes{margin-bottom:1rem}.notes-input,.credit-amount-input{width:100%;padding:.5rem;border:1px solid #d1d5db;border-radius:.375rem;font-size:.875rem;transition:border-color .2s ease;margin-bottom:.5rem}.notes-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 1px #3b82f6}.credit-amount-input:focus{outline:none;border-color:#10b981;box-shadow:0 0 0 1px #10b981}.action-buttons{display:flex;gap:.5rem;flex-wrap:wrap}.resolve-btn{padding:.5rem 1rem;border:none;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;flex:1;min-width:100px}.resolve-btn:disabled{opacity:.5;cursor:not-allowed}.resolve-btn.apply-credit{background:#10b981;color:#fff}.resolve-btn.apply-credit:hover:not(:disabled){background:#059669}.resolve-btn.write-off{background:#f59e0b;color:#fff}.resolve-btn.write-off:hover:not(:disabled){background:#d97706}.resolve-btn.resolved{background:#3b82f6;color:#fff}.resolve-btn.resolved:hover:not(:disabled){background:#2563eb}.page-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid #e5e7eb}.page-description{color:#6b7280;font-size:.875rem;margin-top:.5rem;margin-bottom:0;max-width:500px}.header-stats{display:flex;gap:2rem;align-items:center}.header-stat{display:flex;flex-direction:column;align-items:flex-end;text-align:right}.header-stat-label{font-size:.75rem;color:#6b7280;font-weight:500;text-transform:uppercase;letter-spacing:.05em}.header-stat-value{font-size:1.25rem;font-weight:700;color:#111827;margin-top:.25rem}.tabs-container{margin-bottom:2rem;border-bottom:1px solid #e5e7eb}.tabs-nav{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}.tabs-nav::-webkit-scrollbar{display:none}.tab-item{padding:1rem 1.5rem;border:none;background:none;font-size:.875rem;font-weight:500;color:#6b7280;cursor:pointer;position:relative;transition:all .2s ease;white-space:nowrap;min-width:-moz-fit-content;min-width:fit-content;display:flex;align-items:center;gap:.5rem}.tab-icon{font-size:1rem;transition:transform .2s ease}.tab-item:hover .tab-icon{transform:scale(1.1)}.tab-item:hover{color:#374151;background-color:#f9fafb}.tab-item.active{color:#3b82f6;font-weight:600}.tab-item.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:linear-gradient(90deg,#3b82f6,#06b6d4);border-radius:2px 2px 0 0}.admin-panel{display:flex;flex-direction:column;gap:2rem}.panel-header{display:flex;justify-content:space-between;align-items:center}.users-section{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a}.users-table{border:1px solid #e5e7eb;border-radius:.5rem;overflow:hidden}.users-table .table-header{display:grid;grid-template-columns:1fr 1fr 1.5fr 100px 100px 140px 120px;gap:1rem;padding:.75rem 1rem;background:#f8fafc;border-bottom:1px solid #e5e7eb;font-weight:600;font-size:.875rem;color:#374151}.users-table .table-row{display:grid;grid-template-columns:1fr 1fr 1.5fr 100px 100px 140px 120px;gap:1rem;padding:.75rem 1rem;border-bottom:1px solid #e5e7eb;font-size:.875rem;align-items:center}.users-table .table-row:last-child{border-bottom:none}.users-table .table-row:hover{background:#f9fafb}.user-role{font-weight:600;text-transform:capitalize}.user-status{font-weight:500}.user-actions{display:flex;justify-content:center}.system-info{background:#fff;padding:1.5rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a}.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}.info-card{padding:1rem;background:#f8fafc;border-radius:.5rem;text-align:center}.info-label{color:#6b7280;font-size:.875rem;margin-bottom:.5rem}.info-value{font-size:1.5rem;font-weight:700;color:#1f2937}@media(max-width:768px){.users-table .table-header,.users-table .table-row{grid-template-columns:1fr;gap:.5rem}.panel-header{flex-direction:column;align-items:flex-start;gap:1rem}}.layout{display:flex;min-height:100vh}.sidebar{width:280px;background:linear-gradient(180deg,#1e40af,#1d4ed8);color:#fff;display:flex;flex-direction:column;position:fixed;height:100vh;overflow-y:auto}.sidebar-header{padding:2rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.1)}.sidebar-title{font-size:1.5rem;font-weight:700;margin:0}.sidebar-nav{flex:1;padding:1rem 0}.nav-item{display:flex;align-items:center;padding:.75rem 1.5rem;color:#fffc;text-decoration:none;transition:all .2s;border-left:3px solid transparent}.nav-item:hover{background-color:#ffffff1a;color:#fff}.nav-item.active{background-color:#ffffff26;color:#fff;border-left-color:#fbbf24}.nav-icon{font-size:1.2rem;margin-right:.75rem}.nav-text{font-weight:500}.sidebar-footer{padding:1.5rem;border-top:1px solid rgba(255,255,255,.1)}.user-info{margin-bottom:1rem}.user-name{font-weight:600;font-size:.9rem}.user-role{font-size:.8rem;opacity:.8;text-transform:capitalize}.logout-btn{width:100%;padding:.5rem;background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:.375rem;cursor:pointer;transition:background-color .2s}.logout-btn:hover{background-color:#fff3}.main-content{flex:1;margin-left:280px;display:flex;flex-direction:column}.main-header{background:#fff;padding:1rem 2rem;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center;box-shadow:0 1px 3px #0000001a}.header-title{font-size:1.5rem;font-weight:600;color:#1f2937}.header-actions{display:flex;align-items:center;gap:1rem}.user-greeting{color:#6b7280;font-size:.9rem}.content-area{flex:1;padding:2rem;overflow-y:auto}@media(max-width:768px){.sidebar{transform:translate(-100%);transition:transform .3s ease}.main-content{margin-left:0}.content-area{padding:1rem}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f8fafc;color:#1a202c}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{min-height:100vh;display:flex;flex-direction:column}.text-green-600{color:#059669}.text-red-600{color:#dc2626}.text-yellow-600{color:#d97706}.text-blue-600{color:#2563eb}.text-gray-600{color:#4b5563}.bg-green-500{background-color:#10b981}.bg-red-500{background-color:#ef4444}.bg-yellow-500{background-color:#f59e0b}.bg-blue-500{background-color:#3b82f6}.btn{padding:.5rem 1rem;border-radius:.375rem;font-weight:500;cursor:pointer;transition:all .2s;border:none;text-decoration:none;display:inline-block;text-align:center}.btn-primary{background-color:#3b82f6;color:#fff}.btn-primary:hover{background-color:#2563eb}.btn-secondary{background-color:#6b7280;color:#fff}.btn-secondary:hover{background-color:#4b5563}.btn-success{background-color:#10b981;color:#fff}.btn-success:hover{background-color:#059669}.btn-danger{background-color:#ef4444;color:#fff}.btn-danger:hover{background-color:#dc2626}.btn-sm{padding:.25rem .75rem;font-size:.875rem}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem;gap:1rem}.loading-spinner{width:40px;height:40px;border:4px solid #e5e7eb;border-top:4px solid #3b82f6;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.page-title{font-size:2rem;font-weight:700;color:#1f2937;margin-bottom:1.5rem}.section-title{font-size:1.25rem;font-weight:600;color:#1f2937;margin-bottom:1rem}.toast-container{position:fixed;top:1rem;right:1rem;z-index:1000;display:flex;flex-direction:column;gap:.5rem}.toast{background:#fff;padding:1rem 1.5rem;border-radius:.5rem;box-shadow:0 10px 25px -3px #0000001a;border-left:4px solid;display:flex;align-items:center;justify-content:space-between;min-width:300px;animation:slideIn .3s ease-out}.toast-success{border-left-color:#10b981}.toast-error{border-left-color:#ef4444}.toast-warning{border-left-color:#f59e0b}.toast-info{border-left-color:#3b82f6}.toast-close{background:none;border:none;font-size:1.25rem;cursor:pointer;color:#6b7280;margin-left:1rem}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:modalFadeIn .2s ease-out}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:#fff;border-radius:.75rem;box-shadow:0 25px 50px -12px #00000040;width:100%;max-width:500px;margin:1rem;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;border-bottom:1px solid #e5e7eb}.modal-title{font-size:1.25rem;font-weight:600;margin:0;color:#111827}.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#6b7280;padding:.25rem;border-radius:.25rem;transition:all .2s ease;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center}.modal-close:hover{color:#374151;background:#f3f4f6}.modal-body{padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.modal-footer{display:flex;justify-content:flex-end;gap:1rem;padding:1.5rem;border-top:1px solid #e5e7eb;background:#f9fafb;border-radius:0 0 .75rem .75rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-label{font-size:.875rem;font-weight:500;color:#374151}.form-input,.form-select{padding:.75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:1rem;transition:border-color .2s,box-shadow .2s}.form-input:focus,.form-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-input:disabled{background-color:#f9fafb;color:#6b7280}.form-help{font-size:.75rem;color:#6b7280;margin-top:.25rem}.content-card{background:#fff;padding:2rem;border-radius:.75rem;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border:1px solid #f3f4f6;transition:box-shadow .2s ease}.content-card:hover{box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.card-title{font-size:1.25rem;font-weight:700;color:#111827;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.card-description{color:#6b7280;margin-bottom:1.5rem;line-height:1.6;font-size:.875rem}.status-badge{padding:.375rem .875rem;border-radius:9999px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;display:inline-flex;align-items:center;gap:.25rem}.status-badge.success{background-color:#d1fae5;color:#065f46;border:1px solid #a7f3d0}.status-badge.danger{background-color:#fee2e2;color:#991b1b;border:1px solid #fecaca}.status-badge.warning{background-color:#fef3c7;color:#92400e;border:1px solid #fde68a}.status-badge.info{background-color:#dbeafe;color:#1e40af;border:1px solid #bfdbfe}
