/* ==============================================================================
 *  Desenho padrão das camas (XWM-126)
 *
 *  Desenhos: assets/icons/camas.svg. Markup: views/fragments/camas.html (e app/camas.js,
 *  para a prévia). A cama pega a cor do texto de quem a contém (currentColor), então
 *  acompanha os dois temas sozinha.
 *
 *  O tamanho é UMA variável: --xn-cama-h, a altura da cama. A largura sai da proporção dos
 *  desenhos (casal 18 x 20, solteiro 11 x 20) e o espaço entre elas também escala com a
 *  altura — é isso que deixa a regra de "caber no tile" do fragmento valer em qualquer
 *  tamanho. Quem chama só redefine --xn-cama-h.
 * ---------------------------------------------------------------------------- */
.xn-camas {
    --xn-cama-h: 16px;
    display: inline-flex;
    align-items: center;
    gap: calc(var(--xn-cama-h) / 8);
    line-height: 1;
    vertical-align: middle;
}

.xn-cama {
    flex: none;
    height: var(--xn-cama-h);
}
.xn-cama--casal    { width: calc(var(--xn-cama-h) * 18 / 20); }
.xn-cama--solteiro { width: calc(var(--xn-cama-h) * 11 / 20); }

/* "2×" + cama: o modo compacto, quando as camas não cabem desenhadas uma a uma. Um tipo
   por linha: lado a lado, "3× casal 1× solteiro" passava do tile (61px num miolo de 54,
   medido no Chrome); empilhado, cabe na altura das três densidades do Rack. */
.xn-camas--compacto {
    flex-direction: column;
    gap: calc(var(--xn-cama-h) / 8);
}
.xn-camas-grupo {
    display: inline-flex;
    align-items: center;
    gap: 1px;
}
.xn-camas-n {
    font-size: calc(var(--xn-cama-h) * .72);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* ── O tile do Rack em miniatura, para a prévia ──────────────────────────────
   Mesmas medidas e superfície do .ru-tile (rack.css): 72px, vidro, linha e a barra
   lateral neutra de quando a UH não tem status. Não reaproveita o .ru-tile porque
   aquele vive escopado em .rack-container, com arrastar, hover e densidades. */
.xn-camas-quadro {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 72px;
    height: 72px;
    padding: 6px 6px 6px 10px;
    border-radius: var(--occ-radius-sm);
    background: var(--occ-glass-bg);
    border: 1px solid var(--occ-line);
    box-shadow: inset 4px 0 0 0 var(--occ-ink-faint), var(--occ-shadow);
    font-variant-numeric: tabular-nums;
}
.xn-camas-quadro-num {
    font-size: .95rem;
    font-weight: 700;
    color: var(--occ-ink);
    line-height: 1;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.xn-camas-quadro-camas {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--occ-ink);
    opacity: .6;
}
.xn-camas-quadro-camas img { height: 16px; width: auto; opacity: .75; }