/* =============================================================
   Foxco Icon Box  v1.0.2
   ============================================================= */

/* ---- Base ---- */
.fib-widget {
    width: 100%;
}

.fib-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.fib-icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.fib-icon-wrap i,
.fib-icon-wrap svg {
    display: block;
}

.fib-title {
    margin: 0;
}

.fib-subtitle {
    margin: 0;
}

.fib-list {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
}

.fib-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.fib-item.fib-hidden {
    display: none;
}

.fib-tag-list {
    display: flex;
    flex-wrap: wrap;
}

.fib-tag.fib-hidden {
    display: none;
}

.fib-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.fib-loadmore-btn,
.fib-showless-btn {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    line-height: 1;
    transition: opacity 0.15s;
}

.fib-loadmore-btn:hover,
.fib-showless-btn:hover {
    opacity: 0.7;
}

/* =============================================================
   PRESET: dark-agency
   ============================================================= */
.fib-preset-dark-agency .fib-card {
    background: #1e1e1e;
    border: 1px solid #2e2e2e;
    border-radius: 12px;
    padding: 28px 22px 22px;
}

.fib-preset-dark-agency .fib-icon-wrap {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    border: 1.5px solid #444;
    background: #2a2a2a;
    margin: 0 auto 18px;
}

.fib-preset-dark-agency .fib-icon-wrap i,
.fib-preset-dark-agency .fib-icon-wrap svg {
    font-size: 28px;
    width: 28px;
    height: 28px;
    color: #aaa;
}

.fib-preset-dark-agency .fib-title {
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 18px;
}

.fib-preset-dark-agency .fib-subtitle {
    font-size: 12px;
    color: #888;
    text-align: center;
    margin-bottom: 12px;
    margin-top: -12px;
}

.fib-preset-dark-agency .fib-item {
    padding: 10px 0;
    border-bottom: 0.5px solid #2e2e2e;
    align-items: flex-start;
}

.fib-preset-dark-agency .fib-item:last-child {
    border-bottom: none;
}

.fib-preset-dark-agency .fib-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #df6737;
    flex-shrink: 0;
    margin-top: 7px;
}

.fib-preset-dark-agency .fib-item-text {
    font-size: 13px;
    color: #cccccc;
    line-height: 1.5;
}

.fib-preset-dark-agency .fib-footer {
    margin-top: 12px;
}

.fib-preset-dark-agency .fib-loadmore-btn {
    font-size: 12px;
    color: #df6737;
    border-bottom: 1px solid transparent;
    padding-bottom: 1px;
}

.fib-preset-dark-agency .fib-loadmore-btn:hover {
    border-bottom-color: #df6737;
    opacity: 1;
}

.fib-preset-dark-agency .fib-showless-btn {
    font-size: 11px;
    color: #666;
}

/* =============================================================
   PRESET: foxco-brand
   ============================================================= */
.fib-preset-foxco-brand .fib-card {
    background: #0f0f1a;
    border: 1px solid #df6737;
    border-radius: 12px;
    padding: 28px 20px 22px;
}

.fib-preset-foxco-brand .fib-icon-wrap {
    width: 62px;
    height: 62px;
    border-radius: 10px;
    background: #df6737;
    margin: 0 auto 16px;
}

.fib-preset-foxco-brand .fib-icon-wrap i,
.fib-preset-foxco-brand .fib-icon-wrap svg {
    font-size: 26px;
    width: 26px;
    height: 26px;
    color: #ffffff;
}

.fib-preset-foxco-brand .fib-title {
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
    margin-bottom: 4px;
}

.fib-preset-foxco-brand .fib-subtitle {
    font-size: 11px;
    color: #df6737;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    margin-bottom: 18px;
}

.fib-preset-foxco-brand .fib-tag-list {
    gap: 6px;
    justify-content: center;
    flex: 1;
}

.fib-preset-foxco-brand .fib-tag {
    font-size: 11px;
    background: #1a1a2e;
    color: #999999;
    border: 0.5px solid #2e2e45;
    border-radius: 20px;
    padding: 5px 12px;
    line-height: 1.3;
    text-align: center;
}

