/**
 * Roadmap page styles.
 */

.wr-roadmap-content{
	scroll-padding-top:calc(var(--wr-header-h) + var(--wr-admin-bar-h) + 24px);
}

.wr-roadmap-content .wr-rm-hero{
	background:var(--wr-navy,#010B44);
	padding:calc(var(--wr-header-h) + var(--wr-admin-bar-h) + 3rem) 2rem 70px;
	position:relative;overflow:hidden;text-align:center;
}
.wr-roadmap-content .wr-rm-hero::before{
	content:'';position:absolute;top:-200px;right:-200px;width:600px;height:600px;
	background:radial-gradient(circle,rgba(150,73,227,.25) 0%,transparent 70%);pointer-events:none;
}
.wr-roadmap-content .wr-rm-hero::after{
	content:'';position:absolute;bottom:-100px;left:-100px;width:500px;height:500px;
	background:radial-gradient(circle,rgba(0,148,242,.2) 0%,transparent 70%);pointer-events:none;
}
.wr-roadmap-content .wr-page-hero-inner{max-width:760px;margin:0 auto;position:relative;z-index:1}
.wr-roadmap-content .wr-rm-hero h1{font-size:3rem;font-weight:900;color:#fff;line-height:1.1;margin-bottom:1.2rem}
.wr-roadmap-content .wr-rm-hero h1 em{
	font-style:normal;
	background:linear-gradient(135deg,#FF6B00,#ff9a3c);
	-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.wr-roadmap-content .wr-rm-hero p{color:rgba(255,255,255,.7);font-size:1.05rem;line-height:1.7;max-width:580px;margin:0 auto 2rem}
.wr-roadmap-content .wr-badge{
	display:inline-flex;align-items:center;gap:8px;
	background:rgba(255,107,0,.15);border:1px solid rgba(255,107,0,.3);
	color:#FF6B00;padding:6px 14px;border-radius:100px;font-size:.82rem;font-weight:600;margin-bottom:1.5rem;
}
.wr-rm-hero-actions{
	display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;margin-top:.5rem;
}
.wr-rm-version-pill{
	display:inline-flex;align-items:center;gap:8px;
	background:rgba(0,200,100,.15);border:1px solid rgba(0,200,100,.3);
	color:#00c864;padding:8px 18px;border-radius:100px;font-size:.85rem;font-weight:700;
}
.wr-rm-get-started{padding:10px 22px;font-size:.9rem;border-radius:100px}

.wr-rm-section{padding:80px 2rem;background:#fff}
.wr-rm-inner{max-width:920px;margin:0 auto}

.wr-rm-legend{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;margin-bottom:3.5rem}
.wr-rm-legend-item{
	display:flex;align-items:center;gap:8px;font-size:.85rem;font-weight:600;color:var(--wr-text,#1a1f3c);
	background:none;border:none;padding:6px 12px;border-radius:100px;cursor:pointer;font-family:inherit;
	transition:background .2s,color .2s,box-shadow .2s;
}
.wr-rm-legend-item:hover{background:rgba(1,11,68,.05)}
.wr-rm-legend-item:focus-visible{outline:2px solid var(--wr-blue,#0094F2);outline-offset:2px}
.wr-rm-legend-item.is-active{background:rgba(1,11,68,.08);box-shadow:0 0 0 1px rgba(1,11,68,.08)}
.wr-rm-legend-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}
.wr-rm-legend-dot.shipped{background:#00c864}
.wr-rm-legend-dot.in-progress{background:#FF6B00}
.wr-rm-legend-dot.planned{background:#0094F2}
.wr-rm-legend-dot.considering{background:#9649E3}
.wr-rm-legend-dot.changelog{background:#FF6B00}

.wr-rm-phase{margin-bottom:3rem}
.wr-rm-phase-label{display:flex;align-items:center;gap:12px;margin-bottom:1.5rem}
.wr-rm-phase-tag{
	display:inline-flex;align-items:center;gap:6px;padding:5px 16px;border-radius:100px;
	font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
}
.wr-rm-phase-tag.shipped{background:rgba(0,200,100,.12);color:#00a84e;border:1px solid rgba(0,200,100,.25)}
.wr-rm-phase-tag.in-progress{background:rgba(255,107,0,.12);color:#e05500;border:1px solid rgba(255,107,0,.25)}
.wr-rm-phase-tag.planned{background:rgba(0,148,242,.1);color:#0078c8;border:1px solid rgba(0,148,242,.2)}
.wr-rm-phase-tag.considering{background:rgba(150,73,227,.1);color:#7a35c8;border:1px solid rgba(150,73,227,.2)}
.wr-rm-phase-divider{flex:1;height:1px;background:var(--wr-border,#e5e7eb)}

.wr-rm-items-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.wr-rm-item{
	background:#fff;border:1px solid var(--wr-border,#e5e7eb);border-radius:14px;
	padding:1.4rem 1.5rem;display:flex;align-items:flex-start;gap:14px;transition:all .2s;
}
.wr-rm-item:hover{box-shadow:0 8px 24px rgba(1,11,68,.08);transform:translateY(-2px)}
.wr-rm-item.shipped{border-left:3px solid #00c864}
.wr-rm-item.in-progress{border-left:3px solid #FF6B00}
.wr-rm-item.planned{border-left:3px solid #0094F2}
.wr-rm-item.considering{border-left:3px solid #9649E3}
.wr-rm-item-icon{font-size:1.4rem;flex-shrink:0;margin-top:2px}
.wr-rm-item-title{font-size:.95rem;font-weight:700;color:var(--wr-text,#1a1f3c);margin-bottom:4px}
.wr-rm-item-desc{font-size:.82rem;color:var(--wr-muted,#6b7280);line-height:1.6}
.wr-rm-item-badges{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.wr-rm-badge{display:inline-flex;align-items:center;padding:2px 9px;border-radius:100px;font-size:.7rem;font-weight:600}
.wr-rm-badge.pro{background:rgba(150,73,227,.12);color:#7a35c8}
.wr-rm-badge.free{background:rgba(0,200,100,.12);color:#00a84e}
.wr-rm-badge.new{background:rgba(255,107,0,.12);color:#e05500}
.wr-rm-badge.update{background:rgba(0,148,242,.1);color:#0078c8}

.wr-rm-changelog{padding:80px 2rem;background:var(--wr-light,#F4F6FB)}
.wr-rm-changelog-inner{max-width:800px;margin:0 auto}
.wr-rm-section-header{text-align:center;margin-bottom:2.5rem}
.wr-rm-section-badge{
	display:inline-flex;align-items:center;gap:6px;font-size:.82rem;font-weight:600;
	padding:5px 14px;border-radius:100px;margin-bottom:1rem;
	background:rgba(255,107,0,.1);color:#FF6B00;
}
.wr-rm-section-title{font-size:2.4rem;font-weight:800;line-height:1.2;margin-bottom:.8rem;color:var(--wr-text,#1a1f3c)}
.wr-rm-section-sub{font-size:1rem;color:var(--wr-muted,#6b7280);line-height:1.7}

.wr-rm-cl-switcher{
	display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:2rem;
}
.wr-rm-cl-tab{
	display:flex;flex-direction:column;align-items:flex-start;gap:4px;
	padding:1rem 1.2rem;border-radius:14px;border:2px solid var(--wr-border,#e5e7eb);
	background:#fff;cursor:pointer;font-family:inherit;text-align:left;transition:all .2s;
}
.wr-rm-cl-tab:hover{border-color:rgba(0,200,100,.35);box-shadow:0 4px 16px rgba(1,11,68,.06)}
.wr-rm-cl-tab.is-active[data-target="free"]{
	border-color:#00c864;background:rgba(0,200,100,.06);box-shadow:0 4px 20px rgba(0,200,100,.12);
}
.wr-rm-cl-tab.is-active[data-target="pro"]{
	border-color:#9649E3;background:rgba(150,73,227,.06);box-shadow:0 4px 20px rgba(150,73,227,.12);
}
.wr-rm-cl-tab-icon{font-size:1.1rem;line-height:1}
.wr-rm-cl-tab-label{font-size:.95rem;font-weight:800;color:var(--wr-text,#1a1f3c)}
.wr-rm-cl-tab-version{
	font-size:.75rem;font-weight:700;padding:2px 8px;border-radius:100px;
	background:var(--wr-light,#F4F6FB);color:var(--wr-muted,#6b7280);
}
.wr-rm-cl-tab.is-active[data-target="free"] .wr-rm-cl-tab-version{background:rgba(0,200,100,.15);color:#00a84e}
.wr-rm-cl-tab.is-active[data-target="pro"] .wr-rm-cl-tab-version{background:rgba(150,73,227,.12);color:#7a35c8}

.wr-rm-cl-panel{display:none}
.wr-rm-cl-panel.is-active{display:block}
.wr-rm-cl-panel-head{margin-bottom:1.75rem;text-align:center}
.wr-rm-cl-panel-title{font-size:1.15rem;font-weight:800;color:var(--wr-text,#1a1f3c);margin-bottom:.35rem}
.wr-rm-cl-panel-sub{font-size:.88rem;color:var(--wr-muted,#6b7280);line-height:1.6;margin:0}
.wr-rm-cl-empty{
	text-align:center;padding:2rem 1rem;border:1px dashed var(--wr-border,#e5e7eb);
	border-radius:14px;color:var(--wr-muted,#6b7280);font-size:.9rem;
}

.wr-rm-timeline{position:relative;padding-left:2rem}
.wr-rm-timeline::before{
	content:'';position:absolute;left:0;top:0;bottom:0;width:2px;
	background:linear-gradient(180deg,#FF6B00,#9649E3,#0094F2);
}
.wr-rm-timeline-free::before{background:linear-gradient(180deg,#00c864,#0094F2)}
.wr-rm-timeline-pro::before{background:linear-gradient(180deg,#9649E3,#FF6B00)}
.wr-rm-tl-entry{position:relative;margin-bottom:2.5rem;padding-left:2rem}
.wr-rm-tl-dot{
	position:absolute;left:-2.6rem;top:4px;width:14px;height:14px;border-radius:50%;
	border:2px solid #fff;box-shadow:0 0 0 2px #FF6B00;
}
.wr-rm-tl-dot.latest{background:#FF6B00;box-shadow:0 0 0 3px rgba(255,107,0,.25)}
.wr-rm-timeline-free .wr-rm-tl-dot.latest{background:#00c864;box-shadow:0 0 0 3px rgba(0,200,100,.25)}
.wr-rm-timeline-pro .wr-rm-tl-dot.latest{background:#9649E3;box-shadow:0 0 0 3px rgba(150,73,227,.25)}
.wr-rm-timeline-free .wr-rm-version-latest{background:#00c864}
.wr-rm-timeline-pro .wr-rm-version-latest{background:#9649E3}
.wr-rm-tl-dot.regular{background:#fff;box-shadow:0 0 0 2px var(--wr-border,#e5e7eb)}
.wr-rm-tl-dot.minor{background:var(--wr-light,#F4F6FB);border-color:var(--wr-border,#e5e7eb);box-shadow:0 0 0 2px var(--wr-border,#e5e7eb)}

.wr-rm-tl-card{background:#fff;border:1px solid var(--wr-border,#e5e7eb);border-radius:14px;overflow:hidden;transition:box-shadow .2s}
.wr-rm-tl-card:hover{box-shadow:0 8px 24px rgba(1,11,68,.08)}
.wr-rm-tl-head{
	width:100%;display:flex;align-items:center;justify-content:space-between;
	padding:1rem 1.4rem;border-bottom:1px solid var(--wr-border,#e5e7eb);
	cursor:pointer;background:#fff;border-left:none;border-right:none;border-top:none;
	font-family:inherit;text-align:left;
}
.wr-rm-tl-head:not([aria-expanded="true"]){border-bottom:none}
.wr-rm-tl-version{display:flex;align-items:center;gap:10px}
.wr-rm-version-num{font-size:1rem;font-weight:800;color:var(--wr-text,#1a1f3c)}
.wr-rm-version-latest{background:#FF6B00;color:#fff;font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:100px}
.wr-rm-tl-date{font-size:.82rem;color:var(--wr-muted,#6b7280);font-weight:500;margin-left:auto;margin-right:12px}
.wr-rm-tl-toggle{font-size:.75rem;color:var(--wr-muted,#6b7280);transition:transform .2s;flex-shrink:0}
.wr-rm-tl-toggle.open{transform:rotate(180deg)}

.wr-rm-tl-body{display:none;padding:1rem 1.4rem;gap:6px}
.wr-rm-tl-body.is-open{display:grid}
.wr-rm-tl-item{display:flex;align-items:flex-start;gap:10px;font-size:.85rem;color:var(--wr-text,#1a1f3c);padding:4px 0}
.wr-rm-tl-type{
	min-width:52px;padding:2px 8px;border-radius:6px;font-size:.68rem;font-weight:700;
	text-align:center;flex-shrink:0;
}
.wr-rm-tl-type.new{background:rgba(0,200,100,.12);color:#00a84e}
.wr-rm-tl-type.update{background:rgba(0,148,242,.1);color:#0078c8}
.wr-rm-tl-type.fix{background:rgba(255,107,0,.1);color:#e05500}

@media(max-width:768px){
	.wr-roadmap-content .wr-rm-hero{padding:calc(var(--wr-header-h) + var(--wr-admin-bar-h) + 1.5rem) 1rem 50px}
	.wr-roadmap-content .wr-rm-hero h1{font-size:2.2rem}
	.wr-rm-section,.wr-rm-changelog{padding:60px 1rem}
	.wr-rm-cl-switcher{grid-template-columns:1fr;gap:10px}
	.wr-rm-items-grid{grid-template-columns:1fr}
	.wr-rm-legend{gap:1rem}
	.wr-rm-section-title{font-size:1.85rem}
}

@media(max-width:640px){
	.wr-rm-items-grid{grid-template-columns:1fr}
}