
.mws{
  background: var(--mws-bg);
  color: var(--mws-text);
  font-family: var(--mws-font);
  border: 1px solid var(--mws-border);
  border-radius: calc(var(--mws-radius) + 6px);
  padding: 14px;
  direction: rtl;
}
.mws[data-rtl="0"]{ direction:ltr; }

.mws-topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding: 8px 6px 14px 6px;
}
.mws-title{
  font-size: 18px;
  font-weight: 900;
  letter-spacing: .2px;
}
.mws-right{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.mws-logo{ width:44px; height:44px; object-fit:contain; border-radius:10px; background:rgba(255,255,255,.04); padding:6px; border:1px solid rgba(255,255,255,.06); }

.mws-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.mws-btn{
  background: linear-gradient(180deg, rgba(214,180,106,.95), rgba(175,140,70,.95));
  color:#101418;
  padding:10px 12px;
  border-radius: 14px;
  font-weight:900;
  text-decoration:none;
  border: 1px solid rgba(0,0,0,.15);
}

.mws-daypills{
  display:none;
  gap:10px;
  overflow:auto;
  padding: 6px 4px 12px 4px;
  -webkit-overflow-scrolling: touch;
}
.mws-pill{
  background: rgba(255,255,255,.03);
  border:1px solid var(--mws-border);
  color: var(--mws-text);
  padding:10px 14px;
  border-radius: 999px;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
}
.mws-pill.is-active{
  background: rgba(214,180,106,.18);
  border-color: rgba(214,180,106,.35);
}

.mws-layout{ display:flex; gap:12px; }
.mws-times{
  width:72px; flex:0 0 72px;
  display:flex; flex-direction:column; gap:10px;
  padding-top: 32px;
}
.mws-time-label{
  color: rgba(214,180,106,.85);
  font-weight:900;
  font-size: 12px;
  text-align:center;
  padding: 0px 6px;
  border-radius: 12px;
  background: rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
}

.mws-grid{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 12px;
  width: 100%;
}
.mws-col{
  background: var(--mws-panel);
  border: 1px solid var(--mws-border);
  border-radius: var(--mws-radius);
  overflow:hidden;
  min-height: 180px;
}
.mws-colhead{
  padding: 12px 12px;
  font-weight: 900;
  color: rgba(214,180,106,.92);
  border-bottom:1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.02);
}
.mws-events{ padding: 10px; display:flex; flex-direction:column; gap:10px; }
.mws-empty{ color: var(--mws-muted); padding: 14px 6px; font-weight:800; }

.mws-card{
  --mws-card: #1f4aa8;
  background: linear-gradient(180deg, color-mix(in srgb, var(--mws-card) 90%, #000 10%), color-mix(in srgb, var(--mws-card) 78%, #000 22%));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--mws-radius);
  padding: 20px;
  display:flex;
  justify-content:space-between;
  gap: 12px;
  position:relative;
  overflow:hidden;
  min-height: 140px;
  height: 140px;
}
.mws-card:after{
  content:"";
  position:absolute;
  inset:-40%;
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.12), transparent 40%);
  transform: rotate(12deg);
  pointer-events:none;
}
.mws-card-left{ 
  position:relative; 
  z-index:1; 
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  flex:1;
}
.mws-card-title{ font-weight: 900; font-size: 16px; line-height:1.2; color:#e9d6a8; }
.mws-card-sub{ 
  margin-top:6px; 
  color: rgba(255,255,255,.85); 
  font-weight:900; 
  font-size: 13px; 
  min-height: 18px;
}

.mws-card-actions{ 
  margin-top:auto; 
  display:flex; 
  align-items:center;
  gap:10px; 
  flex-wrap:wrap; 
}
.mws-mini{
  display:inline-block;
  padding:6px 10px;
  border-radius: 999px;
  text-decoration:none;
  font-weight:900;
  font-size:12px;
  background: rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.14);
  color: #fff;
}

.mws-card-right{
  position:relative; z-index:1;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:space-between;
  min-width: 86px;
}
.mws-icon{
  width:38px; height:38px;
  border-radius: 12px;
  background: rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.14);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  font-size:18px;
}
.mws-icon img{ width:100%; height:100%; object-fit:cover; }