.fib-preset-foxco-brand .fib-tag.is-highlight {
    background: #1e1000;
    color: #df6737;
    border-color: #df6737;
}

.fib-preset-foxco-brand .fib-footer {
    margin-top: 14px;
}

.fib-preset-foxco-brand .fib-loadmore-btn {
    font-size: 11px;
    color: #df6737;
    border: 0.5px solid #df673755;
    border-radius: 20px;
    padding: 5px 14px;
}

.fib-preset-foxco-brand .fib-loadmore-btn:hover {
    opacity: 1;
    border-color: #df6737;
}

.fib-preset-foxco-brand .fib-showless-btn {
    font-size: 11px;
    color: #555;
}

/* =============================================================
   PRESET: clean-light
   ============================================================= */
.fib-preset-clean-light .fib-card {
    background: #ffffff;
    border: 0.5px solid #e5e5e5;
    border-radius: 12px;
    padding: 28px 22px 22px;
}

.fib-preset-clean-light .fib-icon-wrap {
    width: 56px;
    height: 56px;
    border-radius: 10px;
    background: #eef4ff;
    margin: 0 auto 14px;
}

.fib-preset-clean-light .fib-icon-wrap i,
.fib-preset-clean-light .fib-icon-wrap svg {
    font-size: 24px;
    width: 24px;
    height: 24px;
    color: #378add;
}

.fib-preset-clean-light .fib-title {
    font-size: 14px;
    font-weight: 600;
    color: #1a1a2e;
    text-align: center;
    margin-bottom: 14px;
}

.fib-preset-clean-light .fib-subtitle {
    font-size: 12px;
    color: #888;
    text-align: center;
    margin-bottom: 10px;
    margin-top: -8px;
}

.fib-preset-clean-light .fib-item {
    padding: 7px 0;
    border-bottom: 0.5px solid #f0f0f0;
}

.fib-preset-clean-light .fib-item:last-child {
    border-bottom: none;
}

.fib-preset-clean-light .fib-check {
    color: #378add;
    flex-shrink: 0;
    margin-top: 2px;
    display: flex;
    align-items: center;
}

.fib-preset-clean-light .fib-item-text {
    font-size: 13px;
    color: #444;
    line-height: 1.5;
}

.fib-preset-clean-light .fib-footer {
    margin-top: 12px;
}

.fib-preset-clean-light .fib-loadmore-btn {
    font-size: 12px;
    color: #378add;
    border: 0.5px solid #378add66;
    border-radius: 6px;
    padding: 6px 14px;
    background: #f0f7ff;
    width: 100%;
    text-align: center;
}

.fib-preset-clean-light .fib-loadmore-btn:hover {
    opacity: 1;
    background: #e4f0ff;
}

.fib-preset-clean-light .fib-showless-btn {
    font-size: 11px;
    color: #bbb;
}

/* =============================================================
   PRESET: accent-left
   ============================================================= */
.fib-preset-accent-left .fib-card {
    background: #ffffff;
    border: 0.5px solid #e5e5e5;
    border-left: 3px solid #df6737;
    border-radius: 0 10px 10px 0;
    padding: 18px 20px;
    flex-direction: row;
    align-items: flex-start;
    gap: 16px;
}

.fib-preset-accent-left .fib-icon-wrap {
    width: 46px;
    height: 46px;
    border-radius: 8px;
    background: #fff3ee;
    flex-shrink: 0;
}

.fib-preset-accent-left .fib-icon-wrap i,
.fib-preset-accent-left .fib-icon-wrap svg {
    font-size: 20px;
    width: 20px;
    height: 20px;
    color: #df6737;
}

.fib-preset-accent-left .fib-content-inner {
    flex: 1;
    min-width: 0;
}

.fib-preset-accent-left .fib-title {
    font-size: 13px;
    font-weight: 600;
    color: #1a1a2e;
    margin-bottom: 10px;
    text-align: left;
}

.fib-preset-accent-left .fib-subtitle {
    font-size: 11px;
    color: #888;
    text-align: left;
    margin-bottom: 8px;
    margin-top: -6px;
}

