/* ───────────────────────────────────────────────────────────── AttivitaCard — soft UI ───────────────────────────────────────────────────────────── */ .attivita-card { position: relative; display: flex; flex-direction: column; border-radius: 20px; background: #ffffff; border: 1px solid rgba(31, 30, 90, 0.05); box-shadow: 0 6px 22px rgba(31, 30, 90, 0.07), 0 1px 3px rgba(31, 30, 90, 0.04); overflow: hidden; transition: transform 0.22s ease, box-shadow 0.22s ease, opacity 0.22s ease; } .attivita-card:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(31, 30, 90, 0.13), 0 2px 6px rgba(31, 30, 90, 0.06); } /* Accent bar — priority */ .accent-bar { position: absolute; top: 0; left: 0; bottom: 0; width: 5px; border-radius: 20px 0 0 20px; } .attivita-card.priorita-emergenza .accent-bar { background: linear-gradient(180deg, #ff6b6b, #d32f2f); } .attivita-card.priorita-alta .accent-bar { background: linear-gradient(180deg, #ffb74d, #ef6c00); } .attivita-card.priorita-normale .accent-bar { background: linear-gradient(180deg, #8c8bff, var(--primary-color)); } /* Closed / non-open cards */ .attivita-card.card-chiusa { opacity: 0.62; box-shadow: 0 2px 10px rgba(31, 30, 90, 0.05); } .attivita-card.card-chiusa:hover { transform: none; box-shadow: 0 2px 10px rgba(31, 30, 90, 0.05); } /* Drag affordance */ .attivita-card[draggable="true"] { cursor: grab; } .attivita-card[draggable="true"]:active { cursor: grabbing; } /* ─── Body ─── */ .card-body { padding: 1rem 1.1rem 0.4rem 1.25rem; } .card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.75rem; } .priorita-pill { display: inline-flex; align-items: center; gap: 0.3rem; height: 26px; padding: 0 0.7rem; border-radius: 100px; font-size: 0.66rem; font-weight: 700; letter-spacing: 0.04em; line-height: 1; } .priorita-pill ::deep .mud-icon-root { font-size: 0.95rem; } .priorita-pill.priorita-emergenza { background: #ffe9e9; color: #c62828; } .priorita-pill.priorita-alta { background: #fff2df; color: #e65100; } .priorita-pill.priorita-normale { background: #ecebff; color: #3f3bc4; } .card-top ::deep .handle-icon { font-size: 1.2rem; } .card-top ::deep .lock-icon { color: #e53935; opacity: 0.75; } .card-top ::deep .drag-icon { color: #c4c4d4; } .card-store { display: flex; align-items: center; gap: 0.45rem; margin: 0 0 0.4rem; font-size: 0.98rem; font-weight: 600; color: var(--darker-color); } .card-store ::deep .mud-icon-root { color: var(--primary-color); } .card-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 0.15rem; margin-bottom: 0.35rem; font-size: 0.72rem; color: #9a9aae; } .card-breadcrumb ::deep .mud-icon-root { font-size: 0.9rem; color: #c7c7d6; } .card-location { display: flex; align-items: center; gap: 0.35rem; margin-bottom: 0.55rem; font-size: 0.76rem; color: #6b6b7b; } .card-location ::deep .mud-icon-root { font-size: 1rem; color: #9a9aae; } .card-desc { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 0 0 0.6rem; font-size: 0.85rem; line-height: 1.5; color: #4a4a57; } .card-allegati-pill { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.25rem 0.65rem; border-radius: 100px; background: rgba(83, 82, 237, 0.08); color: var(--primary-color); font-size: 0.72rem; font-weight: 600; } .card-allegati-pill ::deep .mud-icon-root { font-size: 0.95rem; } /* ─── Actions ─── */ .card-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 0.5rem; padding: 0.4rem 1.1rem 1rem 1.25rem; } .btn-card { display: inline-flex; align-items: center; gap: 0.35rem; height: 36px; padding: 0 1rem; border-radius: 100px; border: none; font-family: inherit; font-size: 0.78rem; font-weight: 600; cursor: pointer; transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease; -webkit-tap-highlight-color: transparent; } .btn-card ::deep .mud-icon-root { font-size: 1.05rem; } .btn-card:active { transform: scale(0.96); } .btn-card-ghost { background: #f3f3fb; color: var(--primary-color); } .btn-card-ghost:hover { background: #e9e9fb; } .btn-card-primary { background: linear-gradient(135deg, #5352ed, #3f3bc4); color: #fff; box-shadow: 0 5px 16px rgba(83, 82, 237, 0.32); } .btn-card-primary:hover { box-shadow: 0 7px 20px rgba(83, 82, 237, 0.42); } /* Stato pill (non-open cards) */ .stato-pill { display: inline-flex; align-items: center; gap: 0.35rem; height: 30px; padding: 0 0.85rem; border-radius: 100px; font-size: 0.74rem; font-weight: 700; } .stato-pill ::deep .mud-icon-root { font-size: 1rem; } .stato-pill.stato-chiusa { background: #e6f6ec; color: #2e7d32; } .stato-pill.stato-rimandata { background: #fff4e0; color: #e08600; } .stato-pill.stato-aperta { background: #ecebff; color: #3f3bc4; }