/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-x-reverse:0;--tw-border-style:solid;--tw-duration:initial}}}.block{display:block}.flex{display:flex}.hidden{display:none}.w-full{width:100%}.flex-shrink-0{flex-shrink:0}.rotate-180{rotate:180deg}.list-none{list-style-type:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}:where(.space-x-reverse>:not(:last-child)){--tw-space-x-reverse:1}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded-full{border-radius:3.40282e38px}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.text-center{text-align:center}.text-right{text-align:right}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.duration-300{--tw-duration:.3s;transition-duration:.3s}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}:root{--green-primary: #033c22;--green-secondary: #034628;--yellow: #f7dd4c;--lavender: #d8dcfd;--bg: #f4f7f5;--surface: rgba(255, 255, 255, .82);--surface-solid: #ffffff;--text: #033c22;--text-muted: #668076;--border: rgba(3, 60, 34, .1);--sidebar-width: 78px;--shadow: -10px 0 35px rgba(3, 60, 34, .08);--transition: .3s ease}html.dark{--bg: #07071c;--surface: rgba(13, 13, 39, .94);--surface-solid: #0d0d27;--text: #ffffff;--text-muted: #aaa8bd;--border: rgba(216, 220, 253, .1);--shadow: -10px 0 40px rgba(0, 0, 0, .55)}body{margin:0;padding:0}body.sidebar-open{overflow:hidden}.sidebar{position:fixed;top:0;right:0;width:var(--sidebar-width);height:100vh;padding:18px 10px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;background:var(--surface);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border-left:1px solid var(--border);box-shadow:var(--shadow);z-index:2000;overflow:hidden;transition:transform .35s cubic-bezier(.4,0,.2,1),background .3s ease,border-color .3s ease,box-shadow .3s ease}html.dark .sidebar{background:linear-gradient(180deg,#0d0d27f7,#07071cf7);border-left-color:#d8dcfd14;box-shadow:-12px 0 45px #0000008c}.sidebar-header{width:100%;min-height:70px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.sidebar-brand{width:100%;display:flex;align-items:center;justify-content:center}.animated-logo{position:relative;width:54px;height:54px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.logo-center{position:relative;width:38px;height:38px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--surface-solid);border:2px solid var(--yellow);z-index:3;box-shadow:0 5px 18px #033c2226}html.dark .logo-center{background:#07071c;border-color:var(--yellow);box-shadow:0 5px 22px #0000008c}.logo-center img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.logo-ring{position:absolute;border-radius:50%;pointer-events:none;border:1px solid var(--yellow)}.ring-one{width:47px;height:47px;animation:rotateRing 7s linear infinite}.ring-two{width:56px;height:56px;border-color:var(--lavender);animation:rotateRingReverse 11s linear infinite}html.dark .ring-one{border-color:#f7dd4cd9}html.dark .ring-two{border-color:#d8dcfd80}@keyframes rotateRing{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotateRingReverse{0%{transform:rotate(360deg)}to{transform:rotate(0)}}.sidebar .logo-info,.sidebar-title{display:none}.sidebar-menu{width:100%;margin-top:28px;display:flex;flex-direction:column;align-items:center;gap:10px;flex-shrink:0}.menu-item{position:relative;width:54px;height:54px;padding:0;box-sizing:border-box;display:flex;align-items:center;justify-content:center;border-radius:16px;color:var(--text-muted);text-decoration:none;transition:color .25s ease,background .25s ease,transform .25s ease,box-shadow .25s ease}.menu-text{display:none}.menu-icon{width:22px;height:22px;flex-shrink:0;transition:transform .3s ease,color .3s ease}.menu-item:hover{color:var(--green-primary);background:#033c2214;transform:translateY(-2px)}.menu-item:hover .menu-icon{transform:scale(1.12)}html.dark .menu-item:hover{color:var(--yellow);background:#f7dd4c12;box-shadow:0 6px 18px #00000038}.menu-item.active{color:var(--green-primary);background:linear-gradient(135deg,#f7dd4c61,#d8dcfd7a);box-shadow:0 8px 22px #033c221a}.menu-item.active .menu-icon{color:var(--green-primary)}html.dark .menu-item.active{color:var(--yellow);background:linear-gradient(135deg,#f7dd4c29,#d8dcfd14);border:1px solid rgba(247,221,76,.12);box-shadow:0 8px 25px #00000052}html.dark .menu-item.active .menu-icon{color:var(--yellow)}.menu-active-dot{display:none}.sidebar-theme{width:100%;margin-top:auto;padding-top:20px;padding-bottom:4px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.theme-switch{position:relative;width:48px;height:48px;padding:0;border:1px solid var(--border);border-radius:15px;display:flex;align-items:center;justify-content:center;cursor:pointer;background:linear-gradient(135deg,#f7dd4c40,#d8dcfd8c);color:var(--green-primary);box-shadow:0 7px 20px #033c221a;overflow:hidden}.theme-toggle-text{display:none}.theme-toggle-icon{width:25px;height:25px;display:flex;align-items:center;justify-content:center;color:var(--green-primary)}.mobile-menu-btn{display:none;position:fixed;top:14px;right:14px;width:44px;height:44px;padding:0;border:1px solid var(--border);border-radius:13px;background:var(--surface-solid);color:var(--text);align-items:center;justify-content:center;cursor:pointer;z-index:3000;box-shadow:0 8px 25px #033c221f}.hamburger-icon,.close-icon{position:absolute;width:23px;height:23px;display:flex;align-items:center;justify-content:center;transition:opacity .3s ease,transform .35s ease}.hamburger-icon{opacity:1;transform:rotate(0) scale(1)}.close-icon{opacity:0;transform:rotate(-90deg) scale(.5)}.mobile-menu-btn.open .hamburger-icon{opacity:0;transform:rotate(90deg) scale(.5)}.mobile-menu-btn.open .close-icon{opacity:1;transform:rotate(0) scale(1)}.sidebar-overlay{display:none;position:fixed;inset:0;background:#00000059;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:1900;opacity:0;pointer-events:none;transition:opacity .3s ease}.sidebar-overlay.show{opacity:1;pointer-events:auto}@media (min-width: 769px){.sidebar{transform:translate(0)}.sidebar-overlay,.mobile-menu-btn{display:none!important}}@media (max-width: 768px){.sidebar{width:72px;padding:78px 8px 14px;transform:translate(100%);box-shadow:-15px 0 45px #033c222e}.sidebar.show{transform:translate(0)}.mobile-menu-btn{display:flex;top:14px;right:14px;z-index:3000}.sidebar-overlay{display:block}.animated-logo{width:50px;height:50px}.logo-center{width:35px;height:35px}.ring-one{width:44px;height:44px}.ring-two{width:51px;height:51px}.sidebar-menu{margin-top:28px;gap:8px}.menu-item{width:50px;height:50px;border-radius:14px}.menu-icon{width:20px;height:20px}.theme-switch{width:46px;height:46px;border-radius:14px}}@media (max-width: 600px){.mobile-menu-btn{top:10px;right:10px;width:42px;height:42px;border-radius:12px}.sidebar{width:68px;padding:70px 7px 12px}.sidebar-menu{margin-top:24px;gap:7px}.menu-item{width:46px;height:46px;border-radius:13px}.menu-icon{width:19px;height:19px}.theme-switch{width:44px;height:44px;border-radius:13px}}@media (max-width: 380px){.mobile-menu-btn{top:8px;right:8px;width:40px;height:40px}.sidebar{width:64px;padding:66px 6px 10px}.sidebar-menu{margin-top:20px;gap:6px}.menu-item{width:44px;height:44px;border-radius:12px}.theme-switch{width:42px;height:42px;border-radius:12px}}.layout{min-height:100vh;width:100%;background:transparent;position:relative}.layout-content{width:calc(100% - 74px);margin-right:74px;min-height:100vh;box-sizing:border-box;transition:width .3s ease,margin-right .3s ease}@media (max-width: 768px){.layout-content{width:100%;margin-right:0;min-height:100vh;padding:0;box-sizing:border-box}}.attendance-container{position:relative;width:100%;min-height:100vh;box-sizing:border-box;padding:28px;background-color:var(--bg);background-size:cover;background-position:center;background-attachment:fixed;overflow:visible}.attendance-container:before{content:"";position:absolute;inset:0;background:#f4f7f5b8;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:0;pointer-events:none}html.dark .attendance-container:before{background:#07071ce0}.attendance-container>*{position:relative;z-index:1}.attendance-card{position:relative;z-index:20;width:100%;max-width:1100px;margin:0 auto;padding:30px;box-sizing:border-box;border-radius:30px;background:#fff3;border:1px solid rgba(255,255,255,.45);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);box-shadow:0 25px 70px #0000001a;overflow:visible}html.dark .attendance-card{background:#0c0c26d1;border:1px solid rgba(216,220,253,.1);box-shadow:0 25px 70px #0009}.header-section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;width:100%}.date-box,.time-box{min-width:0;display:flex;align-items:center;gap:14px;padding:18px;box-sizing:border-box;border-radius:20px;background:#ffffff7a;border:1px solid var(--border);transition:transform .3s ease,background .3s ease}html.dark .date-box,html.dark .time-box{background:#10102be0;border-color:#d8dcfd1a;box-shadow:inset 0 1px #ffffff06}.date-box:hover,.time-box:hover{transform:translateY(-3px)}.date-icon,.time-icon{width:43px;height:43px;padding:10px;box-sizing:border-box;flex-shrink:0;border-radius:14px;background:var(--green-primary);color:var(--yellow)}.time-icon{background:var(--yellow);color:var(--green-primary)}html.dark .date-icon{background:#102d20;color:var(--yellow)}html.dark .time-icon{background:var(--yellow);color:#07071c}.date-info,.time-info{min-width:0;display:flex;flex-direction:column;gap:4px}.date-label,.time-label{font-size:10px;color:var(--text-muted)}.date-value,.time-value{font-size:14px;font-weight:800;color:var(--text);overflow:hidden;text-overflow:ellipsis}.time-value{font-family:monospace;font-size:18px;letter-spacing:1px}.divider{width:100%;height:1px;margin:25px 0;background:linear-gradient(to left,transparent,var(--border),transparent)}.input-section{width:100%}.input-wrapper{position:relative;width:100%}.input-label{display:flex;align-items:center;gap:7px;margin-bottom:10px;font-size:12px;font-weight:700;color:var(--text)}.label-icon{width:17px;height:17px;color:var(--green-primary)}html.dark .label-icon{color:var(--yellow)}.required-star{color:#d94b4b}.name-input{width:100%;height:58px;padding:0 18px;box-sizing:border-box;border:1px solid var(--border);border-radius:17px;outline:none;background:#ffffff8c;color:var(--text);font-family:inherit;font-size:13px;cursor:pointer;transition:border .25s ease,box-shadow .25s ease,background .25s ease}html.dark .name-input{background:#0d0d29;border-color:#d8dcfd1f;color:#fff;box-shadow:inset 0 1px 2px #00000040}html.dark .name-input::-moz-placeholder{color:#777993}html.dark .name-input::placeholder{color:#777993}.name-input:hover{border-color:var(--green-primary)}html.dark .name-input:hover{border-color:#f7dd4c8c}.name-input:focus{border-color:var(--green-primary);box-shadow:0 0 0 4px #033c2214}html.dark .name-input:focus{border-color:var(--yellow);box-shadow:0 0 0 4px #f7dd4c17}.name-input.error{border-color:#d94b4b}.error-message{display:block;margin-top:7px;font-size:11px;color:#d94b4b}.custom-dropdown{position:relative;width:100%;z-index:1000}.dropdown-trigger{position:relative;width:100%;min-height:58px;padding:0 16px;box-sizing:border-box;border:1px solid rgba(3,60,34,.14);border-radius:15px;background-color:#fff;background-image:none;color:var(--text);display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-family:inherit;transition:border-color .25s ease,box-shadow .25s ease}.dropdown-trigger:hover{border-color:var(--green-primary);box-shadow:0 6px 18px #033c2214}.dropdown-trigger.open{border-color:var(--green-primary);box-shadow:0 8px 24px #033c221f}html.dark .dropdown-trigger{background-color:#07071c;background-image:none;color:#fff;border-color:#d8dcfd24;box-shadow:none}html.dark .dropdown-trigger:hover{border-color:#f7dd4c8c;box-shadow:0 5px 18px #00000059}html.dark .dropdown-trigger.open{border-color:var(--yellow);box-shadow:0 7px 22px #0006}.selected-user{min-width:0;display:flex;align-items:center;gap:11px;font-size:12px;font-weight:700;overflow:hidden}.selected-user span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selected-user-icon{width:36px;height:36px;flex-shrink:0;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--yellow),var(--lavender));color:var(--green-primary)}html.dark .selected-user-icon{background:#15152f;border:1px solid rgba(247,221,76,.18);color:var(--yellow)}.dropdown-arrow{flex-shrink:0;color:currentColor;transition:transform .3s ease}.dropdown-menu{position:absolute;top:calc(100% + 8px);right:0;left:0;width:100%;max-height:290px;overflow-y:auto;overflow-x:hidden;padding:8px;box-sizing:border-box;background-color:#fff!important;background-image:none!important;opacity:1!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;filter:none!important;isolation:isolate;border:1px solid #dfe5e1;border-radius:17px;box-shadow:0 18px 45px #0000002e;z-index:999999;animation:dropdownOpen .22s ease;mix-blend-mode:normal}html.dark .dropdown-menu{background-color:#07071c!important;background-image:none!important;opacity:1!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;filter:none!important;border:1px solid #292947;box-shadow:0 20px 55px #000c;mix-blend-mode:normal}.dropdown-menu::-webkit-scrollbar{width:6px}.dropdown-menu::-webkit-scrollbar-thumb{background:#033c2240;border-radius:10px}.dropdown-menu::-webkit-scrollbar-thumb:hover{background:#033c2266}html.dark .dropdown-menu::-webkit-scrollbar-thumb{background:#d8dcfd38}html.dark .dropdown-menu::-webkit-scrollbar-thumb:hover{background:#f7dd4c66}@keyframes dropdownOpen{0%{opacity:0;transform:translateY(-7px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.dropdown-item{width:100%;min-height:50px;padding:6px 9px;box-sizing:border-box;border:0;border-radius:13px;background-color:transparent;color:#1c2923;font-family:inherit;font-size:11px;display:flex;align-items:center;gap:10px;cursor:pointer;text-align:right;transition:background .2s ease,transform .2s ease}.dropdown-item:hover{background-color:#fff8c7;transform:translate(-2px)}.dropdown-item.selected{background-color:#eef0ff}html.dark .dropdown-item{background-color:transparent;color:#fff}html.dark .dropdown-item:hover{background-color:#17172f;color:#fff}html.dark .dropdown-item.selected{background-color:#1d1d38;color:var(--yellow)}.person-option-icon{width:35px;height:35px;flex-shrink:0;border-radius:11px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f7dd4c8c,#d8dcfda6);color:var(--green-primary)}html.dark .person-option-icon{background:#15152f;border:1px solid rgba(247,221,76,.14);color:var(--yellow)}.selected-check{margin-right:auto;color:var(--green-primary)}html.dark .selected-check{color:var(--yellow)}.buttons-section{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}.btn-checkin,.btn-checkout,.btn-rd-checkin,.btn-rd-checkout{position:relative;min-height:56px;border:0;border-radius:17px;font-family:inherit;font-size:12px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease,opacity .25s ease}.btn-checkin:hover,.btn-checkout:hover,.btn-rd-checkin:hover,.btn-rd-checkout:hover{transform:translateY(-3px)}.btn-checkin:active,.btn-checkout:active,.btn-rd-checkin:active,.btn-rd-checkout:active{transform:scale(.97)}.btn-checkin{background:var(--green-primary);color:#fff;box-shadow:0 12px 25px #033c2233}.btn-checkout{background:var(--yellow);color:var(--green-primary);box-shadow:0 12px 25px #f7dd4c33}.btn-rd-checkin{background:#d8dcfd;color:#13044a}.btn-rd-checkout{background:#13044a;color:#fff}html.dark .btn-checkin{background:#0f5a39;color:#fff;box-shadow:0 12px 28px #00000059}html.dark .btn-checkout{background:var(--yellow);color:#07071c;box-shadow:0 12px 28px #f7dd4c1a}html.dark .btn-rd-checkin{background:#d8dcfd;color:#07071c}html.dark .btn-rd-checkout{background:#161638;color:#fff;border:1px solid rgba(216,220,253,.15)}.btn-icon{width:19px;height:19px;transition:transform .3s ease}button:hover .btn-icon{transform:translateY(-2px)}button:disabled{opacity:.55;cursor:not-allowed;transform:none!important}.status-card{margin-top:18px;padding:17px 20px;box-sizing:border-box;border-radius:18px;border:1px solid var(--border);background:#ffffff73;display:flex;align-items:center;gap:13px;animation:statusAppear .4s ease}html.dark .status-card{background:#0e0e28d9;border-color:#d8dcfd1a;box-shadow:inset 0 1px #ffffff06}@keyframes statusAppear{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.status-icon{width:25px;height:25px;flex-shrink:0}.status-text{display:flex;flex-direction:column;gap:4px}.status-title{font-size:12px;font-weight:800;color:var(--text)}.status-subtitle{font-size:10px;color:var(--text-muted)}.history-section{position:relative;z-index:1;width:100%;max-width:1100px;margin:25px auto 0;box-sizing:border-box}.history-header{display:flex;align-items:center;gap:10px;margin-bottom:14px;position:relative;z-index:1}.history-header h3{margin:0;font-size:15px;color:var(--text)}.history-icon{width:22px;height:22px;flex-shrink:0;color:var(--green-primary)}html.dark .history-icon{color:var(--yellow)}.history-list{width:100%;display:flex;flex-direction:column;gap:10px;box-sizing:border-box}.history-item{position:relative;width:100%;box-sizing:border-box;display:grid;grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr);align-items:center;gap:15px;padding:17px 20px;border-radius:20px;background:#ffffff9e;border:1px solid var(--border);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);transition:transform .25s ease,box-shadow .25s ease}html.dark .history-item{background:#0c0c24e0;border-color:#d8dcfd17;box-shadow:0 8px 25px #0003}.history-item:hover{transform:translateY(-2px);box-shadow:0 12px 30px #033c2214}html.dark .history-item:hover{box-shadow:0 15px 35px #00000061}.history-name{min-width:0;font-size:13px;font-weight:800;color:var(--text);display:flex;align-items:center;gap:10px}.history-name:before{content:"";width:9px;height:9px;flex-shrink:0;border-radius:50%;background:var(--yellow);box-shadow:0 0 8px #f7dd4c40}.history-times{min-width:0;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}.checkin-badge,.checkout-badge,.rd-badge{display:inline-flex;align-items:center;gap:5px;padding:7px 10px;border-radius:10px;font-size:9px;font-weight:700;white-space:nowrap}.checkin-badge{background:#033c221a;color:var(--green-primary)}.checkout-badge{background:#f7dd4c40;color:var(--green-primary)}.rd-badge{background:#d8dcfd8c;color:#13044a}html.dark .checkin-badge{background:#0f5a3947;color:#9ee0bd;border:1px solid rgba(80,190,130,.1)}html.dark .checkout-badge{background:#f7dd4c1a;color:var(--yellow);border:1px solid rgba(247,221,76,.08)}html.dark .rd-badge{background:#d8dcfd14;color:var(--lavender);border:1px solid rgba(216,220,253,.08)}.empty-state{width:100%;box-sizing:border-box;padding:55px 20px;text-align:center;border-radius:22px;border:1px dashed var(--border);background:#ffffff59}html.dark .empty-state{background:#0a0a20b3;border-color:#d8dcfd1f}.empty-state span{display:block;margin-bottom:10px;font-size:30px;opacity:.6}.empty-state p{margin:0;color:var(--text-muted);font-size:11px}.success-toast{position:fixed;top:25px;left:50%;transform:translate(-50%);z-index:3000;min-width:280px;padding:15px 22px;border-radius:17px;background:#033c22eb;color:#fff;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 20px 50px #0003;text-align:center;font-size:12px;animation:toastIn .4s ease,toastOut .4s ease 2.5s forwards}html.dark .success-toast{background:#0f5a39f2;color:#fff;border:1px solid rgba(247,221,76,.12);box-shadow:0 20px 55px #0000008c}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,-15px)}to{opacity:1;transform:translate(-50%)}}@keyframes toastOut{to{opacity:0;transform:translate(-50%,-10px)}}@media (max-width: 900px){.attendance-container{margin-right:0;width:100%;padding:100px 25px 30px}.attendance-card,.history-section{max-width:none}}@media (max-width: 700px){.attendance-container{margin-right:0;width:100%;padding:90px 15px 25px}.attendance-card{padding:20px;border-radius:24px}.header-section,.buttons-section{grid-template-columns:1fr}.history-section{margin-top:22px}.history-item{grid-template-columns:1fr;gap:12px;padding:16px}.history-times{justify-content:flex-start}.dropdown-menu{max-height:250px}.dropdown-item{min-height:48px}}@media (max-width: 480px){.attendance-container{margin-right:0;width:100%;padding:82px 10px 20px}.attendance-card{padding:15px;border-radius:20px}.date-box,.time-box{padding:14px}.date-icon,.time-icon{width:38px;height:38px;padding:9px}.date-value{font-size:12px}.time-value{font-size:16px}.name-input,.dropdown-trigger{min-height:52px}.history-item{padding:14px}.history-name{font-size:12px}.history-times{flex-direction:column;align-items:stretch}.checkin-badge,.checkout-badge,.rd-badge{justify-content:center}.success-toast{min-width:unset;width:calc(100% - 30px);top:80px}}@media (max-width: 360px){.attendance-container{margin-right:0;width:100%;padding:78px 8px 18px}.attendance-card{padding:12px}.date-box,.time-box{gap:10px;padding:12px}.date-icon,.time-icon{width:35px;height:35px;padding:8px}.selected-user-icon{width:32px;height:32px}.dropdown-trigger{padding:0 12px}}.phonebook-page{--cream: #e6cca7;--soft-blue: #bfd2ec;--burgundy: #3b0000;--page-bg: #f5f0e8;--card-bg: rgba(255, 255, 255, .68);--card-bg-strong: rgba(255, 255, 255, .86);--input-bg: rgba(255, 255, 255, .58);--text: #30251e;--text-muted: #756b63;--border: rgba(59, 0, 0, .1);--shadow: 0 20px 55px rgba(59, 0, 0, .08);--shadow-small: 0 10px 30px rgba(59, 0, 0, .07);--dropdown-bg: rgba(255, 255, 255, .98);width:100%;min-height:100vh;box-sizing:border-box;padding:28px;position:relative;direction:rtl;overflow-x:hidden;color:var(--text);isolation:isolate;font-family:inherit}.phonebook-page:before{content:"";position:absolute;inset:0;z-index:-2;background-image:linear-gradient(135deg,#e6cca7b8,#bfd2ecb8),url(/assets/shegerd-DTF9r9nU.png);background-size:cover;background-position:center;background-repeat:no-repeat;transform:scale(1.02);pointer-events:none}.phonebook-page:after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 85% 15%,rgba(230,204,167,.32),transparent 32%),radial-gradient(circle at 15% 80%,rgba(191,210,236,.28),transparent 35%);pointer-events:none}.phonebook-page>*{position:relative;z-index:2}html.dark .phonebook-page{--page-bg: #07071c;--card-bg: rgba(7, 7, 28, .72);--card-bg-strong: rgba(7, 7, 28, .88);--input-bg: rgba(7, 7, 28, .7);--text: #f4eee5;--text-muted: #aaa6b7;--border: rgba(230, 204, 167, .13);--dropdown-bg: #07071c;--shadow: 0 24px 65px rgba(0, 0, 0, .48);--shadow-small: 0 12px 35px rgba(0, 0, 0, .35)}html.dark .phonebook-page:before{background-image:linear-gradient(135deg,#07071cf0,#07071ce0),url(/assets/shegerd-DTF9r9nU.png)}html.dark .phonebook-page:after{background:radial-gradient(circle at 85% 15%,rgba(230,204,167,.08),transparent 30%),radial-gradient(circle at 15% 80%,rgba(191,210,236,.07),transparent 35%)}.page-header{width:100%;max-width:1100px;min-height:88px;margin:0 auto 20px;padding:20px 24px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:20px;border-radius:24px;background:var(--card-bg-strong);border:1px solid var(--border);backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%);box-shadow:var(--shadow)}.page-header-content{display:flex;align-items:center;gap:14px;min-width:0}.page-header-icon{width:48px;height:48px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:14px;background:linear-gradient(135deg,var(--cream),var(--soft-blue));color:var(--burgundy);box-shadow:0 8px 20px #3b000014}.page-header h1{margin:0 0 5px;color:var(--text);font-size:24px;font-weight:900}.page-header p{margin:0;color:var(--text-muted);font-size:12px}.contact-count{display:flex;align-items:center;gap:10px;padding:9px 13px;border-radius:12px;background:#3b00000d;color:var(--text-muted);font-size:10px;white-space:nowrap}.contact-count strong{min-width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:var(--burgundy);color:#fff;font-size:11px}html.dark .contact-count{background:#e6cca712}html.dark .contact-count strong{background:var(--cream);color:var(--burgundy)}.toolbar{width:100%;max-width:1100px;margin:0 auto 18px;display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:12px;position:relative;z-index:100}.search-box{min-height:56px;padding:0 16px;box-sizing:border-box;display:flex;align-items:center;gap:10px;border-radius:16px;background:var(--card-bg-strong);border:1px solid var(--border);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transition:border-color .2s ease,box-shadow .2s ease}.search-box>svg{flex-shrink:0;color:var(--burgundy)}.search-box:focus-within{border-color:var(--burgundy);box-shadow:0 0 0 4px #3b00000f}.search-box input{width:100%;height:54px;min-width:0;padding:0;border:0;outline:none;background:transparent;color:var(--text);font-family:inherit;font-size:12px}.search-box input::-moz-placeholder{color:var(--text-muted)}.search-box input::placeholder{color:var(--text-muted)}.clear-search{width:28px;height:28px;flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:8px;background:#3b00000f;color:var(--text-muted);cursor:pointer}.clear-search:hover{background:#3b00001f;color:var(--burgundy)}html.dark .search-box>svg{color:var(--cream)}html.dark .search-box:focus-within{border-color:var(--cream);box-shadow:0 0 0 4px #e6cca712}html.dark .clear-search{background:#e6cca714;color:var(--text-muted)}.custom-dropdown{width:100%;min-width:0;position:relative;z-index:100}.custom-dropdown.dropdown-is-open{z-index:99999}.dropdown-trigger{width:100%;min-height:56px;padding:6px 13px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--border);outline:none;border-radius:16px;background:var(--card-bg-strong);color:var(--text);cursor:pointer;font-family:inherit;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.dropdown-trigger:hover,.dropdown-trigger.open{border-color:var(--burgundy);box-shadow:0 8px 24px #3b000014}.dropdown-trigger:disabled{opacity:.65;cursor:not-allowed}.selected-user{min-width:0;display:flex;align-items:center;gap:9px}.selected-user-icon{width:34px;height:34px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:10px;background:linear-gradient(135deg,var(--cream),var(--soft-blue));color:var(--burgundy)}.selected-user-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:750}.dropdown-arrow{flex-shrink:0;color:var(--burgundy);transition:transform .22s ease}.dropdown-trigger.open .dropdown-arrow{transform:rotate(180deg)}html.dark .dropdown-trigger{background:#07071cd6}html.dark .dropdown-trigger:hover,html.dark .dropdown-trigger.open{border-color:var(--cream);box-shadow:0 8px 25px #0006}html.dark .selected-user-icon{background:linear-gradient(135deg,#e6cca729,#bfd2ec1a);color:var(--cream);border:1px solid rgba(230,204,167,.1)}html.dark .dropdown-arrow{color:var(--cream)}.dropdown-menu{position:absolute;top:calc(100% + 7px);right:0;width:100%;max-height:280px;padding:6px;box-sizing:border-box;overflow-y:auto;border-radius:16px;background:var(--dropdown-bg);border:1px solid var(--border);box-shadow:0 22px 50px #3b00002e;z-index:100000;animation:dropdownFadeIn .16s ease both}@keyframes dropdownFadeIn{0%{opacity:0}to{opacity:1}}.dropdown-empty{padding:20px;text-align:center;color:var(--text-muted);font-size:11px}.dropdown-item{width:100%;min-height:48px;padding:6px 8px;box-sizing:border-box;display:flex;align-items:center;gap:10px;border:0;outline:none;border-radius:11px;background:linear-gradient(135deg,#e6cca73d,#bfd2ec47);color:var(--text);font-family:inherit;font-size:11px;font-weight:650;cursor:pointer;text-align:right;transition:background .18s ease,transform .18s ease}.dropdown-item:hover{background:linear-gradient(135deg,#e6cca77a,#bfd2ec8c);transform:translate(-2px)}.dropdown-item.selected{background:linear-gradient(135deg,#e6cca799,#bfd2ecad);font-weight:800}.person-option-icon{width:32px;height:32px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:9px;background:linear-gradient(135deg,#e6cca7ad,#bfd2ecbf);color:var(--burgundy)}.dropdown-item-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.selected-check{margin-right:auto;flex-shrink:0;color:var(--burgundy)}html.dark .dropdown-menu{background:#07071c;border-color:#e6cca724;box-shadow:0 25px 55px #0009}html.dark .dropdown-item:hover{background:#e6cca717}html.dark .dropdown-item.selected{background:#bfd2ec17}html.dark .person-option-icon{background:#e6cca71a;color:var(--cream);border:1px solid rgba(230,204,167,.08)}html.dark .selected-check{color:var(--cream)}.dropdown-menu::-webkit-scrollbar{width:5px}.dropdown-menu::-webkit-scrollbar-track{background:transparent}.dropdown-menu::-webkit-scrollbar-thumb{background:#3b000033;border-radius:10px}html.dark .dropdown-menu::-webkit-scrollbar-thumb{background:#e6cca733}.contact-form{width:100%;max-width:1100px;margin:0 auto 20px;padding:20px;box-sizing:border-box;position:relative;z-index:50;border-radius:24px;background:var(--card-bg);border:1px solid var(--border);backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%);box-shadow:var(--shadow)}.contact-form.editing{border-color:#3b000040}.edit-indicator{display:inline-flex;align-items:center;gap:7px;margin-bottom:12px;padding:7px 10px;border-radius:9px;background:#bfd2ec4d;color:var(--burgundy);font-size:10px;font-weight:750}html.dark .edit-indicator{background:#e6cca714;color:var(--cream)}.contact-form-grid{width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) auto;align-items:center;gap:11px}.input-group{min-width:0;min-height:56px;padding:0 14px;box-sizing:border-box;display:flex;align-items:center;gap:10px;border-radius:16px;background:var(--input-bg);border:1px solid var(--border);transition:border-color .2s ease,box-shadow .2s ease}.input-group:focus-within{border-color:var(--burgundy);box-shadow:0 0 0 4px #3b00000e}.input-group>svg{flex-shrink:0;color:var(--burgundy)}.input-group input{width:100%;height:54px;min-width:0;padding:0;border:0;outline:none;background:transparent;color:var(--text);font-family:inherit;font-size:12px}.input-group input::-moz-placeholder{color:var(--text-muted)}.input-group input::placeholder{color:var(--text-muted)}html.dark .input-group{background:#07071cb8}html.dark .input-group>svg{color:var(--cream)}html.dark .input-group:focus-within{border-color:var(--cream);box-shadow:0 0 0 4px #e6cca70f}.form-role-dropdown{min-width:0;z-index:100}.form-role-dropdown.dropdown-is-open{z-index:100000}.form-actions{display:flex;align-items:center;gap:9px}.submit-btn,.cancel-btn{min-height:56px;padding:0 19px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;border-radius:16px;font-family:inherit;font-size:11px;font-weight:800;cursor:pointer;white-space:nowrap;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.submit-btn{min-width:130px;background:var(--burgundy);color:#fff;box-shadow:0 12px 25px #3b00002e}.submit-btn:hover{transform:translateY(-2px);box-shadow:0 16px 30px #3b00003b}.submit-btn:active{transform:scale(.97)}.submit-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}.cancel-btn{background:#3b00001a;color:var(--burgundy)}.cancel-btn:hover{transform:translateY(-2px);background:#3b00002b}.cancel-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}html.dark .cancel-btn{background:#e6cca717;color:var(--cream)}html.dark .cancel-btn:hover{background:#e6cca726}.contacts-list-wrapper{width:100%;max-width:1100px;min-height:150px;margin:0 auto;padding:12px;box-sizing:border-box;position:relative;z-index:1;border-radius:24px;background:var(--card-bg);border:1px solid var(--border);backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%);box-shadow:var(--shadow)}.contacts-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.contact-card{min-width:0;padding:17px;box-sizing:border-box;border-radius:18px;background:#ffffff80;border:1px solid rgba(59,0,0,.06);transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease}.contact-card:hover{transform:translateY(-3px);background:#ffffffb8;border-color:#3b00001a;box-shadow:0 12px 28px #3b000014}.contact-card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.contact-person{min-width:0;display:flex;align-items:center;gap:11px}.contact-avatar{width:43px;height:43px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:13px;background:linear-gradient(135deg,var(--cream),var(--soft-blue));color:var(--burgundy)}.contact-name-wrapper{min-width:0}.contact-name{margin:0 0 6px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--text);font-size:13px;font-weight:850}.contact-role{display:inline-flex;align-items:center;max-width:180px;padding:5px 9px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border-radius:8px;background:linear-gradient(135deg,#e6cca76b,#bfd2ec73);color:var(--burgundy);font-size:9px;font-weight:800}.contact-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}.contact-action{width:35px;height:35px;padding:0;display:flex;align-items:center;justify-content:center;border:0;border-radius:10px;cursor:pointer;transition:transform .18s ease,background .18s ease}.contact-action:hover{transform:translateY(-2px)}.contact-action:active{transform:scale(.94)}.contact-action:disabled{opacity:.5;cursor:not-allowed;transform:none}.contact-action.edit{background:#bfd2ec8c;color:#29466b}.contact-action.edit:hover{background:#bfd2ecd1}.contact-action.delete{background:#3b000014;color:var(--burgundy)}.contact-action.delete:hover{background:#3b000026}html.dark .contact-card{background:#07071c9e;border-color:#e6cca712}html.dark .contact-card:hover{background:#07071cd1;border-color:#e6cca71f;box-shadow:0 14px 35px #0000004d}html.dark .contact-avatar{background:linear-gradient(135deg,#e6cca729,#bfd2ec1a);color:var(--cream);border:1px solid rgba(230,204,167,.08)}html.dark .contact-role{background:#e6cca714;color:var(--cream);border:1px solid rgba(230,204,167,.09)}html.dark .contact-action.edit{background:#bfd2ec1a;color:var(--soft-blue)}html.dark .contact-action.delete{background:#e6cca714;color:var(--cream)}.contact-divider{width:100%;height:1px;margin:14px 0;background:#3b000012}html.dark .contact-divider{background:#e6cca714}.contact-phone-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.contact-phone-info{min-width:0;display:flex;align-items:center;gap:10px}.phone-icon{width:34px;height:34px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#3b00000f;color:var(--burgundy)}.phone-text{min-width:0;display:flex;flex-direction:column;gap:3px}.phone-label{color:var(--text-muted);font-size:9px;font-weight:650}.phone-number{direction:ltr;text-align:right;color:var(--text);font-size:12px;font-weight:800;letter-spacing:.2px}.copy-phone-btn{min-height:35px;padding:0 10px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:10px;background:#3b000012;color:var(--burgundy);font-family:inherit;font-size:10px;font-weight:750;cursor:pointer;transition:transform .18s ease,background .18s ease}.copy-phone-btn:hover{transform:translateY(-2px);background:#3b000021}html.dark .phone-icon,html.dark .copy-phone-btn{background:#e6cca714;color:var(--cream)}html.dark .copy-phone-btn:hover{background:#e6cca724}.contacts-loading{min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;color:var(--text-muted);font-size:11px}.loading-spinner{width:30px;height:30px;border-radius:50%;border:3px solid rgba(59,0,0,.1);border-top-color:var(--burgundy);animation:phonebookSpin .8s linear infinite}@keyframes phonebookSpin{to{transform:rotate(360deg)}}html.dark .loading-spinner{border-color:#e6cca71a;border-top-color:var(--cream)}.contacts-empty{min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.empty-icon{width:65px;height:65px;margin-bottom:14px;display:flex;align-items:center;justify-content:center;border-radius:20px;background:linear-gradient(135deg,#e6cca766,#bfd2ec73);color:var(--burgundy)}.contacts-empty h3{margin:0 0 7px;color:var(--text);font-size:14px;font-weight:850}.contacts-empty p{max-width:380px;margin:0;color:var(--text-muted);font-size:10px;line-height:1.8}html.dark .empty-icon{background:#e6cca714;color:var(--cream);border:1px solid rgba(230,204,167,.08)}.phonebook-toast{position:fixed;top:24px;left:50%;transform:translate(-50%);z-index:999999;min-width:280px;max-width:calc(100vw - 30px);padding:13px 15px;box-sizing:border-box;border-radius:15px;color:#fff;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 20px 50px #00000040;animation:phonebookToastIn .3s ease}.phonebook-toast.success{background:#3b0000f0}.phonebook-toast.error{background:#521919f5}.phonebook-toast-content{display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;font-weight:750}.toast-close{width:25px;height:25px;margin-right:5px;padding:0;display:flex;align-items:center;justify-content:center;border:0;border-radius:7px;background:#ffffff1a;color:#fff;cursor:pointer}.toast-close:hover{background:#ffffff2e}@keyframes phonebookToastIn{0%{opacity:0;transform:translate(-50%,-15px)}to{opacity:1;transform:translate(-50%)}}button:focus-visible,input:focus-visible{outline:2px solid var(--burgundy);outline-offset:2px}html.dark button:focus-visible,html.dark input:focus-visible{outline-color:var(--cream)}@media (max-width: 1000px){.contact-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.form-actions{grid-column:1 / -1;justify-content:flex-start}}@media (max-width: 900px){.phonebook-page{padding:95px 24px 30px;margin-right:80px}.toolbar{grid-template-columns:minmax(0,1fr) 220px}.contacts-list{grid-template-columns:1fr}}@media (max-width: 700px){.phonebook-page{width:100%;margin-right:0;padding:82px 12px 25px}.page-header{flex-direction:column;align-items:stretch;padding:18px;border-radius:21px}.page-header h1{font-size:20px}.contact-count{justify-content:space-between}.toolbar{grid-template-columns:1fr;gap:10px}.contact-form{padding:16px;border-radius:21px}.contact-form-grid{grid-template-columns:1fr}.form-actions{grid-column:auto;width:100%;flex-direction:row}.submit-btn,.cancel-btn{flex:1}.contacts-list-wrapper{padding:8px;border-radius:21px}}@media (max-width: 480px){.phonebook-page{padding:78px 10px 20px}.page-header{padding:15px;border-radius:18px}.page-header-icon{width:43px;height:43px}.page-header h1{font-size:18px}.page-header p{font-size:10px}.search-box,.dropdown-trigger,.input-group{min-height:52px;border-radius:14px}.search-box input{height:50px;font-size:11px}.selected-user-icon{width:32px;height:32px}.selected-user-text{font-size:10px}.dropdown-menu{max-height:240px;border-radius:14px}.dropdown-item{min-height:45px;font-size:10px}.person-option-icon{width:30px;height:30px}.contact-form{padding:12px;border-radius:18px}.form-actions{flex-direction:column;align-items:stretch}.submit-btn,.cancel-btn{width:100%;min-height:52px}.contact-card{padding:14px;border-radius:16px}.contact-name{font-size:12px}.contact-role{max-width:130px}.contact-phone-row{align-items:stretch;flex-direction:column}.copy-phone-btn{width:100%}.phonebook-toast{width:calc(100% - 30px);min-width:unset;top:70px}}@media (max-width: 360px){.phonebook-page{padding:75px 8px 15px}.page-header{padding:13px}.page-header h1{font-size:16px}.contact-form{padding:9px}.contact-card{padding:12px}.contact-avatar{width:39px;height:39px}.contact-action,.phone-icon{width:32px;height:32px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.contact-form button[type=submit]{min-width:130px;min-height:56px;padding:0 22px;display:flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:16px;background:var(--burgundy);color:#fff;font-family:inherit;font-size:12px;font-weight:800;cursor:pointer;box-shadow:0 12px 25px #3b00002e;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}.contact-form button[type=submit]:hover{transform:translateY(-2px);box-shadow:0 16px 30px #3b00003b;background:#4d0808}.contact-form button[type=submit]:active{transform:scale(.97)}.contact-form button[type=submit]:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:0 8px 18px #3b00001a}.form-actions{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px}.form-actions:not(:has(button+button)){justify-content:center}.form-actions:has(button+button){justify-content:center}