.fib-preset-accent-left .fib-tag-list {
    gap: 5px;
}

.fib-preset-accent-left .fib-tag {
    font-size: 11px;
    background: #f5f5f5;
    color: #555;
    border-radius: 4px;
    padding: 3px 9px;
    border: 0.5px solid #e5e5e5;
}

.fib-preset-accent-left .fib-tag.is-highlight {
    background: #fff3ee;
    color: #df6737;
    border-color: #df673755;
}

.fib-preset-accent-left .fib-footer {
    margin-top: 10px;
    align-items: flex-start;
}

.fib-preset-accent-left .fib-loadmore-btn {
    font-size: 11px;
    color: #df6737;
    border: 0.5px solid #df673744;
    border-radius: 4px;
    padding: 3px 10px;
}

.fib-preset-accent-left .fib-showless-btn {
    font-size: 11px;
    color: #bbb;
}

/* =============================================================
   PRESET: numbered-dark
   ============================================================= */
.fib-preset-numbered-dark .fib-card {
    background: rgba(255, 255, 255, 0.04);
    border: 0.5px solid rgba(255, 255, 255, 0.11);
    border-radius: 16px;
    padding: 28px 22px 22px;
}

.fib-preset-numbered-dark .fib-icon-wrap {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    border: 0.5px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.06);
    margin: 0 auto 16px;
}

.fib-preset-numbered-dark .fib-icon-wrap i,
.fib-preset-numbered-dark .fib-icon-wrap svg {
    font-size: 24px;
    width: 24px;
    height: 24px;
    color: #cccccc;
}

.fib-preset-numbered-dark .fib-title {
    font-size: 14px;
    font-weight: 600;
    color: #f0f0f0;
    text-align: center;
    margin-bottom: 16px;
}

.fib-preset-numbered-dark .fib-subtitle {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.38);
    text-align: center;
    margin-bottom: 10px;
    margin-top: -10px;
}

.fib-preset-numbered-dark .fib-item {
    padding: 8px 0;
    border-bottom: 0.5px solid rgba(255, 255, 255, 0.07);
}

.fib-preset-numbered-dark .fib-item:last-child {
    border-bottom: none;
}

.fib-preset-numbered-dark .fib-num {
    font-size: 11px;
    font-weight: 600;
    color: #df6737;
    flex-shrink: 0;
    min-width: 20px;
    padding-top: 2px;
    font-variant-numeric: tabular-nums;
}

.fib-preset-numbered-dark .fib-item-text {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.62);
    line-height: 1.5;
}

.fib-preset-numbered-dark .fib-footer {
    margin-top: 12px;
}

.fib-preset-numbered-dark .fib-loadmore-btn {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.4);
    border-bottom: 0.5px solid rgba(255, 255, 255, 0.15);
    padding-bottom: 2px;
}

.fib-preset-numbered-dark .fib-loadmore-btn:hover {
    opacity: 1;
    color: rgba(255, 255, 255, 0.7);
}

.fib-preset-numbered-dark .fib-showless-btn {
    font-size: 11px;
    color: rgba(255, 255, 255, 0.25);
}

/* =============================================================
   Accent-left inner layout fix
   ============================================================= */
.fib-preset-accent-left .fib-card > .fib-title,
.fib-preset-accent-left .fib-card > .fib-subtitle,
.fib-preset-accent-left .fib-card > .fib-tag-list,
.fib-preset-accent-left .fib-card > .fib-footer {
    /* wrapped in content-inner via JS — these are fallbacks */
}

/* =============================================================
   Responsive
   ============================================================= */
@media (max-width: 480px) {
    .fib-preset-accent-left .fib-card {
        flex-direction: column;
    }
}

/* =============================================================
   Title & Subtitle links
   ============================================================= */
.fib-title-link,
.fib-subtitle-link {
    text-decoration: none;
    color: inherit;
    transition: opacity 0.15s;
}

.fib-title-link:hover,
.fib-subtitle-link:hover {
    opacity: 0.75;
    text-decoration: underline;
    text-underline-offset: 3px;
}