/* ================================================================
   BeautyOS — Base & Bootstrap Overrides  (base.css)
   Load AFTER tokens.css and bootstrap.min.css
   ================================================================ */

/* ── Reset ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:var(--font-b);font-size:13px;color:var(--text);background:var(--cream);line-height:1.5;-webkit-font-smoothing:antialiased;overflow:hidden;height:100vh}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-thumb{background:var(--blush-md);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--blush-dk)}

/* ── App Shell ── */
.app-shell{height:100vh;display:flex;overflow:hidden}
.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.content-area{flex:1;overflow-y:auto;padding:var(--s6)}

/* ── Typography helpers ── */
.font-display{font-family:var(--font-d)}
.font-mono{font-family:var(--font-m)}

/* ── Bootstrap overrides ── */
/* Cards */
.card{background:var(--white)!important;border:1px solid var(--border)!important;border-radius:var(--r-xl)!important;box-shadow:none!important}
.card-header{padding:14px 18px 12px!important;border-bottom:1px solid var(--border)!important;background:transparent!important;display:flex;align-items:center;justify-content:space-between;border-radius:var(--r-xl) var(--r-xl) 0 0!important}
.card-body{padding:14px 18px!important}
.card-title{font-family:var(--font-d);font-size:17px;font-weight:500;color:var(--text)}
.card-link{font-size:12px;color:var(--rose);cursor:pointer;flex-shrink:0}

/* Modals */
.modal-content{border-radius:var(--r-2xl)!important;border:none!important;background:var(--white)!important;box-shadow:var(--shadow-lg)!important}
.modal-header{border-bottom:1px solid var(--border-lt)!important;padding:18px 22px 14px!important}
.modal-title{font-family:var(--font-d)!important;font-size:22px!important;font-weight:500!important;color:var(--text)!important}
.modal-body{padding:18px 22px!important}
.modal-footer{padding:14px 22px!important;border-top:1px solid var(--border-lt)!important;gap:10px!important}

/* Form controls */
.form-control,.form-select{font-family:var(--font-b);font-size:13px;color:var(--text);background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-md);padding:9px 13px;outline:none;transition:var(--t-fast)}
.form-control:focus,.form-select:focus{border-color:var(--rose);box-shadow:var(--shadow-focus);outline:none}
.form-control::placeholder{color:var(--text-lt)}
textarea.form-control{resize:vertical;min-height:76px}
.form-label{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-lt);margin-bottom:5px;display:block}
.form-label.required::after{content:' *';color:var(--danger)}

/* Page animation */
.page{display:none}
.page.active{display:block;animation:pgIn .18s ease}
@keyframes pgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Access denied */
.access-denied{text-align:center;padding:80px 20px;color:var(--text-lt)}
.access-denied-icon{font-size:52px;margin-bottom:16px}
.access-denied-title{font-family:var(--font-d);font-size:26px;color:var(--text-md);margin-bottom:8px}