/* CE Utilities Widget Shared Styles */

/* ============================================================
   Base: Card Layout
   Card item wrapper — structural base for all card-layout widgets.
   Per-widget visual overrides stay in templates.css (Phase 29).
   ============================================================ */
.capigacr-widget-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.capigacr-widget-card__date-box-layout {
    display: flex;
    flex-direction: row;
}

.capigacr-widget-card__upcoming-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

.capigacr-widget-card__header {
    display: flex;
    align-items: center;
}

.capigacr-widget-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.capigacr-widget-card__meta-size,
.capigacr-widget-card__meta-date {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.875em;
}

.capigacr-widget-card__content {
    display: flex;
    flex-direction: column;
    flex: 1;
    flex-grow: 1;
}

.capigacr-widget-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: auto;
}

.capigacr-widget-card__actions a {
    display: inline-flex;
}

/* ============================================================
   Base: Row Layout
   Row item wrapper — structural base for list-layout widgets.
   ============================================================ */
.capigacr-widget-row {
    display: flex;
    flex-direction: column;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ============================================================
   Base: Grid Container
   Shared grid/list container — wraps <ol> or <ul> for all widgets.
   ============================================================ */
.capigacr-widget-grid {
    display: grid;
    grid-template-columns: repeat(var(--columns, 3), 1fr);
    list-style: none;
    margin: 0;
    padding: 0;
}

/* ============================================================
   Separator Pseudo-Elements
   All separator values are driven by CSS custom properties written
   by the Elementor Group_Control_Border onto {{WRAPPER}} at render
   time. NO hardcoded colors, widths, or styles here.

   Custom properties (written by Elementor separator border control):
     --capigacr-separator-style  (default: solid)
     --capigacr-separator-width  (default: 1px)
     --capigacr-separator-color  (default: #e0e0e0)

   Five separator options (LAYOUT-03 / D-04):
     Between — ::after on every <li>, hidden on :last-child
     Top     — ::before on :first-child only
     Bottom  — ::after on :last-child only
     Both    — Top + Bottom (::before on :first-child + ::after on :last-child)
     None    — no pseudo-element rules (Elementor condition hides sub-controls)

   Each mode is scoped behind a modifier class on the <ul>/<ol> wrapper
   (e.g. .capigacr-separator-between) so modes are mutually exclusive
   and do not bleed into one another.
   ============================================================ */

/* Separator: Between — ::after on all <li>, hidden on :last-child */
.capigacr-widget-row > li {
    position: relative;
}

.capigacr-separator-between > li::after {
    content: '';
    display: block;
    border-top: var(--capigacr-separator-width) var(--capigacr-separator-style) var(--capigacr-separator-color);
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
}

.capigacr-separator-between > li:last-child::after {
    display: none;
}

.capigacr-separator-default > li::before {
    content: '';
    display: var(--capigacr-sep-def-before, none);
    border-top: var(--capigacr-separator-width) var(--capigacr-separator-style) var(--capigacr-separator-color);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

.capigacr-separator-default > li::after {
    content: '';
    display: var(--capigacr-sep-def-after, block);
    border-top: var(--capigacr-separator-width) var(--capigacr-separator-style) var(--capigacr-separator-color);
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
}

.capigacr-separator-default > li:last-child::after {
    display: var(--capigacr-sep-def-last-after, none);
}

/* Separator: Top — ::before on all <li> */
.capigacr-separator-top > li::before,
.capigacr-separator-both > li::before {
    content: '';
    display: block;
    border-top: var(--capigacr-separator-width) var(--capigacr-separator-style) var(--capigacr-separator-color);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

/* Separator: Bottom — ::after on all <li> */
/* Note: None — Elementor hides sub-controls via condition; no additional CSS rules needed. */
.capigacr-separator-bottom > li::after,
.capigacr-separator-both > li::after {
    content: '';
    display: block;
    border-top: var(--capigacr-separator-width) var(--capigacr-separator-style) var(--capigacr-separator-color);
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
}

/* ============================================================
   Accordion Variant (Legislation widget — D-05)
   Normalized from Legislation__accordion / Legislation__accordion--root /
   Legislation__accordion--nested. Bootstrap card-header/card-body structure
   is preserved in the template; these rules carry over structural spacing.
   ============================================================ */
.capigacr-widget-accordion {
    margin-top: 0.5rem;
}

.capigacr-widget-accordion--root {
    margin-top: 0;
}

.capigacr-widget-accordion--nested {
    margin-top: 0.5rem;
}

/* ============================================================
   File Link Variant (Legislation widget — D-05)
   Normalized from Legislation__fileLink.
   Structural rules ported from templates.css Legislation__fileLink ruleset.
   ============================================================ */
.capigacr-widget-card__file-link {
    text-decoration: none;
}

.capigacr-widget-card__file-link:hover,
.capigacr-widget-card__file-link:focus {
    text-decoration: underline;
}

.capigacr-widget-card__file-link.disabled {
    color: #6c757d;
    cursor: not-allowed;
    text-decoration: none;
}

/* ============================================================
   Date Box Variant (Upcoming Meetings widget — D-07)
   Normalized from UMeeting__dateBox / UMeeting__dateMon / UMeeting__dateDay.
   CSS custom properties (--datebox-*) written by Elementor controls onto
   the outer .UpcomingMeetings wrapper at render time.
   ============================================================ */
.capigacr-widget-card__date-box {
    width: var(--datebox-w, auto);
    min-width: var(--datebox-w, auto);
    text-align: center;
    border: 0 solid var(--datebox-border, #000);
    background: var(--datebox-bg, none);
    overflow: hidden;
    flex-shrink: 0;
}

.capigacr-widget-card__date-mon {
    background: var(--datebox-mon-bg, none);
    color: var(--datebox-mon-color, #000);
}

.capigacr-widget-card__date-day {
    background: var(--datebox-day-bg, none);
    color: var(--datebox-day-color, #000);
}

/* Add-to-calendar button variant (Upcoming Meetings widget — D-07)
   Normalized from UMeeting__addToCal. */
.capigacr-widget-card__add-to-cal {
    display: inline-block;
}

/* Text item variant (Upcoming Meetings widget — D-07)
   Normalized from UMeeting__textItem. */
.capigacr-widget-card__text-item {
    display: flex;
    flex-direction: column;
}

/* Override text variant (Upcoming Meetings widget — D-07)
   Normalized from UMeeting__override. */
.capigacr-widget-card__override {
    display: inline;
}

/* Meeting title variant (Upcoming Meetings widget — D-07)
   Normalized from UMeeting__meetingTitle. */
.capigacr-widget-card__meeting-title {
    font-weight: 600;
    text-decoration: none;
}

/* Location variant (Upcoming Meetings widget — D-07)
   Normalized from UMeeting__location. */
.capigacr-widget-card__location {
    display: flex;
    flex-direction: column;
}

/* Time variant (Upcoming Meetings widget — D-07)
   Normalized from UMeeting__time. */
.capigacr-widget-card__time {
    display: flex;
    flex-direction: column;
}

/* ============================================================
   Tag Variant (Members widget — D-05 canonical example)
   Normalized from .badge presiding badge.
   Structural rules ported from Bootstrap .badge layout; color/
   typography driven by Elementor controls on {{WRAPPER}} at render
   time (no hardcoded colors here).
   ============================================================ */
.capigacr-widget-card__tag {
    display: inline-block;
    padding: 0.25em 0.4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    flex-shrink: 0;
}

/* ============================================================
   Ordered List Variant (Agenda Items widget — D-05)
   Normalized from AgendaItems__list / AgendaItems__children.
   Structural rules ported from templates.css AgendaItems__list
   and AgendaItems__children rulesets.
   ============================================================ */
.capigacr-widget-list {
    margin: 0;
    padding-left: 1.5rem;
}

.capigacr-widget-list > li {
    margin-bottom: 1rem;
}

ol.capigacr-widget-list__children {
    padding-left: 0;
}

li.capigacr-widget-list__children {
    display: list-item !important;
    margin-left: 1.5rem;
}
