/* Estilos mejorados y profesionales para el panel */
:root{
	--brand: #0d6efd;
	--muted: #6c757d;
	--surface: #ffffff;
	--bg: #f4f6fb;
}
html,body{height:100%;}
body { background:var(--bg); font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; color:#222; }

.container h1{ font-weight:600; letter-spacing: -0.5px; }
.card { box-shadow: 0 6px 18px rgba(22,28,45,0.06); border: none; border-radius: .6rem; background: var(--surface); }
.card-header { background: linear-gradient(90deg, rgba(13,110,253,0.06), rgba(13,110,253,0.02)); border-bottom: none; font-weight:600; }

/* Table styling */
.table thead th { border: 0; background: transparent; color: #444; font-weight:600; }
.table tbody td { vertical-align: middle; }
.table-striped>tbody>tr:nth-of-type(odd){ background: rgba(13,110,253,0.02); }
.table-hover>tbody>tr:hover{ background: rgba(13,110,253,0.04); }
.table-responsive { overflow: hidden; }

.badge-slug { background: #eef4ff; color: var(--brand); border:1px solid rgba(13,110,253,0.08); font-weight:600; }

/* Buttons */
.btn-primary, .btn-success { border-radius: .45rem; box-shadow: 0 1px 0 rgba(0,0,0,0.04); }
.btn-outline-primary { border-radius: .45rem; }

/* Pagination */
.pagination { justify-content: center; }
.page-link { border-radius: .35rem; }

/* Modal tweaks */
.modal-content { border-radius: .6rem; }

/* Header area */
.panel-header { display:flex; align-items:center; gap:16px; }
.panel-header .logo-placeholder{ width:48px; height:48px; background:linear-gradient(135deg,#e9f0ff,#f7fbff); border-radius:8px; display:flex; align-items:center; justify-content:center; color:var(--brand); font-weight:700; }

/* Small text helpers */
.text-muted-small{ color:var(--muted); font-size:0.9rem; }

@media (max-width:767px){
	.panel-header { flex-direction:column; align-items:flex-start; }
}

/* Responsive table: convert rows to cards on small screens */
@media (max-width: 768px) {
	.table thead { display: none; }
	.table tbody, .table tr, .table td { display: block; width: 100%; }
	.table tr { margin-bottom: 1rem; border-radius: .5rem; background: var(--surface); padding: .75rem; box-shadow: 0 6px 18px rgba(22,28,45,0.04); }
	.table td { padding: .35rem .5rem; border: 0; display: flex; justify-content: space-between; align-items: center; }
	.table td::before { content: attr(data-label); font-weight: 600; color: var(--muted); margin-right: .5rem; flex: 0 0 40%; }
	.table td:nth-child(4)::before { flex-basis: 50%; }
	.table td .btn { white-space: nowrap; }
	.action-buttons { display:flex; gap:8px; }
	.action-buttons .btn { flex: 1 1 auto; }

	/* Modal full screen on mobile */
	.modal-dialog { max-width: 95%; margin: 1.5rem auto; }
}