/* --- General --- */
.apb-style-box, .apb-underline, .apb-highlighter {
    /* Common styles if any */
}

/* --- 智慧資訊框 (Style Box) --- */
.apb-style-box {
    margin: 1em 0;
    position: relative;
}

.apb-style-box .apb-box-title {
    display: flex;
    align-items: center;
    font-size: var(--apb-title-font-size, 1.2em);
    font-weight: bold;
    color: var(--apb-title-color, inherit);
}

.apb-style-box .apb-box-title .apb-title-icon {
    margin-right: 10px;
    font-size: 1em;
}

.apb-style-box .apb-box-title .apb-title-text {
    flex-grow: 1;
}

.apb-style-box .apb-box-content > :first-child {
    margin-top: 0;
}

.apb-style-box .apb-box-content > :last-child {
    margin-bottom: 0;
}

/* Layout: 資訊框 (萬用框) */
.apb-layout-info {
    border: var(--apb-border-width, 2px) var(--apb-border-line-style, solid) var(--apb-box-color, #ddd);
    border-radius: 4px;
}

.apb-layout-info .apb-box-title {
    background-color: var(--apb-box-color, #ddd);
    color: var(--apb-title-color, #333);
    padding: 10px 15px;
}

.apb-layout-info .apb-box-content {
    padding: 15px;
    background-color: #fff;
}

/* Layout: 提醒框 (底色框) */
.apb-layout-alert {
    padding: 1rem;
    border: 1px solid transparent;
    border-radius: 0.375rem;
}

.apb-layout-alert .apb-box-title,
.apb-layout-alert .apb-box-content {
    padding: 0;
    background: transparent;
}

.apb-layout-alert .apb-box-title {
    margin-bottom: 0.5rem;
}

/* Bootstrap Alert Types */
.apb-layout-alert.apb-alert-type-custom {
    background-color: var(--apb-box-color, #cfe2ff);
    border-color: var(--apb-border-color, #9ec5fe);
    border-width: var(--apb-border-width, 1px);
    border-style: var(--apb-border-line-style, solid);
    color: var(--apb-title-color, #333);
}

.apb-layout-alert.apb-alert-type-custom .apb-box-title {
    color: var(--apb-title-color, #333);
}

.apb-layout-alert.apb-alert-type-info {
    color: #0a58ca;
    background-color: #cfe2ff;
    border-color: #9ec5fe;
}

.apb-layout-alert.apb-alert-type-info .apb-box-title {
    color: var(--apb-title-color, #0a58ca);
}

.apb-layout-alert.apb-alert-type-success {
    color: #146c43;
    background-color: #d1e7dd;
    border-color: #a3cfbb;
}

.apb-layout-alert.apb-alert-type-success .apb-box-title {
    color: var(--apb-title-color, #146c43);
}

.apb-layout-alert.apb-alert-type-warning {
    color: #664d03;
    background-color: #fff3cd;
    border-color: #ffecb5;
}

.apb-layout-alert.apb-alert-type-warning .apb-box-title {
    color: var(--apb-title-color, #664d03);
}

.apb-layout-alert.apb-alert-type-danger {
    color: #842029;
    background-color: #f8d7da;
    border-color: #f1aeb5;
}

.apb-layout-alert.apb-alert-type-danger .apb-box-title {
    color: var(--apb-title-color, #842029);
}

/* Layout: 提示框 (Morandi 提醒框) */
.apb-layout-morandi-alert {
    background-color: var(--apb-box-color, #F7F4EB);
    border-left: var(--apb-border-width, 4px) solid var(--apb-border-color, #D9D2C6);
    padding: 1rem;
    border-radius: 0.375rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.apb-layout-morandi-alert .apb-box-title {
    color: var(--apb-title-color, #2D3748);
    font-weight: 700;
    margin-bottom: 0.25rem;
    font-size: var(--apb-title-font-size, 1em);
    padding: 0;
    background: transparent;
}

.apb-layout-morandi-alert .apb-box-content {
    color: #4A5568;
    padding: 0;
    background: transparent;
}

/* Layout: 文字置中框 (線條框) - [修正] */
.apb-layout-centered-title {
    border: var(--apb-border-width, 2px) var(--apb-border-line-style, solid) var(--apb-box-color, #ddd);
    border-radius: 4px;
    padding: 25px 15px 15px;
    margin-top: 1.5em;
    background-color: #ffffff; /* 確保容器有白色背景 */
    position: relative; /* 設定相對定位 */
}

.apb-layout-centered-title .apb-box-title {
    position: absolute; /* 設定絕對定位 */
    top: -0.8em; /* 向上移動以覆蓋邊框 */
    left: 20px;
    background: var(--apb-title-bg-color, #fff); /* 標題背景，遮蓋邊框 */
    padding: 0 10px;
    font-size: var(--apb-title-font-size, 1.2em);
    color: var(--apb-title-color, var(--apb-box-color, #333));
}

.apb-layout-centered-title .apb-box-content {
    padding: 0;
    background: transparent; /* 內容區塊背景為透明 */
}


/* --- 特色螢光筆 (Highlighter) --- */
.apb-highlighter {
    background: linear-gradient(to top, var(--apb-highlighter-color, #fff59d) 60%, transparent 60%);
}

.apb-highlighter-highlight {
    background: linear-gradient(to top, var(--apb-highlighter-color, #fff59d) 60%, transparent 60%);
}

.apb-highlighter-line {
    background: linear-gradient(transparent 40%, rgba(255, 255, 255, 0) 40%, var(--apb-highlighter-color, #CCFF90) 50%, transparent 70%);
    padding: 2px 1px;
}

/* --- 特色底線 (Underline) --- */
.apb-underline {
    text-decoration: none;
    background: transparent;
    padding-bottom: 2px;
}

.apb-underline-normal {
    border-bottom: 2px solid var(--apb-underline-color, red);
}

.apb-underline-wavy {
    text-decoration-line: underline;
    text-decoration-style: wavy;
    text-decoration-color: var(--apb-underline-color, red);
    text-decoration-skip-ink: none;
}

.apb-underline-dashed {
    border-bottom: 2px dashed var(--apb-underline-color, red);
}

.apb-underline-crayon {
    background: linear-gradient(transparent 40%, rgba(255, 255, 255, 0) 40%, var(--apb-underline-color, red) 90%, transparent 95%);
    padding: 2px 1px;
    border-radius: 2px;
}