/* davlatyor.uz/portfolio — web-only overrides on top of the shared style.css.
   Keeps the original (classic) design intact; only adjusts the standalone
   read-only bits and fixes long-text overflow. */

/* ---- read-only like pill in the project modal (not a button here) ------ */
.like-button.like-readonly { cursor: default; }
.like-button.like-readonly:hover { transform: none; border-color: var(--line2) !important; }
.like-button .heart-icon { display: inline-flex; }
.like-button .heart-icon .svg-icon { width: 25px; height: 25px; flex-basis: 25px; color: var(--heart); }

/* ---- read-only rating stars: show state, no interaction ---------------- */
#modal-stars .star { cursor: default; }
#modal-stars .star:hover { transform: none; background: transparent; }
#modal-stars .star.active { color: var(--star); }

/* ---- comment engagement -> Telegram call to action --------------------- */
.engage-cta {
    margin-top: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 14px;
    border: 1px dashed rgba(34, 211, 238, .28);
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(34, 211, 238, .06), rgba(255, 255, 255, .02));
    color: var(--muted);
    font-size: 13px;
    line-height: 1.45;
}
.engage-cta .btn { min-height: 44px; white-space: nowrap; }
.chat-pill .svg-icon { color: var(--cyan); }

@media (max-width: 640px) {
    .engage-cta { flex-direction: column; align-items: stretch; }
    .engage-cta .btn { width: 100%; }
}

/* ======================================================================== */
/*  FIX: long words / URLs / titles overflowing their blocks.               */
/*  Applies safe wrapping to every text container without touching layout.  */
/* ======================================================================== */
.cube h3, .cube p,
.project-card h4, .project-card p,
.code-card h3, .code-card p, .code-meta span,
.comment-body strong, .comment-body p,
.resume-info h3, .resume-info p, .resume-info span,
.pinfo h2, .pinfo p, #prof-bio,
#main-title, #main-status, #main-purpose-text,
#modal-title, #modal-desc,
.welcome h1, #title-sub,
.section-head h2, .section-head p, .muted {
    overflow-wrap: anywhere;
    word-break: break-word;
    min-width: 0;
}

/* Flex / grid children must be allowed to shrink instead of forcing overflow. */
.main, .main-project, .main-cubes, .cube,
.projects-grid, .project-card,
.codes-grid, .code-card,
.resume-list, .resume-card, .resume-info,
.comments-list, .comment-item, .comment-body,
.welcome, .topbar, .pinfo {
    min-width: 0;
}

/* Keep any stray inline content from spilling past a card edge. */
.card, .sidebar, .project-card, .code-card, .cube { overflow-wrap: anywhere; }