/* Calendar Manager v2.0.0 - Shared Frontend Styles */

.cm-calendar-root {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 14px;
    width: 100%;
    box-sizing: border-box;
    position: relative;
}
.cm-calendar-root *, .cm-calendar-root *::before, .cm-calendar-root *::after { box-sizing: border-box; }

/* ── Contest color variables (cc- prefix) ── */
.cc-calendar-root { color: var(--cc-cell-text, #333); }
/* ── Club color variables (clb- prefix) ── */
.clb-calendar-root { color: var(--clb-cell-text, #333); }

/* ── Filter Bar ── */
.cm-filter-bar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
    padding: 10px 14px; border-radius: 6px 6px 0 0;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}
.cc-calendar-root  .cm-filter-bar { background: var(--cc-filter-bar-bg,#eaf1f8);  color: var(--cc-filter-bar-text,#1a3a5c); }
.clb-calendar-root .cm-filter-bar { background: var(--clb-filter-bar-bg,#eaf4e8); color: var(--clb-filter-bar-text,#2d5a27); }

.cm-filter-label { font-weight:600; font-size:13px; white-space:nowrap; }
.cm-filter-modes { display:flex; flex-wrap:wrap; align-items:center; gap:6px; flex:1; }
.cm-filter-tz    { display:flex; align-items:center; gap:6px; font-size:13px; white-space:nowrap; }
.cm-filter-tz label { font-weight:600; margin:0; }
.cc-calendar-root  .cm-filter-tz label { color: var(--cc-filter-bar-text,#1a3a5c); }
.clb-calendar-root .cm-filter-tz label { color: var(--clb-filter-bar-text,#2d5a27); }
.cm-tz-select { font-size:12px; padding:3px 6px; border-radius:4px; border:1px solid rgba(0,0,0,0.2); background:#fff; color:#333; cursor:pointer; }

.cm-mode-btn { padding:4px 10px; border-radius:20px; border:2px solid transparent; font-size:12px; font-weight:600; cursor:pointer; transition:all 0.15s; background:rgba(255,255,255,0.6); }
.cc-calendar-root  .cm-mode-btn { color: var(--cc-filter-bar-text,#1a3a5c); }
.clb-calendar-root .cm-mode-btn { color: var(--clb-filter-bar-text,#2d5a27); }
.cm-mode-btn:hover { background:rgba(255,255,255,0.9); }
.cc-calendar-root  .cm-mode-btn.cm-mode-active { background:var(--cc-filter-bar-text,#1a3a5c);  color:#fff; }
.clb-calendar-root .cm-mode-btn.cm-mode-active { background:var(--clb-filter-bar-text,#2d5a27); color:#fff; }
.cc-calendar-root  .cm-mode-btn.cm-mode-clear { background:transparent; border:2px solid var(--cc-filter-bar-text,#1a3a5c); }
.clb-calendar-root .cm-mode-btn.cm-mode-clear { background:transparent; border:2px solid var(--clb-filter-bar-text,#2d5a27); }

/* ── Header ── */
.cm-header { display:flex; align-items:center; justify-content:space-between; padding:10px 14px; flex-wrap:wrap; gap:8px; }
.cc-calendar-root  .cm-header { background:var(--cc-header-bg,#1a3a5c);  color:var(--cc-header-text,#fff); }
.clb-calendar-root .cm-header { background:var(--clb-header-bg,#2d5a27); color:var(--clb-header-text,#fff); }
.cm-nav { display:flex; align-items:center; gap:6px; }
.cm-current-label { font-size:16px; font-weight:700; min-width:180px; text-align:center; }
.cc-calendar-root  .cm-current-label { color:var(--cc-header-text,#fff); }
.clb-calendar-root .cm-current-label { color:var(--clb-header-text,#fff); }

.cm-btn { border:none; border-radius:4px; padding:6px 12px; cursor:pointer; font-size:14px; font-weight:600; transition:opacity 0.15s; line-height:1; }
.cc-calendar-root  .cm-btn { background:var(--cc-nav-btn-bg,#2c5f8a);  color:var(--cc-nav-btn-text,#fff); }
.clb-calendar-root .cm-btn { background:var(--clb-nav-btn-bg,#4a7c43); color:var(--clb-nav-btn-text,#fff); }
.cm-btn:hover { opacity:0.85; }

.cm-view-switcher { display:flex; gap:4px; }
.cm-view-btn { background:transparent; border:2px solid rgba(255,255,255,0.4); border-radius:4px; padding:5px 12px; cursor:pointer; font-size:13px; font-weight:600; transition:all 0.15s; }
.cc-calendar-root  .cm-view-btn { color:var(--cc-header-text,#fff); }
.clb-calendar-root .cm-view-btn { color:var(--clb-header-text,#fff); }
.cm-view-btn:hover { border-color:rgba(255,255,255,0.8); background:rgba(255,255,255,0.1); }
.cm-view-btn.cm-view-active { background:rgba(255,255,255,0.2); border-color:rgba(255,255,255,0.9); }

/* ── Body ── */
.cm-body { border:1px solid rgba(0,0,0,0.1); border-top:none; border-radius:0 0 6px 6px; overflow:hidden; }
.cc-calendar-root  .cm-body { background:var(--cc-cell-bg-weekday,#fff); }
.clb-calendar-root .cm-body { background:var(--clb-cell-bg-weekday,#fff); }

/* ── Spinner ── */
.cm-loading { display:flex; align-items:center; justify-content:center; gap:10px; padding:40px; color:#666; font-size:15px; }
.cm-spinner { display:inline-block; width:20px; height:20px; border:3px solid rgba(0,0,0,0.1); border-radius:50%; animation:cm-spin 0.7s linear infinite; }
.cc-calendar-root  .cm-spinner { border-top-color:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root .cm-spinner { border-top-color:var(--clb-header-bg,#2d5a27); }
@keyframes cm-spin { to { transform:rotate(360deg); } }

/* ── Month Grid ── */
.cm-month-grid { width:100%; }
.cm-weekday-headers { display:grid; grid-template-columns:repeat(7,1fr); }
.cc-calendar-root  .cm-weekday-headers { background:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root .cm-weekday-headers { background:var(--clb-header-bg,#2d5a27); }
.cm-weekday-header { text-align:center; padding:6px 4px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; }
.cc-calendar-root  .cm-weekday-header { color:var(--cc-header-text,#fff); }
.clb-calendar-root .cm-weekday-header { color:var(--clb-header-text,#fff); }
.cm-month-weeks { display:grid; grid-template-columns:repeat(7,1fr); }

.cm-day-cell { min-height:100px; padding:4px; border-right:1px solid rgba(0,0,0,0.08); border-bottom:1px solid rgba(0,0,0,0.08); position:relative; overflow:hidden; }
.cm-day-cell:nth-child(7n) { border-right:none; }
.cc-calendar-root  .cm-day-cell { background:var(--cc-cell-bg-weekday,#fff); }
.clb-calendar-root .cm-day-cell { background:var(--clb-cell-bg-weekday,#fff); }
.cc-calendar-root  .cm-day-cell.cm-weekend { background:var(--cc-cell-bg-weekend,#f5f8fc); }
.clb-calendar-root .cm-day-cell.cm-weekend { background:var(--clb-cell-bg-weekend,#f4f9f3); }
.cc-calendar-root  .cm-day-cell.cm-today { background:var(--cc-cell-today-bg,#fff8e1);  box-shadow:inset 0 0 0 2px var(--cc-cell-today-border,#f0a500); }
.clb-calendar-root .cm-day-cell.cm-today { background:var(--clb-cell-today-bg,#fff8e1); box-shadow:inset 0 0 0 2px var(--clb-cell-today-border,#f0a500); }
.cm-day-cell.cm-other-month { opacity:0.45; }

.cm-day-number { font-size:12px; font-weight:700; margin-bottom:3px; display:inline-block; width:22px; height:22px; line-height:22px; text-align:center; border-radius:50%; }
.cc-calendar-root  .cm-day-number { color:var(--cc-cell-text,#333); }
.clb-calendar-root .cm-day-number { color:var(--clb-cell-text,#333); }
.cc-calendar-root  .cm-today .cm-day-number { background:var(--cc-cell-today-border,#f0a500);  color:#fff; }
.clb-calendar-root .cm-today .cm-day-number { background:var(--clb-cell-today-border,#f0a500); color:#fff; }

/* ── Event Pills ── */
.cm-event-pill { display:block; width:100%; padding:2px 5px; margin-bottom:2px; border-radius:3px; font-size:11px; font-weight:600; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:opacity 0.15s,transform 0.1s; border:none; text-align:left; line-height:1.5; }
.cm-event-pill:hover { opacity:0.85; transform:translateY(-1px); }
.cm-more-link { display:block; font-size:11px; cursor:pointer; padding:1px 4px; font-weight:700; background:none; border:none; text-decoration:underline; text-align:left; }
.cc-calendar-root  .cm-more-link { color:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root .cm-more-link { color:var(--clb-header-bg,#2d5a27); }

/* Contest pills */
.cc-calendar-root .cm-pill-cw      { background:var(--cc-pill-cw,#1565c0);      color:var(--cc-pill-text,#fff); }
.cc-calendar-root .cm-pill-ssb     { background:var(--cc-pill-ssb,#2e7d32);     color:var(--cc-pill-text,#fff); }
.cc-calendar-root .cm-pill-rtty    { background:var(--cc-pill-rtty,#6a1b9a);    color:var(--cc-pill-text,#fff); }
.cc-calendar-root .cm-pill-digital { background:var(--cc-pill-digital,#00838f); color:var(--cc-pill-text,#fff); }
.cc-calendar-root .cm-pill-vhf     { background:var(--cc-pill-vhf,#e65100);     color:var(--cc-pill-text,#fff); }
.cc-calendar-root .cm-pill-qrp     { background:var(--cc-pill-qrp,#558b2f);     color:var(--cc-pill-text,#fff); }
.cc-calendar-root .cm-pill-unknown { background:var(--cc-pill-unknown,#546e7a); color:var(--cc-pill-text,#fff); }

/* Club pills */
.clb-calendar-root .cm-pill-event    { background:var(--clb-pill-event,#2d5a27);    color:var(--clb-pill-text,#fff); }
.clb-calendar-root .cm-pill-net      { background:var(--clb-pill-net,#1565c0);      color:var(--clb-pill-text,#fff); }
.clb-calendar-root .cm-pill-meeting  { background:var(--clb-pill-meeting,#6a1b9a);  color:var(--clb-pill-text,#fff); }
.clb-calendar-root .cm-pill-training { background:var(--clb-pill-training,#e65100); color:var(--clb-pill-text,#fff); }
.clb-calendar-root .cm-pill-other    { background:var(--clb-pill-other,#546e7a);    color:var(--clb-pill-text,#fff); }

/* ── Week Grid ── */
.cm-week-grid { width:100%; }
.cm-week-headers { display:grid; grid-template-columns:repeat(7,1fr); }
.cc-calendar-root  .cm-week-headers { background:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root .cm-week-headers { background:var(--clb-header-bg,#2d5a27); }
.cm-week-header { text-align:center; padding:8px 4px 6px; font-size:12px; font-weight:700; }
.cc-calendar-root  .cm-week-header { color:var(--cc-header-text,#fff); }
.clb-calendar-root .cm-week-header { color:var(--clb-header-text,#fff); }
.cm-week-header .cm-wh-date { display:block; font-size:18px; font-weight:700; line-height:1.2; }
.cc-calendar-root  .cm-week-header.cm-today-header .cm-wh-date { color:var(--cc-cell-today-border,#f0a500); }
.clb-calendar-root .cm-week-header.cm-today-header .cm-wh-date { color:var(--clb-cell-today-border,#f0a500); }
.cm-week-days { display:grid; grid-template-columns:repeat(7,1fr); min-height:300px; }
.cm-week-day-col { padding:6px 4px; border-right:1px solid rgba(0,0,0,0.08); min-height:200px; }
.cm-week-day-col:last-child { border-right:none; }
.cc-calendar-root  .cm-week-day-col         { background:var(--cc-cell-bg-weekday,#fff); }
.cc-calendar-root  .cm-week-day-col.cm-weekend { background:var(--cc-cell-bg-weekend,#f5f8fc); }
.cc-calendar-root  .cm-week-day-col.cm-today   { background:var(--cc-cell-today-bg,#fff8e1); }
.clb-calendar-root .cm-week-day-col            { background:var(--clb-cell-bg-weekday,#fff); }
.clb-calendar-root .cm-week-day-col.cm-weekend { background:var(--clb-cell-bg-weekend,#f4f9f3); }
.clb-calendar-root .cm-week-day-col.cm-today   { background:var(--clb-cell-today-bg,#fff8e1); }

/* ── List View ── */
.cm-list-view { padding:0; }
.cm-list-table { width:100%; border-collapse:collapse; }
.cm-list-table thead th { padding:10px 12px; text-align:left; font-size:13px; font-weight:700; }
.cc-calendar-root  .cm-list-table thead th { background:var(--cc-header-bg,#1a3a5c);  color:var(--cc-header-text,#fff); }
.clb-calendar-root .cm-list-table thead th { background:var(--clb-header-bg,#2d5a27); color:var(--clb-header-text,#fff); }
.cm-list-table tbody tr { border-bottom:1px solid rgba(0,0,0,0.06); cursor:pointer; transition:background 0.12s; }
.cm-list-table tbody tr:hover { background:rgba(0,0,0,0.03); }
.cm-list-table tbody td { padding:9px 12px; vertical-align:top; font-size:13px; }
.cc-calendar-root  .cm-list-table tbody td { color:var(--cc-cell-text,#333); }
.clb-calendar-root .cm-list-table tbody td { color:var(--clb-cell-text,#333); }
.cm-list-name { font-weight:600; }
.cc-calendar-root  .cm-list-name { color:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root .cm-list-name { color:var(--clb-header-bg,#2d5a27); }
.cm-list-time { white-space:nowrap; font-size:12px; color:#555; }
.cm-list-cat  { display:flex; flex-wrap:wrap; gap:4px; }
.cm-cat-tag   { display:inline-block; padding:2px 7px; border-radius:10px; font-size:11px; font-weight:700; }

/* ── Entries widget (compact list) ── */
.cm-entries-list { list-style:none; padding:0; margin:0; }
.cm-entries-list li { padding:10px 14px; border-bottom:1px solid rgba(0,0,0,0.07); cursor:pointer; transition:background 0.12s; display:flex; align-items:flex-start; gap:12px; }
.cm-entries-list li:last-child { border-bottom:none; }
.cm-entries-list li:hover { background:rgba(0,0,0,0.03); }
.cm-entry-date { font-size:12px; font-weight:700; min-width:80px; white-space:nowrap; }
.clb-calendar-root .cm-entry-date { color:var(--clb-header-bg,#2d5a27); }
.cm-entry-title { font-size:13px; font-weight:600; line-height:1.3; }
.cm-entry-sub   { font-size:12px; color:#666; margin-top:2px; }

/* ── Pagination ── */
.cm-pagination { display:flex; align-items:center; justify-content:center; gap:6px; padding:14px; flex-wrap:wrap; }
.cm-page-btn { padding:5px 11px; border:1px solid rgba(0,0,0,0.2); border-radius:4px; background:#fff; cursor:pointer; font-size:13px; font-weight:600; transition:all 0.12s; }
.cc-calendar-root  .cm-page-btn { color:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root .cm-page-btn { color:var(--clb-header-bg,#2d5a27); }
.cc-calendar-root  .cm-page-btn:hover, .cc-calendar-root  .cm-page-btn.cm-page-active { background:var(--cc-header-bg,#1a3a5c);  color:#fff; border-color:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root .cm-page-btn:hover, .clb-calendar-root .cm-page-btn.cm-page-active { background:var(--clb-header-bg,#2d5a27); color:#fff; border-color:var(--clb-header-bg,#2d5a27); }
.cm-page-btn:disabled { opacity:0.4; cursor:default; }
.cm-pagination-info { font-size:12px; color:#666; padding:0 8px; }

/* ── Modal ── */
/* Modal overlay lives on <body> — z-index 999999 clears sticky navs */
.cm-modal-overlay { display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:999999; align-items:center; justify-content:center; padding:20px; box-sizing:border-box; }
/* Color from CSS vars — overlay carries the calendar root class for theming */
.cc-calendar-root.cm-modal-overlay,
.cc-calendar-root  .cm-modal-overlay { background:var(--cc-modal-overlay,rgba(0,0,0,0.55)); }
.clb-calendar-root.cm-modal-overlay,
.clb-calendar-root .cm-modal-overlay { background:var(--clb-modal-overlay,rgba(0,0,0,0.55)); }
.cm-modal-overlay.cm-modal-open { display:flex; }
.cm-modal { border-radius:8px; max-width:640px; width:100%; max-height:88vh; display:flex; flex-direction:column; box-shadow:0 10px 40px rgba(0,0,0,0.3); animation:cm-modal-in 0.2s ease; }
.cc-calendar-root.cm-modal-overlay .cm-modal,
.cc-calendar-root  .cm-modal { background:var(--cc-modal-bg,#fff);  color:var(--cc-modal-text,#222); }
.clb-calendar-root.cm-modal-overlay .cm-modal,
.clb-calendar-root .cm-modal { background:var(--clb-modal-bg,#fff); color:var(--clb-modal-text,#222); }
@keyframes cm-modal-in { from{opacity:0;transform:translateY(-20px) scale(0.97)} to{opacity:1;transform:none} }
.cm-modal-header { padding:14px 18px; border-radius:8px 8px 0 0; display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.cc-calendar-root.cm-modal-overlay .cm-modal-header,
.cc-calendar-root  .cm-modal-header { background:var(--cc-modal-header-bg,#1a3a5c);  color:var(--cc-modal-header-text,#fff); }
.clb-calendar-root.cm-modal-overlay .cm-modal-header,
.clb-calendar-root .cm-modal-header { background:var(--clb-modal-header-bg,#2d5a27); color:var(--clb-modal-header-text,#fff); }
.cm-modal-title { margin:0; font-size:16px; font-weight:700; line-height:1.3; flex:1; }
.cc-calendar-root.cm-modal-overlay .cm-modal-title,
.cc-calendar-root  .cm-modal-title { color:var(--cc-modal-header-text,#fff); }
.clb-calendar-root.cm-modal-overlay .cm-modal-title,
.clb-calendar-root .cm-modal-title { color:var(--clb-modal-header-text,#fff); }
.cm-modal-close { background:transparent; border:none; font-size:22px; cursor:pointer; line-height:1; padding:0; opacity:0.8; flex-shrink:0; }
.cc-calendar-root.cm-modal-overlay .cm-modal-close,
.cc-calendar-root  .cm-modal-close { color:var(--cc-modal-header-text,#fff); }
.clb-calendar-root.cm-modal-overlay .cm-modal-close,
.clb-calendar-root .cm-modal-close { color:var(--clb-modal-header-text,#fff); }
.cm-modal-close:hover { opacity:1; }
.cm-modal-body { padding:18px; overflow-y:auto; flex:1; }
.cm-detail-section { margin-bottom:14px; }
.cm-detail-section h4 { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:#888; margin:0 0 4px; }
.cm-detail-section p { margin:0; font-size:13px; line-height:1.55; }
.cc-calendar-root.cm-modal-overlay .cm-detail-section p,
.cc-calendar-root  .cm-detail-section p { color:var(--cc-modal-text,#222); }
.clb-calendar-root.cm-modal-overlay .cm-detail-section p,
.clb-calendar-root .cm-detail-section p { color:var(--clb-modal-text,#222); }
.cm-detail-section a { color:inherit; }
.cm-sessions-list { list-style:none; padding:0; margin:0; }
.cm-sessions-list li { font-size:13px; padding:4px 0; border-bottom:1px solid rgba(0,0,0,0.06); display:flex; gap:8px; align-items:baseline; }
.cm-sessions-list li:last-child { border-bottom:none; }
.cm-session-label { font-weight:700; font-size:12px; min-width:40px; }
.cc-calendar-root.cm-modal-overlay .cm-session-label,
.cc-calendar-root  .cm-session-label { color:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root.cm-modal-overlay .cm-session-label,
.clb-calendar-root .cm-session-label { color:var(--clb-header-bg,#2d5a27); }
.cm-detail-modes { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:14px; }
.cm-detail-link { display:inline-block; margin-top:10px; font-size:12px; text-decoration:underline; }
.cc-calendar-root.cm-modal-overlay .cm-detail-link,
.cc-calendar-root  .cm-detail-link { color:var(--cc-header-bg,#1a3a5c); }
.clb-calendar-root.cm-modal-overlay .cm-detail-link,
.clb-calendar-root .cm-detail-link { color:var(--clb-header-bg,#2d5a27); }
.cm-no-detail-note { font-size:12px; color:#888; font-style:italic; padding:8px 0; }
.cm-no-events { text-align:center; padding:30px 20px; color:#888; font-size:14px; }

/* ── Responsive ── */
@media (max-width:767px) {
    .cm-month-weeks,.cm-weekday-headers { grid-template-columns:repeat(7,minmax(36px,1fr)); }
    .cm-day-cell { min-height:60px; padding:2px; }
    .cm-day-number { font-size:11px; width:18px; height:18px; line-height:18px; }
    .cm-event-pill { font-size:9px; padding:1px 3px; }
    .cm-weekday-header { font-size:10px; padding:4px 2px; }
    .cm-header { flex-direction:column; align-items:stretch; gap:8px; }
    .cm-nav,.cm-view-switcher { justify-content:center; }
    .cm-current-label { min-width:unset; font-size:15px; }
    .cm-filter-bar { flex-direction:column; align-items:flex-start; }
    .cm-filter-tz { width:100%; }
    .cm-tz-select { flex:1; }
    .cm-list-table thead th:nth-child(3),.cm-list-table tbody td:nth-child(3) { display:none; }
    .cm-modal { max-height:92vh; }
    .cm-week-header .cm-wh-date { font-size:14px; }
    .cm-week-day-col { min-height:80px; padding:3px 2px; }
    .cm-btn { padding:5px 8px; font-size:13px; }
}
@media (max-width:480px) {
    .cm-month-weeks,.cm-weekday-headers { grid-template-columns:repeat(7,minmax(28px,1fr)); }
    .cm-day-cell { min-height:48px; }
    .cm-event-pill { display:none; }
    .cm-more-link { font-size:9px; }
}
