body {
    font-family: 'Raleway', sans-serif;
}

td {
    word-break: break-all;
}

/* ── Purchases table ─────────────────────────────────────────── */

.attachment-icon {
    display: inline-block;
    color: var(--bs-primary);
    margin-right: 4px;
    vertical-align: middle;
    opacity: .8;
    transition: opacity .15s;
}

.attachment-icon:hover {
    opacity: 1;
}

/* ── Admin — vessel cards ────────────────────────────────────── */

.vessel-card {
    border-top: 3px solid var(--bs-primary);
    transition: box-shadow .2s;
}

.vessel-card:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, .45);
}

.vessel-inactive {
    border-top-color: var(--bs-secondary);
    opacity: .65;
}

.vessel-name {
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Admin — status badges ───────────────────────────────────── */

.status-badge {
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .2rem .55rem;
    border-radius: 999px;
}

.badge-active {
    background: rgba(45, 212, 191, .15);
    color: #2dd4bf;
    border: 1px solid #2dd4bf;
}

.badge-inactive {
    background: rgba(108, 117, 125, .15);
    color: #6c757d;
    border: 1px solid #495057;
}

/* ── Admin — toggle links ────────────────────────────────────── */

.toggle-link {
    font-size: .75rem;
    font-weight: 600;
    text-decoration: none;
    padding: .2rem .6rem;
    border-radius: 6px;
    border: 1px solid transparent;
    transition: background .15s;
}

.toggle-off { color: #f87171; border-color: #7f1d1d; }
.toggle-off:hover { background: rgba(248, 113, 113, .1); color: #f87171; }

.toggle-on  { color: #4ade80; border-color: #14532d; }
.toggle-on:hover  { background: rgba(74, 222, 128, .1); color: #4ade80; }