/* Time fixed at physical left of card, all screen sizes, RTL & LTR */
.mws-card-time{
  position:absolute;
  left:12px;
  bottom:12px;
  font-weight: 900;
  color: rgba(255,255,255,.95);
  font-size: 13px;
  direction: ltr;
  z-index: 2;
  pointer-events: none;
}
.mws-time{
  font-weight: 900;
  color: rgba(255,255,255,.95);
  font-size: 13px;
}

/* Mobile: day pills + single column */
@media (max-width: 980px){
  .mws-daypills{
    display:flex;
    gap: 8px;
    padding: 8px 4px 14px;
    margin: 0 -4px;
    scroll-snap-type: x proximity;
  }
  .mws-pill{
    scroll-snap-align: start;
    flex-shrink: 0;
    min-height: 44px;
    padding: 10px 16px;
    font-size: 14px;
    -webkit-tap-highlight-color: transparent;
  }
  .mws-layout{ display:block; margin-top: 0; }
  .mws-times{ display:none; }
  .mws-grid{ grid-template-columns: 1fr; gap: 0; }
  .mws-col{
    display:none !important;
    margin-top: 12px;
  }
  .mws-col.is-active{ display:block !important; }
  .mws-colhead{
    padding: 14px 12px;
    font-size: 15px;
  }
  .mws-card{
    height: auto !important;
    min-height: 120px !important;
    padding: 14px;
  }
  .mws-cal-menu{
    right: 0;
    left: auto;
    min-width: 180px;
  }
  .mws[data-rtl="1"] .mws-cal-menu{
    right: auto;
    left: 0;
  }
}

/* Small phones: tighter topbar and actions */
@media (max-width: 480px){
  .mws{ padding: 10px; }
  .mws-topbar{ flex-wrap: wrap; padding: 6px 0 10px; }
  .mws-title{ font-size: 16px; }
  .mws-right{ width: 100%; justify-content: flex-end; }
  .mws-actions{ gap: 6px; }
  .mws-btn{ padding: 8px 10px; font-size: 13px; }
  .mws-daypills{ padding: 6px 0 12px; }
  .mws-pill{ padding: 8px 14px; font-size: 13px; }
  .mws-events{ padding: 8px; gap: 8px; }
  .mws-card{ padding: 12px; min-height: 110px; }
  .mws-card-title{ font-size: 15px; }
  .mws-cal-btn{ padding: 6px 12px !important; min-height: 36px; }
}

.mws-calendar{position:relative}
.mws-cal-btn{
  background:rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  width:36px;height:36px;
  cursor:pointer;
  color:#fff;
  font-size:16px;
}
.mws-cal-menu{
  position:absolute;
  top:42px;
  right:0;
  background:#0f1620;
  border:1px solid rgba(255,255,255,.15);
  border-radius:12px;
  min-width:160px;
  display:none;
  z-index:20;
}
.mws-cal-menu a{
  display:block;
  padding:10px 12px;
  color:#d6b46a;
  text-decoration:none;
  font-weight:700;
}
.mws-cal-menu a:hover{background:rgba(255,255,255,.05)}

/* v1.5 fixes: calendar button alignment + size */
.mws-cal-btn{
  font-size: 12px;
  padding: 6px 12px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}
.mws-calendar{position:relative; display:inline-flex; align-items:center}
.mws-cal-menu{
  top: 38px;
}

/* v1.7 FIXES */

/* Button size matches text */
.mws-cal-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:auto;
  min-height:28px;
  padding:6px 12px;
  line-height:1.2;
  font-size:12px;
  box-sizing:border-box;
}

/* Ensure cards don't clip dropdown */
.mws-event,
.mws-card{
  overflow: visible !important;
}

.mws-timeline{
  position:relative;
}

/* v1.7.3 FORCE UI FIXES */
.mws-card-left{position:relative}
.mws-card-time{
  position:absolute !important;
  bottom:10px !important;
  left:12px !important;
  font-weight:800;
  font-size:12px;
  direction:ltr;
}
.mws-cal-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:28px;
  padding:6px 40px !important;
  line-height:1 !important;
  border-radius:999px;
  box-sizing:border-box;
}
.mws-card{
  overflow:visible !important;
  min-height: 140px !important;
  height: 140px !important;
}
