/* tpl-tool-archive.css: extracted from templates/tool-archive.php (was an inline <style> block in the page body). */
    :root {
        --ts-primary: var(--awt-c-primary, #EF4444);
        --ts-accent: var(--awt-c-accent, #DC2626);
        --ts-bg: var(--awt-c-bg, #F8FAFC);
        --ts-btn-color: var(--awt-c-btn, #EF4444);
    }
    
    * {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    
    .ts-launch-btn {
        transition: all 0.2s;
    }
    
    @media (max-width: 768px) {
        .ts-archive-hero h1 {
            font-size: 2rem !important;
        }
        
        .ts-tools-grid {
            grid-template-columns: 1fr !important;
        }
    }

    .ts-pagination-wrap{
        display:flex;
        align-items:center;
        justify-content:center;
        gap:8px;
        flex-wrap:wrap;
        margin:4px auto 34px;
        padding:0 10px;
    }
    .ts-pagination-wrap .page-numbers{
        display:inline-flex;
        min-width:36px;
        height:36px;
        align-items:center;
        justify-content:center;
        padding:0 8px;
        border:1px solid #E2E8F0;
        border-radius:10px;
        background:#fff;
        color:#475569;
        font-size:12px;
        font-weight:600;
        line-height:1;
        text-decoration:none;
        box-shadow:0 4px 12px rgba(0,0,0,.04);
        transition:all .2s ease;
    }
    .ts-pagination-wrap .page-numbers:hover{
        border-color:var(--ts-primary);
        background:color-mix(in srgb,var(--ts-primary) 8%,white);
        color:var(--ts-primary);
        transform:translateY(-1px);
        box-shadow:0 8px 18px color-mix(in srgb,var(--ts-primary) 14%,transparent);
    }
    .ts-pagination-wrap .page-numbers.current{
        border-color:var(--ts-primary);
        background:linear-gradient(135deg,var(--ts-primary),var(--ts-accent));
        color:#fff;
        box-shadow:0 8px 18px color-mix(in srgb,var(--ts-primary) 22%,transparent);
    }
    .ts-pagination-info{
        width:100%;
        margin-bottom:0;
        color:#64748B;
        font-size:12px;
        font-weight:500;
        text-align:center;
    }
    @media(max-width:768px){
        .ts-pagination-wrap{
            gap:5px;
            margin-bottom:28px;
            padding:0 8px;
        }
        .ts-pagination-wrap .page-numbers{
            min-width:34px;
            height:34px;
            padding:0 9px;
            border-radius:9px;
            font-size:12px;
        }
    }

        /* width:100% plus 75px of padding overflowed the box (and the page on phones) under content-box. */
        #ts-main-search {
            box-sizing: border-box;
            max-width: 100%;
        }

        #ts-main-search:focus {
            border-color: var(--ts-primary);
            background: white;
            box-shadow: 0 0 0 4px color-mix(in srgb, var(--ts-primary) 8%, transparent);
        }
        .ts-category-scroll::-webkit-scrollbar {
            height: 5px;
        }
        .ts-category-scroll::-webkit-scrollbar-thumb {
            background: #E2E8F0;
            border-radius: 10px;
        }
        .ts-filter-btn {
            transition: all 0.3s ease;
        }
        .ts-filter-btn.active {
            background: var(--ts-primary) !important;
            color: white !important;
            border-color: var(--ts-primary) !important;
            box-shadow: 0 4px 12px color-mix(in srgb, var(--ts-primary) 25%, transparent) !important;
        }
        .ts-filter-btn:not(.active):hover {
            background: #F1F5F9;
            border-color: #CBD5E1;
            color: #0F172A;
            transform: translateY(-1px);
        }
        #ts-search-results {
            background: white !important;
            min-height: 50px;
        }
        .ts-search-item {
            padding: 15px 20px;
            display: flex;
            align-items: center;
            gap: 15px;
            cursor: pointer;
            transition: all 0.2s;
            border-bottom: 1px solid #F1F5F9;
            background: white;
        }
        .ts-search-item:last-child {
            border-bottom: none;
        }
        .ts-search-item:hover {
            background: #F8FAFC;
        }
        .ts-search-item .ts-icon-box {
            width: 40px;
            height: 40px;
            background: linear-gradient(135deg, var(--ts-primary), var(--ts-accent));
            border-radius: 10px;
            display: flex; align-items: center; justify-content: center;
            color: white;
            flex-shrink: 0;
        }
        .ts-search-item .ts-content {
            flex: 1;
            min-width: 0;
        }
        .ts-search-item h4 {
            margin: 0 0 2px 0;
            font-size: 15px;
            font-weight: 700;
            color: #0F172A;
        }
        .ts-search-item p {
            margin: 0;
            font-size: 12px;
            color: #64748B;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .ts-search-item .ts-action {
            padding: 6px 14px;
            background: #F1F5F9;
            color: #475569;
            border-radius: 30px;
            font-size: 11px;
            font-weight: 700;
            text-transform: uppercase;
        }
        .ts-search-item:hover .ts-action {
            background: var(--ts-primary);
            color: white;
        }
    

    .ts-archive-hero a:hover {
        border-color: #CBD5E1 !important;
        background: #F8FAFC !important;
    }


/* ---- Tool cards (were inline styles on every card; FUN-H3). Scoped under .ts-style8-card so they keep the
   precedence the inline styles had over generic theme/plugin rules. ---- */
.ts-style8-card.awt-card{height:100%}
.ts-style8-card .awt-card-link{display:block;background:white;border-radius:24px;box-shadow:0 4px 12px rgba(0,0,0,0.05);text-decoration:none;color:inherit;overflow:hidden;height:100%}
.ts-style8-card .awt-card-body{padding:22px 22px 16px}
.ts-style8-card .awt-card-head{display:flex;align-items:flex-start;margin-bottom:16px;gap:14px}
.ts-style8-card .awt-card-iconwrap{position:relative;flex-shrink:0}
.ts-style8-card .awt-card-icon{width:56px;height:56px;background:linear-gradient(135deg,var(--ts-primary),var(--ts-accent));border-radius:18px;display:flex;align-items:center;justify-content:center;color:white;box-shadow:0 8px 16px -4px color-mix(in srgb, var(--ts-primary) 31%, transparent);transition:transform 0.3s}
.ts-style8-card .awt-card-icon i{font-size:24px}
.ts-style8-card .awt-card-check{position:absolute;bottom:-5px;right:-5px;width:22px;height:22px;background:#10B981;border:2px solid white;border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:10px}
.ts-style8-card .awt-card-main{flex:1;min-width:0}
.ts-style8-card .awt-card-titlerow{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.ts-style8-card .awt-card-title{font-size:1rem;font-weight:700;color:#0F172A;margin:0 0 4px 0;line-height:1.35;word-break:break-word}
.ts-style8-card .awt-card-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:4px}
.ts-style8-card .awt-card-badge{display:inline-block;padding:3px 10px;background:color-mix(in srgb,var(--ts-primary) 10%,white);color:var(--ts-primary);border-radius:30px;font-size:9px;font-weight:700;text-transform:uppercase}
.ts-style8-card .awt-card-badge--ls{letter-spacing:0.3px}
.ts-style8-card .awt-card-ai{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;background:#EEF2FF;color:#4F46E5;border-radius:30px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:0.3px;border:1px solid #C7D2FE}
.ts-style8-card .awt-card-desc{font-size:0.85rem;color:#64748B;line-height:1.5;margin-bottom:18px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ts-style8-card .awt-card-stats{display:flex;gap:12px;margin-bottom:16px}
.ts-style8-card .awt-card-foot{padding:12px 22px;background:#F8FAFC;border-top:1px solid #E2E8F0;display:flex;align-items:center;justify-content:space-between}
.ts-style8-card .awt-card-launch{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:linear-gradient(135deg,var(--ts-primary),var(--ts-accent));color:white;border-radius:40px;font-weight:600;font-size:12px}
.ts-style8-card .awt-card-launch i{font-size:10px}
