/* =========================================================
   Vrienda v7.3.1 - Hard Radius Cleanup
   Plaats als ALLERLAATSTE stylesheet, na v7.3.
   Doel: resterende oude ronde velden/cards hard normaliseren.
   ========================================================= */

/* Design tokens */
:root{
    --radius:10px !important;
    --radius-sm:8px !important;
    --radius-md:10px !important;
    --radius-lg:10px !important;
    --radius-xl:10px !important;
    --radius-2xl:10px !important;
    --radius-3xl:10px !important;

    --vf-radius:10px !important;
    --vf-radius-lg:10px !important;
    --v6-radius:10px !important;
    --v6-radius-lg:10px !important;
    --ds-radius:10px !important;
}

/* Hard normalize common layout blocks */
body :where(
    .panel,
    .card,
    .box,
    .widget,
    .section,
    .surface,
    .module,
    .tile,
    .feed-card,
    .post-card,
    .krabbel-card,
    .story-card,
    .stories-card,
    .activity-card,
    .composer,
    .create-post,
    .post-composer,
    .krabbel-composer,
    .comment,
    .comment-item,
    .reply,
    .krabbel-comment,
    .comment-form,
    .reply-form,
    .krabbel-comment-form,
    .post-comment-form,
    .reaction-box,
    .reaction-panel,
    .emoji-panel,
    .gif-panel,
    .tag-panel,
    .mention-panel,
    .sidebar-profile-card,
    .nav-card,
    .menu-card,
    .trending-card,
    .side-card,
    .profile-card,
    .group-card
){
    border-radius:10px !important;
}

/* Catch old generated classes */
body :where(
    [class*="card"],
    [class*="panel"],
    [class*="composer"],
    [class*="comment"],
    [class*="reply"],
    [class*="reaction"],
    [class*="krabbel"],
    [class*="bubble"],
    [class*="surface"],
    [class*="widget"]
):not(
    img,
    .avatar,
    .profile-avatar,
    .sidebar-profile-avatar,
    .user-avatar,
    .post-avatar,
    .comment-avatar,
    .member-avatar,
    .story-avatar,
    .fab,
    .floating-action,
    .chat-fab,
    .add-fab
){
    border-radius:10px !important;
}

/* Forms and composer fields: these were still too round */
body :where(
    input,
    textarea,
    select,
    .form-control,
    .input,
    .search-input,
    .comment-input,
    .reply-input,
    .composer-input,
    .post-input,
    .krabbel-input,
    [contenteditable="true"]
){
    border-radius:10px !important;
}

/* Buttons: normal buttons 10px, only real floating buttons circular */
body :where(
    button,
    .btn,
    .button,
    input[type="submit"],
    a.btn,
    .action-btn,
    .like-button,
    .comment-button,
    .reaction-trigger,
    .submit-btn,
    .post-submit,
    .share-btn
):not(
    .fab,
    .floating-action,
    .chat-fab,
    .add-fab
){
    border-radius:10px !important;
}

/* Legacy inline rounded components */
body :where(
    [style*="border-radius: 12"],
    [style*="border-radius:12"],
    [style*="border-radius: 14"],
    [style*="border-radius:14"],
    [style*="border-radius: 16"],
    [style*="border-radius:16"],
    [style*="border-radius: 18"],
    [style*="border-radius:18"],
    [style*="border-radius: 20"],
    [style*="border-radius:20"],
    [style*="border-radius: 22"],
    [style*="border-radius:22"],
    [style*="border-radius: 24"],
    [style*="border-radius:24"],
    [style*="border-radius: 28"],
    [style*="border-radius:28"],
    [style*="border-radius: 32"],
    [style*="border-radius:32"],
    [style*="border-radius:999"]
):not(
    img,
    .avatar,
    .profile-avatar,
    .sidebar-profile-avatar,
    .user-avatar,
    .post-avatar,
    .comment-avatar,
    .member-avatar,
    .story-avatar,
    .fab,
    .floating-action,
    .chat-fab,
    .add-fab
){
    border-radius:10px !important;
}

/* Keep actual avatars round */
body :where(
    .avatar,
    .profile-avatar,
    .sidebar-profile-avatar,
    .user-avatar,
    .post-avatar,
    .comment-avatar,
    .member-avatar,
    .story-avatar,
    img.avatar,
    img.profile-avatar,
    img.sidebar-profile-avatar,
    img.user-avatar,
    img.post-avatar,
    img.comment-avatar,
    .post-header img,
    .krabbel-header img,
    .feed-card-header img,
    .user-row img,
    .author-row img
){
    border-radius:50% !important;
}

/* Keep floating buttons round */
body :where(
    .fab,
    .floating-action,
    .chat-fab,
    .add-fab,
    .float-btn,
    .quick-action
){
    border-radius:50% !important;
}

/* Pills/badges remain pill-shaped */
body :where(
    .badge,
    .pill,
    .tag,
    .hashtag,
    .mention,
    .status-badge,
    .online-badge,
    .offline-badge,
    .count-pill
){
    border-radius:999px !important;
}

/* Hero/cover only slightly soft */
body :where(
    .hero,
    .hero-card,
    .cover-card,
    .welcome-banner,
    .welcome-card,
    .banner,
    .profile-cover,
    .sidebar-profile-cover
){
    border-radius:12px !important;
}

/* But profile cover should connect to profile card top */
.sidebar-profile-card .sidebar-profile-cover{
    border-radius:0 !important;
}

/* Post media should not have inner rounded corners */
body :where(
    .post-media,
    .media-wrap,
    .image-wrap
){
    border-radius:0 !important;
}

body :where(
    .post-media img,
    .media-wrap img,
    .image-wrap img,
    .feed-image,
    .post-image,
    .krabbel-image
){
    border-radius:0 !important;
}

/* Specific visible leftovers from current screenshot */
#postForm,
#postForm *,
.composer,
.composer *,
.post-composer,
.post-composer *,
.krabbel-composer,
.krabbel-composer *,
.comment-form,
.comment-form *,
.krabbel-comment-form,
.krabbel-comment-form *{
    border-radius:10px !important;
}

/* Restore exceptions inside those groups */
#postForm img,
.composer img,
.post-composer img,
.krabbel-composer img,
.comment-form img,
.krabbel-comment-form img{
    border-radius:50% !important;
}

/* Emoji/reaction small circles should become clean squares unless they are icons only */
.quick-reactions button,
.reaction-options button,
.emoji-picker button,
.composer-tools button,
.post-tools button{
    border-radius:10px !important;
}

/* Remove oversized rounded corners from nested empty wrappers */
.feed-card div,
.post-card div,
.krabbel-card div{
    max-border-radius:10px;
}

/* Browser fallback for older CSS that uses classes with high specificity */
html body .feed-card,
html body .post-card,
html body .krabbel-card,
html body .panel,
html body .card,
html body .composer,
html body .comment,
html body .krabbel-comment{
    border-radius:10px !important;
}