@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
:root{--msbeau-text:#a2647e;--msbeau-top:#f9e9f0;--msbeau-border:#ddaec2;--msbeau-button:#c98da4;--msbeau-page:#fbf6f8}
body,button,input,select,textarea,.content-wrapper,.main-footer{font-family:Inter,Arial,sans-serif!important;font-size:14px;color:var(--msbeau-text)!important}
body :is(h1,h2,h3,h4,h5,h6,p,label,span,small,strong,b,td,th,a,button,input,select,textarea,i,div,li),a:visited,a:hover,a:active,input::placeholder{color:var(--msbeau-text)!important}
.main-header{background:var(--msbeau-top)!important;border-bottom:1px solid var(--msbeau-border)!important;min-height:76px}
.main-sidebar,.main-sidebar .sidebar,.brand-link,.main-footer{background:#ffffff!important;box-shadow:none!important}
.main-sidebar{width:220px;border-right:1px solid #e8e3e7}
.main-sidebar .brand-link{width:220px;font-size:18px;font-weight:600!important;border-bottom:1px solid var(--msbeau-border)!important;min-height:76px;display:flex;align-items:center;gap:8px;white-space:normal}
.msbeau-brand-mark,.msbeau-login-mark{display:inline-flex;align-items:center;justify-content:center;background:var(--msbeau-top);border-radius:12px;width:42px;height:42px;flex-shrink:0}
.brand-text{font-size:16px;font-weight:600!important}
.main-sidebar .nav-link{border-radius:8px!important;font-size:14px;padding:11px 12px}
.main-sidebar .nav-link:hover,.main-sidebar .nav-link.active,.main-sidebar .menu-open>.nav-link{background:var(--msbeau-top)!important;box-shadow:none!important}
.main-sidebar .nav-treeview{background:#ffffff!important;padding-left:14px}
.main-sidebar .nav-treeview .nav-link{font-size:13px}
.main-sidebar .nav-treeview .nav-icon{font-size:6px!important;width:12px!important}
.msbeau-colored-icon{font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif!important;font-size:17px!important}
.content-wrapper,.login-page,.register-page{background:var(--msbeau-page)!important}
.content-header h1{font-size:23px;font-weight:600}
.content-wrapper>.content{padding:16px 26px}
.card{border:1px solid #e8e3e7!important;border-radius:12px!important;box-shadow:none!important;background:#ffffff!important}
.card-header,.card-body,.login-card-body{background:#ffffff!important}
.card-title{font-size:16px;font-weight:600}
.btn:not(.btn-link),.page-item.active .page-link{background:var(--msbeau-button)!important;border-color:var(--msbeau-button)!important;color:var(--msbeau-text)!important;border-radius:8px;min-height:38px}
.btn:hover{background:var(--msbeau-top)!important}
.form-control,.custom-select,.select2-selection{border:1px solid #d7d0d8!important;border-radius:8px!important;min-height:44px;background:#ffffff!important}
.form-control:focus,.btn:focus,a:focus-visible{outline:2px solid var(--msbeau-border);outline-offset:2px;box-shadow:none!important}
.table{font-size:13px}.table th{font-weight:500;background:#faf9fb!important}.table td,.table th{border-color:#e8e3e7!important}
.badge,.bg-primary,.bg-success,.bg-danger,.bg-warning,.bg-info,.bg-secondary,.user-header{background:var(--msbeau-top)!important;color:var(--msbeau-text)!important}
.nav-tabs .nav-link.active,.nav-pills .nav-link.active{background:var(--msbeau-top)!important;border-color:var(--msbeau-border)!important}
.main-footer{font-size:12px;border-top:1px solid #e8e3e7!important;padding:16px 22px}
.main-footer a,.main-footer a:visited,.main-footer a:hover,.main-footer a strong{color:#a2647e!important}
.login-box{width:360px;max-width:calc(100% - 32px)}.login-logo a{display:flex;align-items:center;justify-content:center;gap:12px;font-size:23px}.login-card-body{border-radius:12px;padding:30px}.login-page>.main-footer{margin:24px 0 0;width:100%;text-align:center;background:transparent!important}.login-page>.main-footer .float-right{float:none!important;display:block;margin-top:8px}
@media(min-width:768px){body:not(.sidebar-collapse) .content-wrapper,body:not(.sidebar-collapse) .main-header,body:not(.sidebar-collapse) .main-footer{margin-left:220px}}
@media(max-width:767.98px){.content-wrapper>.content{padding:16px}.main-footer .float-right{float:none!important;display:block;margin-top:8px}}

/* MS Beau shell update: centered circular logo, full-width header, steady sidebar. */
.msbeau-logo{position:relative;display:inline-block;flex:0 0 auto;width:44px;height:44px;border-radius:50%;overflow:hidden;vertical-align:middle;background:var(--msbeau-top)}
.msbeau-logo img{position:absolute;width:147.53%!important;max-width:none!important;height:auto!important;left:50%;top:50%;transform:translate(-50%,-39.872%);border-radius:0!important}
.login-logo .msbeau-logo{width:70px;height:70px}
body:not(.login-page) .wrapper{padding-top:76px}
body .main-header{position:fixed;top:0;left:0;right:0;height:76px;width:100%;margin-left:0!important;z-index:1040;padding:8px 20px}
.msbeau-header-brand{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:600;text-decoration:none!important}
body .main-sidebar{position:fixed;top:76px;bottom:0;left:0;height:calc(100vh - 76px);width:220px!important;margin-left:0!important;transform:none!important;z-index:1030}
.main-sidebar>.brand-link{display:none!important}
.main-sidebar .sidebar{height:100%;overflow-y:auto;padding-top:4px}
body:not(.login-page) .content-wrapper,body:not(.login-page) .main-footer{margin-left:220px!important}
body.login-page{min-height:100vh;height:auto;overflow-x:hidden;justify-content:center;padding:32px 16px}
body.login-page>.main-footer{margin:24px 0 0!important;width:100%;max-width:100%;padding:12px 0;border-top:0!important;background:transparent!important;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;flex-shrink:0}
body.login-page>.main-footer .float-right{float:none!important;display:block;margin-top:8px}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-text-fill-color:#a2647e!important;caret-color:#a2647e;box-shadow:0 0 0 1000px #fff inset!important}
@media(max-width:767.98px){body .main-header{padding:8px 12px}.msbeau-header-brand{gap:8px;font-size:14px}.msbeau-header-brand .msbeau-logo{width:38px;height:38px}body .main-sidebar{width:180px!important}body:not(.login-page) .content-wrapper,body:not(.login-page) .main-footer{margin-left:180px!important}.main-sidebar .nav-link{padding:10px 8px}.main-sidebar .info{white-space:normal}}

/* MS Beau layout update: center the entire login group and give titles breathing room. */
body.login-page{display:grid!important;place-items:center!important;min-height:100vh;min-height:100dvh;height:auto!important;padding:32px 16px!important;box-sizing:border-box}
.msbeau-login-shell{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}
.msbeau-login-shell .login-box{margin:0!important;flex:none}
body.login-page .msbeau-login-shell>.main-footer{margin:24px 0 0!important;width:100%;padding:12px 0;border:0!important;background:transparent!important;display:flex;flex-direction:column;align-items:center;text-align:center;flex:none}
body.login-page .msbeau-login-shell>.main-footer .float-right{float:none!important;display:block;margin-top:8px}
body:not(.login-page) .content-header{padding:32px 26px 8px!important}
body:not(.login-page) .content-header h1{color:var(--msbeau-text)!important;margin:0!important;line-height:1.4}

/* Fit complete navigation labels inside the fixed sidebar. */
.main-sidebar .nav-sidebar,.main-sidebar .nav-sidebar>.nav-item,.main-sidebar .nav-treeview,.main-sidebar .nav-treeview>.nav-item{width:100%!important;min-width:0;box-sizing:border-box}
.main-sidebar .nav-link{display:flex!important;align-items:flex-start;gap:6px;width:100%!important;box-sizing:border-box;white-space:normal!important}
.main-sidebar .nav-link>.nav-icon{flex:0 0 20px;margin-top:3px;margin-right:0!important}
.main-sidebar .nav-link>p{display:block!important;flex:1;min-width:0;width:auto!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere;line-height:1.45;margin:0!important;padding-right:18px;position:relative}
.main-sidebar .nav-link>p>.right{position:absolute!important;right:0!important;top:3px!important}
.main-sidebar .nav-treeview{padding-left:8px!important}
.main-sidebar .nav-treeview .nav-link{font-size:13px!important;padding:10px 8px!important}
.main-sidebar .nav-treeview .nav-link>.nav-icon{flex-basis:12px}
.main-sidebar .sidebar{overflow-x:hidden!important}
.content-header h1{white-space:normal!important;overflow-wrap:anywhere}
#holidayCalendar .fc-title{white-space:normal!important;overflow-wrap:anywhere}
#holidayCalendar .fc-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
#holidayCalendar .fc-toolbar h2{font-size:20px!important}

/* Explicit viewport height keeps the complete login group centered. */
html:has(body.login-page){min-height:100%!important}
body.login-page{height:auto!important;min-height:100vh!important;min-height:100dvh!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;padding:0 16px!important}
body.login-page .msbeau-login-shell{min-height:100vh!important;min-height:100dvh!important;box-sizing:border-box;padding:32px 0;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;width:100%}
.msbeau-calendar-panel{width:100%;max-width:720px}
#holidayCalendar .fc-today{background:#f9e9f0!important}
