@tailwind base;
@tailwind components;
@tailwind utilities;

/* Fix: Tailwind .collapse{visibility:collapse} conflicts with Bootstrap .collapse
   Bootstrap 加上 .show 後元素仍帶 .collapse class，Tailwind 的 visibility:collapse 依然生效，
   導致所有 collapse/accordion（含 navbar、弱點掃描展開列、專案設定群組等）展開後內容隱形。 */
.navbar-collapse,
.collapsing,
.collapse.show {
  visibility: visible !important;
}
.collapse:not(.show) {
  display: none !important;
}

.ios-folder {
    width: 100%;
    aspect-ratio: 1/1;
    border-radius: 22px;
    background: #f5f5f7;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: .15s;
}

.ios-folder:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, .1);
}

.folder-inner {
    width: 90%
}

.folder-name {
    font-size: .8rem;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

/* 3×3 Grid 預覽 */
.icon-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 1fr;
    gap: 4px;
}

.icon-box {
    background: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.icon-box i {
    font-size: 1.1rem;
    color: #6c757d
}

.icon-box.plus {
    background: #dfe0e3;
    font-size: .8rem;
    font-weight: 600;
    color: #444
}

/* Off-canvas 外觀（像 iOS 放大面板） */
.ios-canvas {
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
    --bs-offcanvas-backdrop-bg: #000;
    --bs-offcanvas-backdrop-opacity: .3
}