:root{ --bg:#0e0f13; --card:#151821; --elev:#1a1f2b; --line:#252a36; --text:#0b1220; --muted:#667085; --accent:#0ea5e9; --radius:16px; --shadow:0 10px 30px rgba(0,0,0,.12); } /* Light palette (default) */ .tmpro-root.tmpro-light{ --bg:#f7f8fb; --card:#ffffff; --elev:#ffffff; --line:#e5e7eb; --text:#0b1220; --muted:#667085; --accent:#0ea5e9; } .tmpro-root{background:var(--bg);color:var(--text);padding:12px;border-radius:var(--radius);} /* Header */ .tmpro-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin-bottom:12px;position:relative;z-index:5;} .tmpro-left,.tmpro-right{display:flex;align-items:center;gap:8px;} .tmpro-center{text-align:center;} #tmpro-title{margin:0;font-size:26px;font-weight:700;letter-spacing:.2px;} .tmpro-btn,.tmpro-icon{background:var(--elev);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:8px 12px;cursor:pointer;} .tmpro-icon{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:18px;} .tmpro-btn:hover,.tmpro-icon:hover{outline:2px solid var(--accent);outline-offset:0;} .tmpro-seg{background:var(--elev);padding:4px;border-radius:12px;border:1px solid var(--line);display:inline-flex;} .tmpro-seg .seg{border:0;background:transparent;color:var(--text);padding:6px 10px;border-radius:8px;cursor:pointer;} .tmpro-seg .seg.active{background:var(--card);outline:2px solid var(--accent);} /* Calendar chrome */ .fc .fc-toolbar,.fc-theme-standard .fc-scrollgrid{border-color:var(--line);} .fc .fc-daygrid-day{background:var(--card);} .fc .fc-daygrid-day-number{font-size:15px;font-weight:700;color:var(--text);padding:6px 8px;border-radius:10px;} .fc .fc-daygrid-day:hover .fc-daygrid-day-number{background:rgba(14,165,233,.12);} .fc .fc-daygrid-day.fc-day-today{background:rgba(14,165,233,.10);} .fc .fc-daygrid-day-frame{padding:6px;overflow:hidden;} #tmpro-calendar{position:relative;z-index:1;} /* Event chip (text + tiny avatar) */ .fc .fc-daygrid-event{ background:#f3f6fb; color:#0b1220; border:1px solid #e5e7eb; border-radius:999px; padding:3px 10px; box-shadow:none; height:auto !important; max-width:100%; } .fc .fc-daygrid-event:hover{border-color:#cbd5e1;} /* Title wrapping */ .fc .fc-daygrid-event .fc-event-title, .fc-popover .fc-event .fc-event-title, .fc .fc-list-event-title{ white-space:normal; overflow-wrap:anywhere; word-break:break-word; line-height:1.25; } /* “+N more” popover */ .fc-popover{z-index:2147483645;} .fc-popover .fc-popover-body{max-height:60vh;overflow:auto;} .fc-popover .fc-event{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:6px 8px;margin:4px 0;} /* Tiny avatar in event pills & popover list */ .tmpro-evt{display:flex;align-items:center;gap:6px;} .tmpro-evt img{width:18px;height:26px;border-radius:4px;object-fit:cover;} .tmpro-evt .tmpro-evt-btn{margin-left:6px;border:1px solid #e5e7eb;border-radius:8px;background:#fff;padding:0 8px;line-height:22px;height:22px;cursor:pointer;} @media (hover:hover) and (pointer:fine){ .tmpro-evt .tmpro-evt-btn { display:none; } } /* List view */ .fc .fc-list,.fc .fc-list-sticky .fc-list-table{background:var(--card);color:var(--text);border-color:var(--line);} .fc .fc-list-day-cushion{background:#f7f8fb;font-weight:700;} /* Progress */ .tmpro-progress{height:4px;background:var(--line);border-radius:4px;overflow:hidden;margin-top:6px;} .tmpro-progress .bar{height:100%;width:0;background:var(--accent);animation:tmpro-load 1.2s infinite ease-in-out;} @keyframes tmpro-load{0%{width:0}50%{width:70%}100%{width:0}} /* ---------- GLOBAL HOVER (in ) ---------- */ .tmpro-hover{ position:fixed; z-index:2147483647; width:440px;max-width:95vw; background:#ffffff !important; color:#0b1220 !important; border:1px solid #e5e7eb !important; border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.15) !important; padding:12px; display:none; pointer-events:none; /* never block clicks */ } .tmpro-hover .row{display:flex;gap:12px;} .tmpro-hover img{width:140px;aspect-ratio:2/3;object-fit:cover;border-radius:12px;} .tmpro-hover h4{margin:0 0 4px;font-size:18px;font-weight:700;color:#0b1220 !important;} .tmpro-hover .meta{font-size:12px;color:#0b1220 !important;opacity:.8;margin-bottom:6px;} .tmpro-hover .ov{font-size:13px;line-height:1.45;color:#0b1220 !important;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;} .tmpro-hover .ad{margin-top:8px;border-top:1px dashed #e5e7eb;padding-top:6px;} /* Brand buttons */ #tmpro-cal .btn{ display:inline-flex;align-items:center;justify-content:center; padding:6px 10px;border-radius:8px;font-weight:600;line-height:1; min-height:36px;min-width:86px;cursor:pointer; border:1px solid #e5e7eb;background:#f9fafb;color:#0b1220; } #tmpro-cal .btn[disabled]{opacity:.55;cursor:not-allowed;} #tmpro-cal .tmpro-btn-imdb{background:#f5c518 !important;border-color:#d4ad12 !important;color:#000 !important;} #tmpro-cal .tmpro-btn-rt {background:#fa320a !important;border-color:#d52b09 !important;color:#fff !important;} #tmpro-cal .tmpro-btn-yt {background:#ff0033 !important;border-color:#ff0033 !important;color:#fff !important;} #tmpro-cal .tmpro-btn-share{background:#ffffff !important;border-color:#e5e7eb !important;color:#0b1220 !important;} #tmpro-cal .tmpro-btn-share svg{width:18px;height:18px;} .tmpro-actionbar{margin-top:12px;display:flex;gap:8px;flex-wrap:wrap;align-items:center;} /* Modal */ #tmpro-modal{position:fixed;inset:0;z-index:2147483646;display:none;} #tmpro-modal .tmpro-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);} #tmpro-modal .tmpro-modal-card{ position:absolute;top:50%;left:50%;transform:translate(-50%,-50%); width:min(880px,92vw);background:#ffffff !important;color:#0b1220 !important;border:1px solid #e5e7eb; border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.15);max-height:85vh;overflow:auto; } .tmpro-modal-close{position:absolute;top:10px;right:10px;z-index:2;border:0;background:#f9fafb;color:#0b1220;border:1px solid #e5e7eb;border-radius:10px;width:36px;height:36px;cursor:pointer;} .tmpro-modal-body{padding:16px;} .tmpro-modal-hero{display:flex;gap:16px;} .tmpro-modal-hero img{width:240px;aspect-ratio:2/3;object-fit:cover;border-radius:12px;} .tmpro-modal-hero .info h3{margin:0 0 6px;font-size:22px;} .tmpro-badges{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 10px;font-size:13px;color:#667085;} .tmpro-badge{background:#f9fafb;border:1px solid #e5e7eb;color:#667085;padding:2px 8px;border-radius:999px;font-size:12px;} .tmpro-modal-ov{font-size:14px;line-height:1.5;color:#0b1220;} .tmpro-ad{margin-top:14px;border-top:1px dashed #e5e7eb;padding-top:10px;} #tmpro-modal[aria-hidden="true"]{display:none !important;} /* Force readable text everywhere inside calendar scope */ #tmpro-cal,#tmpro-cal *{color:#0b1220 !important;} #tmpro-cal .fc a{color:#0b1220 !important;text-decoration:none;} #tmpro-cal .fc .fc-daygrid-event, #tmpro-cal .fc-popover .fc-event{ background:#ffffff !important;border-color:#e5e7eb !important;color:#0b1220 !important; } #tmpro-cal .fc .fc-daygrid-day-number, #tmpro-cal .tmpro-btn, #tmpro-cal .tmpro-icon{color:#0b1220 !important;} /* SMALL ad slot inside modal */ .tmpro-ad-small{ margin-top:12px; padding:8px; background:#fff; border:1px dashed #e5e7eb; border-radius:12px; max-width:320px; min-height:90px; overflow:hidden; } .tmpro-ad-small iframe, .tmpro-ad-small ins, .tmpro-ad-small div{max-width:100% !important;} /* Mobile poster tweaks (wider/shorter banner) */ @media (max-width:640px){ .tmpro-modal-hero{flex-direction:column;gap:12px;} .tmpro-modal-hero img{ width:100%; max-width:none; height:180px; aspect-ratio:auto; object-fit:cover; border-radius:12px; } } /* Mobile header layout: title above controls */ @media (max-width:640px){ .tmpro-header{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:12px;} .tmpro-center{order:-1;text-align:center;} .tmpro-left,.tmpro-right{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;} .tmpro-right{justify-content:flex-end;} } /* Mobile poster tweaks */ @media (max-width: 640px) { .tmpro-modal-hero { flex-direction: column; gap: 12px; } /* This is the poster in the modal on mobile */ .tmpro-modal-hero img { width: 50%; /* fill the modal width */ height: 100%; /* <- change this to control how short/tall it looks */ object-fit: cover; /* keeps it nicely cropped */ border-radius: 12px; } } /*Want it shorter? Lower height (e.g., 150px or 140px). Want it taller? Raise height (e.g., 220px). Keep object-fit: cover; to avoid distortion.*/ /* If a hover box is hidden, it must never intercept clicks */ .tmpro-hover[hidden], .tmpro-hover[style*="display: none"] { pointer-events: none !important; } /* Keep header above everything so its buttons are always clickable */ #tmpro-cal .tmpro-header { position: relative; z-index: 10; } /* If hover is hidden, it must not capture clicks */ .tmpro-hover[hidden], .tmpro-hover[style*="display: none"] { pointer-events: none !important; } /* Keep header above everything so its buttons are always clickable */ #tmpro-cal .tmpro-header { position: relative; z-index: 10; } /* When modal is hidden, it should not block clicks */ #tmpro-modal[style*="display: none"] { pointer-events: none !important; }