/* Watchlist star (partials/_watchlist_star.html). Plain CSS on purpose: the
   committed tailwind.css is not rebuilt by CI. */
.wl-star { position: relative; display: inline-flex; flex-shrink: 0; }
.wl-star__btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2.25rem; height: 2.25rem; border-radius: 9999px; cursor: pointer;
    border: 1px solid rgba(255, 255, 255, .28); background: rgba(15, 23, 42, .35);
    color: #fff; transition: background-color .15s, color .15s, border-color .15s;
}
.wl-star__btn:hover { background: rgba(255, 255, 255, .18); }
.wl-star__btn:focus-visible { outline: 2px solid #fbbf24; outline-offset: 2px; }
.wl-star__btn.is-on { color: #fbbf24; border-color: rgba(251, 191, 36, .6); }
.wl-star--light .wl-star__btn { border-color: #cbd5e1; background: #fff; color: #64748b; }
.wl-star--light .wl-star__btn:hover { background: #f8fafc; color: #334155; }
.wl-star--light .wl-star__btn.is-on { color: #f59e0b; border-color: #fcd34d; }
.wl-star__icon { width: 1.25rem; height: 1.25rem; }

/* Panel is teleported to <body> and positioned (fixed) by watchlist-star.js. */
.wl-star__panel {
    position: fixed; z-index: 1000; max-height: min(26rem, 70vh); overflow-y: auto;
    background: #fff; color: #1f2937; border: 1px solid #e5e7eb; border-radius: .75rem;
    box-shadow: 0 12px 32px rgba(15, 23, 42, .18), 0 2px 6px rgba(15, 23, 42, .08);
    font-size: .875rem; line-height: 1.25rem; text-align: left;
}
.wl-star__head {
    padding: .625rem .875rem .375rem; font-size: .6875rem; font-weight: 700;
    letter-spacing: .05em; text-transform: uppercase; color: #64748b;
}
.wl-star__status { padding: .5rem .875rem; color: #64748b; font-size: .8125rem; }
.wl-star__status--err { color: #b91c1c; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.wl-star__rows { padding: .125rem 0; }
.wl-star__row {
    display: flex; align-items: center; gap: .625rem; width: 100%;
    padding: .5rem .875rem; background: none; border: 0; cursor: pointer;
    color: #1f2937; text-align: left; font: inherit;
}
.wl-star__row:hover, .wl-star__row:focus-visible { background: #f1f5f9; outline: none; }
.wl-star__row:disabled { opacity: .6; cursor: progress; }
.wl-star__row-icon { width: 1.125rem; height: 1.125rem; flex-shrink: 0; color: #94a3b8; }
.wl-star__row-icon.is-on { color: #f59e0b; }
.wl-star__name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wl-star__tag {
    flex-shrink: 0; font-size: .625rem; font-weight: 700; text-transform: uppercase;
    color: #4338ca; background: #eef2ff; border-radius: .25rem; padding: .0625rem .375rem;
}
.wl-star__foot { border-top: 1px solid #f1f5f9; padding: .25rem 0; }
.wl-star__row--new { color: #0f766e; font-weight: 600; }
.wl-star__plus { width: 1.125rem; text-align: center; font-size: 1.125rem; line-height: 1; flex-shrink: 0; }
.wl-star__create { display: flex; gap: .375rem; padding: .375rem .875rem .5rem; }
.wl-star__input {
    flex: 1; min-width: 0; padding: .375rem .5rem; border: 1px solid #cbd5e1;
    border-radius: .375rem; font: inherit; color: #1f2937; background: #fff;
}
.wl-star__input:focus { outline: 2px solid #5eead4; outline-offset: 0; border-color: #14b8a6; }
.wl-star__ok {
    padding: .375rem .75rem; border: 0; border-radius: .375rem; background: #0d9488;
    color: #fff; font-weight: 600; cursor: pointer; font: inherit;
}
.wl-star__ok:disabled { opacity: .45; cursor: not-allowed; }
.wl-star__manage, .wl-star__link {
    display: block; padding: .375rem .875rem .5rem; color: #64748b; font-size: .75rem;
    text-decoration: none; background: none; border: 0; cursor: pointer;
}
.wl-star__link { display: inline; padding: 0; text-decoration: underline; color: inherit; }
.wl-star__manage:hover, .wl-star__manage:focus-visible { color: #0f766e; text-decoration: underline; outline: none; }
.wl-star__msg {
    margin: 0 .5rem .5rem; padding: .375rem .625rem; border-radius: .375rem;
    background: #fef2f2; color: #991b1b; font-size: .75rem;
}
.wl-star__guest { padding: .875rem; }
.wl-star__guest-title { font-weight: 700; color: #0f172a; margin: 0 0 .25rem; }
.wl-star__guest-text { color: #475569; font-size: .8125rem; margin: 0 0 .75rem; }
.wl-star__cta {
    display: inline-block; padding: .4375rem .875rem; border-radius: .5rem; background: #0d9488;
    color: #fff; font-weight: 600; font-size: .8125rem; text-decoration: none; margin-right: .375rem;
}
.wl-star__cta:hover { background: #0f766e; }
.wl-star__cta--ghost { background: #fff; color: #0f766e; border: 1px solid #99f6e4; }
.wl-star__cta--ghost:hover { background: #f0fdfa; }
.wl-star__cta:focus-visible { outline: 2px solid #0d9488; outline-offset: 2px; }

/* Header placement helpers: star in the top-right corner of a header block. */
.wl-star-corner { position: absolute; top: .75rem; right: .75rem; z-index: 20; }
.wl-star-corner-pad { padding-right: 2.75rem; }
@media (min-width: 1024px) {
    /* vessel header: the actions column sits under the star on desktop */
    .wl-star-corner-pad--mobile { padding-right: 0; }
}
.wl-star-corner--tight { top: .5rem; right: .5rem; }
.wl-star__msg.is-ok { background: #f0fdfa; color: #115e59; }