/**
 * Advanced Search Widget v2 — Frontend CSS
 * New: filters row, tags, type badge, reading time, history panel, view-all footer, highlight marks.
 * @package Advanced_Search_Widget
 */

/* ── Reset & Tokens ──────────────────────────────────────────────── */
.asw-wrapper*,.asw-wrapper *::before,.asw-wrapper *::after{box-sizing:border-box;}

.asw-wrapper{
	--asw-accent:      #4f46e5;
	--asw-accent-rgb:  79,70,229;
	--asw-text:        #111827;
	--asw-muted:       #6b7280;
	--asw-border:      #e5e7eb;
	--asw-bg:          #ffffff;
	--asw-bg-hover:    #f9fafb;
	--asw-shadow:      0 8px 32px rgba(0,0,0,.12),0 2px 6px rgba(0,0,0,.06);
	--asw-radius:      10px;
	--asw-tr:          .17s ease;
	--asw-font:        -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
	position:relative;width:100%;
	font-family:var(--asw-font);font-size:15px;color:var(--asw-text);
}

/* ── Row 1: Main bar ─────────────────────────────────────────────── */
.asw-form-row{display:flex;gap:8px;align-items:center;}

/* Input wrap */
.asw-input-wrap{position:relative;flex:1;min-width:0;}

.asw-input{
	display:block;width:100%;height:48px;
	padding:0 72px 0 44px;
	font-size:15px;font-family:var(--asw-font);color:var(--asw-text);
	background:var(--asw-bg);border:1.5px solid var(--asw-border);
	border-radius:var(--asw-radius);outline:none;
	transition:border-color var(--asw-tr),box-shadow var(--asw-tr);
	-webkit-appearance:none;appearance:none;
}
.asw-input::placeholder{color:var(--asw-muted);}
.asw-input:focus{border-color:var(--asw-accent);box-shadow:0 0 0 3px rgba(var(--asw-accent-rgb),.15);}
.asw-input::-webkit-search-cancel-button{-webkit-appearance:none;}

/* Date input variant */
.asw-input--date{height:40px;padding:0 12px;font-size:13px;flex:1;}

.asw-input-icon{position:absolute;top:50%;left:14px;transform:translateY(-50%);color:var(--asw-muted);pointer-events:none;display:flex;align-items:center;}

/* Clear button */
.asw-clear-btn{
	position:absolute;top:50%;right:40px;transform:translateY(-50%);
	background:none;border:none;cursor:pointer;color:var(--asw-muted);
	font-size:14px;padding:4px 6px;line-height:1;
	transition:color var(--asw-tr);
}
.asw-clear-btn:hover{color:var(--asw-text);}

/* Spinner */
.asw-spinner{
	position:absolute;top:50%;right:14px;transform:translateY(-50%);
	width:18px;height:18px;border:2px solid var(--asw-border);
	border-top-color:var(--asw-accent);border-radius:50%;
	opacity:0;pointer-events:none;transition:opacity var(--asw-tr);
}
.asw-spinner.is-active{opacity:1;animation:asw-spin .65s linear infinite;}
@keyframes asw-spin{to{transform:translateY(-50%) rotate(360deg);}}

.asw-is-loading .asw-input-icon{opacity:0;}

/* Select wrap */
.asw-select-wrap{position:relative;flex-shrink:0;}
.asw-select-wrap--sm{flex-shrink:0;}

.asw-select{
	height:48px;padding:0 34px 0 14px;
	font-size:14px;font-family:var(--asw-font);color:var(--asw-text);
	background:var(--asw-bg);border:1.5px solid var(--asw-border);
	border-radius:var(--asw-radius);outline:none;cursor:pointer;
	-webkit-appearance:none;appearance:none;
	transition:border-color var(--asw-tr),box-shadow var(--asw-tr);
}
.asw-select:focus{border-color:var(--asw-accent);box-shadow:0 0 0 3px rgba(var(--asw-accent-rgb),.15);}
.asw-select-arrow{position:absolute;top:50%;right:10px;transform:translateY(-50%);color:var(--asw-muted);pointer-events:none;font-size:18px;line-height:1;}

/* Search button */
.asw-btn{
	flex-shrink:0;display:flex;align-items:center;justify-content:center;
	width:48px;height:48px;background:var(--asw-accent);color:#fff;
	border:none;border-radius:var(--asw-radius);cursor:pointer;
	transition:background var(--asw-tr),transform var(--asw-tr),box-shadow var(--asw-tr);
}
.asw-btn:hover{filter:brightness(.9);box-shadow:0 4px 14px rgba(var(--asw-accent-rgb),.4);}
.asw-btn:active{transform:scale(.95);}

/* ── Row 2: Filters ──────────────────────────────────────────────── */
.asw-filters-row{
	display:flex;gap:8px;align-items:center;flex-wrap:wrap;
	margin-top:8px;
}
.asw-filters-row .asw-select{height:40px;font-size:13px;}
.asw-filters-row .asw-select-arrow{font-size:15px;}

/* Date range */
.asw-date-range{display:flex;align-items:center;gap:6px;}
.asw-date-sep{color:var(--asw-muted);font-size:13px;}

/* ── Results container ───────────────────────────────────────────── */
.asw-results{
	position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:9999;
	background:var(--asw-bg);border:1.5px solid var(--asw-border);
	border-radius:var(--asw-radius);box-shadow:var(--asw-shadow);
	overflow:hidden;max-height:520px;overflow-y:auto;
	opacity:0;transform:translateY(-6px);pointer-events:none;
	transition:opacity var(--asw-tr),transform var(--asw-tr);
}
.asw-results[hidden]{display:block!important;visibility:hidden;}
.asw-results.is-visible{opacity:1;transform:translateY(0);pointer-events:auto;visibility:visible;}
.asw-results::-webkit-scrollbar{width:5px;}
.asw-results::-webkit-scrollbar-thumb{background:var(--asw-border);border-radius:3px;}

