body { background: #f5f7fb; } .navbar { margin-bottom: 25px; } .card { border: 0; border-radius: 12px; box-shadow: 0 2px 8px rgba(0,0,0,.06); } .page-title { font-weight: 700; } .category-item { display: grid; gap: 1rem; } .category-edit-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; align-items: end; } .category-fields { display: grid; grid-template-columns: 5rem minmax(0, 1fr); gap: .75rem; } .category-icon-input { text-align: center; } .category-actions button { white-space: nowrap; } .product-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: .5rem; margin-top: 1.5rem; .list-check-button { width: 2.5rem; height: 2.5rem; padding: 0; font-size: 1.35rem; line-height: 1; } align-items: stretch; } .product-actions form, .product-actions button, .product-actions a { width: 100%; } .product-actions a { display: inline-flex; align-items: center; justify-content: center; } .category-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; } .category-actions form, .category-actions button { width: 100%; } @media (max-width: 767.98px) { .category-item { padding: 1rem; } .category-edit-form, .category-fields { grid-template-columns: 1fr; } .category-edit-form { display: contents; } .product-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); } .product-actions a { grid-column: 1 / -1; } } .alert { animation: fadeIn .3s ease; } @keyframes fadeIn { from{ opacity:0; transform:translateY(-10px); } to{ opacity:1; transform:translateY(0); } }