/*
 * Yahoo Link Directory - Frontend Stylesheet
 * Inspired by the classic directory portals circa 2002-2005
 */

/* Featured badge */
.fnld-featured-badge {
    display: inline-block;
    background: #FFCC00;
    color: #003399;
    font-size: 9px;
    font-weight: bold;
    padding: 1px 5px;
    border-radius: 2px;
    margin-right: 3px;
    vertical-align: middle;
}
.fnld-btn-feature {
    background: #FFCC00;
    color: #003399;
    border: 1px solid #CCA800;
    padding: 2px 7px;
    font-size: 10px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 2px;
}
.fnld-btn-feature:hover { background: #FFD700; }
.fnld-msg { padding: 5px 8px; margin-bottom: 8px; border-left: 3px solid; font-size: 11px; }
.fnld-msg-ok  { background: #F5FFF5; border-color: #006600; color: #004400; }
.fnld-msg-err { background: #FFF5F5; border-color: #CC0000; color: #880000; }
.fnld-status-ok      { color: #006600; font-weight: bold; }
.fnld-status-pending { color: #CC6600; font-style: italic; }

/* ======================================================
   CSS CUSTOM PROPERTIES
   ====================================================== */
:root {
    --fnld-purple:       #400098;
    --fnld-purple-light: #6600cc;
    --fnld-blue:         #0000cc;
    --fnld-blue-visited: #551a8b;
    --fnld-red:          #cc0000;
    --fnld-orange:       #ff6600;
    --fnld-yellow-bg:    #fffde7;
    --fnld-yellow-bdr:   #ffcc00;
    --fnld-header-bg:    #400098;
    --fnld-header-text:  #ffffff;
    --fnld-section-bg:   #e8e0f0;
    --fnld-section-text: #2d0060;
    --fnld-border:       #cccccc;
    --fnld-light-bg:     #f8f6ff;
    --fnld-text:         #000000;
    --fnld-meta:         #666666;
    --fnld-new-bg:       #cc0000;
    --fnld-new-text:     #ffffff;
    --fnld-star:         #cc7700;
    --fnld-count:        #666666;
}

/* ======================================================
   DIRECTORY WRAPPER
   ====================================================== */
.fnld-directory {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: var(--fnld-text);
    line-height: 1.5;
    width: 100%;
    margin: 0 auto;
}

.fnld-directory *,
.fnld-directory *::before,
.fnld-directory *::after {
    box-sizing: border-box;
}

.fnld-directory a {
    color: var(--fnld-blue);
    text-decoration: none;
}

.fnld-directory a:visited {
    color: var(--fnld-blue-visited);
}

.fnld-directory a:hover {
    text-decoration: underline;
    color: var(--fnld-red);
}

/* ======================================================
   BREADCRUMB
   ====================================================== */
.fnld-breadcrumb {
    font-size: 11px;
    color: var(--fnld-meta);
    padding: 6px 0 8px;
    border-bottom: 1px solid var(--fnld-border);
    margin-bottom: 10px;
}

.fnld-breadcrumb a {
    color: var(--fnld-blue);
    text-decoration: none;
}

.fnld-breadcrumb a:hover {
    text-decoration: underline;
}

.fnld-bc-sep {
    color: #999;
    margin: 0 4px;
}

/* ======================================================
   DIRECTORY HEADER
   ====================================================== */
.fnld-dir-header {
    background: var(--fnld-header-bg);
    color: var(--fnld-header-text);
    padding: 10px 14px;
    margin-bottom: 14px;
    border-radius: 2px;
}

.fnld-dir-header h2 {
    margin: 0;
    font-size: 20px;
    font-weight: bold;
    color: #ffffff;
    display: inline-block;
}

.fnld-dir-header .fnld-cat-icon {
    font-size: 22px;
    vertical-align: middle;
}

.fnld-dir-header .fnld-cat-desc {
    margin: 6px 0 0;
    font-size: 12px;
    color: #ddd;
}

.fnld-dir-subtitle {
    font-size: 12px;
    color: #ccc;
    margin: 4px 0 0;
}

/* ======================================================
   TOP-LEVEL CATEGORY GRID
   ====================================================== */
.fnld-top-cats {
    display: grid;
    grid-template-columns: repeat(var(--fnld-cols, 3), 1fr);
    gap: 14px;
    margin-bottom: 20px;
}

@media (max-width: 700px) {
    .fnld-top-cats {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 480px) {
    .fnld-top-cats {
        grid-template-columns: 1fr;
    }
}

.fnld-cat-box {
    background: #ffffff;
    border: 1px solid var(--fnld-border);
    border-top: 3px solid var(--fnld-purple);
    padding: 10px 12px;
}

.fnld-cat-title {
    font-size: 14px;
    font-weight: bold;
    margin: 0 0 6px;
    border-bottom: 1px solid #eee;
    padding-bottom: 5px;
}

.fnld-cat-title a {
    color: var(--fnld-purple);
    text-decoration: none;
}

.fnld-cat-title a:hover {
    text-decoration: underline;
    color: var(--fnld-red);
}

.fnld-cat-count {
    font-size: 11px;
    font-weight: normal;
    color: var(--fnld-count);
}

.fnld-cat-icon {
    font-style: normal;
}

/* Subcategory list inside a category box */
.fnld-subcat-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.fnld-subcat-list li {
    padding: 1px 0;
    font-size: 12px;
    line-height: 1.6;
}

.fnld-subcat-list li::before {
    content: "›";
    color: var(--fnld-purple);
    margin-right: 4px;
}

.fnld-subcat-list li a {
    color: var(--fnld-blue);
}

.fnld-subcat-list li.fnld-more a {
    color: var(--fnld-purple);
    font-style: italic;
}

.fnld-subcount {
    font-size: 10px;
    color: var(--fnld-count);
}

/* ======================================================
   SUBCATEGORY GRID (inside a category page)
   ====================================================== */
.fnld-subcat-grid {
    display: grid;
    grid-template-columns: repeat(var(--fnld-cols, 3), 1fr);
    gap: 4px 16px;
    margin-bottom: 16px;
    padding: 8px 12px;
    background: var(--fnld-light-bg);
    border: 1px solid var(--fnld-border);
}

.fnld-subcat-item {
    font-size: 12px;
    padding: 2px 0;
}

.fnld-subcat-item::before {
    content: "›";
    color: var(--fnld-purple);
    margin-right: 4px;
}

/* ======================================================
   SECTION HEADERS (like Yahoo's "Categories" / "Site Listings")
   ====================================================== */
.fnld-section-header {
    background: var(--fnld-section-bg);
    color: var(--fnld-section-text);
    font-size: 12px;
    font-weight: bold;
    padding: 4px 10px;
    margin: 14px 0 6px;
    border-left: 4px solid var(--fnld-purple);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.fnld-section-header .fnld-count {
    font-weight: normal;
    color: var(--fnld-meta);
    text-transform: none;
    letter-spacing: 0;
}

/* ======================================================
   LINK LIST
   ====================================================== */
.fnld-link-list {
    list-style: none;
    margin: 0 0 12px;
    padding: 0;
}

.fnld-link-item {
    padding: 7px 10px;
    border-bottom: 1px solid #eeeeee;
    background: #ffffff;
}

.fnld-link-item:nth-child(even) {
    background: #fafafa;
}

.fnld-link-item:last-child {
    border-bottom: 1px solid var(--fnld-border);
}

.fnld-link-item:hover {
    background: var(--fnld-light-bg);
}

.fnld-featured-list .fnld-link-item {
    background: var(--fnld-yellow-bg);
    border-left: 3px solid var(--fnld-yellow-bdr);
    padding-left: 12px;
}

.fnld-link-title {
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 2px;
}

.fnld-link-title a {
    color: var(--fnld-blue);
    text-decoration: none;
}

.fnld-link-title a:visited {
    color: var(--fnld-blue-visited);
}

.fnld-link-title a:hover {
    text-decoration: underline;
}

.fnld-link-desc {
    font-size: 12px;
    color: #333333;
    margin-bottom: 3px;
    line-height: 1.4;
}

.fnld-link-meta {
    font-size: 10px;
    color: var(--fnld-meta);
}

.fnld-link-host {
    font-style: italic;
}

.fnld-link-clicks {
    color: #999;
}

/* NEW! badge */
.fnld-new-badge {
    display: inline-block;
    background: var(--fnld-new-bg);
    color: var(--fnld-new-text);
    font-size: 9px;
    font-weight: bold;
    padding: 1px 4px;
    vertical-align: middle;
    text-transform: uppercase;
    border-radius: 2px;
    margin-left: 4px;
}

/* Editor's Pick star */
.fnld-star {
    color: var(--fnld-star);
    font-size: 14px;
    vertical-align: middle;
}

/* ======================================================
   SEARCH WIDGET
   ====================================================== */
.fnld-search-widget {
    margin-bottom: 20px;
    position: relative;
}

.fnld-search-form {
    display: block;
}

.fnld-search-row {
    display: flex;
    gap: 6px;
    align-items: center;
}

.fnld-search-input {
    flex: 1;
    height: 36px;
    padding: 0 10px;
    font-size: 14px;
    border: 2px solid var(--fnld-purple);
    border-radius: 2px;
    font-family: Arial, Helvetica, sans-serif;
    outline: none;
}

.fnld-search-input:focus {
    border-color: var(--fnld-purple-light);
    box-shadow: 0 0 0 2px rgba(64, 0, 152, 0.15);
}

.fnld-search-btn {
    height: 36px;
    padding: 0 20px;
    background: var(--fnld-purple);
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
    white-space: nowrap;
}

.fnld-search-btn:hover {
    background: var(--fnld-purple-light);
}

/* Live search dropdown */
.fnld-live-results {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #ffffff;
    border: 1px solid var(--fnld-purple);
    border-top: none;
    z-index: 1000;
    max-height: 280px;
    overflow-y: auto;
    box-shadow: 0 4px 8px rgba(0,0,0,0.12);
}

.fnld-live-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.fnld-live-list li {
    padding: 7px 12px;
    border-bottom: 1px solid #eee;
    font-size: 12px;
}

.fnld-live-list li:hover {
    background: var(--fnld-light-bg);
}

.fnld-live-list li a {
    color: var(--fnld-blue);
    font-weight: bold;
}

.fnld-live-none {
    padding: 10px 12px;
    color: var(--fnld-meta);
    font-size: 12px;
}

/* Search results page */
.fnld-search-results-header {
    background: var(--fnld-section-bg);
    color: var(--fnld-section-text);
    padding: 6px 12px;
    font-size: 13px;
    border: 1px solid var(--fnld-border);
    margin-bottom: 10px;
}

.fnld-no-results {
    padding: 12px;
    color: var(--fnld-meta);
    border: 1px solid var(--fnld-border);
    font-size: 13px;
}

/* ======================================================
   SUBMIT FORM
   ====================================================== */
.fnld-submit-form {
    max-width: 580px;
    background: #ffffff;
    border: 1px solid var(--fnld-border);
    padding: 20px 24px;
}

.fnld-form-title {
    font-size: 16px;
    color: var(--fnld-purple);
    margin: 0 0 6px;
    border-bottom: 2px solid var(--fnld-purple);
    padding-bottom: 6px;
}

.fnld-form-intro {
    font-size: 12px;
    color: var(--fnld-meta);
    margin-bottom: 14px;
}

.fnld-field {
    margin-bottom: 12px;
}

.fnld-field label {
    display: block;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 3px;
    color: #333;
}

.fnld-req {
    color: var(--fnld-red);
}

.fnld-field input[type="text"],
.fnld-field input[type="url"],
.fnld-field input[type="email"],
.fnld-field select,
.fnld-field textarea {
    width: 100%;
    padding: 6px 8px;
    font-size: 13px;
    font-family: Arial, Helvetica, sans-serif;
    border: 1px solid #aaaaaa;
    border-radius: 2px;
    background: #ffffff;
    color: #000;
}

.fnld-field input:focus,
.fnld-field select:focus,
.fnld-field textarea:focus {
    border-color: var(--fnld-purple);
    outline: none;
    box-shadow: 0 0 0 2px rgba(64,0,152,0.12);
}

.fnld-field textarea {
    resize: vertical;
}

.fnld-field small {
    font-size: 10px;
    color: var(--fnld-meta);
    display: block;
    margin-top: 2px;
}

.fnld-field-row {
    display: flex;
    gap: 12px;
}

.fnld-field-row .fnld-field {
    flex: 1;
}

.fnld-submit-btn {
    background: var(--fnld-purple);
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    padding: 8px 24px;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
}

.fnld-submit-btn:hover {
    background: var(--fnld-purple-light);
}

.fnld-submit-btn:disabled {
    background: #aaa;
    cursor: not-allowed;
}

.fnld-submit-message {
    padding: 10px 14px;
    margin-bottom: 14px;
    font-size: 13px;
    border-radius: 2px;
}

.fnld-submit-message.success {
    background: #e8f5e9;
    border: 1px solid #4caf50;
    color: #1b5e20;
}

.fnld-submit-message.error {
    background: #ffebee;
    border: 1px solid #f44336;
    color: #b71c1c;
}

/* ======================================================
   POPULAR / RECENT WIDGETS
   ====================================================== */
.fnld-popular-list,
.fnld-recent-list {
    margin-bottom: 20px;
}

.fnld-widget-title {
    font-size: 14px;
    color: var(--fnld-purple);
    border-bottom: 2px solid var(--fnld-purple);
    padding-bottom: 4px;
    margin-bottom: 8px;
}

.fnld-ranked-list {
    list-style: decimal;
    padding-left: 20px;
    margin: 0;
}

.fnld-ranked-list li {
    padding: 4px 0;
    font-size: 13px;
    border-bottom: 1px dotted #ddd;
}

.fnld-ranked-list li a {
    color: var(--fnld-blue);
}

.fnld-click-badge {
    font-size: 10px;
    color: var(--fnld-meta);
    margin-left: 6px;
}

/* ======================================================
   PAGINATION
   ====================================================== */
.fnld-pagination {
    margin: 12px 0;
    font-size: 12px;
    text-align: center;
}

.fnld-pagination .page-numbers {
    display: inline-block;
    padding: 3px 8px;
    margin: 0 2px;
    border: 1px solid var(--fnld-border);
    color: var(--fnld-blue);
    text-decoration: none;
}

.fnld-pagination .page-numbers.current {
    background: var(--fnld-purple);
    color: #ffffff;
    border-color: var(--fnld-purple);
    font-weight: bold;
}

.fnld-pagination .page-numbers:hover:not(.current) {
    background: var(--fnld-light-bg);
}

/* ======================================================
   DIRECTORY FOOTER BAR
   ====================================================== */
.fnld-dir-footer {
    margin-top: 16px;
    padding: 8px 12px;
    background: var(--fnld-section-bg);
    font-size: 11px;
    color: var(--fnld-meta);
    border-top: 2px solid var(--fnld-purple);
    text-align: center;
}

.fnld-dir-footer a {
    color: var(--fnld-blue);
}

/* ======================================================
   UTILITY
   ====================================================== */
.fnld-no-cats,
.fnld-no-links {
    padding: 12px;
    color: var(--fnld-meta);
    font-size: 12px;
    border: 1px dashed var(--fnld-border);
}

.fnld-notice {
    padding: 10px 14px;
    background: #fff8e1;
    border: 1px solid var(--fnld-yellow-bdr);
    color: #555;
    font-size: 13px;
}

/* ======================================================
   TAXONOMY ARCHIVE (when using built-in term pages)
   ====================================================== */
.tax-directory_category .fnld-directory {
    margin-top: 10px;
}

/* ======================================================
   INTERMEDIATE REDIRECT PAGE — Flamenet style
   Mirrors .content-box / .box-header patterns from the theme.
   ====================================================== */
.fnld-redirect-wrap {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #000000;
    line-height: 1.3;
    /* Sits inside #page-wrapper so inherits the 780px column */
    margin: 6px 0;
}

/* Box shell — matches .content-box */
.fnld-redirect-card {
    border: 1px solid #CCCCCC;
    margin-bottom: 6px;
    background: #FFFFFF;
}

/* Blue title bar — matches .content-box .box-header */
.fnld-redirect-box-header {
    background: #003399;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: bold;
    padding: 3px 5px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fnld-redirect-box-header a {
    color: #FFCC00;
    text-decoration: none;
    font-size: 10px;
    font-weight: normal;
}

.fnld-redirect-box-header a:hover {
    text-decoration: underline;
}

/* Body padding */
.fnld-redirect-card-header {
    padding: 5px 5px 4px;
    border-bottom: 1px solid #CCCCCC;
}

/* Editor's pick badge */
.fnld-redirect-star {
    color: #CC7700;
    font-size: 10px;
    font-weight: bold;
    display: block;
    margin-bottom: 2px;
}

/* Site title — red, like logo accent */
.fnld-redirect-title {
    font-size: 14px;
    font-weight: bold;
    color: #CC0000;
    margin: 0 0 2px;
    line-height: 1.3;
}

/* External hostname — green like classic browser status bar */
.fnld-redirect-host {
    font-size: 10px;
    color: #006600;
    font-style: italic;
}

/* Description */
.fnld-redirect-desc {
    padding: 4px 5px;
    font-size: 11px;
    color: #333333;
    line-height: 1.4;
    border-bottom: 1px solid #CCCCCC;
}

.fnld-redirect-desc p {
    margin: 0 0 4px;
}

.fnld-redirect-desc p:last-child {
    margin-bottom: 0;
}

/* Category row */
.fnld-redirect-cats {
    padding: 3px 5px;
    font-size: 10px;
    color: #666666;
    border-bottom: 1px solid #CCCCCC;
}

.fnld-redirect-cats a {
    color: #0000CC;
    text-decoration: none;
}

.fnld-redirect-cats a:hover {
    text-decoration: underline;
}

/* Button row */
.fnld-redirect-actions {
    padding: 5px 5px 4px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

/* "VISIT SITE" — primary action, dark blue bg + outset border */
.fnld-visit-btn,
.fnld-visit-btn:visited,
.fnld-visit-btn:hover,
.fnld-visit-btn:visited:hover {
    color: #FFFFFF;
    text-decoration: none;
}

.fnld-visit-btn {
    display: inline-block;
    padding: 2px 14px;
    background: #003399;
    font-size: 11px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    border: 2px outset #336699;
    cursor: pointer;
}

.fnld-visit-btn:hover,
.fnld-visit-btn:visited:hover {
    background: #0044BB;
}

.fnld-visit-arrow {
    font-size: 11px;
}

/* "GO BACK" — secondary, matches the theme's standard outset button */
.fnld-back-btn {
    display: inline-block;
    padding: 2px 12px;
    background: #DDDDDD;
    color: #000000;
    font-size: 11px;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    border: 2px outset #CCCCCC;
    text-decoration: none;
    cursor: pointer;
}

.fnld-back-btn:hover {
    background: #CCCCCC;
    color: #000000;
    text-decoration: none;
}

/* Small "back to directory" text link above the box */
.fnld-back-link {
    display: inline-block;
    color: #0000CC;
    font-size: 10px;
    text-decoration: none;
    margin-bottom: 3px;
}

.fnld-back-link:hover {
    text-decoration: underline;
    color: #CC0000;
}

.fnld-back-arrow {
    font-size: 11px;
}

/* Disclaimer — 9px gray, matches theme's .small.gray */
.fnld-redirect-notice {
    padding: 3px 5px 4px;
    font-size: 9px;
    color: #666666;
    border-top: 1px dotted #CCCCCC;
}
