/* 财经日历 (market-calendar.html) — Longbridge /calendar replica.

   Geometry is measured from longbridge.com (1440 / 375, see
   reference/longbridge/_audit_calendar/): pills 32/6, calendar frame 1px
   #dbdde1 radius 8, day cell 14px, chips 12px with a 22px pill, list rows
   12px padding with 14px data, group header 36px on #f0f2f4, right column
   375px cards radius 24 padding 20.

   Colors come from the clarity tokens (cibo brand), not Longbridge's teal. */

.mc-layout{display:flex;align-items:flex-start;gap:28px;max-width:1400px;margin:0 auto;padding:24px var(--cl-panel-inline,20px) 32px;box-sizing:border-box}
.mc-main{flex:1;min-width:0}
.mc-aside{width:375px;flex:none;display:flex;flex-direction:column;gap:12px}

/* ── Tabs ─────────────────────────────────────────────── */
.mc-tabs{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
.mc-tabs::-webkit-scrollbar{display:none}
.mc-tab-off{background:#f0f2f4;color:#a8aaad;cursor:not-allowed}

/* ── Toolbar ──────────────────────────────────────────── */
.mc-section{display:flex;flex-direction:column}
.mc-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px 0;flex-wrap:wrap}
.mc-toolbar-left{display:flex;align-items:center;gap:8px;min-width:0}
.mc-toolbar-right{display:flex;align-items:center;gap:8px}
.mc-today{display:inline-flex;align-items:center;height:28px;padding:0 12px;border:1px solid var(--cl-rule);border-radius:9999px;background:#fff;color:var(--cl-ink);font-size:14px;line-height:20px;text-decoration:none;cursor:pointer}
.mc-today:hover{background:#f0f2f4}
.mc-period{display:flex;align-items:center;gap:8px;min-width:0}
.mc-round{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:1px solid var(--cl-rule);border-radius:9999px;background:#fff;color:var(--cl-muted);cursor:pointer;text-decoration:none}
.mc-round:hover{background:#f0f2f4;color:var(--cl-ink)}
.mc-round svg{width:14px;height:14px}
.mc-period-picker{position:relative}
.mc-period-btn{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0;border:0;background:none;color:var(--cl-ink);font-size:16px;font-weight:600;line-height:24px;cursor:pointer}
.mc-period-btn svg{width:16px;height:16px}
.mc-clock{font-size:14px;line-height:20px;color:var(--cl-ink);white-space:nowrap}
.mc-clock b{font-weight:400;font-variant-numeric:tabular-nums}
.mc-segmented{display:inline-flex;align-items:center;padding:2px;background:#f0f2f4;border-radius:9999px}
.mc-seg{display:inline-flex;align-items:center;justify-content:center;height:24px;padding:2px 8px;border-radius:9999px;color:var(--cl-muted);font-size:14px;font-weight:500;line-height:20px;text-decoration:none}
.mc-seg.is-active{background:#fff;color:var(--cl-ink);box-shadow:0 0 0 1px rgba(var(--c-text-rgb),.08)}
.mc-filter{position:relative}
.mc-filter-btn{display:inline-flex;align-items:center;justify-content:center;height:32px;width:34px;padding:0;border:1px solid var(--cl-rule);border-radius:8px;background:#fff;color:var(--cl-ink);cursor:pointer}
.mc-filter-btn svg{width:16px;height:16px}
.mc-filter-btn:hover{background:#f0f2f4}

/* ── Popovers (date picker / filter) ──────────────────── */
.mc-popover{position:absolute;top:calc(100% + 4px);left:0;z-index:60;background:#fff;border:1px solid var(--cl-rule);border-radius:8px;box-shadow:0 8px 24px rgba(7,10,19,.08);box-sizing:border-box}
.mc-popover[hidden]{display:none}
.mc-popover-picker{width:300px;padding:16px}
.mc-popover-filter{left:auto;right:0;width:224px;padding:12px}
.mc-popover-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:8px}
.mc-popover-title{display:inline-flex;align-items:center;gap:4px;border:0;background:none;padding:0;color:var(--cl-ink);font-size:16px;font-weight:600;line-height:24px;cursor:default}
.mc-popover-title svg{width:14px;height:14px}
.mc-popover-nav{display:flex;align-items:center;gap:4px}
.mc-picker-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px 0;padding-top:8px}
.mc-picker-th{height:24px;text-align:center;color:var(--cl-muted);font-size:12px;font-weight:500;line-height:24px}
.mc-picker-day{display:flex;align-items:center;justify-content:center;height:30px;border-radius:4px;color:var(--cl-ink);font-size:14px;line-height:20px;text-decoration:none}
.mc-picker-day:hover{background:#f0f2f4}
.mc-picker-day.is-outside{color:var(--cl-muted)}
.mc-picker-day.is-today{color:var(--c-accent);font-weight:600}
.mc-picker-day.is-active{background:var(--cl-ink);color:#fff;font-weight:600}
.mc-filter-group+.mc-filter-group{margin-top:10px;padding-top:10px;border-top:1px solid var(--cl-rule)}
.mc-filter-label{padding:4px 8px;color:var(--cl-muted);font-size:12px;line-height:16px}
.mc-filter-list{display:flex;flex-direction:column;gap:4px}
.mc-check{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:4px;color:var(--cl-ink);font-size:14px;line-height:20px;text-decoration:none;background:none;border:0;cursor:pointer;text-align:left}
.mc-check.is-on{background:rgba(240,242,244,.5)}
.mc-check:hover:not([disabled]){background:#f0f2f4}
.mc-check[disabled]{cursor:default;color:var(--cl-muted)}
.mc-check-box{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:none;border:1px solid var(--cl-rule);border-radius:4px;color:transparent;background:#fff}
.mc-check-box svg{width:12px;height:12px}
.mc-check.is-on .mc-check-box{background:var(--cl-ink);border-color:var(--cl-ink);color:#fff}
.mc-market{font-size:12px;font-weight:500;line-height:16px;padding:2px 0}
.mc-market.is-hk{color:#ff3a9d}

/* ── Calendar grid ────────────────────────────────────── */
.mc-calendar{margin:0 0 16px;border:1px solid var(--cl-rule);border-radius:8px;overflow:hidden}
.mc-calendar-head{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid var(--cl-rule);background:rgba(240,242,244,.3)}
.mc-calendar-th{padding:8px 0;text-align:center;font-size:12px;font-weight:500;line-height:16px;color:var(--cl-ink)}
.mc-calendar-th.is-weekend{color:var(--cl-muted)}
.mc-calendar-body{display:flex;flex-direction:column}
.mc-calendar-week{display:grid;grid-template-columns:repeat(7,1fr)}
.mc-calendar-week+.mc-calendar-week{border-top:1px solid var(--cl-rule)}
.mc-cell{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:113px;padding:8px 0;color:var(--cl-ink);text-decoration:none;position:relative}
.mc-cell+.mc-cell{border-left:1px solid var(--cl-rule)}
.mc-cell:hover{background:rgba(240,242,244,.4)}
.mc-cell.is-outside .mc-cell-day{color:var(--cl-muted)}
.mc-cell.is-today{background:var(--cl-brand-soft);color:var(--c-accent)}
.mc-cell-day{display:flex;align-items:center;gap:2px;margin-bottom:8px;font-size:14px;line-height:20px;font-variant-numeric:tabular-nums}
.mc-cell-today{display:none;font-size:12px;line-height:1}
.mc-cell-events{display:flex;flex-direction:column;align-items:center;gap:4px;width:100%}
.mc-chip{display:flex;align-items:center;gap:4px;max-width:85%;padding:2px 4px;border:1px solid var(--cl-rule);border-radius:9999px;color:var(--cl-muted);font-size:12px;line-height:16px}
.mc-chip-more{padding:2px 8px;justify-content:center}
.mc-chip-logo{position:relative;display:block;width:16px;height:16px;flex:none;border-radius:9999px;overflow:hidden;background:var(--mc-avatar-color,#f0f2f4)}
.mc-chip-logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff;z-index:1}
.mc-chip-logo i{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#fff;font-size:9px;font-weight:600;font-style:normal}
.mc-chip-text{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── Event list ───────────────────────────────────────── */
.mc-list{display:flex;flex-direction:column;gap:16px}
.mc-group{position:relative}
.mc-group-head{position:sticky;top:var(--cl-masthead-h);z-index:10;display:flex;align-items:center;height:36px;padding:0 12px;background:#f0f2f4;border-bottom:1px solid var(--cl-rule)}
.mc-group-grid{display:grid;gap:12px;grid-template-columns:minmax(180px,270px) 1fr;width:100%;align-items:center}
.mc-group-left{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mc-group-date{font-size:12px;line-height:16px;color:var(--cl-muted);font-weight:400}
.mc-group-pick{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;padding:0;border:0;background:none;color:var(--cl-muted);cursor:pointer}
.mc-group-pick svg{width:12px;height:12px}
.mc-group-cols{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;align-items:center;margin:0}
.mc-group-cols dt{font-size:12px;font-weight:400;line-height:16px;color:var(--cl-muted);text-align:right}
.mc-rows{list-style:none;margin:0;padding:0}
.mc-row{padding:12px;border-bottom:1px solid var(--cl-rule);cursor:pointer;background:#fff}
.mc-row:hover{background:rgba(240,242,244,.4)}
.mc-row.is-selected{background:var(--cl-brand-soft)}
.mc-row.is-hidden{display:none}
.mc-row-grid{display:grid;gap:12px;grid-template-columns:minmax(180px,270px) 1fr;align-items:center}
.mc-row-stock{display:flex;align-items:center;gap:8px;min-width:0}
.mc-row-names{display:flex;flex-direction:column;min-width:0}
.mc-row-name{margin:0;font-size:14px;font-weight:500;line-height:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-row-name a{color:inherit;text-decoration:none}
.mc-row-name a:hover{text-decoration:underline;text-underline-offset:3px}
.mc-row-id{display:flex;align-items:center;gap:4px;font-size:14px;line-height:20px}
.mc-row-code{font-size:14px;color:var(--cl-muted);font-variant-numeric:tabular-nums}
.mc-row-values{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;margin:0}
.mc-row-values>div{display:flex;justify-content:flex-end;align-items:center}
.mc-row-values dd{margin:0;font-size:14px;line-height:20px;text-align:right;font-variant-numeric:tabular-nums}
.mc-unit{color:var(--cl-muted);font-size:12px}
.mc-more-row{padding:12px 0;text-align:center;list-style:none}
.mc-more{border:0;background:none;border-radius:8px;color:var(--c-blue);font-size:14px;font-weight:500;line-height:20px;cursor:pointer}
.mc-empty{padding:48px 0;text-align:center;color:var(--cl-muted);font-size:14px}

/* ── Avatars ──────────────────────────────────────────── */
.mc-avatar{position:relative;display:inline-flex;flex:none;align-items:center;justify-content:center;border-radius:9999px;overflow:hidden;background:var(--mc-avatar-color,#f0f2f4)}
.mc-avatar-md{width:36px;height:36px}
.mc-avatar-lg{width:44px;height:44px}
.mc-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff;z-index:1}
.mc-avatar-initial{color:#fff;font-size:14px;font-weight:600;line-height:1}
.mc-avatar-lg .mc-avatar-initial{font-size:16px}

/* ── Right column cards ───────────────────────────────── */
.mc-card{background:#fff;border:1px solid var(--cl-rule);border-radius:24px;overflow:hidden}
.mc-card-head{padding:20px 20px 0}
.mc-card-head h3{margin:0;font-size:18px;font-weight:600;line-height:24.75px}
.mc-card-body{padding:20px}
.mc-card-body-list{padding:12px 20px 20px}
.mc-card-body-track{padding:0 12px 20px}
.mc-quote-head h2{margin:0 0 4px;font-size:18px;font-weight:500;line-height:22.5px}
.mc-quote-head a{color:inherit;text-decoration:none}
.mc-quote-head a:hover{text-decoration:underline;text-underline-offset:3px}
.mc-pill{display:inline-flex;align-items:center;gap:6px;padding:2px 8px;background:#f0f2f4;border-radius:9999px;color:var(--cl-muted);font-size:10px;font-weight:500;line-height:16px}
.mc-pill::before{content:"";width:6px;height:6px;border-radius:9999px;background:currentColor}
.mc-quote-line{display:flex;align-items:center;margin-top:8px}
.mc-quote-price{font-size:30px;font-weight:700;line-height:36px;font-variant-numeric:tabular-nums}
.mc-quote-price.is-up{color:#00ada2}
.mc-quote-price.is-down{color:#ff3874}
.mc-quote-change{display:flex;flex-direction:column;margin-left:8px;font-size:16px;font-weight:500;line-height:24px;font-variant-numeric:tabular-nums}
.mc-quote-change.is-up{color:#00ada2}
.mc-quote-change.is-down{color:#ff3874}
.mc-quote-change em{font-style:normal}
.mc-quote-source{margin-top:4px;color:var(--cl-muted);font-size:12px;line-height:16px}
.mc-profile-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mc-profile-id{display:flex;align-items:center;gap:12px}
.mc-profile-name{font-size:16px;font-weight:500;line-height:24px}
.mc-profile-desc{margin-top:16px;font-size:14px;line-height:20px;color:var(--cl-ink);overflow-wrap:anywhere}
.mc-industry{margin-top:16px;padding:12px;background:rgba(240,242,244,.7);border-radius:8px}
.mc-industry-head{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;line-height:20px}
.mc-industry-name{font-weight:500}
.mc-industry-meta{display:flex;flex-wrap:wrap;gap:4px 8px;margin-top:4px;color:var(--cl-muted);font-size:12px;line-height:20px}
.mc-more-link{display:inline-flex;align-items:center;margin-top:12px;padding:0;border:0;border-radius:8px;background:none;color:var(--c-blue);font-size:14px;font-weight:500;line-height:20px;text-decoration:none;cursor:pointer}
.mc-more-link:hover{text-decoration:underline;text-underline-offset:3px}

/* IPO timeline */
.mc-ipo-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.mc-ipo-title h2{margin:0;font-size:18px;font-weight:500;line-height:22.5px}
.mc-ipo-title a{color:inherit;text-decoration:none}
.mc-ipo-price{margin-top:12px}
.mc-ipo-range{font-size:30px;font-weight:700;line-height:36px;color:var(--c-red);font-variant-numeric:tabular-nums}
.mc-timeline{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:0;margin:12px 0}
.mc-timeline-step{display:flex;flex-direction:column;align-items:center;gap:0}
.mc-timeline-label{height:32px;font-size:12px;font-weight:500;line-height:15px;text-align:center;color:var(--cl-muted)}
.mc-timeline-track{position:relative;display:block;width:100%;height:1px;background:#f0f2f4}
.mc-timeline-track i{position:absolute;top:-4px;left:50%;width:10px;height:10px;margin-left:-5px;border:2px solid var(--cl-rule);border-radius:9999px;background:#fff;box-sizing:border-box}
.mc-timeline-step.is-first .mc-timeline-label,.mc-timeline-step.is-first .mc-timeline-date{color:var(--c-accent)}
.mc-timeline-step.is-first .mc-timeline-track{background:var(--c-accent)}
.mc-timeline-step.is-first .mc-timeline-track i{border-color:var(--c-accent)}
.mc-timeline-date{margin-top:8px;font-size:12px;line-height:16px;text-align:center;color:var(--cl-muted);white-space:pre-line}
.mc-ipo-sub{margin-top:12px;padding-top:12px;border-top:1px solid var(--cl-rule)}
.mc-ipo-sub .mc-holiday-name{font-size:16px;font-weight:500;line-height:24px}
.mc-ipo-desc{margin-top:12px;font-size:14px;line-height:20px;overflow-wrap:anywhere}

/* Intermediaries */
.mc-sublist+.mc-sublist{margin-top:8px}
.mc-sublist-head{padding:16px 0 0;font-size:14px;font-weight:500;line-height:20px}
.mc-sublist ul{list-style:none;margin:0;padding:0}
.mc-sublist li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--cl-rule);font-size:14px;line-height:20px}
.mc-sublist li:last-child{border-bottom:0}
.mc-sub-muted{color:var(--cl-muted);font-size:12px;text-align:right;flex:none}
.mc-cornerstones li{gap:12px}
.mc-cs-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-cs-bar{position:relative;flex:none;width:60px;height:8px;border-radius:9999px;background:var(--cl-rule);overflow:hidden}
.mc-cs-bar::after{content:"";position:absolute;inset:0;width:min(100%,calc(var(--mc-cs-w) * 4));background:var(--c-accent)}
.mc-cs-value{display:flex;gap:12px;justify-content:flex-end;flex:none;color:var(--cl-muted);font-size:12px;line-height:16px}
.mc-cs-value b{color:var(--cl-ink);font-weight:500}

/* Holidays */
.mc-holiday+.mc-holiday{margin-top:12px}
.mc-holiday-head{position:sticky;top:0;display:flex;align-items:center;background:#fff;padding-bottom:4px}
.mc-holiday-head time{font-size:14px;font-weight:500;line-height:20px}
.mc-holiday-card{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--cl-rule);border-radius:12px}
.mc-holiday-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex:none;color:var(--c-red)}
.mc-holiday-icon svg{width:24px;height:24px}
.mc-holiday-name{flex:1;min-width:0;font-size:16px;font-weight:500;line-height:24px}
.mc-holiday-session{color:var(--cl-muted);font-size:14px;line-height:20px}

/* Event tracking */
.mc-track{list-style:none;margin:0;padding:0;position:relative}
.mc-track li{display:flex;gap:12px;padding:8px 0}
.mc-track-date{position:relative;flex:none;width:46px;padding-top:2px;text-align:center;font-size:12px;line-height:16px;color:var(--cl-muted)}
.mc-track-date::after{content:"";position:absolute;top:0;bottom:-16px;left:50%;border-left:1px dashed rgba(var(--c-text-rgb),.12)}
.mc-track li:last-child .mc-track-date::after{display:none}
.mc-track-body{flex:1;min-width:0}
.mc-track-title{font-size:14px;font-weight:500;line-height:20px;overflow-wrap:anywhere}
.mc-track-title a{color:inherit;text-decoration:none}
.mc-track-title a:hover{text-decoration:underline;text-underline-offset:3px}

/* ── Responsive: Longbridge drops the right column below 1100px ───────── */
@media(max-width:1099px){
  .mc-layout{max-width:none;padding:16px var(--cl-panel-inline,12px) 24px}
  .mc-aside{display:none}
}
@media(max-width:767px){
  .mc-toolbar{padding:12px 0}
  .mc-toolbar-left{flex:1;justify-content:space-between}
  /* Longbridge mobile keeps only the period button, 周/月 and the filter:
     the today button and the period arrows are dropped. */
  .mc-today,.mc-round{display:none}
  .mc-clock{display:none}
  .mc-period{flex:1}
  .mc-period-picker{flex:1;min-width:0}
  .mc-period-btn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mc-period-btn>span{overflow:hidden;text-overflow:ellipsis}
  .mc-popover-picker{width:min(300px,calc(100vw - 32px))}
  .mc-cell{min-height:106px}
  .mc-cell-day{margin-bottom:8px}
  .mc-cell-today{display:inline-block}
  .mc-chip{padding:0;border:0;border-radius:0;background:none}
  .mc-chip-stock{border:0}
  .mc-chip-logo{width:18px;height:18px}
  .mc-chip-text{display:none}
  .mc-chip-more{display:flex;padding:2px 8px;border:1px solid var(--cl-rule);border-radius:9999px}
  .mc-chip-more::after{content:"";}
  .mc-calendar{margin-bottom:16px}
  .mc-group-head{position:static;height:auto;padding:12px 12px 12px;background:#f0f2f4}
  .mc-group-grid{grid-template-columns:1fr}
  .mc-group-cols{display:none}
  .mc-row-grid{grid-template-columns:1fr}
  .mc-row{padding:12px}
  .mc-row-values{display:flex;flex-direction:column;gap:4px;margin-top:8px;padding-top:8px;border-top:1px solid var(--cl-rule)}
  .mc-row-values>div{justify-content:space-between}
  .mc-row-values dd{text-align:right}
  .mc-row-values>div::before{content:attr(data-label);color:var(--cl-muted);font-size:14px;line-height:20px}
  .mc-more{padding:0}
  .mc-list{gap:16px}
}