/* v0.19.0 */

/* Collapsed sidebar tooltip (instant) */
.nav-tip{position:fixed;z-index:2000;padding:6px 10px;border-radius:6px;background:#1d2433;color:#fff;font-size:13px;font-weight:600;line-height:1.3;white-space:nowrap;box-shadow:0 6px 18px #0004;transform:translateY(-50%);pointer-events:none}
.nav-tip::before{content:"";position:absolute;top:50%;left:-5px;border:5px solid transparent;border-left:0;border-right-color:#1d2433;transform:translateY(-50%)}
.nav-tip[hidden]{display:none}

/* Cài đặt accordions */
#main .card-accordion-title{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.card-toggle{display:inline-grid;place-items:center;width:32px;height:32px;margin-left:auto;padding:0;border:1px solid #e4e7ec;border-radius:8px;background:#fff;color:#475467}
.card-toggle .solid-icon{width:16px;height:16px;flex-basis:16px;transform:rotate(180deg);transition:transform .15s}
.card-collapsed .card-toggle .solid-icon{transform:none}
#main .card.card-collapsed{padding-top:14px;padding-bottom:14px}
#main .card.card-collapsed .card-accordion-title{margin:0}
.card-collapsed .brand-card-head{margin:0}
.menu-item.group{flex-wrap:wrap}
.menu-group-toggle{display:inline-flex;align-items:center;gap:6px;margin-left:auto;padding:4px 8px;border:1px solid #e4e7ec;border-radius:6px;background:#fff;color:#475467}
.menu-group-toggle em{min-width:22px;padding:0 6px;border-radius:999px;background:#f2f4f7;font-size:12px;font-style:normal}
.menu-group-toggle .solid-icon{width:14px;height:14px;flex-basis:14px;transform:rotate(180deg);transition:transform .15s}
.menu-item.group.folded .menu-group-toggle .solid-icon{transform:none}
.menu-children[hidden]{display:none}

/* Customer type and company details */
.customer-type{display:flex;align-items:center;flex-wrap:wrap;gap:8px 14px}
.customer-type .field-label{margin:0}
.customer-type .segmented span{display:inline-flex;align-items:center;gap:6px;padding:7px 14px}
.customer-type .segmented .solid-icon{width:15px;height:15px;flex-basis:15px}
.company-box{margin:0;padding:12px 14px 4px;border:1px solid #d0d5dd;border-radius:8px;background:#f8fafc}
.company-box legend{display:inline-flex;align-items:center;gap:6px;padding:0 6px;font-weight:700;color:#1d2433}
.company-box legend .solid-icon{width:16px;height:16px;flex-basis:16px;color:var(--brand)}
.company-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.company-grid .wide{grid-column:1/-1}
@media(max-width:700px){.company-grid{grid-template-columns:minmax(0,1fr)}}

/* Users: status and personal settings */
.user-status.active{background:#ecfdf3;color:#067647}
.user-status.resigned{background:#fef3f2;color:#b42318}
.user-status.suspended{background:#f2f4f7;color:#475467}
.user-extra{display:flex;flex-wrap:wrap;gap:4px;max-width:360px}
.user-extra .chip{padding:2px 8px;border-radius:999px;background:#eff4ff;color:#1d4ed8;font-size:12px}
.user-extra .muted-chip{background:#f2f4f7;color:#475467}
#user-form label .hint{display:block;margin-top:4px}
.perm-table input:disabled:checked{accent-color:#98a2b3}

/* Product line with a save error */
#quote-form .line-editor.field-error{outline:2px solid #d92d20;outline-offset:2px;background:#fef3f2}

/* Products fold header: folder icon, icon-only bulk supplier button (white, no background) */
#quote-form .fold-extra [data-act="add-group"]{display:inline-flex;align-items:center;gap:6px}
#quote-form .fold-extra [data-act="add-group"] .solid-icon{width:15px;height:15px;flex-basis:15px}
#quote-form .fold-extra .bulk-supplier-btn.icon-only{position:relative;display:inline-grid;place-items:center;width:34px;height:32px;padding:0;border:0;border-radius:6px;background:transparent;color:#fff;box-shadow:none}
#quote-form .fold-extra .bulk-supplier-btn.icon-only .solid-icon{width:20px;height:20px;flex-basis:20px}
#quote-form .fold-extra .bulk-supplier-btn.icon-only:hover,#quote-form .fold-extra .bulk-supplier-btn.icon-only:focus-visible{background:#ffffff26;color:#fff}
#quote-form .fold-extra [data-tip]:hover::after,#quote-form .fold-extra [data-tip]:focus-visible::after{top:calc(100% + 8px);bottom:auto;transition:none}

/* Thêm hạng mục: several rooms */
.group-types{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px 12px;max-height:320px;overflow:auto;margin-top:10px}
.group-types label[hidden]{display:none}
#group-search{width:100%}

/* Huỷ báo giá */
#quote-form .actions .cancel-quote{display:inline-flex;align-items:center;gap:6px;margin-right:auto;transition:background .1s,color .1s,border-color .1s}
#quote-form .actions .cancel-quote .solid-icon{width:15px;height:15px;flex-basis:15px}
#quote-form .actions .cancel-quote:hover,#quote-form .actions .cancel-quote:focus-visible{border-color:#d92d20;background:#d92d20;color:#fff}