.tour-overlay{
position:fixed;
inset:0;
background:rgba(15,23,42,.30);
z-index:15000;
}
.tour-highlight{
position:fixed;
z-index:15002;
border:3px solid rgba(37,99,235,.82);
border-radius:16px;
box-shadow:0 0 0 9999px rgba(15,23,42,.22),0 18px 48px rgba(37,99,235,.24);
pointer-events:none;
transition:top .18s ease,left .18s ease,width .18s ease,height .18s ease;
}
.tour-panel{
position:fixed;
width:min(360px, calc(100vw - 40px));
padding:16px;
border-radius:8px;
background:#fff;
border:1px solid rgba(15,23,42,.12);
box-shadow:0 24px 70px rgba(15,23,42,.24);
z-index:15003;
animation:tourIn .22s ease;
}
.tour-panel-eyebrow{
font-size:11px;
letter-spacing:.12em;
text-transform:uppercase;
color:var(--muted);
margin-bottom:8px;
}
.tour-panel-title{
font-size:18px;
font-weight:950;
margin-bottom:8px;
color:#0f172a;
}
.tour-panel-copy{
font-size:14px;
line-height:1.55;
color:var(--text);
}
.tour-panel-actions{
display:flex;
gap:10px;
justify-content:flex-end;
margin-top:14px;
flex-wrap:wrap;
}
.format-toolbar{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-bottom:10px;
}
.format-toolbar-wrap{
display:flex;
flex-direction:column;
gap:8px;
}
.tox.tox-tinymce{
border:1px solid var(--border);
border-radius:8px;
overflow:hidden;
box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.tox .tox-toolbar__primary,
.tox .tox-toolbar-overlord{
background:var(--surface) !important;
}
.tox .tox-tbtn{
border-radius:8px !important;
}
.format-tool{
border:1px solid var(--border);
background:var(--surface);
color:var(--text);
border-radius:10px;
padding:7px 10px;
font-size:12px;
font-weight:700;
cursor:pointer;
line-height:1;
}
.format-tool:hover{
background:var(--soft);
}
.tour-active-step{
position:relative;
z-index:15001 !important;
border-radius:14px;
}
@keyframes tourIn{
from{transform:translateY(10px);opacity:0}
to{transform:translateY(0);opacity:1}
}
/* Announcement Modal Styles */
.announcement-modal-overlay {
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(15,23,42,.6);
backdrop-filter:blur(4px);
z-index:100000;
display:none;
align-items:center;
justify-content:center;
padding:20px;
}
.announcement-modal-overlay.show {
display:flex;
}
.announcement-modal {
background:#fff;
border-radius:16px;
box-shadow:0 24px 48px rgba(15,23,42,.25);
max-width:560px;
width:100%;
max-height:80vh;
overflow-y:auto;
animation:announcementIn .3s ease;
}
@keyframes announcementIn {
from{transform:scale(.95);opacity:0}
to{transform:scale(1);opacity:1}
}
.announcement-modal-header {
padding:24px 24px 0;
display:flex;
align-items:center;
gap:12px;
position:relative;
}
.announcement-modal-icon {
width:40px;
height:40px;
border-radius:10px;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}
.announcement-modal-icon.info { background:#eff6ff;color:#2563eb; }
.announcement-modal-icon.warning { background:#fff7ed;color:#ea580c; }
.announcement-modal-icon.success { background:#f0fdf4;color:#16a34a; }
.announcement-modal-icon.critical { background:#fef2f2;color:#dc2626; }
.announcement-modal-title {
font-size:18px;
font-weight:700;
margin:0;
color:var(--text);
padding-right:34px;
}
.announcement-modal-close {
position:absolute;
right:18px;
top:18px;
width:32px;
height:32px;
border:1px solid var(--border);
border-radius:999px;
background:#fff;
color:var(--muted);
font-size:20px;
line-height:1;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
}
.announcement-modal-close:hover {
background:var(--soft);
color:var(--text);
}
.announcement-modal-body {
padding:20px 24px;
line-height:1.6;
color:var(--text);
}
.announcement-modal-footer {
padding:16px 24px 24px;
display:flex;
gap:12px;
justify-content:flex-end;
border-top:1px solid var(--border);
}
.announcement-modal-btn {
padding:10px 20px;
border-radius:8px;
font-size:14px;
font-weight:600;
border:none;
cursor:pointer;
transition:background .2s;
}
.announcement-modal-btn.primary {
background:var(--primary);
color:#fff;
}
.announcement-modal-btn.secondary {
background:var(--soft);
color:var(--text);
}
.announcement-modal-btn:hover {
opacity:.9;
}