/* Buttons, inputs */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.55rem .85rem;border-radius:8px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-fg);cursor:pointer}
.btn--primary{background:var(--color-primary);color:#fff;border-color:transparent}.btn--primary:hover{background:var(--color-primary-600)}
.btn--danger{background:#dc2626;color:#fff;border-color:transparent}
.input{display:block;padding:.55rem .7rem;max-width:420px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-bg);color:var(--color-fg)}
.select{display:block;padding:.55rem .7rem;max-width:260px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-bg);color:var(--color-fg)}
.label{font-size:.9rem;color:var(--color-muted)}
.role-badge{display:inline-block;padding:.2rem .5rem;border-radius:999px;border:1px solid var(--color-border);font-size:.75rem;color:var(--color-muted)}
.header .role-badge{border-color:color-mix(in srgb,var(--header-fg) 28%, transparent);color:var(--header-fg);background:color-mix(in srgb,var(--header-fg) 12%, transparent)}

/* Table */
.table-wrap{overflow-x:auto}
.table{width:100%;border-collapse:separate;border-spacing:0;min-width:860px}
.table th,.table td{border-bottom:1px solid var(--color-border);padding:.6rem .5rem;text-align:left}
.table th{font-size:.9rem;color:var(--color-muted);text-transform:uppercase;letter-spacing:.04em}
.table tr:hover{background:color-mix(in srgb,var(--color-primary) 10%, transparent)}

