/* Calendar Styling  */

.clearfix::after,
.dbc-calendar ol::after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.dbc-calendar {
    border-radius: 10px;
}

.month {
    font-size: 2rem;
}

@media (min-width: 992px) {
    .month {
        font-size: 3.5rem;
    }
}

.dbc-calendar ol li {
    float: left;
    width: 14.28571%;
}

.dbc-calendar .day-names {
    border-bottom: 1px solid #eee;
}

    .dbc-calendar .day-names li {
        text-transform: uppercase;
        margin-bottom: 0.5rem;
    }

.dbc-calendar .days li {
    border-bottom: 1px solid #eee;
    min-height: 10rem;
}

    .dbc-calendar .days li .date {
        margin: 0.5rem 0;
    }

    .dbc-calendar .days li .event {
        font-size: 0.75rem;
        padding: 0.2rem 0.1rem 0.2rem 0.1rem;
        overflow: hidden;
        text-overflow: ellipsis;
        margin-bottom: 1px;
    }

        .dbc-calendar .days li .event.span-2 {
            width: 200%;
        }

        .dbc-calendar .days li .event.begin {
            border-radius: 1rem 0 0 1rem;
        }

        .dbc-calendar .days li .event.end {
            border-radius: 0 1rem 1rem 0;
        }

        .dbc-calendar .days li .event.clear {
            background: none;
        }

    .dbc-calendar .days li:nth-child(n+29) {
        border-bottom: none;
    }

    .dbc-calendar .days li.outside .date {
        color: #ddd;
    }


.dbc-activity-table-column {
    border: solid 1px;
    padding: 3px;
    margin-top: 3px;
    margin-bottom: 3px;
}

.dbc-activity-table-header-column {
    border-left: solid 1px;
    border-right: solid 1px;
    border-bottom: solid 2px;
    border-top: solid 1px;
    padding: 3px;
    font-size: 105%;
    font-weight: bold;
}

.dbc-activity-table {
    margin-top: 10px;
    margin-bottom: 10px;
    border: solid 1px;
    width: 100%;
    border-collapse: collapse;
}

.dbc-activity-rable-row-error { BACKGROUND-COLOR: lightpink }
.dbc-activity-table-row-blocked { BACKGROUND-COLOR: lightgoldenrodyellow }
.dbc-activity-table-row-security-failure { BACKGROUND-COLOR: lightsalmon }


/* align with bootstrap (grid-framework.scss) */
.dbc-blogpost-fields-allignment-compatibility { 
    padding-left: 15px;
    padding-right: 15px; 
}
        
/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    /* Hide captions */
    .carousel-caption {
        display: none;
    }
}


.dbc-post-image-full {
    width: 100%;
    height: 100%;
}

tbody.dbc-admin-comment-table td {
    word-break: break-all;
}

/* Admin: comment moderation cards */
.dbc-comment-card {
    border-left: 4px solid var(--bs-secondary-bg) !important;
    transition: box-shadow .15s ease-in-out, transform .15s ease-in-out;
}

.dbc-comment-card:hover {
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .12) !important;
}

.dbc-comment-card--pending {
    border-left-color: var(--bs-warning) !important;
}

.dbc-comment-card--approved {
    border-left-color: var(--bs-success) !important;
}

.dbc-comment-card--spam {
    border-left-color: var(--bs-danger) !important;
}

.dbc-comment-card .dbc-admin-comment-content {
    word-break: break-word;
}

.dbc-comment-card .dbc-comment-gravatar {
    width: 48px;
    height: 48px;
    object-fit: cover;
}

/* ============================================================
   TagHelper / ViewComponent component hooks
   ------------------------------------------------------------
   These class names are emitted by C# TagHelpers and Razor view
   components. The rules below are the shipped defaults so that
   markup stays free of inline CSS.

   DO NOT EDIT THESE RULES TO CUSTOMIZE A THEME.
   site.css is part of the product. To change the look of a
   theme, override these selectors in that theme's own CSS file
   (e.g. Themes/<your-theme>/custom.css), which is loaded after
   site.css and therefore wins by cascade order.
   ============================================================ */

/* DeletePostModalTagHelper: keep the post-delete <form> inline
   with the modal's Cancel button. */
.dbc-delete-post-form {
    display: inline;
}

/* CommentBlock view component: success alert is hidden until
   dasblog-ui.js promotes it (toggles the d-none class). */

/* CookieConsent view component */
#cookieConsent {
    position: fixed;
    bottom: 20px;
    right: 20px;
    max-width: 400px;
    z-index: 9999;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    border-left: 4px solid var(--bs-primary);
    animation: dbc-cookie-consent-slide-in 0.5s ease-out;
    display: none;
}

#cookieConsent.show {
    display: block !important;
}

.dbc-cookie-consent-icon {
    margin-top: 4px;
}

.cookie-consent-closing {
    animation: dbc-cookie-consent-fade-out 0.3s ease-out forwards;
}

@keyframes dbc-cookie-consent-slide-in {
    from {
        transform: translateX(450px);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes dbc-cookie-consent-fade-out {
    from {
        opacity: 1;
        transform: translateX(0);
    }
    to {
        opacity: 0;
        transform: translateX(450px);
    }
}

@media (max-width: 768px) {
    #cookieConsent {
        bottom: 0;
        right: 0;
        left: 0;
        max-width: 100%;
        border-radius: 0;
        border-left: none;
        border-top: 4px solid var(--bs-primary);
    }

    @keyframes dbc-cookie-consent-slide-in {
        from {
            transform: translateY(100%);
            opacity: 0;
        }
        to {
            transform: translateY(0);
            opacity: 1;
        }
    }

    @keyframes dbc-cookie-consent-fade-out {
        from {
            opacity: 1;
            transform: translateY(0);
        }
        to {
            opacity: 0;
            transform: translateY(100%);
        }
    }
}

/* ------------------------------------------------------------
   TagHelper theme hooks (no default rules)
   ------------------------------------------------------------
   These selectors are listed here purely as documentation of
   the class names emitted by the TagHelpers, so theme authors
   know what they can target. Add real rules in your theme's
   own CSS file (e.g. Themes/<your-theme>/custom.css), NOT here.
   ------------------------------------------------------------ */

/* ArchiveListTagHelper */
/* .dbc-archive-list-item { } */
/* .dbc-archive-count { } */

/* CategoryListTagHelper */
/* .dbc-category-list-item { } */
/* .dbc-category-count { } */

/* RecentPostsTagHelper */
/* .dbc-recent-post-item { } */
/* .dbc-recent-post-date { } */

/* PostAuthorTagHelper */
/* .dbc-post-author-avatar { } */
/* .dbc-post-author-link { } */