/**
* CLW Modern List Widget Styles - UX Optimized
*
* @package CLW_Modern_List
* @author Charli Lue Wickes
* @version 1.3.1
*/
:root{--clw-primary-color:#95c15b;--clw-text-color:#333333;--clw-text-light:#666666;--clw-bg-light:#f8f9fa;--clw-border-light:#e5e7eb;--clw-shadow-light:rgba(0,0,0,0.08);--clw-shadow-hover:rgba(149,193,91,0.15);--clw-transition-fast:0.15s cubic-bezier(0.4,0,0.2,1);--clw-transition-normal:0.25s cubic-bezier(0.4,0,0.2,1);--clw-transition-slow:0.35s cubic-bezier(0.4,0,0.2,1);}
.clw-modern-list{margin:0;padding:0;list-style:none;contain:layout style paint;transform:translateZ(0);min-height:1px;}
.clw-modern-list .item{position:relative;margin:0;padding:0;contain:layout style;display:block;width:fit-content;}
.clw-modern-list .item:not(.visible){content-visibility:auto;contain-intrinsic-size:0 48px;}
.clw-modern-list .link{display:inline;text-decoration:none;color:var(--clw-text-color);transition:color var(--clw-transition-normal);position:relative;padding:4px 0;border-radius:0;contain:layout style;font-weight:600;line-height:1.5;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;overflow:visible;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.clw-modern-list .link:hover{color:var(--clw-primary-color);text-decoration:none;}
.clw-modern-list .link::after{content:"";position:absolute;left:0;right:auto;bottom:0;height:2px;width:0;-webkit-transition:width .6s cubic-bezier(.25,.8,.25,1) 0s;transition:width .6s cubic-bezier(.25,.8,.25,1) 0s;background-color:#94be57;z-index:1;}
.clw-modern-list .link:hover::after{width:100%;}
.clw-modern-list .link:focus::after{width:100%;}
.clw-modern-list .link:active{transform:none;transition-duration:var(--clw-transition-fast);}
.clw-modern-list .badge{display:inline-block;margin-left:8px;}
.clw-modern-list .badge__text{display:inline-block;padding:4px 10px;background-color:var(--clw-primary-color);color:#ffffff;font-size:11px;font-weight:600;border-radius:16px;line-height:1.2;transition:all var(--clw-transition-normal);contain:layout style;letter-spacing:0.025em;text-transform:uppercase;min-width:20px;text-align:center;}
.clw-modern-list--style-01 .link{background-color:transparent;border:none;border-radius:0;font-weight:600;padding:4px 0;position:relative;overflow:visible;}
.clw-modern-list--style-01 .link::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(148,190,88,0.1),transparent);transition:left var(--clw-transition-slow);will-change:transform,width;backface-visibility:hidden;}
.clw-modern-list--style-01 .link:hover{background-color:transparent;border-color:transparent;transform:none;box-shadow:none;}
.clw-modern-list--style-01 .link:hover::before{left:100%;}
.clw-modern-list--style-02 .link{background-color:transparent;border:none;border-radius:0;box-shadow:none;font-weight:600;backdrop-filter:none;}
.clw-modern-list--style-02 .link:hover{background-color:transparent;border-color:transparent;box-shadow:none;transform:none;}
.clw-modern-list--style-02 .link:active{transform:none;}
.clw-modern-list--style-02 .item + .item{margin-top:8px;}
.clw-modern-list--style-03 .link{background-color:transparent;border:none;border-radius:0;font-weight:600;position:relative;}
.clw-modern-list--style-03 .link::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background-color:#94be57;-webkit-transition:width .6s cubic-bezier(.25,.8,.25,1) 0s;transition:width .6s cubic-bezier(.25,.8,.25,1) 0s;z-index:1;will-change:transform,width;backface-visibility:hidden;}
.clw-modern-list--style-03 .link:hover::after{width:100%;}
.clw-modern-list--style-03 .link:hover{padding-left:0;}
.clw-modern-list--style-03 .item.truncated .link{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
@media (min-width:769px) and (max-width:1024px){
.clw-modern-list .item{margin-bottom:6px;}
.clw-modern-list .link{font-size:16px;min-height:46px;padding:10px 14px;border-radius:6px;display:inline-flex;align-items:center;background-color:rgba(149,193,91,0.01);border:1px solid transparent;transition:all var(--clw-transition-normal);}
.clw-modern-list .link:hover{background-color:rgba(149,193,91,0.05);border-color:rgba(149,193,91,0.15);transform:translateY(-1px);box-shadow:0 2px 8px rgba(149,193,91,0.1);}
.clw-modern-list--style-01 .link{border-left:2px solid transparent;}
.clw-modern-list--style-01 .link:hover{border-left-color:var(--clw-primary-color);padding-left:16px;}
.clw-modern-list--style-02 .link{background-color:rgba(255,255,255,0.6);border:1px solid rgba(149,193,91,0.08);box-shadow:0 1px 3px rgba(0,0,0,0.03);margin-bottom:8px;}
.clw-modern-list--style-02 .link:hover{background-color:rgba(255,255,255,0.9);box-shadow:0 4px 16px rgba(149,193,91,0.12);border-color:rgba(149,193,91,0.2);}
.clw-modern-list--style-03 .link:hover{padding-left:12px;}
.clw-modern-list .badge{margin-left:auto;padding-left:10px;}
.clw-modern-list .badge__text{font-size:11px;padding:5px 10px;border-radius:14px;}
.clw-modern-list .link:active{transform:scale(0.98);transition-duration:var(--clw-transition-fast);}
}
@media (max-width:768px){
.clw-modern-list .item{margin-bottom:8px;padding:0;}
.clw-modern-list .link{font-size:16px;min-height:48px;display:inline;align-items:center;justify-content:flex-start;padding:12px 0;margin:0 0 0 16px;border-radius:0;background-color:transparent;border:none;transition:all var(--clw-transition-normal);-webkit-tap-highlight-color:rgba(149,193,91,0.1);touch-action:manipulation;position:relative;overflow:visible;transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);}
.clw-modern-list .link:active{background-color:transparent;border-color:transparent;transform:none;transition-duration:var(--clw-transition-fast);will-change:auto;}
.clw-modern-list--style-01 .link{background:transparent;border:none;margin-left:20px;}
.clw-modern-list--style-01 .link:active{background:transparent;border:none;}
.clw-modern-list--style-02 .link{background-color:transparent;border:none;box-shadow:none;margin-bottom:0;margin-left:20px;backdrop-filter:none;}
.clw-modern-list--style-02 .link:active{box-shadow:none;border:none;background:transparent;}
.clw-modern-list--style-03 .link{border:none;margin-left:20px;}
.clw-modern-list--style-03 .link:active{border:none;}
.clw-modern-list .badge{margin-left:auto;padding-left:12px;}
.clw-modern-list .badge__text{font-size:11px;padding:6px 12px;border-radius:16px;font-weight:700;letter-spacing:0.5px;box-shadow:0 2px 4px rgba(0,0,0,0.1);border:1px solid rgba(255,255,255,0.2);contain:layout style;}
.clw-modern-list .item + .item{margin-top:0;}
@media (hover:none){
.clw-modern-list .link:hover{color:var(--clw-text-color);background-color:transparent;border-color:transparent;box-shadow:none;transform:none;padding-left:0;}
.clw-modern-list--style-01 .link:hover{background-color:transparent;border-color:transparent;transform:none;}
.clw-modern-list--style-01 .link:hover::before{left:-100%;}
.clw-modern-list--style-02 .link:hover{background-color:#ffffff;border-color:var(--clw-border-light);box-shadow:0 1px 3px var(--clw-shadow-light);transform:none;}
.clw-modern-list--style-03 .link:hover::after{width:0;}
}
.clw-modern-list .link:not(:active):not(:hover){will-change:auto;}
}
@media (max-width:480px){
.clw-modern-list .item{margin-bottom:6px;}
.clw-modern-list .link{font-size:15px;min-height:52px;padding:14px 0;border-radius:0;line-height:1.4;}
.clw-modern-list--style-01 .link{border:none;margin-left:24px;}
.clw-modern-list--style-02 .link{margin-bottom:0;margin-left:24px;box-shadow:none;background:transparent;}
.clw-modern-list--style-03 .link{padding:14px 0;border:none;margin-left:24px;}
.clw-modern-list .badge{margin-left:8px;}
.clw-modern-list .badge__text{font-size:10px;padding:4px 8px;border-radius:12px;min-width:24px;}
.clw-modern-list .link:active{transform:none;transition:all 0.1s cubic-bezier(0.25,0.46,0.45,0.94);}
}
.clw-modern-list .link:focus{outline:3px solid var(--clw-primary-color);outline-offset:2px;border-radius:0;}
.clw-modern-list .link:focus-visible{outline:3px solid var(--clw-primary-color);outline-offset:2px;box-shadow:0 0 0 6px rgba(148,190,88,0.2);}
.clw-modern-list .link:focus:not(:focus-visible){outline:none;}
@media (prefers-contrast:high){
.clw-modern-list .link:focus,.clw-modern-list .link:focus-visible{outline:4px solid currentColor;outline-offset:3px;}
.clw-modern-list .link{border:2px solid currentColor;}
.clw-modern-list .badge__text{border:1px solid currentColor;}
}
.clw-modern-list .badge__text.badge--secondary{background-color:#648A44;}
.clw-modern-list .badge__text.badge--warning{background-color:#FF6A6A;}
.clw-modern-list .badge__text.badge--light{background-color:#f5f5f5;color:#252525;}
.clw-modern-list--loading .link{opacity:0.6;pointer-events:none;}
@media print{
.clw-modern-list .link{color:#000 !important;background:transparent !important;box-shadow:none !important;border:none !important;padding:8px 0 !important;}
.clw-modern-list .badge__text{border:1px solid #000;background:transparent !important;color:#000 !important;}
}
@media (prefers-reduced-motion:reduce){
:root{--clw-transition-fast:0s;--clw-transition-normal:0s;--clw-transition-slow:0s;}
.clw-modern-list .link,.clw-modern-list .badge__text,.clw-modern-list--style-03 .link::after,.clw-modern-list--style-01 .link::before{transition:none;animation:none;will-change:auto;}
.clw-modern-list--style-01 .link:hover,.clw-modern-list--style-02 .link:hover,.clw-modern-list .link:active{transform:none;}
.clw-modern-list--style-01 .link:hover::before{left:-100%;}
}
@media (prefers-reduced-data:reduce){
.clw-modern-list--style-01 .link::before{background:none;}
.clw-modern-list--style-02 .link{backdrop-filter:none;box-shadow:none;}
.clw-modern-list .badge__text{box-shadow:none;border:none;}
}
@media (prefers-reduced-motion:no-preference){
.clw-modern-list{scroll-behavior:smooth;}
}
@supports (backdrop-filter:blur(10px)){
@media (min-width:769px){
.clw-modern-list--style-02 .link{backdrop-filter:blur(10px);}
}
}
@media (pointer:coarse){
.clw-modern-list .link{min-height:48px;padding:12px 16px;}
.clw-modern-list .badge__text{min-width:28px;min-height:28px;}
}
@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){
.clw-modern-list .link::after{height:1px;transform:scaleY(2);transform-origin:bottom;}
}