/* Sidebar */
.sidebar__top{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.sidebar__brand{display:flex;align-items:center;gap:.5rem;min-width:0}
.sidebar__brand-text{font-weight:700;white-space:nowrap;color:var(--sidebar-fg)}
.sidebar__logo{width:38px;height:38px;object-fit:contain;border-radius:50%;background:#fff;border:1px solid var(--color-border)}
.sidebar__collapse-btn{border-color:color-mix(in srgb,var(--sidebar-fg) 26%, transparent);background:color-mix(in srgb,var(--sidebar-fg) 12%, transparent);color:var(--sidebar-fg);padding:.4rem .55rem;font-size:.78rem}
.sidebar__collapse-btn:hover{background:color-mix(in srgb,var(--sidebar-fg) 20%, transparent)}
.sidebar__section{margin-top:1rem}
.sidebar__section-title{font-size:.85rem;color:var(--sidebar-muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.25rem}
.sidebar__section-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.5rem;background:transparent;border:0;padding:.2rem 0;margin-bottom:.25rem;cursor:pointer;text-align:left}
.sidebar__section-toggle::after{content:'▾';font-size:.82rem;color:var(--sidebar-muted);transition:transform .15s ease}
.sidebar__section.is-collapsed .sidebar__section-toggle::after{transform:rotate(-90deg)}
.sidebar__section.is-collapsed .sidebar__nav{display:none}
.sidebar__nav{display:flex;flex-direction:column;gap:.25rem}
.sidebar__nav-link{display:flex;align-items:center;gap:.5rem;padding:.5rem .6rem;border-radius:8px;color:var(--sidebar-fg)}
.sidebar__nav-link:hover{background:var(--sidebar-hover)}
.sidebar__nav-link.is-active{background:var(--sidebar-active);color:#fff}
.sidebar__item-icon{width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:color-mix(in srgb,var(--sidebar-fg) 18%, transparent);border:1px solid color-mix(in srgb,var(--sidebar-fg) 34%, transparent);font-size:.68rem;font-weight:700;letter-spacing:.02em;flex:0 0 26px}
.sidebar[data-collapsed="true"] .sidebar__section-title{display:none}
.sidebar[data-collapsed="true"] .sidebar__section-toggle{display:none}
.sidebar[data-collapsed="true"] .sidebar__section{margin-top:.5rem}
.sidebar[data-collapsed="true"] .sidebar__nav{gap:.35rem}
.sidebar[data-collapsed="true"] .sidebar__section.is-collapsed .sidebar__nav{display:flex}
.sidebar[data-collapsed="true"] .sidebar__item-text{display:none}
.sidebar[data-collapsed="true"] .sidebar__nav-link{justify-content:center;padding:.45rem .3rem}

/* Header navigation */
.header-nav{display:flex;align-items:center;gap:.75rem;padding:.6rem 0}
.header-nav__brand{display:inline-flex;align-items:center;padding:.2rem .25rem;border-radius:8px}
.header-nav__brand:hover{background:var(--header-hover)}
.header-nav__brand-logo{height:32px;width:auto;display:block}
.header-nav__spacer{flex:1}
.header-nav__link{padding:.45rem .7rem;border-radius:8px;color:var(--header-fg)}
.header-nav__link:hover{background:var(--header-hover)}
.header .header-btn{border-color:color-mix(in srgb,var(--header-fg) 28%, transparent);background:color-mix(in srgb,var(--header-fg) 10%, transparent);color:var(--header-fg)}
.header .header-btn:hover{background:color-mix(in srgb,var(--header-fg) 18%, transparent)}
.header .btn--primary.header-btn{border-color:transparent;background:var(--color-accent);color:#fff}
.header .btn--primary.header-btn:hover{background:color-mix(in srgb,var(--color-accent) 88%, #000)}
.header-theme-btn{width:36px;height:36px;padding:0;border-radius:999px;font-size:1rem;line-height:1}

/* Tabs */
.tabs{display:flex;gap:.4rem;border-bottom:1px solid var(--color-border); margin-bottom:.8rem;}
.tab{padding:.5rem .75rem;border-radius:8px 8px 0 0;border:1px solid var(--color-border); border-bottom:none; background:var(--color-surface); cursor:pointer}
.tab.is-active{background:var(--color-bg); font-weight:600}

/* Grid of permissions */
.perms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.5rem}
.perm-item{display:flex;align-items:center;gap:.5rem;border:1px solid var(--color-border);border-radius:8px;padding:.5rem;background:var(--color-bg)}

.badge{display:inline-block;padding:.15rem .5rem;border-radius:999px;border:1px solid var(--color-border);font-size:.75rem}
.badge--ok{color:#16a34a;border-color:#16a34a33;background:#16a34a11}
.badge--off{color:#dc2626;border-color:#dc262633;background:#dc262611}
.row-actions{display:flex;gap:.35rem}
.form-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:end}
.divider{height:1px;background:var(--color-border);margin:.75rem 0}
.link{color:var(--color-primary);cursor:pointer}
.right{margin-left:auto}

/* Import sections */
.section-block{margin-top:.9rem;padding:.85rem;border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface)}
.section-title{margin:0 0 .55rem 0;font-size:.95rem;color:var(--color-fg)}
.section-title--toggle{display:flex;align-items:center;justify-content:space-between;gap:.5rem;cursor:pointer;user-select:none}
.section-title--toggle::after{content:'▾';font-size:.9rem;color:var(--color-muted);transition:transform .15s ease}
.section-title--toggle:focus{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:6px}
.section-content{display:block}
.section-block.is-collapsed .section-content{display:none}
.section-block.is-collapsed .section-title--toggle::after{transform:rotate(-90deg)}

/* Footer */
.footer-brand{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.footer-brand__logo{width:28px;height:28px;object-fit:contain}
.footer-brand__name{color:#0f5fa8;font-weight:700;letter-spacing:.02em}

/* Info modal */
.info-modal__overlay{position:fixed;inset:0;background:rgba(5,23,36,.46);display:flex;align-items:center;justify-content:center;padding:1rem;z-index:9999}
.info-modal{width:min(100%,520px);background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.info-modal__header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.8rem 1rem;border-bottom:1px solid var(--color-border)}
.info-modal__title{margin:0;font-size:1rem}
.info-modal__close{padding:.3rem .55rem;min-width:34px}
.info-modal__body{padding:.9rem 1rem}
.info-modal__line{margin:.15rem 0;color:var(--color-fg)}

/* Action modal */
.action-modal__overlay{position:fixed;inset:0;background:rgba(5,23,36,.5);display:flex;align-items:center;justify-content:center;padding:1rem;z-index:10000}
.action-modal{width:min(100%,560px);background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.action-modal__header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.8rem 1rem;border-bottom:1px solid var(--color-border)}
.action-modal__title{margin:0;font-size:1rem}
.action-modal__close{padding:.3rem .55rem;min-width:34px}
.action-modal__body{padding:.9rem 1rem}
.action-modal__message{margin:0 0 .8rem 0;color:var(--color-fg)}
.action-modal__field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.7rem}
.action-modal__field:last-child{margin-bottom:0}
.action-modal__footer{display:flex;justify-content:flex-end;gap:.5rem;padding:.8rem 1rem;border-top:1px solid var(--color-border)}

/* Contact cards */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}
.contact-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:1rem;box-shadow:var(--shadow)}
.contact-card__title{margin:0 0 .7rem 0;font-size:1.05rem}
.contact-card__row{margin:.35rem 0;color:var(--color-fg);line-height:1.4}