/* assets/css/table_component.css – layout overrides for full width */

/* Gör så att .card och tabellen tar upp hela arbetsytan inom main-content */
.main-content {
  /* Låt app.css styra layout och sidomeny, ingen extra bredd här */
}
.card {
  width: 100% !important;
  max-width: none !important;
}
.tbl-wrap, .tbl-scroller, .tbl-table {
  width: 100% !important;
  max-width: 100% !important;
}

/* Our table already uses width:100%; keep these safety belts */
.tbl-wrap{display:block;width:100%;grid-column:1 / -1;}
.tbl-scroller{overflow:auto;width:100%;max-width:100%;min-height:360px;display:block;}
.tbl-table{width:100%;table-layout:auto;border-collapse:separate;border-spacing:0;}
.tbl-table thead th{text-align:left !important;}

/* Keep the existing visual styles from earlier patch */
.tbl-header{display:flex;align-items:center;gap:12px;margin:0 0 6px 0;}
.tbl-search{flex:0 1 420px;max-width:520px;padding:8px 10px;border:1px solid #d0d7de;border-radius:8px;}
.tbl-filters{display:flex;justify-content:space-between;align-items:center;margin:4px 0 8px;}
.tbl-filter-left{display:flex;gap:8px;align-items:center;}
.tbl-chip{border:1px solid #cbd5e1;background:#f8fafc;color:#334155;border-radius:999px;padding:6px 12px;cursor:pointer;font-size:12px;line-height:1.1;transition:background .15s,border-color .15s,color .15s;}
.tbl-chip:hover{background:#eef2f7;border-color:#94a3b8;}
.tbl-chip.active{background:#2563eb;color:#fff;border-color:#1d4ed8;}
.tbl-chip.active:hover{background:#1d4ed8;}
.tbl-filter-right{display:flex;align-items:center;gap:16px;}

/* Icon buttons - diskret pastellstil */
.icon-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border:1px solid #e2e8f0;
  background:#f8fafc;
  border-radius:6px;
  cursor:pointer;
  text-decoration:none;
  color:#64748b;
  transition:all 0.15s;
}
.icon-btn i{font-size:14px;line-height:1;}
.icon-btn:hover{background:#f1f5f9;border-color:#cbd5e1;color:#475569;}

/* Ny-knapp - grön */
.icon-btn.tbl-new{background:#f0fdf4;color:#16a34a;border-color:#bbf7d0;}
.icon-btn.tbl-new:hover{background:#dcfce7;border-color:#86efac;color:#15803d;}

/* Export-knapp - blå */
.icon-btn.tbl-export{background:#eff6ff;color:#3b82f6;border-color:#bfdbfe;}
.icon-btn.tbl-export:hover{background:#dbeafe;border-color:#93c5fd;color:#2563eb;}

/* Print-knapp - neutral */
.icon-btn.tbl-print{background:#f8fafc;color:#64748b;border-color:#e2e8f0;}
.icon-btn.tbl-print:hover{background:#f1f5f9;border-color:#cbd5e1;color:#475569;}

/* Delete-knapp - röd */
.icon-btn.act-del,
.icon-btn.act-del-article,
.icon-btn.act-del-customer,
.icon-btn.act-del-mt,
.icon-btn.act-del-person,
.icon-btn.act-del-activity,
.icon-btn.act-del-attachment,
.icon-btn.act-del-door,
.icon-btn.act-del-resource,
.icon-btn.act-del-booking,
.icon-btn.act-del-user,
.icon-btn.act-del-event,
.icon-btn[style*="color:#c00"],
.icon-btn[style*="color: #c00"]{
  background:#fef2f2 !important;
  color:#dc2626 !important;
  border-color:#fecaca !important;
}
.icon-btn.act-del:hover,
.icon-btn.act-del-article:hover,
.icon-btn.act-del-customer:hover,
.icon-btn.act-del-mt:hover,
.icon-btn.act-del-person:hover,
.icon-btn.act-del-activity:hover,
.icon-btn.act-del-attachment:hover,
.icon-btn.act-del-door:hover,
.icon-btn.act-del-resource:hover,
.icon-btn.act-del-booking:hover,
.icon-btn.act-del-user:hover,
.icon-btn.act-del-event:hover,
.icon-btn[style*="color:#c00"]:hover,
.icon-btn[style*="color: #c00"]:hover{
  background:#fee2e2 !important;
  border-color:#fca5a5 !important;
  color:#b91c1c !important;
}
.tbl-pagination{display:flex;gap:6px;align-items:center;}
.tbl-pagination button{width:30px;height:30px;border:none;background:#fff;border:1px solid #d0d7de;border-radius:6px;cursor:pointer;color:#4b5563;box-shadow:0 1px 2px rgba(0,0,0,0.05);}
.tbl-pagination button:hover{background:#f1f5f9;color:#111827;}
.tbl-pagination .pg-info{font-size:14px;color:#6b7280;margin:0 4px;}
.tbl-pagination select.pg-rows{height:30px;padding:0 8px;border:1px solid #d0d7de;border-radius:6px;font-size:14px;background:#fff;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,0.05);}
.tbl-table th{padding:8px 10px;color:#374151;border-bottom:1px solid #e5e7eb;white-space:nowrap;}
th .th-sort{font-size:12px;opacity:0.45;margin-left:6px;}
.tbl-table td{padding:8px 10px;border-bottom:1px solid #f0f2f5;vertical-align:middle;}
.tbl-table tbody tr:hover{background:#f9fafb;}
.tbl-loading td,.tbl-empty td{padding:16px;color:#6b7280;text-align:center;}
.tbl-error{color:#b91c1c;}