/* ============================================================ CAC List View — Card Layout ============================================================ */ /* --- Two-column layout wrapper --- */ .cac-list-layout { display: grid; grid-template-columns: 1fr; gap: 0; align-items: start; } @media (min-width: 768px) { .cac-list-layout { grid-template-columns: 1fr 300px; gap: 0 24px; } } /* --- Sidebar: hidden on mobile, sticky on desktop --- */ .cac-list-sidebar { display: none; } @media (min-width: 768px) { .cac-list-sidebar { display: block; } .cac-list-sidebar-inner { position: sticky; top: 20px; display: flex; flex-direction: column; gap: 14px; } } .cac-list-sidebar-ad { background: #faf7f2; border: 1px solid #e8e0d4; border-radius: 6px; padding: 10px 12px 14px; text-align: center; } .cac-list-sidebar-label { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; color: #b0a090; margin: 0 0 8px; } /* --- Inline ad slots (mobile only) --- */ .cac-list-ad-inline { background: #faf7f2; border: 1px solid #e8e0d4; border-radius: 6px; padding: 10px 12px 14px; margin-bottom: 10px; text-align: center; } .cac-list-ad-inline-label { font-size: 9px; text-transform: uppercase; letter-spacing: .08em; color: #b0a090; margin: 0 0 8px; } @media (min-width: 768px) { .cac-list-ad-inline { display: none; } } /* --- Month separator --- */ .tribe-events-calendar-list__month-separator { border-bottom: 1px solid rgba(0,0,0,.08); margin: 18px 0 12px; } .tribe-events-calendar-list__month-separator:first-child { margin-top: 0; } .tribe-events-calendar-list__month-separator-text { font-size: 10px !important; font-weight: 700 !important; letter-spacing: .1em !important; text-transform: uppercase !important; color: #888 !important; padding-bottom: 8px; display: block; } /* --- Event card --- */ .cac-event-card { display: flex; border: 1px solid #dde1e7; border-radius: 6px; overflow: hidden; margin-bottom: 10px; background: #fff; text-decoration: none; color: inherit; transition: border-color .15s; } .cac-event-card:hover { border-color: #b0b8c8; } .cac-event-card:hover .cac-card-title { text-decoration: underline; } /* Thumbnail */ .cac-card-thumb { width: 110px; min-width: 110px; background: #f0f0f0; overflow: hidden; flex-shrink: 0; } @media (min-width: 768px) { .cac-card-thumb { width: 130px; min-width: 130px; } } .cac-card-thumb img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; } .cac-card-thumb-placeholder { width: 100%; height: 100%; min-height: 80px; display: flex; align-items: center; justify-content: center; background: #eaecef; } .cac-card-thumb-placeholder svg { opacity: .3; } /* Body */ .cac-card-body { padding: 10px 12px; flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; } .cac-card-date { font-size: 11px; color: #888; font-weight: 600; letter-spacing: .03em; margin: 0 0 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cac-card-title { font-size: 14px; font-weight: 600; color: #1a1a1a; margin: 0 0 4px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .cac-card-venue { font-size: 12px; color: #666; margin: 0 0 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cac-card-pills { display: flex; flex-wrap: wrap; gap: 4px; } .cac-card-pill { display: inline-block; font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 20px; line-height: 1.5; letter-spacing: .03em; } .cac-card-pill-cat { background: #e8f5ee; color: #1a6638; border: 1px solid #b8dfc8; } .cac-card-pill-tag { background: #e8f0fa; color: #1a3a72; border: 1px solid #b8ccf0; } /* Strip TEC's default list item styling */ .tribe-events-calendar-list { list-style: none !important; padding: 0 !important; margin: 0 !important; } .tribe-events-calendar-list__event-row { display: block !important; padding: 0 !important; margin: 0 !important; }