.layout{min-height:100vh;display:flex;flex-direction:column;background-color:var(--color-background)}.header{background-color:var(--color-white);border-bottom:2px solid var(--color-border);box-shadow:0 2px 4px #0000001a;position:sticky;top:0;z-index:100}.header-content{max-width:1200px;margin:0 auto;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center}.logo-link{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:var(--color-primary);font-weight:600;font-size:1.5rem;transition:color .2s ease}.logo-link:hover{color:var(--color-primary-dark)}.logo{height:105px;width:auto}.logo-text{font-size:1.5rem;font-weight:700;color:var(--color-primary)}.logo-subtitle{font-size:1rem;font-weight:400;color:var(--color-text-secondary);margin-left:.5rem}.nav{display:flex;gap:1.5rem;align-items:center}.nav-link{color:var(--color-text-primary);text-decoration:none;font-weight:500;padding:.5rem 1rem;border-radius:4px;transition:all .2s ease}.nav-link:hover{background-color:var(--color-accent);color:var(--color-primary-dark)}.nav-link:active{background-color:var(--color-primary);color:var(--color-white)}.user-section{display:flex;align-items:center;gap:1rem}.user-info{color:var(--color-text-secondary);font-size:.9rem}.logout-button{background-color:var(--color-primary);color:var(--color-white);border:none;padding:.5rem 1rem;border-radius:4px;font-weight:500;cursor:pointer;transition:background-color .2s ease;font-size:.9rem}.logout-button:hover{background-color:var(--color-primary-dark)}.logout-button:active{transform:translateY(1px)}.main-content{flex:1;max-width:1200px;width:100%;margin:0 auto;padding:2rem}.footer{background-color:var(--color-primary-dark);color:var(--color-white);margin-top:auto}.footer-content{max-width:1200px;margin:0 auto;padding:1.5rem 2rem;text-align:center}.footer-content p{margin:0;font-size:.9rem}@media (max-width: 768px){.header-content{flex-direction:column;gap:1rem;padding:1rem}.nav{flex-wrap:wrap;justify-content:center;gap:.75rem}.user-section{flex-direction:column;gap:.5rem;width:100%}.logout-button{width:100%}.main-content{padding:1rem}}.agent-states-dashboard{padding:2rem;max-width:1600px;margin:0 auto;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);min-height:100vh}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem;background:#fff;padding:1.5rem 2rem;border-radius:12px;box-shadow:0 4px 6px #00000012}.dashboard-header h1{margin:0;font-size:2rem;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.last-updated{color:#6b7280;font-size:.875rem;display:flex;align-items:center;gap:.5rem}.last-updated:before{content:"🕐";font-size:1rem}.summary-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-bottom:2.5rem}.stat-card{background:#fff;border-radius:16px;padding:1.75rem;text-align:center;box-shadow:0 4px 6px #00000012;transition:all .3s ease;border:1px solid rgba(255,255,255,.8);position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#667eea,#764ba2)}.stat-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #0000001f}.stat-value{font-size:3rem;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem;line-height:1}.stat-label{font-size:.875rem;color:#6b7280;text-transform:uppercase;letter-spacing:1px;font-weight:600}.agents-by-state{margin-top:2rem}.agents-by-state h2{font-size:1.75rem;margin-bottom:1.5rem;color:#1f2937;font-weight:700}.state-group{margin-bottom:2.5rem;background:#fff;border-radius:16px;padding:1.5rem;box-shadow:0 4px 6px #00000012}.state-group h3{font-size:1.25rem;margin-bottom:1.25rem;color:#1f2937;padding-bottom:.75rem;border-bottom:2px solid #e5e7eb;font-weight:700;display:flex;align-items:center;gap:.75rem}.state-group h3:before{content:"";width:4px;height:24px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:2px}.agents-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}.agent-card{background:linear-gradient(135deg,#fff,#f9fafb);border:1px solid #e5e7eb;border-radius:12px;padding:1.25rem;box-shadow:0 2px 4px #0000000d;transition:all .3s ease;position:relative;overflow:hidden}.agent-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#667eea,#764ba2);opacity:0;transition:opacity .3s ease}.agent-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #0000001f;border-color:#667eea}.agent-card:hover:before{opacity:1}.agent-name{font-size:1.125rem;font-weight:700;margin-bottom:1rem;color:#1f2937;display:flex;align-items:center;gap:.5rem}.agent-name:before{content:"👤";font-size:1.25rem}.agent-details{margin-bottom:1rem;display:grid;gap:.625rem}.detail-item{display:flex;justify-content:space-between;align-items:center;font-size:.875rem;padding:.375rem 0}.detail-item .label{color:#6b7280;font-weight:600;font-size:.8125rem;text-transform:uppercase;letter-spacing:.5px}.detail-item .value{color:#1f2937;font-weight:500;text-align:right;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.agent-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;padding-top:1rem;border-top:1px solid #e5e7eb}.badge{padding:.375rem .75rem;border-radius:6px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;transition:all .2s ease}.badge.active{background:linear-gradient(135deg,#d4edda,#c3e6cb);color:#155724;border:1px solid #c3e6cb}.badge.acw{background:linear-gradient(135deg,#fff3cd,#ffeaa7);color:#856404;border:1px solid #ffeaa7}.badge.outbound{background:linear-gradient(135deg,#d1ecf1,#bee5eb);color:#0c5460;border:1px solid #bee5eb}.badge.contacts{background:linear-gradient(135deg,#e2e3e5,#d6d8db);color:#383d41;border:1px solid #d6d8db}.badge:hover{transform:scale(1.05)}.loading,.error,.empty-state{text-align:center;padding:4rem 2rem;color:#6b7280;background:#fff;border-radius:16px;box-shadow:0 4px 6px #00000012}.loading{font-size:1.125rem;display:flex;flex-direction:column;align-items:center;gap:1rem}.loading:before{content:"⏳";font-size:3rem;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.error{color:#dc3545}.error button{margin-top:1.5rem;padding:.75rem 1.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s ease;box-shadow:0 2px 4px #667eea4d}.error button:hover{transform:translateY(-2px);box-shadow:0 4px 8px #667eea66}.empty-state{font-size:1.125rem}.empty-state:before{content:"📭";font-size:3rem;display:block;margin-bottom:1rem}@media (max-width: 768px){.agent-states-dashboard{padding:1rem}.dashboard-header{flex-direction:column;align-items:flex-start}.summary-stats{grid-template-columns:repeat(2,1fr);gap:1rem}.agents-grid{grid-template-columns:1fr}.stat-value{font-size:2.25rem}}.abandoned-calls-by-team-dashboard{min-height:100vh;height:100vh;width:100%;background:var(--color-background);color:var(--color-text-primary);padding:clamp(.75rem,1.5vh,1.5rem);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box}.teams-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:clamp(.5rem,1vh,1rem);box-sizing:border-box;align-content:flex-start}.team-card{background:var(--color-white);border:2px solid var(--color-border);border-radius:12px;padding:clamp(1rem,2vh,2rem);box-shadow:0 2px 4px #0000001a;transition:all .2s ease;flex:1 1 calc((100% - clamp(.5rem,1vh,1rem))/2);min-width:calc((100% - clamp(.5rem,1vh,1rem))/2);max-width:calc((100% - clamp(.5rem,1vh,1rem))/2);box-sizing:border-box;display:flex;flex-direction:column;gap:clamp(.75rem,1.5vh,1.5rem)}.team-card:hover{border-color:var(--color-primary);box-shadow:0 4px 8px #00000026;transform:translateY(-2px)}.team-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:clamp(.75rem,1.5vh,1.5rem);border-bottom:2px solid var(--color-border)}.team-name{margin:0;font-size:clamp(1rem,2.5vh,2rem);font-weight:800;color:var(--color-primary);flex:1}.team-metrics{display:grid;grid-template-columns:1fr 1fr;gap:clamp(.75rem,1.5vh,1.5rem)}@media (max-width: 1024px){.team-card{flex:1 1 100%;min-width:100%;max-width:100%}}.abandoned-calls-dashboard{min-height:100vh;height:100vh;width:100%;background:var(--color-background);color:var(--color-text-primary);padding:1.5rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(.75rem,2vh,1.5rem);flex-wrap:wrap;gap:1rem;flex-shrink:0;box-sizing:border-box}.abandoned-calls-dashboard .dashboard-title,.abandoned-calls-dashboard h1,.abandoned-calls-dashboard .dashboard-header h1,.abandoned-calls-dashboard .dashboard-header .dashboard-title,.abandoned-calls-dashboard h1.dashboard-title{font-size:clamp(1.8rem,4vw,3rem);font-weight:700;margin:0;color:#489291!important}.header-info{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;font-size:.9rem}.current-date-time{font-weight:700;font-size:1rem;color:var(--color-primary-dark)!important}.refresh-info{font-size:.85rem;color:var(--color-text-secondary)!important}.metrics-container{display:flex;flex-direction:column;gap:clamp(.75rem,1.5vh,1.5rem);flex:1 1 auto;overflow:hidden;padding-right:.5rem;box-sizing:border-box;min-height:0;justify-content:space-between}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:clamp(.75rem,1.5vh,1.25rem);flex:.8 1 auto;min-height:0}.metric-card{background:var(--color-white);border:2px solid var(--color-border);border-radius:20px;padding:clamp(1.5rem,2.5vh,3rem);text-align:center;box-shadow:0 4px 6px #0000001a;transition:transform .3s ease,box-shadow .3s ease;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:0}.metric-card:hover{transform:translateY(-5px);box-shadow:0 8px 16px #00000026;border-color:var(--color-primary)}.metric-card.primary{background:var(--color-white);border-color:var(--color-primary);border-width:4px;padding:clamp(1.5rem,3vh,4rem);flex:1 1 auto;min-height:0;display:flex;flex-direction:column;justify-content:center;align-items:center}.metric-value{font-size:clamp(4rem,12vh,16rem);font-weight:800;line-height:1;margin-bottom:clamp(.5rem,1.5vh,1.5rem);color:var(--color-primary)}.metric-card.primary .metric-value{font-size:clamp(5rem,15vh,20rem)}.metric-value-large{font-size:clamp(1.5rem,5vh,5rem);font-weight:800;line-height:1;margin-bottom:.5rem;color:var(--color-primary)}.metric-card.percentage{position:relative}.percentage-bar{width:100%;height:8px;background:var(--color-accent);border-radius:4px;margin-top:1rem;overflow:hidden}.percentage-fill{height:100%;background:var(--color-primary);border-radius:4px;transition:width .5s ease}.metric-label{font-size:clamp(.875rem,2vh,2rem);font-weight:600;color:var(--color-text-primary);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:1px}.metric-card.primary .metric-label{font-size:clamp(1rem,3vh,2.5rem);margin-bottom:1rem}.metric-date{font-size:clamp(.75rem,1.8vh,1.5rem);color:var(--color-text-secondary);font-weight:400}.metric-card.primary .metric-date{font-size:clamp(.875rem,2.5vh,2rem)}.info-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:clamp(.75rem,1.5vh,1rem);flex:.5 1 auto;min-height:0}.info-card{background:var(--color-white);border:1px solid var(--color-border);border-radius:15px;padding:clamp(1rem,2vh,2rem);display:flex;align-items:center;gap:1rem;transition:all .3s ease;min-height:0}.info-card:hover{background:var(--color-accent);border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.info-icon{font-size:clamp(1.5rem,3vh,3rem);flex-shrink:0}.info-content{flex:1}.info-title{font-size:clamp(.875rem,1.5vh,1.25rem);font-weight:600;color:var(--color-text-secondary);margin-bottom:.5rem;text-transform:uppercase;letter-spacing:1px}.info-text{font-size:clamp(1rem,2vh,1.5rem);font-weight:500;color:var(--color-text-primary)}.loading,.error{text-align:center;padding:3rem;font-size:1.2rem;color:var(--color-text-secondary)}.error button:active{transform:translateY(0)}@media (min-width: 1920px){.abandoned-calls-dashboard{padding:clamp(1.5rem,2.5vh,2.5rem)}.metrics-container{gap:clamp(1rem,2vh,2rem)}.metrics-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(1rem,2vh,1.5rem)}.dashboard-title{font-size:clamp(2.5rem,4vh,4rem)}.metric-card.primary{padding:clamp(2rem,4vh,5rem)}.header-info{font-size:clamp(1rem,1.5vh,1.25rem)}.info-cards{gap:clamp(1rem,2vh,1.5rem)}}@media (max-width: 1920px) and (min-width: 1367px){.metrics-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}}@media (max-width: 768px){.abandoned-calls-dashboard{padding:1rem}.dashboard-title{font-size:clamp(1.5rem,4vw,2rem)}.metric-card.primary{padding:clamp(1.5rem,3vh,2.5rem)}.metrics-grid,.info-cards{grid-template-columns:1fr}}@media (max-width: 480px){.dashboard-header{flex-direction:column;align-items:flex-start}.header-info{align-items:flex-start}.metric-value{font-size:3rem}}.abandoned-calls-rate-dashboard{min-height:100vh;height:100vh;width:100%;background:var(--color-background);color:var(--color-text-primary);padding:clamp(.75rem,1.5vh,1.5rem);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(.75rem,1.5vh,1.5rem);padding:clamp(.75rem,1.5vh,1.5rem) clamp(1rem,2vh,2rem);background:var(--color-white);border-radius:8px;border:2px solid var(--color-border);box-shadow:0 2px 4px #0000001a;flex-wrap:wrap;gap:1rem;flex-shrink:0;box-sizing:border-box}.dashboard-title{font-size:clamp(1.5rem,3vh,3rem);font-weight:800;margin:0;color:#489291!important;letter-spacing:1px}.header-info{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;font-size:clamp(.8rem,1.4vh,1.1rem)}.current-date-time{font-weight:700;color:var(--color-primary-dark)!important}.last-updated{font-weight:500;color:var(--color-text-primary)!important}.refresh-info{font-size:clamp(.75rem,1.2vh,1rem);color:var(--color-text-secondary)!important}.departments-scroll-wrapper{flex:1 1 auto;overflow:hidden;position:relative;min-height:0;width:100%;box-sizing:border-box}.departments-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:clamp(.5rem,1vh,1rem);box-sizing:border-box;align-content:flex-start}.department-card{background:var(--color-white);border:2px solid var(--color-border);border-radius:12px;padding:clamp(1rem,2vh,2rem);box-shadow:0 2px 4px #0000001a;transition:all .2s ease;flex:1 1 calc((100% - clamp(.5rem,1vh,1rem))/2);min-width:calc((100% - clamp(.5rem,1vh,1rem))/2);max-width:calc((100% - clamp(.5rem,1vh,1rem))/2);box-sizing:border-box;display:flex;flex-direction:column;gap:clamp(.75rem,1.5vh,1.5rem)}.department-card:hover{border-color:var(--color-primary);box-shadow:0 4px 8px #00000026;transform:translateY(-2px)}.department-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:clamp(.75rem,1.5vh,1.5rem);border-bottom:2px solid var(--color-border)}.department-name{margin:0;font-size:clamp(1rem,2.5vh,2rem);font-weight:800;color:var(--color-primary);flex:1}.abandonment-rate{font-size:clamp(1.25rem,3vh,3rem);font-weight:800;padding:clamp(.5rem,1vh,1rem) clamp(1rem,2vh,2rem);border-radius:8px;border:2px solid;box-shadow:0 2px 4px #0000001a}.abandonment-rate.high{color:#dc3545;background:#dc35451a;border-color:#dc3545}.abandonment-rate.medium{color:#ffc107;background:#ffc1071a;border-color:#ffc107}.abandonment-rate.low{color:var(--color-primary);background:var(--color-accent);border-color:var(--color-primary)}.department-metrics{display:grid;grid-template-columns:1fr 1fr;gap:clamp(.75rem,1.5vh,1.5rem)}.metric-value.abandoned{color:#dc3545}.metric-value.total{color:var(--color-primary)}.percentage-bar-container{margin-top:auto}.percentage-bar{width:100%;height:clamp(8px,1.5vh,12px);background:var(--color-accent);border-radius:5px;overflow:hidden}.percentage-fill{height:100%;border-radius:5px;transition:width .3s ease}.percentage-fill.high{background:#dc3545}.percentage-fill.medium{background:#ffc107}.percentage-fill.low{background:var(--color-primary)}.loading,.error,.empty-state{text-align:center;padding:3rem 2rem;color:var(--color-text-primary);background:var(--color-white);border-radius:12px;border:2px solid var(--color-border);box-shadow:0 2px 4px #0000001a;flex:1;display:flex;align-items:center;justify-content:center}.error{color:var(--color-danger);flex-direction:column}.error button{margin-top:1rem;padding:.75rem 1.5rem;background:var(--color-primary);color:var(--color-white);border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.error button:hover{transform:translateY(-2px);box-shadow:0 5px 20px #4892914d;background:var(--color-primary-dark)}@media (max-width: 1024px){.department-card{flex:1 1 100%;min-width:100%;max-width:100%}}.active-agents-dashboard{padding:clamp(.75rem,1.5vh,1.5rem);width:100%;max-width:100%;margin:0;background:var(--color-background);min-height:100vh;height:100vh;overflow:hidden;color:var(--color-text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;display:flex;flex-direction:column;box-sizing:border-box}.active-agents-dashboard .dashboard-header .header-left h1,.active-agents-dashboard .dashboard-header h1,.active-agents-dashboard .header-left h1,.active-agents-dashboard h1{color:#489291!important}.active-agents-dashboard .header-left h1,.active-agents-dashboard h1,.active-agents-dashboard .dashboard-header h1,.active-agents-dashboard .dashboard-header .header-left h1{margin:0;font-size:clamp(1.5rem,3vh,3rem);font-weight:800;color:#489291!important;letter-spacing:1px}.last-updated{color:var(--color-text-primary);font-size:clamp(.875rem,1.5vh,1.25rem);margin-top:.25rem;font-weight:600}.teams-scroll-wrapper{flex:1 1 auto;overflow:hidden;position:relative;min-height:0;width:100%;box-sizing:border-box}.teams-container{display:flex;flex-direction:row;flex-wrap:wrap;gap:clamp(.5rem,1vh,1rem);will-change:transform;align-content:flex-start;width:100%;box-sizing:border-box}.team-section{background:var(--color-white);border-radius:8px;padding:clamp(.75rem,1.5vh,1.5rem);border:2px solid var(--color-border);box-shadow:0 2px 4px #0000001a;display:flex;flex-direction:column;flex:1 1 calc((100% - clamp(.5rem,1vh,1rem))/2);min-width:calc((100% - clamp(.5rem,1vh,1rem))/2);max-width:calc((100% - clamp(.5rem,1vh,1rem))/2);min-height:0;overflow:visible;box-sizing:border-box}.team-content{display:flex;flex-direction:column;gap:clamp(.5rem,1vh,1rem);flex:1 1 auto;min-height:0;overflow:visible}.team-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(.25rem,.5vh,.5rem);padding-bottom:clamp(.25rem,.5vh,.5rem);border-bottom:1.5px solid rgba(255,255,255,.2);flex-shrink:0}.team-header h2{margin:0;font-size:clamp(.75rem,1.5vh,1.25rem);font-weight:800;color:var(--color-primary);letter-spacing:.3px;line-height:1.1}.team-count{background:var(--color-primary);color:var(--color-white);padding:clamp(.25rem,.5vh,.5rem) clamp(.5rem,1vh,1rem);border-radius:8px;font-size:clamp(.65rem,1.3vh,1.1rem);font-weight:800;border:1.5px solid var(--color-primary-dark);box-shadow:0 1px 2px #0000001a;min-width:1.75rem;text-align:center;display:inline-flex;align-items:center;justify-content:center}.agents-grid{display:flex;flex-direction:column;gap:clamp(.3rem,.6vh,.6rem);min-height:fit-content;width:100%}.agent-card{background:var(--color-white);border:1px solid var(--color-border);border-radius:4px;padding:clamp(.5rem,1vh,1rem);transition:all .2s ease;display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;gap:clamp(.75rem,1.5vh,1.5rem);box-shadow:0 1px 2px #0000000d;min-height:fit-content}.agent-card:hover{background:var(--color-accent);border-color:var(--color-primary);transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.agent-info{display:flex;flex-direction:column;gap:clamp(.3rem,.6vh,.6rem);flex:1;min-width:0}.agent-name{font-size:clamp(.9rem,1.8vh,1.5rem);font-weight:700;color:var(--color-text-primary);line-height:1.2;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-badge{display:inline-flex;align-items:center;gap:clamp(.3rem,.6vh,.6rem);padding:clamp(.25rem,.5vh,.5rem) clamp(.5rem,1vh,1rem);border-radius:4px;font-size:clamp(.75rem,1.5vh,1.25rem);font-weight:700;width:fit-content;border-width:1.5px;box-shadow:0 1px 2px #00000026}.status-icon{font-size:clamp(.75rem,1.5vh,1.25rem)}.status-text{font-size:clamp(.7rem,1.4vh,1.2rem);text-transform:uppercase;letter-spacing:.5px;font-weight:700}.status-available{background:var(--color-accent);color:var(--color-primary-dark);border:2px solid var(--color-primary)}.status-on-call{background:var(--color-primary);color:var(--color-white);border:2px solid var(--color-primary-dark)}.status-acw{background:#fbbf2433;color:#fbbf24;border:1px solid rgba(251,191,36,.3)}.status-unavailable{background:#ef444433;color:#ef4444;border:1px solid rgba(239,68,68,.3)}.status-other{background:#9ca3af33;color:#9ca3af;border:1px solid rgba(156,163,175,.3)}.duration-item{display:flex;align-items:center;padding:clamp(.3rem,.6vh,.6rem) clamp(.5rem,1vh,1rem);background:var(--color-accent);border-radius:4px;border:1px solid var(--color-border);white-space:nowrap;overflow:visible}.duration-label{display:none}.duration-value{font-size:clamp(.8rem,1.6vh,1.3rem);font-weight:800;color:var(--color-primary);font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0;overflow:visible}.skill-section{background:var(--color-white);border-radius:6px;padding:clamp(.3rem,.6vh,.6rem);border:1px solid var(--color-border);box-shadow:0 1px 2px #0000000d;display:flex;flex-direction:column;flex-shrink:0;min-height:fit-content}.skill-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(.2rem,.5vh,.4rem);padding-bottom:clamp(.2rem,.5vh,.4rem);border-bottom:1px solid var(--color-border);flex-shrink:0}.skill-header h3{margin:0;font-size:clamp(.65rem,1.3vh,1.1rem);font-weight:700;color:var(--color-primary);text-transform:uppercase;letter-spacing:.8px;line-height:1.1}.skill-count{background:var(--color-primary);color:var(--color-white);padding:clamp(.2rem,.4vh,.4rem) clamp(.4rem,.8vh,.8rem);border-radius:8px;font-size:clamp(.55rem,1.1vh,.9rem);font-weight:800;border:1.5px solid var(--color-primary-dark);box-shadow:0 1px 2px #0000001a;min-width:1.5rem;text-align:center;display:inline-flex;align-items:center;justify-content:center}.error{color:#fca5a5}@media (min-width: 1920px){.active-agents-dashboard{padding:clamp(1.5rem,2.5vh,2.5rem)}.agents-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:clamp(.75rem,1.5vh,1.5rem)}}@media (max-width: 1366px){.agents-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.agent-name{font-size:.875rem}}@media (max-width: 1024px){.team-section{flex:1 1 100%;min-width:100%;max-width:100%}.agents-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.header-stats{gap:1rem}.header-stat-value{font-size:1.5rem}}@keyframes scrollTeams{0%,5%{transform:translateY(0)}6%,11%{transform:translateY(calc(-.1 * var(--team-height)))}12%,17%{transform:translateY(calc(-.2 * var(--team-height)))}18%,23%{transform:translateY(calc(-.3 * var(--team-height)))}24%,29%{transform:translateY(calc(-.4 * var(--team-height)))}30%,35%{transform:translateY(calc(-.5 * var(--team-height)))}36%,41%{transform:translateY(calc(-.6 * var(--team-height)))}42%,47%{transform:translateY(calc(-.7 * var(--team-height)))}48%,53%{transform:translateY(calc(-.8 * var(--team-height)))}54%,59%{transform:translateY(calc(-.9 * var(--team-height)))}60%,65%{transform:translateY(calc(-1 * var(--team-height)))}66%,71%{transform:translateY(calc(-1.1 * var(--team-height)))}72%,77%{transform:translateY(calc(-1.2 * var(--team-height)))}78%,83%{transform:translateY(calc(-1.3 * var(--team-height)))}84%,89%{transform:translateY(calc(-1.4 * var(--team-height)))}90%,95%{transform:translateY(calc(-1 * var(--scroll-distance, 0px)))}96%,to{transform:translateY(0)}}@media (max-width: 768px){.active-agents-dashboard{padding:.75rem}.dashboard-header{flex-direction:column;align-items:flex-start}.header-stats{width:100%;justify-content:space-around}.team-section{flex:0 0 calc(25% - .375rem)}}.skill-performance-dashboard{padding:clamp(.75rem,1.5vh,1.5rem);width:100%;max-width:100%;margin:0;background:var(--color-background);min-height:100vh;height:100vh;overflow:hidden;color:var(--color-text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;display:flex;flex-direction:column;box-sizing:border-box}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(.75rem,1.5vh,1.5rem);padding:clamp(.75rem,1.5vh,1.5rem) clamp(1rem,2vh,2rem);background:var(--color-white);border-radius:8px;border:2px solid var(--color-border);box-shadow:0 2px 4px #0000001a;flex-wrap:wrap;gap:clamp(.75rem,1.5vh,1.5rem);flex-shrink:0;box-sizing:border-box}.header-left h1{margin:0;font-size:clamp(1.5rem,3vh,3rem);font-weight:800;color:#489291!important;letter-spacing:1px}.header-info{display:flex;flex-direction:column;gap:.25rem;margin-top:.25rem}.time-range{color:var(--color-primary-dark);font-size:clamp(.875rem,1.5vh,1.25rem);font-weight:700}.last-updated{color:var(--color-text-primary);font-size:clamp(.8rem,1.4vh,1.1rem);font-weight:600}.header-stats{display:flex;gap:clamp(1.5rem,3vh,3rem)}.header-stat{display:flex;flex-direction:column;align-items:center;gap:.25rem}.header-stat-value{font-size:clamp(1.5rem,4vh,4rem);font-weight:800;color:var(--color-primary);letter-spacing:.5px}.header-stat-label{font-size:clamp(.75rem,1.5vh,1.25rem);color:var(--color-text-primary);text-transform:uppercase;letter-spacing:1.5px;font-weight:700}.skills-scroll-wrapper{flex:1 1 auto;overflow:hidden;position:relative;min-height:0;width:100%;box-sizing:border-box}.skills-grid{display:flex;flex-direction:row;flex-wrap:wrap;gap:clamp(.5rem,1vh,1rem);will-change:transform;align-content:flex-start;box-sizing:border-box;min-height:0;width:100%}.skill-card{background:var(--color-white);border:2px solid var(--color-border);border-radius:12px;padding:clamp(1rem,2vh,2rem);box-shadow:0 2px 4px #0000001a;transition:all .2s ease;display:flex;flex-direction:column;gap:clamp(.75rem,1.5vh,1.5rem);flex:1 1 calc((100% - clamp(.5rem,1vh,1rem))/2);min-width:calc((100% - clamp(.5rem,1vh,1rem))/2);max-width:calc((100% - clamp(.5rem,1vh,1rem))/2);min-height:0;overflow:visible;box-sizing:border-box}.skill-card:hover{border-color:var(--color-primary);box-shadow:0 4px 8px #00000026;transform:translateY(-2px)}.skill-card-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:clamp(.75rem,1.5vh,1.5rem);border-bottom:2px solid var(--color-border)}.skill-name{margin:0;font-size:clamp(1rem,2.5vh,2rem);font-weight:800;color:var(--color-primary);flex:1}.skill-agent-count{background:var(--color-primary);color:var(--color-white);padding:clamp(.5rem,1vh,1rem) clamp(1rem,2vh,2rem);border-radius:12px;font-size:clamp(.875rem,2vh,1.5rem);font-weight:800;border:2px solid var(--color-primary-dark);box-shadow:0 2px 4px #0000001a;min-width:2.5rem;text-align:center;display:inline-flex;align-items:center;justify-content:center}.skill-metrics{display:flex;flex-direction:column;gap:clamp(.75rem,1.5vh,1.5rem);flex:1 1 auto;min-height:0}.metric-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(.75rem,1.5vh,1.5rem)}.metric-item{display:flex;flex-direction:column;gap:.25rem}.metric-label{font-size:clamp(.625rem,1.2vh,1rem);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;font-weight:700}.metric-value{font-size:clamp(1.25rem,3vh,3rem);font-weight:800;font-variant-numeric:tabular-nums}.metric-value.available{color:var(--color-primary)}.metric-value.on-call{color:#dc3545}.metric-value.acw{color:#ffc107}.metric-value.unavailable{color:#6c757d}.utilization-section{margin-top:clamp(.5rem,1vh,1rem);padding-top:clamp(.75rem,1.5vh,1.5rem);border-top:1px solid var(--color-border)}.utilization-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.utilization-label{font-size:clamp(.625rem,1.2vh,1rem);color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;font-weight:700}.utilization-value{font-size:clamp(1rem,2.5vh,2.5rem);font-weight:800;font-variant-numeric:tabular-nums}.utilization-value.utilization-high{color:#dc3545}.utilization-value.utilization-medium{color:#ffc107}.utilization-value.utilization-low{color:var(--color-primary)}.utilization-bar{width:100%;height:clamp(8px,1.5vh,12px);background:var(--color-accent);border-radius:5px;overflow:hidden}.utilization-fill{height:100%;border-radius:5px;transition:width .3s ease}.utilization-fill.utilization-high{background:#dc3545}.utilization-fill.utilization-medium{background:#ffc107}.utilization-fill.utilization-low{background:var(--color-primary)}.call-details{margin-top:clamp(.75rem,1.5vh,1.5rem);padding-top:clamp(.75rem,1.5vh,1.5rem);border-top:1px solid var(--color-border);display:flex;flex-direction:column;gap:clamp(.5rem,1vh,1rem)}.call-detail-row{display:flex;justify-content:space-between;align-items:center;font-size:clamp(.75rem,1.5vh,1.25rem)}.call-detail-label{color:var(--color-text-secondary);font-weight:600}.call-detail-value{color:var(--color-text-primary);font-weight:700;font-variant-numeric:tabular-nums}.loading,.error,.empty-state{text-align:center;padding:3rem 2rem;color:var(--color-text-primary);background:var(--color-white);border-radius:12px;border:2px solid var(--color-border);box-shadow:0 2px 4px #0000001a}.error{color:var(--color-danger)}.error button{margin-top:1rem;padding:.625rem 1.25rem;background:var(--color-primary);color:var(--color-white);border:1px solid var(--color-primary-dark);border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s ease}.error button:hover{background:var(--color-primary-dark);transform:translateY(-2px)}@media (min-width: 1920px){.skill-performance-dashboard{padding:clamp(1.5rem,2.5vh,2.5rem)}.skill-card{padding:clamp(1.5rem,3vh,3rem)}}@media (max-width: 1024px){.skill-card{flex:1 1 100%;min-width:100%;max-width:100%}.header-stats{gap:clamp(1rem,2vh,2rem)}}@media (max-width: 768px){.skill-card{flex:1 1 100%;min-width:100%;max-width:100%}.header-stats{gap:clamp(1rem,2vh,2rem)}}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);padding:20px}.login-card{background:var(--color-white);border-radius:12px;box-shadow:0 10px 40px #0000001a;padding:40px;width:100%;max-width:400px;animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.login-header{text-align:center;margin-bottom:32px}.login-header h1{font-size:28px;font-weight:600;color:var(--color-text-primary);margin:0 0 8px}.login-header p{color:var(--color-text-secondary);font-size:14px;margin:0}.login-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:14px;font-weight:500;color:var(--color-text-primary)}.form-group input{padding:12px 16px;border:1px solid var(--color-border);border-radius:8px;font-size:16px;transition:border-color .2s,box-shadow .2s;background-color:var(--color-white);color:var(--color-text-primary)}.form-group input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #4892911a}.form-group input:disabled{background-color:var(--color-background);cursor:not-allowed}.error-message{background-color:#fed7d7;color:#c53030;padding:12px 16px;border-radius:8px;font-size:14px;border:1px solid #fc8181}.login-button{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);color:var(--color-white);border:none;padding:14px 24px;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;margin-top:8px}.login-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #48929166}.login-button:active:not(:disabled){transform:translateY(0)}.login-button:disabled{opacity:.6;cursor:not-allowed}.login-footer{margin-top:24px;text-align:center}.login-footer p{color:var(--color-text-secondary);font-size:12px;margin:0}.portal-home{animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hero-section{text-align:center;padding:3rem 0;margin-bottom:3rem}.hero-title{font-size:2.5rem;color:var(--color-primary-dark);margin-bottom:1rem;font-weight:700}.hero-subtitle{font-size:1.25rem;color:var(--color-text-secondary);margin:0 auto;white-space:nowrap}.quick-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-top:2rem}.action-card{background-color:var(--color-white);border:2px solid var(--color-border);border-radius:8px;padding:2rem;text-decoration:none;color:inherit;transition:all .3s ease;box-shadow:0 2px 4px #0000000d;display:flex;flex-direction:column;align-items:center;text-align:center}.action-card:hover{transform:translateY(-4px);box-shadow:0 4px 12px #48929133;border-color:var(--color-primary)}.action-card:active{transform:translateY(-2px)}.action-icon{font-size:3rem;margin-bottom:1rem}.action-card h2{color:var(--color-primary);margin-bottom:.5rem;font-size:1.5rem}.action-card p{color:var(--color-text-secondary);margin:0;font-size:1rem}@media (max-width: 768px){.hero-title{font-size:2rem}.hero-subtitle{font-size:1rem;white-space:normal}.quick-actions{grid-template-columns:1fr;gap:1.5rem}}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow-x:hidden}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--color-background);color:var(--color-text-primary)}#root{width:100%;height:100%}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}button{background-color:var(--color-primary);color:var(--color-white);border:none;padding:.75rem 1.5rem;border-radius:4px;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s ease}button:hover{background-color:var(--color-primary-dark);transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}button:active{transform:translateY(0)}button:disabled{background-color:var(--color-border);cursor:not-allowed;opacity:.6}a{color:var(--color-primary);transition:color .2s ease}a:hover{color:var(--color-primary-dark)}input,textarea,select{border:2px solid var(--color-border);border-radius:4px;padding:.75rem;font-size:1rem;transition:border-color .2s ease;background-color:var(--color-white);color:var(--color-text-primary)}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #4892911a}h1,.dashboard-header h1{color:#489291!important;background:none!important;-webkit-background-clip:unset!important;-webkit-text-fill-color:unset!important;background-clip:unset!important}:root{--color-primary: #489291;--color-primary-light: #5eafae;--color-primary-dark: #37706f;--color-accent: #badee7;--color-background: #e0f0f4;--color-white: #ffffff;--color-secondary: #5eafae;--color-success: #489291;--color-danger: #dc3545;--color-warning: #ffc107;--color-info: #5eafae;--color-light: #e0f0f4;--color-dark: #37706f;--color-black: #000000;--color-text-primary: #37706f;--color-text-secondary: #489291;--color-border: #badee7;--color-hover: #5eafae;--color-active: #37706f}