/* ── Result item ─────────────────────────────────────────────────── */
.asw-result-item{
	display:flex;align-items:center;gap:14px;padding:13px 16px;
	text-decoration:none;color:inherit;
	border-left:3px solid transparent;
	transition:background var(--asw-tr),border-color var(--asw-tr);
}
.asw-result-item+.asw-result-item{border-top:1px solid var(--asw-border);}
.asw-result-item:hover,.asw-result-item.is-active,.asw-result-item:focus{
	background:var(--asw-bg-hover);border-left-color:var(--asw-accent);outline:none;
}

/* Thumbnail */
.asw-result-thumb{flex-shrink:0;width:52px;height:52px;border-radius:8px;overflow:hidden;background:var(--asw-bg-hover);display:flex;align-items:center;justify-content:center;}
.asw-result-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.asw-result-thumb--placeholder svg{color:var(--asw-border);}

/* Body */
.asw-result-body{flex:1;min-width:0;}
.asw-result-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:3px;}

.asw-result-category{
	display:inline-block;font-size:11px;font-weight:600;
	letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;
	border-radius:20px;background:rgba(var(--asw-accent-rgb),.1);color:var(--asw-accent);
	white-space:nowrap;
}
.asw-result-type{
	display:inline-block;font-size:10px;font-weight:600;
	letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;
	border-radius:20px;background:#f3f4f6;color:#374151;
	white-space:nowrap;
}
.asw-result-date,.asw-result-rt{font-size:11px;color:var(--asw-muted);}

.asw-result-title{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35;}
.asw-result-title mark{background:rgba(var(--asw-accent-rgb),.15);color:var(--asw-accent);border-radius:3px;padding:0 2px;}

.asw-result-excerpt{font-size:12px;color:var(--asw-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;line-height:1.4;}
.asw-result-excerpt mark{background:rgba(var(--asw-accent-rgb),.12);color:inherit;border-radius:2px;padding:0 1px;}

.asw-result-tags-row{margin-top:5px;display:flex;flex-wrap:wrap;gap:4px;}
.asw-tag-pill{font-size:10px;padding:2px 7px;border-radius:20px;background:var(--asw-bg-hover);border:1px solid var(--asw-border);color:var(--asw-muted);}

.asw-result-arrow{flex-shrink:0;font-size:20px;color:var(--asw-border);transition:color var(--asw-tr),transform var(--asw-tr);line-height:1;}
.asw-result-item:hover .asw-result-arrow,.asw-result-item.is-active .asw-result-arrow{color:var(--asw-accent);transform:translateX(2px);}

/* ── View all footer ──────────────────────────────────────────────── */
.asw-view-all{
	display:flex;align-items:center;justify-content:center;
	padding:12px;text-decoration:none;
	font-size:13px;font-weight:600;color:var(--asw-accent);
	background:rgba(var(--asw-accent-rgb),.04);
	border-top:1px solid var(--asw-border);
	transition:background var(--asw-tr);
}
.asw-view-all:hover{background:rgba(var(--asw-accent-rgb),.1);}

/* ── History panel ───────────────────────────────────────────────── */
.asw-history-header{
	display:flex;align-items:center;justify-content:space-between;
	padding:10px 16px 8px;font-size:11px;font-weight:700;
	text-transform:uppercase;letter-spacing:.06em;color:var(--asw-muted);
}
.asw-history-clear{
	background:none;border:none;cursor:pointer;font-size:11px;
	color:var(--asw-muted);padding:2px 6px;border-radius:4px;
	transition:color var(--asw-tr),background var(--asw-tr);
}
.asw-history-clear:hover{color:var(--asw-text);background:var(--asw-border);}

.asw-history-item{
	display:flex;align-items:center;gap:10px;width:100%;
	padding:10px 16px;background:none;border:none;border-top:1px solid var(--asw-border);
	text-align:left;cursor:pointer;color:var(--asw-text);font-size:14px;font-family:var(--asw-font);
	transition:background var(--asw-tr);
}
.asw-history-item:hover{background:var(--asw-bg-hover);}
.asw-history-item svg{flex-shrink:0;color:var(--asw-muted);}

/* ── Messages ────────────────────────────────────────────────────── */
.asw-message{padding:20px 16px;text-align:center;font-size:14px;}
.asw-message--info,.asw-message--empty{color:var(--asw-muted);}
.asw-message--error{color:#dc2626;}

/* ── Responsive ──────────────────────────────────────────────────── */
@media(max-width:640px){
	.asw-form-row{flex-wrap:wrap;}
	.asw-select-wrap{width:100%;}
	.asw-select{width:100%;}
	.asw-filters-row{flex-direction:column;align-items:stretch;}
	.asw-filters-row .asw-select-wrap{width:100%;}
	.asw-filters-row .asw-select{width:100%;}
	.asw-date-range{width:100%;}
}

/* ── Dark mode ───────────────────────────────────────────────────── */
@media(prefers-color-scheme:dark){
	.asw-wrapper{
		--asw-text:    #f9fafb;
		--asw-muted:   #9ca3af;
		--asw-border:  #374151;
		--asw-bg:      #1f2937;
		--asw-bg-hover:#111827;
		--asw-shadow:  0 8px 32px rgba(0,0,0,.5),0 2px 6px rgba(0,0,0,.3);
	}
	.asw-result-type{background:#374151;color:#d1d5db;}
	.asw-tag-pill{background:#374151;border-color:#4b5563;color:#9ca3af;}
}