 /* ============================================ CSS Variables for Consistency (DRY Principle) ============================================ */:root{--btn-radius-sm:12px;--btn-radius-md:16px;--btn-radius-lg:20px;--btn-radius-xl:24px;--radius-default:12px;--radius-sm:8px;--radius-lg:16px;--radius-round:50%;--padding-xs:6px 12px;--padding-sm:8px 16px;--padding-md:12px 24px;--padding-lg:1rem 1.25rem;--padding-xl:1.25rem 1.5rem;--btn-primary-bg:rgba(255,255,255,0.85);--btn-primary-text:var(--ai-icon-blue,#007aff);--btn-primary-border:rgba(255,255,255,0.3);--btn-secondary-bg:rgba(255,255,255,0.7);--btn-secondary-text:var(--color-label,#333);--btn-secondary-border:rgba(255,255,255,0.2);--btn-danger-bg:rgba(255,59,48,0.1);--btn-danger-text:#ff3b30;--btn-danger-border:rgba(255,59,48,0.3)}/* ============================================ Unified Button System - MOVED TO liquid-glass-buttons.css Commented out on 2025-09-07 to avoid duplication All button styles now handled by liquid-glass-buttons.css ============================================ */ /* .btn-liquid,.btn.btn-liquid-glass,.property-action .btn,.analysis-actions .btn,.form-actions .btn,a.btn:not(.btn-link):not(.btn-outline-primary):not(.btn-outline-secondary){[MOVED TO liquid-glass-buttons.css]}.btn-sm{[MOVED TO liquid-glass-buttons.css]}.btn-lg{[MOVED TO liquid-glass-buttons.css]}.btn:hover{[MOVED TO liquid-glass-buttons.css]}.btn:active{[MOVED TO liquid-glass-buttons.css]}.btn-primary{[MOVED TO liquid-glass-buttons.css]}.btn-secondary{[MOVED TO liquid-glass-buttons.css]}.btn-secondary:hover{[MOVED TO liquid-glass-buttons.css]}.btn-danger{[MOVED TO liquid-glass-buttons.css]}.btn-danger:hover{[MOVED TO liquid-glass-buttons.css]}.property-action .btn{flex:1;[Keep this context-specific rule]}.header-actions .btn{[MOVED TO liquid-glass-buttons.css]}.analysis-actions .btn,.form-actions .btn{[MOVED TO liquid-glass-buttons.css]}*/ body.dashboard-page{background:linear-gradient(135deg,#f1f5f9 0%,#e2e8f0 50%,#cbd5e1 100%) !important;min-height:100vh;position:relative}body.dashboard-page::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 30%,rgba(99,102,241,0.06) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(168,85,247,0.06) 0%,transparent 50%),radial-gradient(circle at 50% 50%,rgba(59,130,246,0.04) 0%,transparent 50%);pointer-events:none;z-index:0}.dashboard{padding:2rem 1.5rem;background:transparent;min-height:calc(100vh - var(--navbar-height) - var(--footer-height));position:relative;max-width:1400px;margin:0 auto}.ripple-effect{position:absolute;border-radius:50%;width:100px;height:100px;background:radial-gradient(circle,rgba(255,255,255,0.5) 0%,transparent 70%);transform:translate(-50%,-50%) scale(0);animation:ripple 0.6s ease-out;pointer-events:none;top:50%;left:50%}@keyframes ripple{to{transform:translate(-50%,-50%) scale(4);opacity:0}}.glass-focus{position:relative}.glass-focus::after{content:'';position:absolute;inset:-2px;border-radius:inherit;background:linear-gradient(45deg,rgba(0,122,255,0.3),rgba(0,86,204,0.3),rgba(0,122,255,0.3));filter:blur(8px);opacity:0;transition:opacity 0.3s ease;z-index:-1}.glass-focus:focus-within::after{opacity:1}.dashboard .card .card-header{padding:1.25rem 1.5rem;background:linear-gradient(135deg,rgba(248,250,252,0.9) 0%,rgba(241,245,249,0.8) 100%) !important;color:#334155 !important;border-bottom:1px solid rgba(226,232,240,0.5);border-radius:16px 16px 0 0;position:relative;overflow:hidden}.dashboard .card .card-header::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.4) 50%,transparent 100%)}.dashboard .card .card-header h2,.dashboard .card .card-header h3{margin:0;color:var(--slate-800,#1e293b) !important;font-weight:600;font-size:1rem;letter-spacing:0.2px}.dashboard .property-card .property-header{padding:1.25rem 1.5rem;background:linear-gradient(135deg,rgba(241,245,249,0.95) 0%,rgba(226,232,240,0.9) 100%) !important;color:#334155;border-bottom:1px solid rgba(226,232,240,0.4);border-radius:14px 14px 0 0;display:flex;justify-content:space-between;align-items:center;position:relative;overflow:hidden}.dashboard .property-card .property-header::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.4) 50%,transparent 100%)}.dashboard .property-card .property-header h3,.dashboard .property-card .property-header h4{margin:0;color:var(--slate-800,#1e293b) !important;font-weight:600;font-size:0.95rem;letter-spacing:0.1px}.dashboard-title{font-size:2rem;font-weight:600;color:var(--slate-800,#1e293b) !important;margin-bottom:2rem;text-align:left;position:relative;z-index:10;letter-spacing:-0.02em;line-height:1.2}.card{position:relative;z-index:10;animation:fadeIn 0.6s ease-out;background:linear-gradient(135deg,rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.5) 100%) !important;backdrop-filter:blur(10px) saturate(120%) !important;-webkit-backdrop-filter:blur(10px) saturate(120%) !important;border:1px solid rgba(255,255,255,0.6) !important;border-radius:16px;box-shadow:0 4px 24px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.8) !important;margin-bottom:1.5rem;overflow:hidden;transition:all 0.3s cubic-bezier(0.25,0.1,0.25,1)}.card-body{padding:1.5rem;position:relative;z-index:2;background:transparent;color:var(--slate-600,#475569) !important}.card-body p,.card-body strong{color:var(--slate-700,#334155) !important}.info-box{background:linear-gradient(135deg,rgba(255,255,255,0.85) 0%,rgba(255,255,255,0.75) 100%);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);padding:1.5rem;border:1px solid rgba(255,255,255,0.4);margin-bottom:1.5rem;border-radius:16px;box-shadow:0 4px 24px rgba(0,0,0,0.06),inset 0 1px 0 rgba(255,255,255,0.6);position:relative}.api-token{display:block;padding:1rem 1.25rem;background:var(--material-ultra-thin-bg);backdrop-filter:blur(var(--material-thin-blur));-webkit-backdrop-filter:blur(var(--material-thin-blur));margin-bottom:1.5rem;font-family:"SF Mono","Menlo",monospace;border:1px solid var(--material-thin-border);border-radius:12px;word-break:break-all;width:100%;font-size:0.85rem;color:var(--heading-color);box-shadow:inset 0 2px 8px rgba(0,0,0,0.06);opacity:0.9}.available-tokens{font-weight:500;margin-top:1rem;display:flex;align-items:center;gap:0.75rem}.available-tokens span{margin-right:0.5rem;font-size:0.9375rem;color:var(--secondary-text,#666)}.available-tokens strong{color:var(--foreground-text,#1f1f1f);font-weight:600}/* Commented out old button styles - using liquid-glass-buttons.css instead .btn-primary{// Old styles removed - see liquid-glass-buttons.css}.btn-primary:hover{// Old styles removed - see liquid-glass-buttons.css}.btn-primary:active{// Old styles removed - see liquid-glass-buttons.css}*/ .btn-primary i{font-size:1.125rem}.btn-outline{background:white;color:var(--ai-icon-blue);border:1px solid rgba(0,122,255,0.2);box-shadow:0 1px 3px rgba(0,0,0,0.04);transition:all 0.2s ease}.btn-outline:hover{background:rgba(0,122,255,0.05) !important;border-color:var(--ai-icon-blue);color:var(--ai-icon-blue);text-decoration:none;box-shadow:0 2px 6px rgba(0,122,255,0.1)}.btn-small{padding:0.5rem 0.875rem;font-size:0.8125rem;border-radius:var(--radius-sm,6px)}.properties-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:1.5rem;margin-top:1.5rem}.property-card{background:linear-gradient(135deg,rgba(255,255,255,0.6) 0%,rgba(255,255,255,0.4) 100%) !important;backdrop-filter:blur(8px) saturate(120%) !important;-webkit-backdrop-filter:blur(8px) saturate(120%) !important;border-radius:14px;box-shadow:0 4px 16px rgba(0,0,0,0.08),inset 0 1px 0 rgba(255,255,255,0.7) !important;border:1px solid rgba(255,255,255,0.5) !important;overflow:hidden;transition:transform 0.2s ease,box-shadow 0.2s ease;animation:fadeIn 0.6s ease-out;position:relative}.property-card:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,0,0,0.1),inset 0 1px 0 rgba(255,255,255,0.8)}.property-body{padding:1.5rem;position:relative;z-index:2}.platform-links{display:flex;flex-wrap:wrap;gap:0.75rem;margin-bottom:1.5rem}.platform-link{display:inline-flex;align-items:center;gap:0.5rem;padding:0.625rem 1rem;background:rgba(255,255,255,0.5);backdrop-filter:blur(6px) saturate(120%);-webkit-backdrop-filter:blur(6px) saturate(120%);border-radius:8px;border:1px solid rgba(226,232,240,0.5);color:#475569;text-decoration:none;transition:all 0.2s ease;position:relative;font-size:0.875rem;box-shadow:0 2px 8px rgba(0,0,0,0.06),inset 0 1px 0 rgba(255,255,255,0.6)}.platform-link:hover{background:rgba(255,255,255,0.7);transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,0.08),inset 0 1px 0 rgba(255,255,255,0.8)}.platform-link i{font-size:1.125rem;transition:all 0.2s ease}.platform-link span{font-size:0.875rem;font-weight:500;color:var(--slate-600,#475569);transition:all 0.2s ease}.platform-link.google i{color:var(--google-color,#4285F4)}.platform-link.booking i{color:var(--booking-color,#003580)}.platform-link.expedia i{color:var(--expedia-color,#ffcc00)}.platform-link.tripadvisor i{color:var(--tripadvisor-color,#00af87)}.platform-link.holidaycheck i{color:var(--holidaycheck-color,#0058a3)}.property-action{display:flex;justify-content:center;margin-top:1.25rem;gap:0.75rem}.property-action .btn:hover{background:var(--ai-icon-blue) !important;color:white !important;border-color:var(--ai-icon-blue) !important;box-shadow:0 4px 12px rgba(0,122,255,0.2) !important;transform:translateY(-1px)}.dashboard .property-header a,.dashboard .property-header .btn,.dashboard .property-header .edit-link{color:#64748b !important;background:rgba(255,255,255,0.6) !important;border:1px solid rgba(226,232,240,0.5) !important;padding:0.375rem 0.75rem;border-radius:6px;font-size:0.8125rem;font-weight:500;text-decoration:none;transition:all 0.15s ease}.dashboard .property-header a:hover,.dashboard .property-header .btn:hover,.dashboard .property-header .edit-link:hover{background:rgba(255,255,255,0.9) !important;color:#475569 !important;box-shadow:0 2px 8px rgba(0,0,0,0.08)}.response-body{padding:1.25rem;border-bottom:1px solid var(--subtle-border,rgba(0,0,0,0.03))}.response-body p{margin-bottom:0.75rem;line-height:1.6;color:var(--secondary-text,#666)}.response-body p:last-child{margin-bottom:0}.response-body p strong{font-weight:600;color:var(--foreground-text,#1f1f1f)}.response-content{padding:1.25rem;background:rgba(0,0,0,0.01)}.response-bubble{background:var(--material-bar-bg);backdrop-filter:blur(var(--material-thin-blur));-webkit-backdrop-filter:blur(var(--material-thin-blur));border-radius:var(--radius);padding:1.5rem;box-shadow:var(--card-shadow);border:1px solid var(--glass-border);transition:var(--transition)}.response-bubble h4{font-size:1rem;font-weight:600;color:var(--heading-color,#2d3748);margin:0 0 0.75rem 0}.response-bubble p{margin:0;font-size:0.9375rem;line-height:1.6;color:var(--secondary-text,#666)}.response-buttons{display:flex;justify-content:center;gap:0.75rem;padding:1rem 1.25rem;border-top:1px solid var(--subtle-border,rgba(0,0,0,0.03))}.response-btn{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-color,rgba(0,0,0,0.1));background:transparent;color:var(--foreground-text,#1f1f1f);font-weight:500;cursor:pointer;transition:all 0.3s ease}.response-btn:hover{background:rgba(0,0,0,0.05)}.response-btn.active{background:var(--ai-accent-gradient,linear-gradient(135deg,#6e49ff,#3a8cff));color:white;border-color:transparent;transform:scale(1.1)}.pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:2rem}.page-info{color:var(--secondary-text,#666);font-size:0.9375rem}.card.warning{border-left:4px solid #f39c12;background:linear-gradient(135deg,rgba(255,250,240,0.95) 0%,rgba(255,245,230,0.85) 100%)}.card.warning .card-header{background:linear-gradient(135deg,#f39c12 0%,#e67e22 100%);color:white}.card.warning .card-header h3{color:white}.card.warning .card-header i{margin-right:0.5rem}.info-message{padding:1rem;background:linear-gradient(135deg,rgba(52,152,219,0.08) 0%,rgba(52,152,219,0.04) 100%);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(52,152,219,0.2);border-radius:12px;margin-bottom:1rem}.info-message p{margin:0;color:var(--secondary-text,#666)}.empty-state{padding:2.5rem 1.5rem;text-align:center}.empty-state-icon{font-size:3rem;color:var(--secondary-text,#666);opacity:0.5;margin-bottom:1rem}.empty-state-text{font-size:1.125rem;color:var(--secondary-text,#666);margin-bottom:1.5rem}.empty-platform-message{display:flex;align-items:center;justify-content:center;padding:1.5rem;background:rgba(255,255,255,0.3);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:12px;border:2px dashed rgba(0,122,255,0.2);min-height:80px}.empty-platform-message p{margin:0;color:var(--secondary-text,#666);font-size:0.9375rem}.page-transitioning{animation:fadeOut 0.3s forwards}@keyframes fadeOut{from{opacity:1}to{opacity:0.7}}@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:992px){}@media (max-width:768px){.dashboard{padding:1.5rem 1rem}.dashboard-title{font-size:1.75rem;margin-bottom:1.5rem}.properties-grid{grid-template-columns:1fr;gap:1.5rem}.platform-links{flex-direction:column;gap:0.5rem}.platform-link{width:100%;justify-content:flex-start}.card-header,.property-header{padding:1.25rem 1.5rem}.card-body,.property-body{padding:1.5rem}.available-tokens{flex-direction:column;align-items:flex-start;gap:0.5rem}}@media (max-width:480px){.dashboard{padding:1rem 0.75rem}.dashboard-title{font-size:1.5rem}.properties-grid{grid-template-columns:1fr;margin-top:1rem}.card-header,.property-header{padding:1rem;border-radius:16px 16px 0 0}.card-body,.property-body{padding:1rem}.btn-primary{padding:0.75rem 1.25rem;font-size:0.875rem}}tr[data-property-id]{opacity:1}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}.property-card:hover,.response-card:hover,.platform-link:hover,.btn:hover{transform:none}}.analysis-container{max-width:1400px;margin:0 auto;padding:var(--space-xl)}/* ============================================================================ ANALYSIS HEADER COMPONENTS - Single Source of Truth Compact,responsive design using CSS variables ============================================================================ */ .analysis-header{display:flex;justify-content:space-between;align-items:center;background:var(--material-ultra-thin-bg);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--material-thin-border);border-radius:var(--radius-sm);padding:var(--space-lg) var(--space-xl);margin-bottom:var(--space-xl);box-shadow:var(--material-regular-shadow)}.analysis-header-main{margin-bottom:var(--space-lg)}.analysis-title{display:flex;align-items:center;gap:var(--space-md);font-size:1.375rem;font-weight:600;color:var(--heading-color);margin:0 0 var(--space-xs) 0;line-height:1.2}.property-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--ai-accent-gradient);border-radius:var(--radius-xs);color:white;font-size:1rem;flex-shrink:0}.analysis-subtitle{font-size:0.75rem;color:var(--secondary-text);margin:0;opacity:0.8;font-weight:400}.analysis-metadata{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:var(--space-lg)}.analysis-stats-grid{display:flex;gap:var(--space-lg);flex-wrap:wrap}.analysis-stat-item{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-xs);min-width:80px}.stat-value,.analysis-stat-item .stat-value{font-size:1.25rem;font-weight:600;color:var(--ai-icon-blue);line-height:1}.stat-label,.analysis-stat-item .stat-label{font-size:0.625rem;color:var(--secondary-text);text-transform:uppercase;letter-spacing:0.3px;font-weight:500}.analysis-actions{display:flex;gap:var(--space-md)}.nav-button{display:inline-flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-xs);font-size:0.75rem;font-weight:500;text-decoration:none;transition:all 0.3s ease;border:none;cursor:pointer}.analysis-actions .btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,122,255,0.25);background:#0056CC}/* ============================================================================ PLATFORM STATS COMPONENTS - Polished Hierarchy Design ============================================================================ */:root{--brand-google:#4285F4;--brand-booking:#003580;--brand-expedia:#FFC100;--brand-tripadvisor:#00AF87;--brand-holidaycheck:#0058A3}.platform-stats{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:12px;margin:0 0 var(--space-xl) 0;padding:0;list-style:none}@media (min-width:720px){.platform-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1080px){.platform-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}.platform-stat-card{margin:0}.platform-stat-link{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;background:var(--material-ultra-thin-bg);backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));-webkit-backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));border:1px solid var(--material-thin-border);border-radius:16px;box-shadow:var(--material-thin-shadow);text-decoration:none;color:var(--text-primary);transition:transform 0.08s ease,box-shadow 0.2s ease,border-color 0.2s ease}.platform-stat-link:hover{transform:translateY(-1px);box-shadow:var(--material-regular-shadow);border-color:var(--material-regular-border)}.platform-stat-link:focus-visible{outline:none;box-shadow:var(--material-thin-shadow),0 0 0 3px rgba(67,97,238,0.25)}.platform-stat-left{display:flex;align-items:center;gap:10px;min-width:0}.platform-brand-dot{width:6px;height:24px;border-radius:3px;display:inline-block;background:var(--material-regular-border)}.platform-brand-dot.brand-google{background:var(--brand-google)}.platform-brand-dot.brand-booking{background:var(--brand-booking)}.platform-brand-dot.brand-expedia{background:var(--brand-expedia)}.platform-brand-dot.brand-tripadvisor{background:var(--brand-tripadvisor)}.platform-brand-dot.brand-holidaycheck{background:var(--brand-holidaycheck)}.platform-stat-icon{width:20px;height:20px;opacity:0.9}.platform-stat-label{font-size:0.95rem;font-weight:600;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.platform-stat-right{display:flex;align-items:center;gap:8px}.platform-stat-count{font-size:1.6rem;font-weight:700;letter-spacing:-0.02em;color:var(--text-primary)}.platform-stat-delta{font-size:0.75rem;padding:2px 6px;border-radius:999px;background:var(--success-bg,#ecfdf5);color:var(--success-text,#065f46);border:1px solid var(--success-border,#a7f3d0)}.platform-stat-delta.delta-up::before{content:"↑ "}.platform-stat-delta.delta-down{background:var(--error-bg,#fef2f2);color:var(--error-text,#991b1b);border-color:var(--error-border,#fecaca)}.platform-stat-delta.delta-down::before{content:"↓ "}.analysis-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(600px,1fr));gap:2rem;margin-bottom:3rem}.card{background:white;border-radius:20px;box-shadow:var(--material-regular-shadow);border:1px solid var(--material-thin-border);overflow:hidden;transition:all 0.3s ease}.card-header small{color:var(--material-bar-bg);font-size:14px;font-weight:400;margin-top:0.5rem;display:block}.card-body{padding:1.5rem;position:relative;z-index:2;background:transparent;color:#475569 !important}.card-body p,.card-body strong{color:#334155 !important}.header-actions{display:flex;gap:0.75rem;margin-top:1rem}.header-actions .btn:hover{background:var(--material-regular-bg);transform:translateY(-1px)}.badge{display:inline-block;padding:0.35em 0.65em;font-size:0.85em;font-weight:600;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:50rem}.badge-success{color:#fff;background-color:var(--ai-icon-blue,#3a8cff)}.badge-warning{color:#212529;background-color:#ffc107}.modal-content{border-radius:20px;box-shadow:var(--material-ultra-thick-shadow);max-width:600px}.tag-section{margin-bottom:2rem;background:white;border-radius:12px;padding:1.5rem;box-shadow:var(--material-ultra-thin-shadow);border:1px solid rgba(0,0,0,0.05)}.tag-section-title{margin:0 0 1rem 0;color:var(--heading-color);font-size:18px;font-weight:600;display:flex;align-items:center;justify-content:space-between}.tag-count{font-size:12px;color:var(--secondary-text);font-weight:500;background:rgba(107,114,128,0.1);padding:4px 12px;border-radius:20px}.tag-section-description{font-size:14px;color:var(--secondary-text);margin-bottom:1rem;font-style:italic;line-height:1.4}.tag-item{background:#f8fafc;border-radius:8px;padding:1rem;margin-bottom:0.75rem;border:1px solid rgba(0,0,0,0.05);transition:all 0.2s ease;display:flex;justify-content:space-between;align-items:center}.tag-item:hover{background:white;box-shadow:var(--material-ultra-thin-shadow)}.tag-info{display:flex;align-items:center;gap:0.75rem}.tag-name{font-weight:600;color:var(--heading-color);font-size:15px}.tag-type{font-size:11px;padding:3px 8px;border-radius:12px;background:#e5e7eb;color:#6b7280;font-weight:500;text-transform:uppercase;letter-spacing:0.5px}.tag-actions{display:flex;gap:0.5rem}.tag-actions .btn{}.no-tags-message{text-align:center;color:var(--secondary-text);font-style:italic;padding:2rem;background:#f8fafc;border-radius:8px;border:2px dashed #e5e7eb}.table-container{background:white;border-radius:12px;overflow:hidden;box-shadow:var(--material-ultra-thin-shadow)}.table{width:100%;border-collapse:collapse;margin:0}.table thead{background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%)}.table th{padding:1.25rem 1.5rem;font-weight:600;color:var(--heading-color);border-bottom:2px solid rgba(0,0,0,0.05);font-size:14px;letter-spacing:0.5px;text-transform:uppercase}.table td{padding:1.25rem 1.5rem;border-bottom:1px solid rgba(0,0,0,0.04);font-size:15px;color:var(--foreground-text)}.table tbody tr:hover{background:rgba(102,126,234,0.02)}.table tbody tr:last-child td{border-bottom:none}.badge{display:inline-flex;align-items:center;padding:6px 16px;font-size:13px;font-weight:600;line-height:1;text-align:center;white-space:nowrap;border-radius:20px;transition:all 0.3s ease}.badge-success{background:var(--material-thin-bg);backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));-webkit-backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));color:#10b981;box-shadow:var(--material-thin-shadow);border:1px solid rgba(16,185,129,0.3);position:relative;overflow:hidden}.badge-success::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(16,185,129,0.15),rgba(5,150,105,0.1));pointer-events:none}.badge-warning{background:var(--material-thin-bg);backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));-webkit-backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));color:#f59e0b;box-shadow:var(--material-thin-shadow);border:1px solid rgba(245,158,11,0.3);position:relative;overflow:hidden}.badge-warning::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(245,158,11,0.15),rgba(217,119,6,0.1));pointer-events:none}.analysis-results{display:none;animation:fadeIn 0.5s ease forwards}.analysis-results.visible{display:block}.analysis-results .container{max-width:1400px;margin:0 auto;padding:0 2rem}@media (max-width:1350px){.analysis-results .container{padding:0 30px}}@media (max-width:1200px){.analysis-results .container{padding:0 20px}}@media (max-width:768px){.analysis-results .container{padding:0 20px}}@media (max-width:480px){.analysis-results .container{padding:0 16px}}.analysis-content .analysis-card{margin-bottom:2rem}.cache-indicator{background:var(--material-thin-bg);backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));-webkit-backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));color:#92400e;padding:1rem 1.5rem;border-radius:12px;margin-bottom:2rem;display:flex;align-items:center;gap:0.75rem;box-shadow:var(--material-thin-shadow);border:1px solid rgba(245,158,11,0.2);position:relative;overflow:hidden}.cache-indicator::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(254,243,199,0.3) 0%,rgba(253,230,138,0.3) 100%);pointer-events:none}.cache-indicator i{font-size:18px}.cache-indicator .btn{margin-left:auto}.cache-indicator .btn:hover{background:#78350f}.form-actions{display:flex;gap:1rem;justify-content:center;margin-top:3rem;padding:2rem;background:white;border-radius:16px;box-shadow:var(--material-thin-shadow)}.form-actions .btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,122,255,0.25);background:#0056CC}.manual-help-button{position:fixed;bottom:30px;right:30px;background:var(--material-thick-bg);backdrop-filter:blur(var(--material-thick-blur)) saturate(var(--material-thick-saturate));-webkit-backdrop-filter:blur(var(--material-thick-blur)) saturate(var(--material-thick-saturate));color:var(--ai-icon-blue);border:1px solid var(--material-thick-border);border-radius:25px;padding:15px 25px;cursor:pointer;display:flex;align-items:center;gap:12px;box-shadow:var(--material-thick-shadow);transition:all 0.3s cubic-bezier(0.175,0.885,0.32,1.275);z-index:999;font-weight:600;font-size:15px;position:relative;overflow:hidden}.manual-help-button::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ai-accent-gradient);opacity:0.12;pointer-events:none}.manual-help-button:hover{transform:translateY(-3px);box-shadow:var(--material-ultra-thick-shadow);background:var(--material-ultra-thick-bg)}.manual-help-button:hover::before{opacity:0.18}.manual-help-button .help-icon{width:36px;height:36px;border-radius:50%;background:var(--material-thin-bg);display:flex;align-items:center;justify-content:center}.manual-help-button .help-icon span{font-size:18px}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:0.5rem;font-weight:600;color:var(--heading-color)}.form-control{width:100%;padding:12px 16px;border:2px solid rgba(0,0,0,0.1);border-radius:12px;font-size:14px;font-family:inherit;background:#f8fafc;transition:all 0.3s ease}.form-control:focus{outline:none;border-color:#007AFF;background:white}.form-text{font-size:13px;color:var(--secondary-text);margin-top:0.5rem;line-height:1.4}.toast{position:fixed;top:20px;right:20px;padding:12px 20px;border-radius:12px;color:white;font-weight:600;font-size:14px;z-index:1001;transform:translateX(100%);transition:all 0.3s ease;box-shadow:var(--material-thick-shadow)}.toast.visible{transform:translateX(0)}.toast.toast-success{background:linear-gradient(135deg,#10b981,#059669)}.toast.toast-error{background:linear-gradient(135deg,#ef4444,#dc2626)}@media (max-width:1024px){.analysis-grid{grid-template-columns:1fr}.platform-stats{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--space-md)}}@media (max-width:880px){.platform-stats{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--space-sm)}}@media (max-width:768px){.analysis-container{padding:var(--space-lg)}.analysis-header{flex-direction:column;align-items:flex-start;gap:var(--space-md);padding:var(--space-md) var(--space-lg)}.analysis-header-main{margin-bottom:var(--space-md)}.analysis-title{font-size:1.125rem;gap:var(--space-sm)}.property-icon{width:24px;height:24px;font-size:0.875rem}.analysis-subtitle{font-size:0.6875rem}.analysis-metadata{flex-direction:column;align-items:flex-start;gap:var(--space-lg)}.analysis-stats-grid{flex-direction:column;gap:var(--space-md)}.analysis-stat-item{flex-direction:row;justify-content:flex-start;gap:var(--space-md);min-width:auto}.stat-value,.analysis-stat-item .stat-value{font-size:1rem}.stat-label,.analysis-stat-item .stat-label{font-size:0.625rem}.platform-stats{grid-template-columns:1fr;gap:var(--space-md)}.platform-stat-card{padding:var(--space-md) var(--space-lg);display:flex;align-items:center;text-align:left;gap:var(--space-lg)}.platform-stat-card i{font-size:1.125rem;margin-bottom:0;flex-shrink:0}.platform-stat-count{font-size:1.25rem;margin:0}.platform-stat-label{font-size:0.625rem}.card-body{padding:1.5rem}.manual-help-button{bottom:20px;right:20px;padding:12px 20px}.manual-help-button .help-text{display:none}.modal-content{width:95%;margin:0 1rem}.modal-body{padding:1.5rem}}@media (max-width:480px){.analysis-actions{flex-direction:column}.header-actions{flex-direction:column}.form-actions{flex-direction:column}.chat-input-container{padding:1rem}}@media print{.manual-help-button,.analysis-actions,.header-actions{display:none !important}.analysis-container{padding:0;background:white}.card{break-inside:avoid;box-shadow:none;border:1px solid #ddd}.modal{display:none !important}}.modal-header{background:var(--material-regular-bg);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--material-regular-border);color:var(--ai-icon-blue);padding:1.5rem 2rem;display:flex;justify-content:space-between;align-items:center;position:relative;overflow:hidden}.modal-header::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ai-accent-gradient);opacity:0.08;pointer-events:none}.modal-header h2{margin:0;font-size:20px;font-weight:700}.modal-header .close{background:none;border:none;color:var(--ai-icon-blue);font-size:24px;cursor:pointer;padding:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease;position:relative;z-index:1}.modal-header .close:hover{background:var(--material-thin-bg)}.modal-body{padding:2rem;max-height:calc(80vh - 200px);overflow-y:auto}/* ============================================================================ Demo Reviews Section Styles (lines 1774-2330) MIGRATED TO demo-styles.css on 2025-09-05 Analysis Results:- 39 CSS classes total,0 dead code (100% active) - All classes verified as used in templates - 557 lines successfully migrated Files using these styles:- demo_dashboard.html (primary user - needs demo-styles.css import!) - demo-grand-plaza.html (already imports demo-styles.css) - demo-seaside-resort.html (already imports demo-styles.css) - Various review templates (uses .platform-icon) Migrated classes include:- Demo review container and cards - Platform-specific styling (Google,Booking,TripAdvisor) - Review rating displays - Response generation UI - Business response displays - Responsive design media queries ============================================================================ */ /* AI Chat Demo Styles (SDM-CODE-005) - MIGRATED TO ai-chat-liquid.css on 2025-09-05 DEAD CODE REMOVED:#demo-ai-chat,.assistant-message,.assistant-response,.chat-welcome,.chat-input-wrapper,.predefined-questions,.question-btn,.user-message ACTIVE CODE MOVED:.chat-message,.message-avatar,.message-content,.chat-messages,.chat-input-container,.chat-input,.send-btn */ /* #demo-ai-chat .chat-interface{display:flex;flex-direction:column;gap:1.5rem}.chat-welcome{margin-bottom:1rem}.chat-message{display:flex;gap:1rem;margin-bottom:1rem}.assistant-message{align-items:flex-start}.message-avatar{width:40px;height:40px;border-radius:50%;background:var(--material-regular-bg);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--material-regular-border);display:flex;align-items:center;justify-content:center;color:var(--ai-icon-blue);font-size:1.1rem;flex-shrink:0;position:relative;overflow:hidden}.message-avatar::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ai-accent-gradient);opacity:0.12;pointer-events:none}.message-content{flex:1;background:rgba(247,250,252,0.8);border:1px solid rgba(226,232,240,0.5);border-radius:16px;padding:1rem 1.25rem;backdrop-filter:blur(var(--material-thin-blur));box-shadow:var(--material-ultra-thin-shadow)}.message-content p{margin:0;color:#334155;line-height:1.5}.predefined-questions{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin:1.5rem 0}.question-btn{background:var(--material-bar-bg);border:1px solid rgba(226,232,240,0.6);border-radius:12px;padding:1rem 1.25rem;text-align:left;cursor:pointer;transition:all 0.2s ease;backdrop-filter:blur(var(--material-thin-blur));box-shadow:var(--material-ultra-thin-shadow);display:flex;flex-direction:column;gap:0.5rem}.question-btn:hover{background:var(--material-bar-bg);border-color:#007AFF;transform:translateY(-1px);box-shadow:0 4px 16px rgba(0,122,255,0.15)}.question-btn:active{transform:translateY(0)}.question-btn i{color:#007AFF;font-size:1.1rem;margin-bottom:0.25rem}.question-btn span{color:#1e293b;font-weight:500;font-size:0.95rem;line-height:1.4}.question-btn small{color:#64748b;font-size:0.8rem;font-style:italic}.chat-messages{min-height:200px;max-height:400px;overflow-y:auto;border:1px solid rgba(226,232,240,0.5);border-radius:12px;padding:1rem;background:rgba(248,250,252,0.3);backdrop-filter:blur(var(--material-ultra-thin-blur))}.chat-messages:empty::before{content:"Your conversation will appear here...";color:#94a3b8;font-style:italic;display:block;text-align:center;padding:2rem}.user-message{justify-content:flex-end}.user-message .message-content{background:var(--material-regular-bg);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--material-regular-border);color:var(--ai-icon-blue);max-width:70%;position:relative;overflow:hidden}.user-message .message-content::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ai-accent-gradient);opacity:0.12;pointer-events:none}.user-message .message-content p{color:var(--ai-icon-blue);position:relative;z-index:1}.assistant-response{justify-content:flex-start}.assistant-response .message-content{max-width:85%;animation:fadeInUp 0.3s ease-out}@keyframes fadeInUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.chat-input-container{margin-top:1rem}.chat-input-wrapper{display:flex;gap:0.5rem;align-items:center;background:var(--material-bar-bg);border:1px solid rgba(226,232,240,0.6);border-radius:12px;padding:0.5rem;backdrop-filter:blur(var(--material-thin-blur))}.chat-input{flex:1;border:none;background:transparent;padding:0.75rem 1rem;font-size:0.95rem;color:#334155;outline:none}.chat-input::placeholder{color:#94a3b8}.send-btn{background:var(--material-regular-bg);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--material-regular-border);border-radius:8px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--ai-icon-blue);cursor:pointer;transition:all 0.2s cubic-bezier(0.175,0.885,0.32,1.275);position:relative;overflow:hidden}.send-btn::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ai-accent-gradient);opacity:0.08;pointer-events:none}.send-btn:hover:not(:disabled){transform:scale(1.05);box-shadow:var(--material-thick-shadow);background:var(--material-thick-bg)}.send-btn:hover:not(:disabled)::before{opacity:0.12}.send-btn:disabled{opacity:0.5;cursor:not-allowed}.chat-input-container small{display:block;margin-top:0.5rem;padding-left:0.5rem}@media (max-width:768px){.predefined-questions{grid-template-columns:1fr;gap:0.75rem}.question-btn{padding:0.875rem 1rem}.message-content{padding:0.875rem 1rem}.user-message .message-content{max-width:85%}}*/ /* ============================================================================ Demo Properties Navigation Section (lines 2098-2266) MIGRATED TO demo-styles.css on 2025-09-05 Analysis Results:- 13 CSS classes total,0 dead code (100% active) - All classes verified as used in demo_dashboard.html - 169 lines successfully migrated - Exclusive to demo functionality ============================================================================ */ /* * CONSOLIDATED REVIEWS CSS * Combined from 17 separate files into 1 unified file * Generated by CSS_ACTION_PLAN.md Phase 2 */ /* ============================================================================= CSS VARIABLES (from variables-old.css) ============================================================================= */:root{--review-spacing:1rem;--review-border:1px solid #e5e7eb;--review-star-color:#fbbf24;--review-card-bg:#ffffff;--review-card-hover:#f9fafb;--review-positive:#10b981;--review-negative:#ef4444;--review-neutral:#6b7280;--review-title-size:1.1rem;--review-text-size:0.9rem;--review-meta-size:0.8rem}/* ============================================================================= VARIABLES (from variables-old.css) ============================================================================= */:root{--primary-color:#000000;--primary-hover:#505050;--secondary-color:#3498db;--accent-color:#4361ee;--success-color:#38a169;--warning-color:#dd6b20;--danger-color:#e53e3e;--light-color:#f5f7fa;--dark-color:#2d3748;--gray-100:#f8f9fa;--gray-200:#e9ecef;--gray-300:#dee2e6;--gray-400:#ced4da;--gray-500:#adb5bd;--gray-600:#6c757d;--gray-700:#495057;--gray-800:#343a40;--gray-900:#212529;--foreground-text:#1f1f1f;--secondary-text:#666;--heading-color:#2d3748;--gradient-bg:linear-gradient(135deg,#f9f9f9,#ffffff 40%,#eaeaea);--card-bg:#ffffff;--input-bg:#fdfdfd;--readonly-bg:rgba(245,247,250,0.5);--ai-accent:linear-gradient(135deg,#6e49ff,#3a8cff);--ai-accent-hover:linear-gradient(135deg,#5d3ee0,#307ae0);--ai-icon-blue:#4361ee;--google-color:#4285F4;--booking-color:#003580;--tripadvisor-color:#00af87;--holidaycheck-color:#0058a3;--expedia-color:#ffcc00;--radius:8px;--border-radius:8px;--box-shadow:0 8px 20px rgba(0,0,0,0.08);--card-shadow:0 8px 20px rgba(0,0,0,0.08);--button-shadow:0 4px 10px rgba(67,97,238,0.3);--button-hover-shadow:0 6px 15px rgba(67,97,238,0.4);--border-color:rgba(0,0,0,0.1);--transition:all 0.2s ease;--footer-height:60px}/* ============================================================================= REVIEWS-CORE (from reviews-core-old.css) ============================================================================= */ /* * Reviews Core Styles - Layout,Utilities & Base Functionality * * This file contains the fundamental layout structure and utility classes * for the reviews page,consolidated from layout.css and utilities.css */ .reviews-container{min-height:calc(100vh - var(--navbar-height));padding:var(--space-xl) var(--space-2xl);position:relative;max-width:1400px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}.reviews-header{margin-bottom:var(--space-xl);text-align:center;padding:1rem 0}.reviews-header h1{font-size:1.8rem;font-weight:600;color:var(--heading-color);margin:0 0 0.5rem;letter-spacing:-0.01em;line-height:1.3}.reviews-header p{color:var(--secondary-text);font-size:0.95rem;margin:0 0 1rem;line-height:1.4}.reviews-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.5rem}.platforms-view{margin-bottom:3rem}.platforms-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-xl);margin-bottom:3rem;padding:1rem 0}.reviews-view{background-color:var(--gray-100);border-radius:var(--border-radius);padding:2rem;box-shadow:var(--box-shadow)}.reviews-header-content{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.reviews-controls{background:var(--glass-background);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);border-radius:var(--border-radius);padding:var(--space-xl);margin-bottom:var(--space-xl);display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;box-shadow:var(--glass-shadow)}.control-group{display:flex;flex-direction:column;gap:0.5rem}.control-group label{font-size:13px;font-weight:500;color:var(--secondary-text)}.select-wrapper{position:relative}.select-wrapper select{appearance:none;padding:8px 32px 8px 12px;border:1px solid var(--border-color);border-radius:var(--radius);background-color:var(--input-bg);font-size:14px;width:100%;cursor:pointer}.select-wrapper::after{content:'▼';position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--secondary-text);pointer-events:none}.chart-toggle-container{margin:1rem 0}.chart-toggle-btn{display:flex;align-items:center;gap:0.5rem;padding:0.75rem 1rem;background-color:rgba(0,0,0,0.05);border:none;border-radius:var(--radius);font-size:14px;font-weight:500;color:var(--heading-color);cursor:pointer;transition:var(--transition)}.chart-toggle-btn:hover{background-color:rgba(0,0,0,0.08)}.chart-toggle-btn.active{background-color:rgba(67,97,238,0.1);color:var(--ai-icon-blue)}.rating-chart-section{display:none;margin-bottom:var(--space-xl);background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:var(--space-xl)}.rating-chart-section.visible{display:block;animation:fadeIn 0.3s ease forwards}#unified-reviews{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.5rem;margin:0;padding:0}.no-reviews{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;background:var(--glass-background);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);border-radius:var(--border-radius);box-shadow:var(--glass-shadow);text-align:center}.no-reviews i{font-size:3rem;color:var(--gray-500);margin-bottom:1rem}.no-reviews p{font-size:1.25rem;color:var(--gray-700);margin-bottom:0}.content-container{opacity:0;transition:opacity 0.3s ease-in;min-height:calc(100vh - var(--navbar-height) - var(--footer-height))}.content-container.visible{opacity:1}.reviews-container:has(.loading-container:not(.hidden)) .content-container{opacity:1;visibility:visible;pointer-events:auto}.loading-container{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--gradient-background);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;justify-content:center;align-items:center;z-index:9999}.loading-container.hidden{display:none}.loading-message{font-size:16px;font-weight:500;color:var(--heading-color);margin-top:1rem}.hidden{display:none !important}.no-scroll{overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.text-success{color:var(--success-color)}.text-danger{color:var(--danger-color)}.text-warning{color:var(--warning-color)}.text-secondary{color:var(--gray-500)}.bg-success{background-color:var(--success-color)}.bg-danger{background-color:var(--danger-color)}.badge{padding:0.35em 0.65em;font-size:0.75em;font-weight:600;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0.25rem}@media (max-width:var(--bp-tablet)){.platforms-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.review-header{flex-direction:column}.reviews-controls{flex-direction:column}#unified-reviews{grid-template-columns:1fr}}@media (max-width:600px){.reviews-container{padding:1rem}.platforms-grid{grid-template-columns:1fr;gap:1.5rem}.reviews-header h1{font-size:1.5rem}.reviews-header p{font-size:0.9rem}}@media (max-width:480px){.reviews-container{padding:0.75rem}.reviews-header{padding:0.5rem 0}.reviews-header h1{font-size:1.4rem}}/* --------------------------------------------- Dark Mode Support - WCAG AA Compliant --------------------------------------------- */ /* ============================================================================= REVIEWS-COMPONENTS (from reviews-components-old.css) ============================================================================= */ /* * REVIEWS COMPONENTS - CONSOLIDATED CSS * * This file consolidates all review-related CSS components for the ReviewAgent application. * Organized into logical sections for maintainability and clear structure. * * Sections:* 1. Platform-Specific Styles * 2. Review Cards and Rating Displays * 3. Charts and Data Visualization * 4. Filter Controls * 5. Loading Animations and States */ /* ======================================== 1. PLATFORM-SPECIFIC STYLES ======================================== */ .platform-badge{padding:0.3rem 0.8rem;margin-top:0.5rem;display:inline-flex;align-items:center;font-size:0.9rem;gap:0.5rem;color:var(--gray-800);border-radius:2rem;font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,0.1);transition:var(--transition)}.platform-badge i{font-size:1.2rem}.review-card[data-platform="google"] .platform-badge{background-color:rgba(66,133,244,0.12);border:1px solid rgba(66,133,244,0.3)}.review-card[data-platform="booking"] .platform-badge{background-color:rgba(0,53,128,0.12);border:1px solid rgba(0,53,128,0.3)}.review-card[data-platform="tripadvisor"] .platform-badge{background-color:rgba(0,175,135,0.12);border:1px solid rgba(0,175,135,0.3)}.review-card[data-platform="holidaycheck"] .platform-badge{background-color:rgba(0,88,163,0.12);border:1px solid rgba(0,88,163,0.3)}.review-card[data-platform="expedia"] .platform-badge{background-color:rgba(255,204,0,0.15);border:1px solid rgba(255,204,0,0.3)}.review-card .platform-badge:hover{transform:translateY(-2px)}.booking-individual-score{font-size:0.9rem;color:var(--booking-color);font-weight:500;padding:0.2rem 0.5rem;border-radius:0.25rem;background-color:rgba(0,53,128,0.08);margin-top:0.25rem}.review-card[data-platform="booking"] .stay-details{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1rem;padding:0.75rem;border-radius:0.25rem;background-color:rgba(0,53,128,0.05);font-size:0.9rem;color:var(--gray-700)}.review-section{display:flex;gap:1rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--gray-300)}.section-icon{font-size:1.5rem;width:2rem;text-align:center;flex-shrink:0}.section-content{flex:1}.section-content strong{display:block;margin-bottom:0.5rem;color:var(--dark-color)}.liked .section-content strong{color:var(--success-color)}.disliked .section-content strong{color:var(--danger-color)}.verification-status{background-color:rgba(52,152,219,0.1);color:var(--secondary-color);padding:0.5rem 1rem;border-radius:0.25rem;margin-bottom:1rem;font-size:0.9rem;display:inline-block}.review-card[data-platform="holidaycheck"] .holidaycheck-extra{margin-top:0.25rem;font-size:0.85rem;color:var(--gray-600);display:flex;flex-wrap:wrap;gap:0.75rem;padding:0.5rem;background-color:rgba(0,88,163,0.05);border-radius:0.25rem;margin-bottom:0.5rem}/* ======================================== 2. REVIEW CARDS AND RATING DISPLAYS ======================================== */ .platform-card{background:var(--glass-background);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--glass-border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--glass-shadow);transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);cursor:pointer;padding:2rem;display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.5rem;position:relative;min-height:180px;border-top:4px solid transparent;background-clip:padding-box;opacity:0;animation:slideInUp 0.6s ease-out forwards;animation-delay:calc(var(--card-index,0) * 0.1s)}@keyframes slideInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.platform-card:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 40px rgba(0,0,0,0.15)}.platform-card[data-platform="google"]{border-top-color:var(--google-color);background:linear-gradient(135deg,var(--glass-background) 0%,rgba(66,133,244,0.05) 100%)}.platform-card[data-platform="booking"]{border-top-color:var(--booking-color);background:linear-gradient(135deg,var(--glass-background) 0%,rgba(0,53,128,0.05) 100%)}.platform-card[data-platform="tripadvisor"]{border-top-color:var(--tripadvisor-color);background:linear-gradient(135deg,var(--glass-background) 0%,rgba(0,175,135,0.05) 100%)}.platform-card[data-platform="holidaycheck"]{border-top-color:var(--holidaycheck-color);background:linear-gradient(135deg,var(--glass-background) 0%,rgba(0,88,163,0.05) 100%)}.platform-card[data-platform="expedia"]{border-top-color:var(--expedia-color);background:linear-gradient(135deg,var(--glass-background) 0%,rgba(255,204,0,0.05) 100%)}.platform-card.configured{border-style:solid;border-width:4px 1px 1px 1px;border-color:var(--gray-400) var(--glass-border) var(--glass-border) var(--glass-border);box-shadow:0 8px 32px rgba(0,0,0,0.12),inset 0 1px 0 var(--material-thin-bg)}.platform-card.configured::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--material-ultra-thin-bg) 0%,transparent 50%);pointer-events:none;border-radius:inherit}.platform-card.configured[data-platform="google"]{border-top-color:var(--google-color)}.platform-card.configured[data-platform="booking"]{border-top-color:var(--booking-color)}.platform-card.configured[data-platform="tripadvisor"]{border-top-color:var(--tripadvisor-color)}.platform-card.configured[data-platform="holidaycheck"]{border-top-color:var(--holidaycheck-color)}.platform-card.configured[data-platform="expedia"]{border-top-color:var(--expedia-color)}.platform-card h3{font-size:1.4rem;margin:0;color:var(--dark-color);font-weight:700;letter-spacing:-0.02em;line-height:1.2}.platform-icon{margin:0 auto 1rem auto;width:60px;height:60px;display:flex !important;align-items:center;justify-content:center;transition:all 0.3s ease;position:relative;z-index:1}.platform-card .platform-icon img{display:block;margin:0 auto;width:48px;height:48px;object-fit:contain;transition:filter 0.3s ease,transform 0.3s ease}.platform-card:hover .platform-icon{transform:scale(1.1)}.platform-card[data-platform="google"]:hover .platform-icon img{filter:brightness(0) saturate(100%) invert(43%) sepia(73%) saturate(1352%) hue-rotate(196deg) brightness(102%) contrast(96%) drop-shadow(0 4px 12px rgba(66,133,244,0.4))}.platform-card[data-platform="booking"]:hover .platform-icon img{filter:brightness(0) saturate(100%) invert(13%) sepia(95%) saturate(3042%) hue-rotate(203deg) brightness(94%) contrast(101%) drop-shadow(0 4px 12px rgba(0,53,128,0.4))}.platform-card[data-platform="tripadvisor"]:hover .platform-icon img{filter:brightness(0) saturate(100%) invert(51%) sepia(79%) saturate(466%) hue-rotate(116deg) brightness(92%) contrast(89%) drop-shadow(0 4px 12px rgba(0,175,135,0.4))}.platform-card[data-platform="holidaycheck"]:hover .platform-icon img{filter:brightness(0) saturate(100%) invert(23%) sepia(93%) saturate(1458%) hue-rotate(190deg) brightness(96%) contrast(101%) drop-shadow(0 4px 12px rgba(0,88,163,0.4))}.platform-card[data-platform="expedia"]:hover .platform-icon img{filter:brightness(0) saturate(100%) invert(81%) sepia(62%) saturate(1037%) hue-rotate(5deg) brightness(102%) contrast(101%) drop-shadow(0 4px 12px rgba(255,204,0,0.4))}.platform-card .platform-icon img{filter:brightness(0) saturate(100%)}.config-badge{position:absolute;top:1rem;right:1rem;padding:0.25rem 0.5rem;border-radius:12px;font-size:0.6rem;font-weight:500;text-transform:uppercase;letter-spacing:0.03em;z-index:2;transition:all 0.3s ease;backdrop-filter:blur(var(--material-thin-blur));-webkit-backdrop-filter:blur(var(--material-thin-blur));border:1px solid var(--material-thin-border)}.config-badge.configured{background:rgba(16,185,129,0.9);color:white;box-shadow:0 2px 8px rgba(16,185,129,0.3)}.config-badge.not-configured{background:rgba(239,68,68,0.9);color:white;box-shadow:0 2px 8px rgba(239,68,68,0.3)}.status-icon{display:none}.fetch-button,.analyze-button{background:var(--material-thin-bg);backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));-webkit-backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));border:1px solid var(--material-regular-border);border-radius:8px;padding:0.7rem 1.2rem;font-size:0.85rem;font-weight:600;color:var(--dark-color);cursor:pointer;transition:all 0.3s ease;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:0.4rem;min-width:110px;position:relative;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,0.1)}.fetch-button::before,.analyze-button::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--material-thin-bg) 0%,transparent 50%);border-radius:inherit;pointer-events:none}.fetch-button:hover,.analyze-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,0.15);border-color:var(--material-thick-border);background:var(--material-regular-bg)}.analyze-button{background:linear-gradient(135deg,var(--ai-icon-blue),#0056CC);color:white;border-color:transparent;box-shadow:0 4px 16px rgba(0,122,255,0.2)}.analyze-button:hover{box-shadow:0 8px 24px rgba(0,122,255,0.3);transform:translateY(-2px) scale(1.02)}.review-card{background:var(--glass-background);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--glass-border);border-radius:var(--border-radius);overflow:hidden;box-shadow:var(--glass-shadow);transition:var(--transition);animation-delay:calc(var(--animation-order,0) * 0.1s);opacity:0;display:flex;flex-direction:column;height:100%;position:relative}.review-card:hover{transform:translateY(-5px);box-shadow:0 8px 15px rgba(0,0,0,0.1)}.review-card.visible{animation-name:slideUp;animation-duration:0.5s;animation-timing-function:ease-out;animation-fill-mode:forwards}.review-card[data-platform="google"]{border-left:4px solid var(--google-color);background:linear-gradient(to bottom,var(--glass-background),rgba(66,133,244,0.08),rgba(66,133,244,0.12))}.review-card[data-platform="booking"]{border-left:4px solid var(--booking-color);background:linear-gradient(to bottom,var(--glass-background),rgba(0,53,128,0.08),rgba(0,53,128,0.12))}.review-card[data-platform="tripadvisor"]{border-left:4px solid var(--tripadvisor-color);background:linear-gradient(to bottom,var(--glass-background),rgba(0,175,135,0.08),rgba(0,175,135,0.12))}.review-card[data-platform="holidaycheck"]{border-left:4px solid var(--holidaycheck-color);background:linear-gradient(to bottom,var(--glass-background),rgba(0,88,163,0.08),rgba(0,88,163,0.12))}.review-card[data-platform="expedia"]{border-left:4px solid var(--expedia-color);background:linear-gradient(to bottom,var(--glass-background),rgba(255,204,0,0.08),rgba(255,204,0,0.12))}.review-card::before{content:"";position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 50px 50px 0;z-index:1;transition:var(--transition)}.review-card:hover::before{border-width:0 60px 60px 0}.review-card[data-platform="google"]::before{border-color:transparent var(--google-color) transparent transparent}.review-card[data-platform="booking"]::before{border-color:transparent var(--booking-color) transparent transparent}.review-card[data-platform="tripadvisor"]::before{border-color:transparent var(--tripadvisor-color) transparent transparent}.review-card[data-platform="holidaycheck"]::before{border-color:transparent var(--holidaycheck-color) transparent transparent}.review-card[data-platform="expedia"]::before{border-color:transparent var(--expedia-color) transparent transparent}.review-card::after{font-family:"Bootstrap Icons";position:absolute;top:7px;right:7px;color:white;font-size:1.2rem;z-index:2;transform:rotate(45deg);text-shadow:0 1px 2px rgba(0,0,0,0.2)}.review-card[data-platform="google"]::after{content:"\F271"}.review-card[data-platform="booking"]::after{content:"\F17A"}.review-card[data-platform="tripadvisor"]::after{content:"\F63D"}.review-card[data-platform="holidaycheck"]::after{content:"\F5AF"}.review-card[data-platform="expedia"]::after{content:"\F6E6"}.review-card .platform-watermark{position:absolute;right:10px;bottom:10px;font-size:4rem;opacity:0.04;transform:rotate(-10deg);pointer-events:none;z-index:0}.review-card[data-platform="google"] .platform-watermark::before{content:"\F271";font-family:"Bootstrap Icons";color:var(--google-color)}.review-card[data-platform="booking"] .platform-watermark::before{content:"\F17A";font-family:"Bootstrap Icons";color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .platform-watermark::before{content:"\F63D";font-family:"Bootstrap Icons";color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .platform-watermark::before{content:"\F5AF";font-family:"Bootstrap Icons";color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .platform-watermark::before{content:"\F6E6";font-family:"Bootstrap Icons";color:var(--expedia-color)}.review-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;padding:1.5rem;background-color:var(--gray-100);border-bottom:1px solid var(--gray-300);position:relative}.avatar{width:3.25rem;height:3.25rem;background-color:var(--primary-color);color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:600;flex-shrink:0;box-shadow:0 2px 6px rgba(0,0,0,0.1)}.review-card[data-platform="google"] .avatar{background-color:var(--google-color)}.review-card[data-platform="booking"] .avatar{background-color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .avatar{background-color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .avatar{background-color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .avatar{background-color:var(--expedia-color)}.review-content{padding:1.5rem;flex:1;display:flex;flex-direction:column}.review-footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background-color:var(--gray-100);border-top:1px solid var(--gray-300);margin-top:auto}.owner-response{background-color:var(--gray-100);padding:1.25rem;border-radius:0.5rem;margin-top:1.5rem;border-left:3px solid var(--secondary-color);box-shadow:0 2px 4px rgba(0,0,0,0.03)}.response-header{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.75rem;color:var(--primary-color);font-weight:600}.response-header i{font-size:1.1rem;color:var(--secondary-color)}.review-rating{text-align:right;margin-left:1rem;flex:0 1 220px;min-width:160px;box-sizing:border-box}.rating-display{display:flex;flex-direction:column;align-items:flex-end;gap:0.5rem}.universal-rating .stars,.platform-rating .stars{font-size:1.2rem;display:flex;align-items:center;gap:0.1rem}.rating-value,.rating-score{display:inline-block;margin-left:0.5rem;font-weight:700;color:var(--primary-color);font-size:1.1rem}.review-card[data-platform="google"] .rating-value{color:var(--google-color)}.review-card[data-platform="booking"] .rating-display{background-color:rgba(0,53,128,0.08);padding:0.5rem;border-radius:0.5rem}.review-card[data-platform="booking"] .review-header{flex-direction:column;align-items:stretch}.review-card[data-platform="booking"] .review-rating{order:2;align-self:flex-start;width:100%;text-align:left;margin:0.5rem 0 0 0;flex:initial;min-width:0}.review-card[data-platform="booking"] .rating-display{align-items:flex-start}.review-card[data-platform="booking"] .rating-display .stars{font-size:1rem}@media (max-width:768px){.review-header{flex-wrap:wrap}.review-rating{order:3;width:100%;min-width:0;margin-left:0;text-align:left;margin-top:0.5rem}}.review-header{flex-direction:column;align-items:stretch}.review-rating{order:2;align-self:flex-start;width:100%;text-align:left;margin:0.5rem 0 0 0;flex:initial;min-width:0}.review-header .rating-display{align-items:flex-start}.review-card[data-platform="booking"] .rating-value{color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .stars i{color:var(--tripadvisor-color)}.review-card[data-platform="tripadvisor"] .rating-value{color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .stars i{color:var(--holidaycheck-color)}.review-card[data-platform="holidaycheck"] .rating-value{color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .stars i{color:var(--expedia-color)}.review-card[data-platform="expedia"] .rating-value{color:var(--expedia-color)}.review-actions{display:flex;gap:0.5rem}.badge{padding:0.35em 0.65em;font-size:0.75em;font-weight:600;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0.25rem}/* ======================================== 3. CHARTS AND DATA VISUALIZATION ======================================== */ .rating-chart-section{background:var(--glass-background);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--glass-border);border-radius:var(--border-radius);padding:0;max-height:0;overflow:hidden;transition:all 0.5s cubic-bezier(0.4,0,0.2,1);margin-bottom:0;box-shadow:var(--glass-shadow);opacity:0;visibility:hidden;transform:translateY(-20px)}.rating-chart-section.visible{max-height:1000px;padding:1.5rem;margin-bottom:2rem;opacity:1;visibility:visible;transform:translateY(0)}.chart-interface{display:flex;gap:2rem;min-height:600px;opacity:0;transform:translateY(20px);transition:all 0.5s cubic-bezier(0.4,0,0.2,1);transition-delay:0.2s;background:linear-gradient(to bottom right,#f8fafc,#f1f5f9);border-radius:var(--border-radius);padding:2rem;box-shadow:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -2px rgba(0,0,0,0.05),inset 0 2px 4px 0 var(--material-bar-bg);position:relative;overflow:hidden}.rating-chart-section.visible .chart-interface{opacity:1;transform:translateY(0)}.chart-interface.with-sidebar{gap:2rem}.chart-interface.with-sidebar .chart-container{width:68%;transition:width 0.3s cubic-bezier(0.4,0,0.2,1)}.chart-container{flex:1;position:relative;min-height:600px;width:100%;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);background:var(--glass-background);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--glass-border);border-radius:1rem;padding:2rem;padding-top:5rem;box-shadow:var(--glass-shadow);border:1px solid var(--material-bar-border)}.chart-container canvas{width:100% !important;height:100% !important;display:block;transition:all 0.3s cubic-bezier(0.4,0,0.2,1)}.chart-toggle-container{margin-bottom:1rem}.chart-sidebar{width:0;opacity:0;overflow-y:auto;overflow-x:hidden;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);display:none;flex-direction:column;gap:2rem;background:linear-gradient(to bottom right,#ffffff,#fafafa);border-radius:1rem;padding:0;box-shadow:0 4px 6px -1px rgba(0,0,0,0.05),0 2px 4px -2px rgba(0,0,0,0.03);transform:translateX(20px);border:1px solid rgba(0,0,0,0.06);max-height:600px;position:relative}.chart-sidebar.visible{width:32%;min-width:320px;max-width:400px;opacity:1;display:flex;padding:2rem;transform:translateX(0)}.chart-control-group{background:linear-gradient(to bottom right,#ffffff,#f8fafc);border-radius:1rem;padding:1.75rem;box-shadow:0 2px 4px rgba(0,0,0,0.03),0 1px 2px rgba(0,0,0,0.04);border:1px solid rgba(0,0,0,0.04);position:relative}.control-header{margin-bottom:2rem;padding-bottom:1.25rem;border-bottom:1px solid rgba(0,0,0,0.06)}.control-header h3{font-size:1.15rem;color:var(--gray-900);margin:0 0 0.75rem;font-weight:600;letter-spacing:-0.01em}.helper-text{font-size:0.925rem;color:var(--gray-600);line-height:1.5}/* ======================================== 4. FILTER CONTROLS ======================================== */ .filter-group{margin-bottom:2rem;padding-bottom:1.75rem;border-bottom:1px solid rgba(0,0,0,0.06)}.filter-group:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.filter-group legend{font-size:1.05rem;font-weight:600;color:var(--gray-800);margin-bottom:1.25rem;padding-bottom:0.75rem;border-bottom:2px solid var(--primary-color);width:max-content;letter-spacing:-0.01em}.filter-controls{display:flex;flex-direction:column;gap:1.75rem}.date-filters{display:flex;flex-direction:column;gap:0.5rem}.date-filter-container{display:flex;gap:0.75rem}.date-filter{min-width:120px}.date-inputs{display:flex;gap:1.25rem}.select-wrapper{position:relative;width:100%}.select-wrapper::after{content:'▼';font-size:0.7rem;position:absolute;right:1.25rem;top:50%;transform:translateY(-50%);color:var(--primary-color);pointer-events:none;opacity:0.8}select{width:100%;padding:0.875rem 2.75rem 0.875rem 1.25rem;appearance:none;background:linear-gradient(to bottom,#ffffff,#f8fafc);border:1px solid rgba(0,0,0,0.08);border-radius:0.75rem;color:var(--gray-800);font-size:0.95rem;cursor:pointer;transition:all 0.2s ease;box-shadow:0 1px 2px rgba(0,0,0,0.04),inset 0 1px 2px var(--material-bar-bg)}select:hover{border-color:var(--primary-color);background:linear-gradient(to bottom,#ffffff,#ffffff)}select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(52,152,219,0.15),0 1px 2px rgba(0,0,0,0.04);background:var(--input-background)}.platform-toggles{display:grid;grid-template-columns:1fr;gap:1rem}.platform-toggle{display:flex;align-items:center;gap:1rem;padding:1rem;background:linear-gradient(to bottom,#ffffff,#f8fafc);border:1px solid rgba(0,0,0,0.08);border-radius:0.75rem;cursor:pointer;transition:all 0.2s ease;box-shadow:0 1px 2px rgba(0,0,0,0.04),inset 0 1px 2px var(--material-bar-bg)}.platform-toggle:hover{border-color:var(--primary-color);background:var(--glass-background);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));transform:translateY(-1px);box-shadow:var(--glass-shadow)}.platform-toggle input[type="checkbox"]{width:1.35rem;height:1.35rem;cursor:pointer;border:2px solid rgba(0,0,0,0.2);border-radius:6px;transition:all 0.2s ease;position:relative;background:var(--input-background)}.platform-toggle input[type="checkbox"]:checked{background-color:var(--primary-color);border-color:var(--primary-color)}.platform-toggle input[type="checkbox"]:checked::after{content:'';position:absolute;left:4px;top:1px;width:6px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.platform-toggle span{font-weight:500;color:var(--gray-800);font-size:0.95rem}.dropdown-checklist{position:relative}.dropdown-toggle{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 2rem 0.5rem 0.75rem;background:var(--input-background);backdrop-filter:blur(var(--material-thin-blur));-webkit-backdrop-filter:blur(var(--material-thin-blur));border:1px solid var(--glass-border);border-radius:var(--border-radius);color:var(--gray-700);font-size:0.9rem;cursor:pointer;transition:var(--transition);min-width:150px;position:relative}.dropdown-toggle i{position:absolute;right:0.75rem;transition:transform 0.3s ease}.dropdown-toggle.active i{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;left:0;z-index:10;width:250px;background:var(--glass-background);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--glass-border);border-radius:var(--border-radius);box-shadow:var(--glass-shadow);padding:0.75rem;margin-top:0.25rem;display:none}.dropdown-menu.show{display:block}.checklist-item{margin-bottom:0.75rem}.checklist-item label{display:flex;align-items:center;gap:0.75rem;cursor:pointer}.checklist-item input[type="checkbox"]{width:1rem;height:1rem;cursor:pointer}.rating-option{display:flex;align-items:center;gap:0.5rem}.stars{color:var(--warning-color);display:flex;gap:2px}.review-count{color:var(--gray-600);font-size:0.85rem}.checklist-actions{display:flex;justify-content:space-between;margin-top:1rem;padding-top:0.75rem;border-top:1px solid var(--gray-300)}/* ======================================== 5. LOADING ANIMATIONS AND STATES ======================================== */ .loading-container{position:fixed;top:var(--navbar-height);left:0;width:100%;height:100vh;background:var(--gradient-background);backdrop-filter:blur(var(--material-thin-blur));-webkit-backdrop-filter:blur(var(--material-thin-blur));display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000;opacity:1;transition:opacity 0.3s ease-out;height:calc(100vh - var(--navbar-height))}.loading-container.hidden{opacity:0;pointer-events:none}.loading-message{font-size:1.1rem;color:var(--gray-700);margin-top:2rem;text-align:center;font-weight:500}.cube-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(75px,15vw);height:min(75px,15vw);transform-style:preserve-3d;transform:rotateX(-30deg) scale(1.2);animation:animate 4s linear infinite;margin:0 auto}@keyframes animate{0%{transform:rotateX(-30deg) rotateY(0)}100%{transform:rotateX(-30deg) rotateY(360deg)}}.cube-loader .cube-wrapper{position:absolute;width:100%;height:100%;transform-style:preserve-3d}.cube-loader .cube-wrapper .cube-span{position:absolute;width:100%;height:100%;transform:rotateY(calc(90deg * var(--i))) translateZ(37.5px);background:#f5f5f5;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 10px rgba(0,0,0,0.1);border:1px solid rgba(128,128,128,0.2)}.cube-top{position:absolute;width:75px;height:75px;background:#e9e9e9;transform:rotateX(90deg) translateZ(37.5px);transform-style:preserve-3d;box-shadow:inset 0 0 10px rgba(0,0,0,0.1);border:1px solid rgba(128,128,128,0.2);display:flex;align-items:center;justify-content:center}.cube-bottom{position:absolute;width:75px;height:75px;background:#e9e9e9;transform:rotateX(-90deg) translateZ(37.5px);transform-style:preserve-3d;box-shadow:inset 0 0 10px rgba(0,0,0,0.1);border:1px solid rgba(128,128,128,0.2);display:flex;align-items:center;justify-content:center}.cube-shadow{position:absolute;bottom:-60px;width:75px;height:20px;background:rgba(0,0,0,0.2);transform:rotateX(90deg);filter:blur(10px);border-radius:50%}.emoji{font-size:40px;text-align:center}$1 /* ======================================== DATA SOURCE BADGES & ROOM INFO ======================================== */ .data-source-badge{margin-top:0.3rem;display:flex;justify-content:flex-start}.source-tag{padding:0.2rem 0.6rem;border-radius:1rem;font-size:0.75rem;font-weight:600;display:inline-flex;align-items:center;gap:0.3rem;transition:var(--transition)}.apify-source{background-color:rgba(76,175,80,0.12);color:rgba(56,142,60,1);border:1px solid rgba(76,175,80,0.3)}.http-source{background-color:rgba(96,125,139,0.12);color:rgba(69,90,100,1);border:1px solid rgba(96,125,139,0.3)}.source-tag i{font-size:0.85rem}.stay-details{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:1rem;padding:0.5rem 0}.stay-details span{padding:0.3rem 0.7rem;background-color:var(--surface-elevated,rgba(255,255,255,0.1));border-radius:1.5rem;font-size:0.85rem;font-weight:500;color:var(--text-secondary,#86868b);display:inline-flex;align-items:center;gap:0.4rem;border:1px solid var(--border-secondary,rgba(255,255,255,0.1));transition:var(--transition,all 0.3s ease)}.stay-details span:hover{background-color:var(--surface-hover,rgba(255,255,255,0.15));border-color:var(--border-primary,rgba(255,255,255,0.2))}.stay-details span i{font-size:0.9rem;color:var(--text-accent,#007AFF)}.room-info{max-width:300px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-info:hover{overflow:visible;white-space:normal;max-width:none}/* ============================================================================= ANIMATIONS (from animations-old.css) ============================================================================= */ @keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%{opacity:0.4;transform:scale(0.95)}50%{opacity:1;transform:scale(1.05)}100%{opacity:0.4;transform:scale(0.95)}}@keyframes animate{0%{transform:rotateX(-30deg) rotateY(0)}100%{transform:rotateX(-30deg) rotateY(360deg)}}.animate-fade-in{animation:fadeIn 0.5s ease-out}.animate-slide-up{opacity:0;animation-name:slideUp;animation-duration:0.5s;animation-timing-function:ease-out;animation-fill-mode:forwards;animation-delay:calc(var(--animation-order,0) * 0.1s)}.loading-text{font-size:1.5rem;animation:pulse 1.5s infinite ease-in-out;display:inline-block}/* ============================================================================= BUTTONS (from buttons-old.css) ============================================================================= */ /* * Reviews Dashboard Button Styles * * This file contains styles for buttons used in the reviews page,* including action buttons,toggle buttons,and other interactive elements. */ .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border:none;border-radius:var(--radius);font-size:14px;font-weight:500;cursor:pointer;transition:var(--transition)}.btn-primary{background-color:var(--primary-color);color:white;box-shadow:var(--button-shadow)}.btn-primary:hover{background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--button-hover-shadow)}.btn-primary:active{transform:scale(0.98)}.analyze-button{background:var(--ai-accent);color:white;box-shadow:var(--button-shadow)}.analyze-button:hover{background:var(--ai-accent-hover);transform:translateY(-2px);box-shadow:var(--button-hover-shadow)}.analyze-button.disabled{background-color:#ccc;cursor:not-allowed;pointer-events:none;box-shadow:none}.btn-reply,.btn-translate,.btn-flag{display:inline-flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;border:none;border-radius:var(--radius);background-color:rgba(0,0,0,0.05);color:var(--secondary-text);font-size:13px;cursor:pointer;transition:var(--transition)}.btn-reply:hover,.btn-translate:hover,.btn-flag:hover{background-color:rgba(0,0,0,0.1)}.btn-reply,.reply-btn,.fetch-button,.view-reviews-button,.back-button{display:inline-flex;align-items:center;gap:0.5rem;padding:0.75rem 1.25rem;border-radius:var(--radius);font-weight:600;cursor:pointer;transition:var(--transition);border:none;font-size:1rem}.reviews-actions{display:flex;justify-content:center;gap:1rem;margin-top:2rem}.fetch-button{background-color:var(--primary-color);color:white;box-shadow:var(--button-shadow)}.fetch-button:hover,.fetch-button:focus{background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--button-hover-shadow);outline:none}.fetch-button:active{transform:scale(0.98)}.view-reviews-button{background-color:var(--primary-color);color:white;box-shadow:var(--button-shadow)}.view-reviews-button:hover,.view-reviews-button:focus{background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:var(--button-hover-shadow);outline:none}.view-reviews-button:active{transform:scale(0.98)}.back-button{background-color:var(--primary-color);color:white;text-decoration:none}.back-button:hover,.back-button:focus{background-color:var(--secondary-color);transform:translateY(-2px);color:white;text-decoration:none;outline:none}.btn-reply,.reply-btn{background-color:var(--primary-color);color:white}.btn-reply:hover,.reply-btn:hover{background-color:var(--secondary-color);transform:translateY(-2px)}.btn-flag{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;background-color:var(--gray-200);color:var(--gray-600);border:none;border-radius:50%;cursor:pointer;transition:var(--transition)}.btn-flag:hover{background-color:var(--gray-300);color:var(--gray-800);transform:translateY(-2px)}.chart-toggle-btn{display:flex;align-items:center;gap:0.5rem;padding:0.75rem 1rem;background-color:rgba(0,0,0,0.05);border:none;border-radius:var(--radius);font-size:14px;font-weight:500;color:var(--heading-color);cursor:pointer;transition:var(--transition)}.chart-toggle-btn:hover{background-color:rgba(0,0,0,0.08)}.chart-toggle-btn.active{background-color:rgba(67,97,238,0.1);color:var(--ai-icon-blue)}.chart-toggle-btn .toggle-icon{margin-left:auto;transition:transform 0.3s cubic-bezier(0.4,0,0.2,1)}.chart-toggle-btn.active .toggle-icon{transform:rotate(180deg)}.filter-toggle-btn{display:inline-flex;align-items:center;justify-content:center;gap:0.75rem;padding:0.875rem 1.5rem;background:linear-gradient(to bottom,#ffffff,#f8fafc);color:var(--primary-color);border:1px solid rgba(0,0,0,0.08);border-radius:var(--radius);font-size:0.95rem;font-weight:500;position:absolute;top:2rem;right:2rem;cursor:pointer;transition:all 0.2s cubic-bezier(0.4,0,0.2,1);z-index:5;box-shadow:0 2px 4px rgba(0,0,0,0.04),0 1px 2px rgba(0,0,0,0.06)}.filter-toggle-btn:hover{background:linear-gradient(to bottom,var(--primary-color),color-mix(in srgb,var(--primary-color),#000 10%));color:white;transform:translateY(-1px);box-shadow:0 4px 6px rgba(0,0,0,0.08),0 2px 4px rgba(0,0,0,0.06)}.filter-toggle-btn.active{background:linear-gradient(to bottom,var(--primary-color),color-mix(in srgb,var(--primary-color),#000 15%));color:white;border-color:rgba(0,0,0,0.1)}.btn-link{background:none;border:none;color:var(--secondary-color);font-size:0.85rem;cursor:pointer;padding:0}.btn-link:hover{text-decoration:underline}/* ============================================================================= CARDS (from cards-old.css) ============================================================================= */ /* * Reviews Dashboard Card Styles * * This file contains styles for cards used in the reviews page,* including platform cards and review cards. */ .platform-card{background-color:white;border-radius:var(--border-radius);overflow:hidden;box-shadow:var(--card-shadow);transition:var(--transition);border-top:4px solid var(--gray-400);cursor:pointer;padding:1.5rem;display:flex;flex-direction:column;gap:1rem;position:relative}.platform-card:hover{transform:translateY(-5px);box-shadow:var(--box-shadow)}.platform-card[data-platform="google"]{border-top-color:var(--google-color)}.platform-card[data-platform="booking"]{border-top-color:var(--booking-color)}.platform-card[data-platform="tripadvisor"]{border-top-color:var(--tripadvisor-color)}.platform-card[data-platform="holidaycheck"]{border-top-color:var(--holidaycheck-color)}.platform-card[data-platform="expedia"]{border-top-color:var(--expedia-color)}.platform-card.configured{border-style:solid;border-width:4px 1px 1px 1px;border-color:var(--gray-400) var(--gray-200) var(--gray-200) var(--gray-200)}.platform-card.configured[data-platform="google"]{border-top-color:var(--google-color)}.platform-card.configured[data-platform="booking"]{border-top-color:var(--booking-color)}.platform-card.configured[data-platform="tripadvisor"]{border-top-color:var(--tripadvisor-color)}.platform-card.configured[data-platform="holidaycheck"]{border-top-color:var(--holidaycheck-color)}.platform-card.configured[data-platform="expedia"]{border-top-color:var(--expedia-color)}.platform-card h3{font-size:1.25rem;margin:0;color:var(--dark-color);font-weight:600}.config-badge{position:absolute;top:1rem;right:1rem}.status-icon{font-size:1.25rem;position:absolute;bottom:1rem;right:1rem}.review-card{background-color:white;border-radius:var(--border-radius);overflow:hidden;box-shadow:var(--card-shadow);transition:var(--transition);border:1px solid var(--gray-200);animation-delay:calc(var(--animation-order,0) * 0.1s);opacity:0;display:flex;flex-direction:column;height:100%;position:relative}.review-card:hover{transform:translateY(-5px);box-shadow:0 8px 15px rgba(0,0,0,0.1)}.review-card.visible{animation-name:slideUp;animation-duration:0.5s;animation-timing-function:ease-out;animation-fill-mode:forwards}.review-card[data-platform="google"]{border-left:4px solid var(--google-color);background:linear-gradient(to bottom,white,rgba(66,133,244,0.02),rgba(66,133,244,0.05))}.review-card[data-platform="booking"]{border-left:4px solid var(--booking-color);background:linear-gradient(to bottom,white,rgba(0,53,128,0.02),rgba(0,53,128,0.05))}.review-card[data-platform="tripadvisor"]{border-left:4px solid var(--tripadvisor-color);background:linear-gradient(to bottom,white,rgba(0,175,135,0.02),rgba(0,175,135,0.05))}.review-card[data-platform="holidaycheck"]{border-left:4px solid var(--holidaycheck-color);background:linear-gradient(to bottom,white,rgba(0,88,163,0.02),rgba(0,88,163,0.05))}.review-card[data-platform="expedia"]{border-left:4px solid var(--expedia-color);background:linear-gradient(to bottom,white,rgba(255,204,0,0.02),rgba(255,204,0,0.05))}.review-card::before{content:"";position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 50px 50px 0;z-index:1;transition:var(--transition)}.review-card:hover::before{border-width:0 60px 60px 0}.review-card[data-platform="google"]::before{border-color:transparent var(--google-color) transparent transparent}.review-card[data-platform="booking"]::before{border-color:transparent var(--booking-color) transparent transparent}.review-card[data-platform="tripadvisor"]::before{border-color:transparent var(--tripadvisor-color) transparent transparent}.review-card[data-platform="holidaycheck"]::before{border-color:transparent var(--holidaycheck-color) transparent transparent}.review-card[data-platform="expedia"]::before{border-color:transparent var(--expedia-color) transparent transparent}.review-card::after{font-family:"Bootstrap Icons";position:absolute;top:7px;right:7px;color:white;font-size:1.2rem;z-index:2;transform:rotate(45deg);text-shadow:0 1px 2px rgba(0,0,0,0.2)}.review-card[data-platform="google"]::after{content:"\F271"}.review-card[data-platform="booking"]::after{content:"\F17A"}.review-card[data-platform="tripadvisor"]::after{content:"\F63D"}.review-card[data-platform="holidaycheck"]::after{content:"\F5AF"}.review-card[data-platform="expedia"]::after{content:"\F6E6"}.review-card .platform-watermark{position:absolute;right:10px;bottom:10px;font-size:4rem;opacity:0.04;transform:rotate(-10deg);pointer-events:none;z-index:0}.review-card[data-platform="google"] .platform-watermark::before{content:"\F271";font-family:"Bootstrap Icons";color:var(--google-color)}.review-card[data-platform="booking"] .platform-watermark::before{content:"\F17A";font-family:"Bootstrap Icons";color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .platform-watermark::before{content:"\F63D";font-family:"Bootstrap Icons";color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .platform-watermark::before{content:"\F5AF";font-family:"Bootstrap Icons";color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .platform-watermark::before{content:"\F6E6";font-family:"Bootstrap Icons";color:var(--expedia-color)}.review-header{display:flex;justify-content:space-between;align-items:flex-start;padding:1.5rem;background-color:var(--gray-100);border-bottom:1px solid var(--gray-300);position:relative}.avatar{width:3.25rem;height:3.25rem;background-color:var(--primary-color);color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:600;flex-shrink:0;box-shadow:0 2px 6px rgba(0,0,0,0.1)}.review-card[data-platform="google"] .avatar{background-color:var(--google-color)}.review-card[data-platform="booking"] .avatar{background-color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .avatar{background-color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .avatar{background-color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .avatar{background-color:var(--expedia-color)}.review-content{padding:1.5rem;flex:1;display:flex;flex-direction:column}.review-footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background-color:var(--gray-100);border-top:1px solid var(--gray-300);margin-top:auto}.owner-response{background-color:var(--gray-100);padding:1.25rem;border-radius:0.5rem;margin-top:1.5rem;border-left:3px solid var(--secondary-color);box-shadow:0 2px 4px rgba(0,0,0,0.03)}.response-header{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.75rem;color:var(--primary-color);font-weight:600}.response-header i{font-size:1.1rem;color:var(--secondary-color)}.review-rating{text-align:right;margin-left:1rem;flex-shrink:0}.rating-display{display:flex;flex-direction:column;align-items:flex-end;gap:0.5rem}.universal-rating .stars,.platform-rating .stars{font-size:1.2rem;display:flex;align-items:center;gap:0.1rem}.rating-value,.rating-score{display:inline-block;margin-left:0.5rem;font-weight:700;color:var(--primary-color);font-size:1.1rem}.review-section{display:flex;gap:1rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--gray-300)}.section-icon{font-size:1.5rem;width:2rem;text-align:center;flex-shrink:0}.section-content{flex:1}.section-content strong{display:block;margin-bottom:0.5rem;color:var(--dark-color)}.liked .section-content strong{color:var(--success-color)}.disliked .section-content strong{color:var(--danger-color)}.review-actions{display:flex;gap:0.5rem}.badge{padding:0.35em 0.65em;font-size:0.75em;font-weight:600;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0.25rem}.user-credibility.tripadvisor-credibility{display:flex;gap:0.75rem;margin-top:0.5rem;flex-wrap:wrap}.user-credibility span{font-size:0.85rem;color:var(--gray-600);display:flex;align-items:center;gap:0.25rem;background:rgba(0,175,135,0.1);padding:0.25rem 0.5rem;border-radius:0.25rem;transition:var(--transition)}.user-credibility span:hover{background:rgba(0,175,135,0.2);transform:translateY(-1px)}.user-credibility .review-count{color:var(--tripadvisor-color);border:1px solid rgba(0,175,135,0.3)}.user-credibility .helpful-votes{color:var(--success-color);border:1px solid rgba(40,167,69,0.3)}.user-credibility .badges-count{color:var(--warning-color);border:1px solid rgba(255,193,7,0.3)}.user-credibility .platform-source{color:var(--info-color);border:1px solid rgba(23,162,184,0.3)}.avatar-enhanced{width:3.25rem;height:3.25rem;border-radius:50%;overflow:hidden;flex-shrink:0;box-shadow:0 2px 6px rgba(0,0,0,0.1);position:relative}.user-avatar{width:100%;height:100%;object-fit:cover;transition:var(--transition)}.user-avatar:hover{transform:scale(1.05)}.avatar-fallback{width:100%;height:100%;background-color:var(--tripadvisor-color);color:white;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:600}.review-engagement.tripadvisor-engagement{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.review-engagement span{display:flex;align-items:center;gap:0.25rem;font-size:0.9rem;color:var(--gray-600);background:rgba(0,175,135,0.05);padding:0.25rem 0.5rem;border-radius:0.25rem;border:1px solid rgba(0,175,135,0.1);transition:var(--transition)}.review-engagement span:hover{background:rgba(0,175,135,0.1);transform:translateY(-1px)}.helpful-indicator{color:var(--success-color) !important;border-color:rgba(40,167,69,0.2) !important;background:rgba(40,167,69,0.05) !important}.helpful-indicator:hover{background:rgba(40,167,69,0.1) !important}.travel-date{color:var(--primary-color) !important;border-color:rgba(0,123,255,0.2) !important;background:rgba(0,123,255,0.05) !important}.travel-date:hover{background:rgba(0,123,255,0.1) !important}.hotel-expert{color:var(--tripadvisor-color) !important;border-color:rgba(0,175,135,0.2) !important;background:rgba(0,175,135,0.05) !important}.hotel-expert:hover{background:rgba(0,175,135,0.1) !important}.review-footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background-color:var(--gray-100);border-top:1px solid var(--gray-300);margin-top:auto;flex-wrap:wrap;gap:1rem}.review-actions-group{display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap}@media (max-width:768px){.user-credibility.tripadvisor-credibility{gap:0.5rem}.user-credibility span{font-size:0.8rem;padding:0.2rem 0.4rem}.review-engagement.tripadvisor-engagement{gap:0.5rem}.review-engagement span{font-size:0.8rem;padding:0.2rem 0.4rem}.review-footer{flex-direction:column;align-items:flex-start}.review-actions-group{width:100%;justify-content:space-between}}@media (max-width:480px){.user-credibility.tripadvisor-credibility{flex-direction:column;gap:0.25rem}.review-engagement.tripadvisor-engagement{flex-direction:column;align-items:flex-start;gap:0.25rem}}/* ============================================================================= CHARTS (from charts-old.css) ============================================================================= */ .rating-chart-section{background-color:white;border-radius:var(--border-radius);padding:0;max-height:0;overflow:hidden;transition:all 0.5s cubic-bezier(0.4,0,0.2,1);margin-bottom:0;box-shadow:var(--card-shadow);opacity:0;visibility:hidden;transform:translateY(-20px)}.rating-chart-section.visible{max-height:1000px;padding:1.5rem;margin-bottom:2rem;opacity:1;visibility:visible;transform:translateY(0)}.chart-interface{display:flex;gap:2rem;min-height:600px;opacity:0;transform:translateY(20px);transition:all 0.5s cubic-bezier(0.4,0,0.2,1);transition-delay:0.2s;background:linear-gradient(to bottom right,#f8fafc,#f1f5f9);border-radius:var(--border-radius);padding:2rem;box-shadow:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -2px rgba(0,0,0,0.05),inset 0 2px 4px 0 rgba(255,255,255,0.9);position:relative;overflow:hidden}.rating-chart-section.visible .chart-interface{opacity:1;transform:translateY(0)}.chart-interface.with-sidebar{gap:2rem}.chart-interface.with-sidebar .chart-container{width:68%;transition:width 0.3s cubic-bezier(0.4,0,0.2,1)}.chart-container{flex:1;position:relative;min-height:600px;width:100%;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);background-color:white;border-radius:1rem;padding:2rem;padding-top:5rem;box-shadow:0 4px 6px -1px rgba(0,0,0,0.05),0 2px 4px -2px rgba(0,0,0,0.03),inset 0 2px 4px 0 rgba(255,255,255,0.95);border:1px solid rgba(255,255,255,0.7)}.chart-container canvas{width:100% !important;height:100% !important;display:block;transition:all 0.3s cubic-bezier(0.4,0,0.2,1)}.chart-toggle-container{margin-bottom:1rem}.chart-sidebar{width:0;opacity:0;overflow-y:auto;overflow-x:hidden;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);display:none;flex-direction:column;gap:2rem;background:linear-gradient(to bottom right,#ffffff,#fafafa);border-radius:1rem;padding:0;box-shadow:0 4px 6px -1px rgba(0,0,0,0.05),0 2px 4px -2px rgba(0,0,0,0.03);transform:translateX(20px);border:1px solid rgba(0,0,0,0.06);max-height:600px;position:relative}.chart-sidebar.visible{width:32%;min-width:320px;max-width:400px;opacity:1;display:flex;padding:2rem;transform:translateX(0)}.chart-control-group{background:linear-gradient(to bottom right,#ffffff,#f8fafc);border-radius:1rem;padding:1.75rem;box-shadow:0 2px 4px rgba(0,0,0,0.03),0 1px 2px rgba(0,0,0,0.04);border:1px solid rgba(0,0,0,0.04);position:relative}.control-header{margin-bottom:2rem;padding-bottom:1.25rem;border-bottom:1px solid rgba(0,0,0,0.06)}.control-header h3{font-size:1.15rem;color:var(--gray-900);margin:0 0 0.75rem;font-weight:600;letter-spacing:-0.01em}.helper-text{font-size:0.925rem;color:var(--gray-600);line-height:1.5}.review-rating{text-align:right;margin-left:1rem;flex-shrink:0}.rating-display{display:flex;flex-direction:column;align-items:flex-end;gap:0.5rem}.universal-rating .stars,.platform-rating .stars{font-size:1.2rem;display:flex;align-items:center;gap:0.1rem}.rating-value,.rating-score{display:inline-block;margin-left:0.5rem;font-weight:700;color:var(--primary-color);font-size:1.1rem}.review-card[data-platform="google"] .rating-value{color:var(--google-color)}.review-card[data-platform="booking"] .rating-display{background-color:rgba(0,53,128,0.08);padding:0.5rem;border-radius:0.5rem}.review-card[data-platform="booking"] .rating-value{color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .stars i{color:var(--tripadvisor-color)}.review-card[data-platform="tripadvisor"] .rating-value{color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .stars i{color:var(--holidaycheck-color)}.review-card[data-platform="holidaycheck"] .rating-value{color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .stars i{color:var(--expedia-color)}.review-card[data-platform="expedia"] .rating-value{color:var(--expedia-color)}/* ============================================================================= FILTERS (from filters-old.css) ============================================================================= */ .filter-group{margin-bottom:2rem;padding-bottom:1.75rem;border-bottom:1px solid rgba(0,0,0,0.06)}.filter-group:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.filter-group legend{font-size:1.05rem;font-weight:600;color:var(--gray-800);margin-bottom:1.25rem;padding-bottom:0.75rem;border-bottom:2px solid var(--primary-color);width:max-content;letter-spacing:-0.01em}.filter-controls{display:flex;flex-direction:column;gap:1.75rem}.date-filters{display:flex;flex-direction:column;gap:0.5rem}.date-filter-container{display:flex;gap:0.75rem}.date-filter{min-width:120px}.date-inputs{display:flex;gap:1.25rem}.select-wrapper{position:relative;width:100%}.select-wrapper::after{content:'▼';font-size:0.7rem;position:absolute;right:1.25rem;top:50%;transform:translateY(-50%);color:var(--primary-color);pointer-events:none;opacity:0.8}select{width:100%;padding:0.875rem 2.75rem 0.875rem 1.25rem;appearance:none;background:linear-gradient(to bottom,#ffffff,#f8fafc);border:1px solid rgba(0,0,0,0.08);border-radius:0.75rem;color:var(--gray-800);font-size:0.95rem;cursor:pointer;transition:all 0.2s ease;box-shadow:0 1px 2px rgba(0,0,0,0.04),inset 0 1px 2px rgba(255,255,255,0.9)}select:hover{border-color:var(--primary-color);background:linear-gradient(to bottom,#ffffff,#ffffff)}select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(52,152,219,0.15),0 1px 2px rgba(0,0,0,0.04);background:white}.platform-toggles{display:grid;grid-template-columns:1fr;gap:1rem}.platform-toggle{display:flex;align-items:center;gap:1rem;padding:1rem;background:linear-gradient(to bottom,#ffffff,#f8fafc);border:1px solid rgba(0,0,0,0.08);border-radius:0.75rem;cursor:pointer;transition:all 0.2s ease;box-shadow:0 1px 2px rgba(0,0,0,0.04),inset 0 1px 2px rgba(255,255,255,0.9)}.platform-toggle:hover{border-color:var(--primary-color);background:white;transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,0.06),inset 0 1px 2px rgba(255,255,255,0.9)}.platform-toggle input[type="checkbox"]{width:1.35rem;height:1.35rem;cursor:pointer;border:2px solid rgba(0,0,0,0.2);border-radius:6px;transition:all 0.2s ease;position:relative;background:white}.platform-toggle input[type="checkbox"]:checked{background-color:var(--primary-color);border-color:var(--primary-color)}.platform-toggle input[type="checkbox"]:checked::after{content:'';position:absolute;left:4px;top:1px;width:6px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.platform-toggle span{font-weight:500;color:var(--gray-800);font-size:0.95rem}.dropdown-checklist{position:relative}.dropdown-toggle{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 2rem 0.5rem 0.75rem;background-color:white;border:1px solid var(--gray-300);border-radius:var(--border-radius);color:var(--gray-700);font-size:0.9rem;cursor:pointer;transition:var(--transition);min-width:150px;position:relative}.dropdown-toggle i{position:absolute;right:0.75rem;transition:transform 0.3s ease}.dropdown-toggle.active i{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;left:0;z-index:10;width:250px;background-color:white;border:1px solid var(--gray-300);border-radius:var(--border-radius);box-shadow:0 4px 8px rgba(0,0,0,0.1);padding:0.75rem;margin-top:0.25rem;display:none}.dropdown-menu.show{display:block}.checklist-item{margin-bottom:0.75rem}.checklist-item label{display:flex;align-items:center;gap:0.75rem;cursor:pointer}.checklist-item input[type="checkbox"]{width:1rem;height:1rem;cursor:pointer}.rating-option{display:flex;align-items:center;gap:0.5rem}.stars{color:var(--warning-color);display:flex;gap:2px}.review-count{color:var(--gray-600);font-size:0.85rem}.checklist-actions{display:flex;justify-content:space-between;margin-top:1rem;padding-top:0.75rem;border-top:1px solid var(--gray-300)}/* ============================================================================= LAYOUT (from layout-old.css) ============================================================================= */ /* * Reviews Dashboard Layout Styles * * This file contains styles for the overall layout structure of the reviews page,* including containers,headers,and main content areas. */ .reviews-container{min-height:calc(100vh - var(--navbar-height));padding:2rem 0;position:relative;max-width:1400px;margin-left:auto;margin-right:auto;width:100%;box-sizing:border-box}body{font-family:"Neue Haas Grotesk",-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.6;color:var(--foreground-text);background:var(--light-color)}.reviews-header{margin-bottom:2rem}.reviews-header h1{font-size:20px;font-weight:600;color:var(--heading-color);margin:0 0 0.5rem}.reviews-header p{color:var(--secondary-text);font-size:14px;margin:0 0 1rem}.reviews-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.5rem}.platforms-view{margin-bottom:3rem}.platforms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem;margin-bottom:2rem}.reviews-view{background-color:var(--gray-100);border-radius:var(--border-radius);padding:2rem;box-shadow:var(--box-shadow)}.reviews-header-content{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.reviews-controls{background-color:white;border-radius:var(--border-radius);padding:1.5rem;margin-bottom:2rem;display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;box-shadow:var(--card-shadow)}.control-group{display:flex;flex-direction:column;gap:0.5rem}.control-group label{font-size:13px;font-weight:500;color:var(--secondary-text)}.select-wrapper{position:relative}.select-wrapper select{appearance:none;padding:8px 32px 8px 12px;border:1px solid var(--border-color);border-radius:var(--radius);background-color:var(--input-bg);font-size:14px;width:100%;cursor:pointer}.select-wrapper::after{content:'▼';position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:10px;color:var(--secondary-text);pointer-events:none}.chart-toggle-container{margin:1rem 0}.chart-toggle-btn{display:flex;align-items:center;gap:0.5rem;padding:0.75rem 1rem;background-color:rgba(0,0,0,0.05);border:none;border-radius:var(--radius);font-size:14px;font-weight:500;color:var(--heading-color);cursor:pointer;transition:var(--transition)}.chart-toggle-btn:hover{background-color:rgba(0,0,0,0.08)}.chart-toggle-btn.active{background-color:rgba(67,97,238,0.1);color:var(--ai-icon-blue)}.rating-chart-section{display:none;margin-bottom:2rem;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--card-shadow);padding:1.5rem}.rating-chart-section.visible{display:block;animation:fadeIn 0.3s ease forwards}#unified-reviews{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.5rem;margin:0;padding:0}.no-reviews{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;background-color:white;border-radius:var(--border-radius);box-shadow:var(--card-shadow);text-align:center}.no-reviews i{font-size:3rem;color:var(--gray-500);margin-bottom:1rem}.no-reviews p{font-size:1.25rem;color:var(--gray-700);margin-bottom:0}.content-container{opacity:0;transition:opacity 0.3s ease-in;min-height:calc(100vh - var(--navbar-height) - var(--footer-height))}.content-container.visible{opacity:1}.reviews-container:has(.loading-container:not(.hidden)) .content-container{opacity:1;visibility:visible;pointer-events:auto}.loading-container{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,0.9);display:flex;justify-content:center;align-items:center;z-index:9999}.loading-container.hidden{display:none}.loading-message{font-size:16px;font-weight:500;color:var(--heading-color);margin-top:1rem}@media (max-width:768px){.platforms-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.review-header{flex-direction:column}.reviews-controls{flex-direction:column}#unified-reviews{grid-template-columns:1fr}}/* ============================================================================= LOADING (from loading-old.css) ============================================================================= */ .loading-container{position:fixed;top:var(--navbar-height);left:0;width:100%;height:100vh;background-color:white;display:flex;flex-direction:column;align-items:center;justify-content:center;align-items:center;z-index:1000;opacity:1;transition:opacity 0.3s ease-out;height:calc(100vh - var(--navbar-height))}.loading-container.hidden{opacity:0;pointer-events:none}.loading-message{font-size:1.1rem;color:var(--gray-700);margin-top:2rem;text-align:center;font-weight:500}.cube-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(75px,15vw);height:min(75px,15vw);transform-style:preserve-3d;transform:rotateX(-30deg) scale(1.2);animation:animate 4s linear infinite;margin:0 auto}@keyframes animate{0%{transform:rotateX(-30deg) rotateY(0)}100%{transform:rotateX(-30deg) rotateY(360deg)}}.cube-loader .cube-wrapper{position:absolute;width:100%;height:100%;transform-style:preserve-3d}.cube-loader .cube-wrapper .cube-span{position:absolute;width:100%;height:100%;transform:rotateY(calc(90deg * var(--i))) translateZ(37.5px);background:#f5f5f5;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 10px rgba(0,0,0,0.1);border:1px solid rgba(128,128,128,0.2)}.cube-top{position:absolute;width:75px;height:75px;background:#e9e9e9;transform:rotateX(90deg) translateZ(37.5px);transform-style:preserve-3d;box-shadow:inset 0 0 10px rgba(0,0,0,0.1);border:1px solid rgba(128,128,128,0.2);display:flex;align-items:center;justify-content:center}.cube-bottom{position:absolute;width:75px;height:75px;background:#e9e9e9;transform:rotateX(-90deg) translateZ(37.5px);transform-style:preserve-3d;box-shadow:inset 0 0 10px rgba(0,0,0,0.1);border:1px solid rgba(128,128,128,0.2);display:flex;align-items:center;justify-content:center}.cube-shadow{position:absolute;bottom:-60px;width:75px;height:20px;background:rgba(0,0,0,0.2);transform:rotateX(90deg);filter:blur(10px);border-radius:50%}.emoji{font-size:40px;text-align:center}.emoji-container{text-align:center;font-size:50px;display:flex;align-items:center;justify-content:center;height:100%}/* ============================================================================= PLATFORMS (from platforms-old.css) ============================================================================= */ .platform-badge{padding:0.3rem 0.8rem;margin-top:0.5rem;display:inline-flex;align-items:center;font-size:0.9rem;gap:0.5rem;color:var(--gray-800);border-radius:2rem;font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,0.1);transition:var(--transition)}.platform-badge i{font-size:1.2rem}.review-card[data-platform="google"] .platform-badge{background-color:rgba(66,133,244,0.12);border:1px solid rgba(66,133,244,0.3)}.review-card[data-platform="booking"] .platform-badge{background-color:rgba(0,53,128,0.12);border:1px solid rgba(0,53,128,0.3)}.review-card[data-platform="tripadvisor"] .platform-badge{background-color:rgba(0,175,135,0.12);border:1px solid rgba(0,175,135,0.3)}.review-card[data-platform="holidaycheck"] .platform-badge{background-color:rgba(0,88,163,0.12);border:1px solid rgba(0,88,163,0.3)}.review-card[data-platform="expedia"] .platform-badge{background-color:rgba(255,204,0,0.15);border:1px solid rgba(255,204,0,0.3)}.review-card .platform-badge:hover{transform:translateY(-2px)}.booking-individual-score{font-size:0.9rem;color:var(--booking-color);font-weight:500;padding:0.2rem 0.5rem;border-radius:0.25rem;background-color:rgba(0,53,128,0.08);margin-top:0.25rem}.review-card[data-platform="booking"] .stay-details{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1rem;padding:0.75rem;border-radius:0.25rem;background-color:rgba(0,53,128,0.05);font-size:0.9rem;color:var(--gray-700)}.review-section{display:flex;gap:1rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--gray-300)}.section-icon{font-size:1.5rem;width:2rem;text-align:center;flex-shrink:0}.section-content{flex:1}.section-content strong{display:block;margin-bottom:0.5rem;color:var(--dark-color)}.liked .section-content strong{color:var(--success-color)}.disliked .section-content strong{color:var(--danger-color)}.verification-status{background-color:rgba(52,152,219,0.1);color:var(--secondary-color);padding:0.5rem 1rem;border-radius:0.25rem;margin-bottom:1rem;font-size:0.9rem;display:inline-block}.review-card[data-platform="holidaycheck"] .holidaycheck-extra{margin-top:0.25rem;font-size:0.85rem;color:var(--gray-600);display:flex;flex-wrap:wrap;gap:0.75rem;padding:0.5rem;background-color:rgba(0,88,163,0.05);border-radius:0.25rem;margin-bottom:0.5rem}/* ============================================================================= RESPONSIVE (from responsive-old.css) ============================================================================= */ @media (min-width:var(--bp-desktop)){.review-card[data-animation-delay]{animation-delay:var(--animation-delay,0s)}}@media (max-width:var(--bp-wide)){.chart-interface.with-sidebar .chart-container{width:65%}.chart-sidebar.visible{width:35%}}@media (max-width:var(--bp-desktop)){.chart-interface{flex-direction:column;gap:2rem;overflow:visible}.chart-interface.with-sidebar .chart-container{width:100%}.chart-sidebar{max-height:none}.chart-sidebar.visible{width:100%;min-width:100%;max-width:100%;position:relative;top:0}.chart-container{min-height:500px}}@media (max-width:var(--bp-tablet)){.chart-interface{padding:1.5rem}.chart-container{padding:1.5rem;padding-top:4.5rem}.chart-sidebar.visible{padding:1.5rem}.filter-toggle-btn{top:1.5rem;right:1.5rem;padding:0.75rem 1.25rem}}@media (max-width:var(--bp-mobile)){.reviews-container{padding:1rem 0.75rem}.platforms-grid{grid-template-columns:1fr;gap:1.5rem}.chart-toggle-btn,.back-button,.fetch-button{width:100%;justify-content:center;padding:0.6rem 1rem;font-size:0.9rem}.reviews-header-content{flex-direction:column;align-items:stretch;gap:1rem}.reviews-header-content h1{text-align:center}.reviewer-meta{flex-direction:column;gap:0.5rem}#unified-reviews{grid-template-columns:1fr}}/* ============================================================================= UTILITIES (from utilities-old.css) ============================================================================= */ .hidden{display:none !important}.no-scroll{overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.text-success{color:var(--success-color)}.text-danger{color:var(--danger-color)}.text-warning{color:var(--warning-color)}.text-secondary{color:var(--gray-500)}.bg-success{background-color:var(--success-color)}.bg-danger{background-color:var(--danger-color)}.badge{padding:0.35em 0.65em;font-size:0.75em;font-weight:600;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:0.25rem}/* ============================================================================= REVIEWS (from reviews-old.css) ============================================================================= */ .translation-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:1050;opacity:0;visibility:hidden;transition:opacity 0.3s ease,visibility 0.3s ease}.translation-modal.visible{opacity:1;visibility:visible}.translation-modal-content{background:var(--glass-background);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);border-radius:8px;box-shadow:var(--glass-shadow);width:90%;max-width:800px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;transform:scale(0.9);transition:transform 0.3s ease}.translation-modal.visible .translation-modal-content{transform:scale(1)}.translation-modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid #e6e9ec}.translation-modal-header h3{margin:0;font-size:1.25rem;color:#1a202c;font-weight:600}.close-modal{background:none;border:none;font-size:1.5rem;color:#718096;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color 0.2s ease}.close-modal:hover,.close-modal:focus{background:var(--glass-background);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#4a5568;outline:none}.translation-modal-body{padding:24px;overflow-y:auto;max-height:calc(90vh - 140px)}.translation-section{margin-bottom:24px}.translation-section h4{font-size:1rem;color:#4a5568;margin:0 0 12px 0;font-weight:600}.original-text,.translated-text{background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.1);border-radius:6px;padding:16px;font-size:1rem;line-height:1.6;color:#1a202c;white-space:pre-wrap;word-break:break-word}.original-text{border-left:3px solid #cbd5e0}.translated-text{border-left:3px solid #4299e1}.translation-modal-footer{padding:16px 24px;border-top:1px solid #e6e9ec;display:flex;align-items:center;justify-content:flex-end}.translation-note{color:#718096;font-size:0.875rem;margin:0}.btn-translate{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.1);color:#3182ce;border-radius:4px;font-size:0.875rem;font-weight:500;cursor:pointer;transition:background-color 0.2s ease,color 0.2s ease,box-shadow 0.2s ease}.btn-translate:hover,.btn-translate:focus{background-color:#e2e8f0;color:#2b6cb0;outline:none}.btn-translate:focus{box-shadow:0 0 0 2px rgba(49,130,206,0.3)}.btn-translate:disabled{opacity:0.7;cursor:not-allowed}.btn-translate .bi{font-size:1rem}.bi-arrow-repeat.rotate{animation:spin 1.5s linear infinite}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@media (max-width:768px){.translation-modal-content{width:95%;max-height:95vh}.translation-modal-body{padding:16px;max-height:calc(95vh - 120px)}.original-text,.translated-text{padding:12px}}/* ============================================================================= REVIEW-CARDS COMPONENT (from review-cards-old.css) ============================================================================= */ /* ============================================================================= ANIMATED REVIEW CARDS COMPONENT DUI-013:Create animated review card component with slide-up animations Created:2025-08-05 Based on:DUI-012 production analysis specification ============================================================================= */:root{--google-color:#4285F4;--booking-color:#003580;--tripadvisor-color:#00af87;--holidaycheck-color:#0058a3;--expedia-color:#ffcc00;--slide-up-duration:0.5s;--slide-up-timing:ease-out;--stagger-delay:0.1s;--slide-distance:20px}/* ============================================================================= UNIFIED REVIEWS CONTAINER Based on production templates/reviews.html:873 structure ============================================================================= */ #unified-reviews{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.5rem;margin:0;padding:0;min-height:200px}.unified-reviews{position:relative;width:100%}.unified-reviews.loading{opacity:0.7}.unified-reviews::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,var(--material-thin-bg),transparent);transform:translateX(-100%);z-index:1}.unified-reviews.loading::before{animation:shimmer 1.5s infinite}@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}/* ============================================================================= REVIEW CARD BASE STRUCTURE Based on production article.review-card structure ============================================================================= */ .review-card{background:#ffffff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:var(--glass-shadow);padding:1.5rem;position:relative;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);overflow:hidden;opacity:0;transform:translateY(var(--slide-distance));will-change:transform,opacity;backface-visibility:hidden;perspective:1000px}.review-card:hover{transform:translateY(-2px);box-shadow:var(--glass-shadow-hover)}/* ============================================================================= ANIMATION CLASSES Based on production animation system from DUI-012 ============================================================================= */ .review-card.animate-slide-up{animation-name:slideUp;animation-duration:var(--slide-up-duration);animation-timing-function:var(--slide-up-timing);animation-fill-mode:forwards;animation-delay:calc(var(--animation-order,0) * var(--stagger-delay))}.review-card.visible{animation-name:slideUp;animation-duration:var(--slide-up-duration);animation-timing-function:var(--slide-up-timing);animation-fill-mode:forwards}@keyframes slideUp{from{opacity:0;transform:translateY(var(--slide-distance))}to{opacity:1;transform:translateY(0)}}/* ============================================================================= REVIEW CARD HEADER Reviewer info,avatar,and rating display ============================================================================= */ .review-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.reviewer-info{display:flex;align-items:flex-start;gap:0.75rem;flex:1}.avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);display:flex;align-items:center;justify-content:center;color:white;font-weight:600;font-size:1.125rem;flex-shrink:0}.reviewer-details{min-width:0;flex:1}.reviewer-name{font-size:1rem;font-weight:600;color:#111827;margin:0 0 0.25rem 0;line-height:1.25}.reviewer-meta{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:0.5rem}.reviewer-location,.review-date{font-size:0.875rem;color:#6b7280}.reviewer-location::after{content:'•';margin:0 0.5rem;color:#d1d5db}.reviewer-location:last-child::after{display:none}.date-unparsed{color:#f59e0b;font-style:italic}.date-unknown{color:#9ca3af;font-style:italic}.platform-badge{display:inline-flex;align-items:center;gap:0.375rem;padding:0.25rem 0.5rem;background:#f3f4f6;border-radius:6px;font-size:0.75rem;font-weight:500;color:#374151}.platform-badge i{font-size:0.875rem}.review-card[data-platform="google"] .platform-badge{background:var(--platform-google-bg);color:var(--google-color)}.review-card[data-platform="booking"] .platform-badge{background:var(--platform-booking-bg);color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .platform-badge{background:var(--platform-tripadvisor-bg);color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .platform-badge{background:var(--platform-holidaycheck-bg);color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .platform-badge{background:var(--platform-expedia-bg);color:#d97706}.review-rating{display:flex;align-items:center;gap:0.25rem;flex-shrink:0}.stars{display:flex;gap:2px}.star{width:16px;height:16px;color:#fbbf24}.star.filled{color:#f59e0b}.star.empty{color:#d1d5db}.rating-value{font-size:0.875rem;font-weight:600;color:#374151;margin-left:0.25rem}/* ============================================================================= REVIEW CONTENT Main review text and title ============================================================================= */ .review-content{margin-bottom:1rem}.review-text-content{line-height:1.6}.review-title{font-size:1rem;font-weight:600;color:#111827;margin:0 0 0.5rem 0;line-height:1.4}.full-review{font-size:0.875rem;color:#374151;line-height:1.6;margin:0}/* ============================================================================= PLATFORM WATERMARK Subtle platform indication ============================================================================= */ .platform-watermark{position:absolute;top:1rem;right:1rem;width:24px;height:24px;opacity:0.1;pointer-events:none;z-index:1}.platform-watermark::before{content:'';position:absolute;width:100%;height:100%;background-size:contain;background-repeat:no-repeat;background-position:center}.review-card[data-platform="google"] .platform-watermark::before{background-color:var(--google-color);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z'/%3E%3C/svg%3E") no-repeat}.review-card[data-platform="booking"] .platform-watermark::before{background-color:var(--booking-color);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 3v18h18V3H3zm15 15H6v-2h12v2zm0-4H6v-2h12v2zm0-4H6V8h12v2z'/%3E%3C/svg%3E") no-repeat}/* ============================================================================= REVIEW FOOTER Action buttons and controls ============================================================================= */ .review-footer{display:flex;align-items:center;justify-content:space-between;gap:0.75rem;margin-top:1rem;padding-top:1rem;border-top:1px solid #f3f4f6}.btn-reply,.btn-translate{display:inline-flex;align-items:center;gap:0.375rem;padding:0.5rem 0.75rem;font-size:0.875rem;font-weight:500;border:1px solid #d1d5db;border-radius:6px;background:#ffffff;color:#374151;cursor:pointer;transition:all 0.2s ease;text-decoration:none}.btn-reply:hover,.btn-translate:hover{background:#f9fafb;border-color:#9ca3af;color:#111827}.btn-reply:active,.btn-translate:active{background:#f3f4f6}.review-actions{display:flex;align-items:center;gap:0.5rem}.btn-flag{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid #d1d5db;border-radius:6px;background:#ffffff;color:#6b7280;cursor:pointer;transition:all 0.2s ease}.btn-flag:hover{background:#fef2f2;border-color:#fca5a5;color:#dc2626}/* ============================================================================= RESPONSIVE DESIGN Mobile and tablet optimizations ============================================================================= */ @media (max-width:768px){#unified-reviews{grid-template-columns:1fr;gap:1rem}.review-card{padding:1rem}.reviewer-info{gap:0.5rem}.avatar{width:40px;height:40px;font-size:1rem}.reviewer-meta{flex-direction:column;gap:0.25rem}.reviewer-location::after{display:none}.review-footer{flex-direction:column;align-items:stretch;gap:0.5rem}.review-footer > div{display:flex;justify-content:space-between}}@media (max-width:480px){.review-card{padding:0.75rem;margin:0 0.5rem}.reviewer-name{font-size:0.875rem}.review-title{font-size:0.875rem}.full-review{font-size:0.8125rem}}/* ============================================================================= ACCESSIBILITY & PERFORMANCE Reduced motion support and performance optimizations ============================================================================= */ @media (prefers-reduced-motion:reduce){.review-card,.review-card.animate-slide-up,.review-card.visible{animation:none;transition:none}.review-card{opacity:1;transform:translateY(0)}.unified-reviews::before,.unified-reviews.loading::before{animation:none}}@media (prefers-contrast:high){.review-card{border:2px solid #000000}.platform-badge{border:1px solid currentColor}.btn-reply,.btn-translate,.btn-flag{border:2px solid currentColor}}.review-card:focus-visible,.btn-reply:focus-visible,.btn-translate:focus-visible,.btn-flag:focus-visible{outline:2px solid #2563eb;outline-offset:2px}@media print{.review-card{break-inside:avoid;box-shadow:none;border:1px solid #000000}.btn-reply,.btn-translate,.btn-flag{display:none}.platform-watermark{display:none}}/* ============================================================================= DEMO MODE ENHANCEMENTS Special styling for demo pages ============================================================================= */ .demo-mode .review-card{position:relative}.demo-mode .review-card::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;background:linear-gradient(135deg,transparent 0%,var(--material-ultra-thin-bg) 50%,transparent 100%);border-radius:12px}.review-card.performance-monitor{--start-time:0}.review-card.performance-monitor.visible{--end-time:0}/* ============================================================================= PAGES/REVIEWS (from pages/reviews-old.css) ============================================================================= */ /* * Reviews Dashboard Styles - Modular Implementation * * This is the main entry point for reviews page styles. * It imports all the modular components for the reviews page. */ @import 'reviews/variables.css';@import 'reviews/animations.css';@import 'reviews/utilities.css';@import 'reviews/layout.css';@import 'reviews/cards.css';@import 'reviews/buttons.css';@import 'reviews/charts.css';@import 'reviews/filters.css';@import 'reviews/loading.css';@import 'reviews/platforms.css';@import 'reviews/responsive.css';/* ============================================================================= PAGES/REVIEWS_CONTENT (from pages/reviews_content-old.css) ============================================================================= */ .reviews-content-container{max-width:1200px;margin:0 auto;padding:2rem}.reviews-title-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.reviews-title{font-size:2rem;color:var(--primary-color);margin:0;font-weight:700;line-height:1.2}.back-button{display:inline-flex;align-items:center;gap:0.5rem;padding:0.75rem 1.25rem;background-color:var(--primary-color);color:white;border:none;border-radius:var(--border-radius);font-weight:600;text-decoration:none;transition:var(--transition)}.back-button:hover,.back-button:focus{background-color:var(--secondary-color);transform:translateY(-2px);color:white;text-decoration:none;outline:none}.back-button i{font-size:1rem}.alert{padding:1rem;border-radius:var(--border-radius);margin-bottom:2rem;box-shadow:var(--card-shadow)}.alert-danger{background-color:rgba(231,76,60,0.1);color:var(--danger-color);border:1px solid rgba(231,76,60,0.2)}.review-container{background-color:var(--gray-100);border-radius:var(--border-radius);padding:2rem;box-shadow:var(--box-shadow)}.review-stats{background:var(--glass-background);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);padding:1.5rem;border-radius:var(--border-radius);box-shadow:var(--glass-shadow);margin-bottom:2rem !important}.rating-summary{display:flex;justify-content:center;align-items:center;text-align:center}.rating-big{display:flex;flex-direction:column;align-items:center}.native-rating{display:flex;align-items:baseline;margin-bottom:0.5rem}.rating-number{font-size:3.5rem;font-weight:700;color:var(--primary-color);line-height:1}.rating-scale{font-size:1.25rem;color:var(--gray-600);margin-left:0.25rem}.rating-stars{margin-bottom:0.5rem}.stars{color:var(--warning-color);font-size:1.5rem;display:flex;align-items:center;gap:0.1rem}.stars i{display:inline-flex;align-items:center;justify-content:center}.booking-score{display:flex;flex-direction:column;align-items:center}.booking-score-text{font-weight:600;color:var(--primary-color);margin-top:0.25rem}.normalized-rating{font-size:0.9rem;color:var(--gray-600);margin-bottom:0.5rem}.rating-count{font-size:0.9rem;color:var(--gray-600)}.reviews-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.5rem}.review-card{background:var(--glass-background);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);border-radius:var(--border-radius);overflow:hidden;box-shadow:var(--glass-shadow);transition:var(--transition);border:1px solid var(--gray-200);animation-delay:calc(var(--animation-order,0) * 0.1s);opacity:0;margin-bottom:1.5rem;display:flex;flex-direction:column;position:relative}.review-card:hover{transform:translateY(-5px);box-shadow:0 8px 15px rgba(0,0,0,0.1)}.review-card.visible{animation-name:slideUp;animation-duration:0.5s;animation-timing-function:ease-out;animation-fill-mode:forwards}.review-card[data-platform="google"]{border-left:4px solid var(--google-color);background:linear-gradient(to bottom,var(--glass-background),rgba(66,133,244,0.08),rgba(66,133,244,0.12))}.review-card[data-platform="booking"]{border-left:4px solid var(--booking-color);background:linear-gradient(to bottom,var(--glass-background),rgba(0,53,128,0.08),rgba(0,53,128,0.12))}.review-card[data-platform="tripadvisor"]{border-left:4px solid var(--tripadvisor-color);background:linear-gradient(to bottom,var(--glass-background),rgba(0,175,135,0.08),rgba(0,175,135,0.12))}.review-card[data-platform="holidaycheck"]{border-left:4px solid var(--holidaycheck-color);background:linear-gradient(to bottom,var(--glass-background),rgba(0,88,163,0.08),rgba(0,88,163,0.12))}.review-card[data-platform="expedia"]{border-left:4px solid var(--expedia-color);background:linear-gradient(to bottom,var(--glass-background),rgba(255,204,0,0.08),rgba(255,204,0,0.12))}.review-card::before{content:"";position:absolute;top:0;right:0;width:0;height:0;border-style:solid;border-width:0 50px 50px 0;z-index:1;transition:var(--transition)}.review-card:hover::before{border-width:0 60px 60px 0}.review-card[data-platform="google"]::before{border-color:transparent var(--google-color) transparent transparent}.review-card[data-platform="booking"]::before{border-color:transparent var(--booking-color) transparent transparent}.review-card[data-platform="tripadvisor"]::before{border-color:transparent var(--tripadvisor-color) transparent transparent}.review-card[data-platform="holidaycheck"]::before{border-color:transparent var(--holidaycheck-color) transparent transparent}.review-card[data-platform="expedia"]::before{border-color:transparent var(--expedia-color) transparent transparent}.review-card::after{font-family:"Bootstrap Icons";position:absolute;top:7px;right:7px;color:white;font-size:1.2rem;z-index:2;transform:rotate(45deg);text-shadow:0 1px 2px rgba(0,0,0,0.2)}.review-card[data-platform="google"]::after{content:"\F271"}.review-card[data-platform="booking"]::after{content:"\F17A"}.review-card[data-platform="tripadvisor"]::after{content:"\F63D"}.review-card[data-platform="holidaycheck"]::after{content:"\F5AF"}.review-card[data-platform="expedia"]::after{content:"\F6E6"}.review-card .platform-watermark{position:absolute;right:10px;bottom:10px;font-size:4rem;opacity:0.04;transform:rotate(-10deg);pointer-events:none;z-index:0}.review-card[data-platform="google"] .platform-watermark::before{content:"\F271";font-family:"Bootstrap Icons";color:var(--google-color)}.review-card[data-platform="booking"] .platform-watermark::before{content:"\F17A";font-family:"Bootstrap Icons";color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .platform-watermark::before{content:"\F63D";font-family:"Bootstrap Icons";color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .platform-watermark::before{content:"\F5AF";font-family:"Bootstrap Icons";color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .platform-watermark::before{content:"\F6E6";font-family:"Bootstrap Icons";color:var(--expedia-color)}.platform-badge{padding:0.3rem 0.8rem;margin-top:0.5rem;display:inline-flex;align-items:center;justify-content:flex-start;font-size:0.9rem;gap:0.5rem;max-width:fit-content;color:var(--gray-800);border-radius:2rem;font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,0.1);transition:var(--transition)}.platform-badge i{font-size:1.2rem}.review-card[data-platform="google"] .platform-badge{background-color:rgba(66,133,244,0.12);border:1px solid rgba(66,133,244,0.3)}.review-card[data-platform="booking"] .platform-badge{background-color:rgba(0,53,128,0.12);border:1px solid rgba(0,53,128,0.3)}.review-card[data-platform="tripadvisor"] .platform-badge{background-color:rgba(0,175,135,0.12);border:1px solid rgba(0,175,135,0.3)}.review-card[data-platform="holidaycheck"] .platform-badge{background-color:rgba(0,88,163,0.12);border:1px solid rgba(0,88,163,0.3)}.review-card[data-platform="expedia"] .platform-badge{background-color:rgba(255,204,0,0.15);border:1px solid rgba(255,204,0,0.3)}.review-card .platform-badge:hover{transform:translateY(-2px)}.review-rating{text-align:right;margin-left:1rem;flex-shrink:0}.rating-display{display:flex;flex-direction:column;align-items:flex-end;gap:0.5rem}.universal-rating .stars,.platform-rating .stars{font-size:1.2rem;display:flex;align-items:center;gap:0.1rem}.rating-value,.rating-score{display:inline-block;margin-left:0.5rem;font-weight:700;color:var(--primary-color);font-size:1.1rem}.review-card[data-platform="google"] .rating-value{color:var(--google-color)}.review-card[data-platform="booking"] .rating-display{background-color:rgba(0,53,128,0.08);padding:0.5rem;border-radius:0.5rem}.review-card[data-platform="booking"] .rating-value{color:var(--booking-color)}.booking-individual-score{font-size:0.9rem;color:var(--booking-color);font-weight:500;padding:0.2rem 0.5rem;border-radius:0.25rem;background-color:rgba(0,53,128,0.08);margin-top:0.25rem}.review-card[data-platform="tripadvisor"] .stars i{color:var(--tripadvisor-color)}.review-card[data-platform="tripadvisor"] .rating-value{color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .stars i{color:var(--holidaycheck-color)}.review-card[data-platform="holidaycheck"] .rating-value{color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .stars i{color:var(--expedia-color)}.review-card[data-platform="expedia"] .rating-value{color:var(--expedia-color)}.review-content{flex:1;display:flex;flex-direction:column;padding:1.5rem}.review-title{font-size:1.25rem;margin:0 0 1rem;color:var(--dark-color);font-weight:600;line-height:1.3;position:relative;padding-bottom:0.75rem}.review-title::after{content:"";position:absolute;bottom:0;left:0;width:3rem;height:3px;background-color:var(--gray-300)}.review-card[data-platform="google"] .review-title::after{background-color:var(--google-color)}.review-card[data-platform="booking"] .review-title::after{background-color:var(--booking-color)}.review-card[data-platform="tripadvisor"] .review-title::after{background-color:var(--tripadvisor-color)}.review-card[data-platform="holidaycheck"] .review-title::after{background-color:var(--holidaycheck-color)}.review-card[data-platform="expedia"] .review-title::after{background-color:var(--expedia-color)}.verification-status{background-color:rgba(52,152,219,0.1);color:var(--secondary-color);padding:0.5rem 1rem;border-radius:0.25rem;margin-bottom:1rem;font-size:0.9rem;display:inline-flex;align-items:center;gap:0.5rem}.verification-status::before{content:"✓";font-weight:bold;color:var(--secondary-color)}.review-card[data-platform="holidaycheck"] .holidaycheck-extra{margin-top:0.25rem;font-size:0.85rem;color:var(--gray-600);display:flex;flex-wrap:wrap;gap:0.75rem;padding:0.5rem;background-color:rgba(0,88,163,0.05);border-radius:0.25rem;margin-bottom:0.5rem}.stay-details{display:flex;flex-wrap:wrap;gap:1rem;margin-bottom:1rem;padding:0.75rem;border-radius:0.25rem;font-size:0.9rem;color:var(--gray-600);background-color:var(--gray-100)}.review-card[data-platform="booking"] .stay-details{background-color:rgba(0,53,128,0.05);color:var(--gray-700)}.review-card[data-platform="tripadvisor"] .stay-details{background-color:rgba(0,175,135,0.05)}.review-section{display:flex;gap:1rem;margin-bottom:1.5rem;padding-bottom:1.5rem;border-bottom:1px solid var(--gray-300)}.section-icon{font-size:1.5rem;width:2rem;text-align:center;flex-shrink:0}.section-content{flex:1}.review-card[data-platform="tripadvisor"] .section-icon{color:var(--tripadvisor-color)}.section-content strong{display:block;margin-bottom:0.5rem;color:var(--dark-color);font-weight:600}.liked .section-content strong{color:var(--success-color)}.disliked .section-content strong{color:var(--danger-color)}.owner-response{background-color:var(--gray-100);padding:1.25rem;border-radius:0.5rem;margin-top:1.5rem;border-left:3px solid var(--secondary-color);box-shadow:0 2px 4px rgba(0,0,0,0.03)}.response-header{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.75rem;color:var(--primary-color);font-weight:600}.response-header i{font-size:1.1rem;color:var(--secondary-color)}.owner-response p{margin-bottom:0;line-height:1.6;position:relative;padding-left:1rem}.owner-response p::before{content:'\201C';position:absolute;left:0;top:-0.5rem;font-size:1.5rem;color:var(--gray-400);font-family:serif}.review-footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background-color:var(--gray-100);border-top:1px solid var(--gray-300);margin-top:auto}.btn-reply{display:inline-flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;background-color:var(--primary-color);color:white;border:none;border-radius:var(--border-radius);font-size:0.9rem;cursor:pointer;transition:var(--transition)}.btn-reply:hover{background-color:var(--secondary-color);transform:translateY(-2px)}.review-actions{display:flex;gap:0.5rem}.btn-flag{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;background-color:var(--gray-200);color:var(--gray-600);border:none;border-radius:50%;cursor:pointer;transition:var(--transition)}.btn-flag:hover{background-color:var(--gray-300);color:var(--gray-800);transform:translateY(-2px)}.load-more-container{display:flex;justify-content:center;margin-top:2rem}.btn-load-more{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;padding:0.75rem 1.75rem;background-color:var(--primary-color);color:white;border:none;border-radius:var(--border-radius);font-weight:600;cursor:pointer;transition:var(--transition);min-width:200px}.btn-load-more:hover,.btn-load-more:focus{background-color:var(--secondary-color);transform:translateY(-2px);outline:none}.btn-load-more i{font-size:1.1rem}.no-reviews{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;background:var(--glass-background);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);border-radius:var(--border-radius);box-shadow:var(--box-shadow);text-align:center}.no-reviews i{font-size:3rem;color:var(--gray-500);margin-bottom:1rem}.no-reviews p{font-size:1.2rem;color:var(--gray-700);margin-bottom:0}.animate-fade-in{animation:fadeIn 0.5s ease-out}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.animate-slide-up{opacity:0;animation-name:slideUp;animation-duration:0.5s;animation-timing-function:ease-out;animation-fill-mode:forwards;animation-delay:calc(var(--animation-order,0) * 0.1s)}@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}@media (min-width:992px){.review-card[data-animation-delay]{animation-delay:var(--animation-delay,0s)}}@media (max-width:992px){.reviews-content-container{padding:1.5rem}.reviews-title{font-size:1.8rem}.rating-number{font-size:3rem}.reviews-list{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media (max-width:768px){.reviews-content-container{padding:1.25rem 1rem}.review-container{padding:1.5rem 1rem}.review-stats{padding:1.25rem}.review-header{flex-direction:column;gap:1rem}.review-rating{text-align:left;margin-left:0;width:100%}.rating-display{align-items:flex-start}.rating-number{font-size:2.5rem}.review-content{padding:1.25rem}.reviews-list{grid-template-columns:1fr}.review-card{animation-delay:0s !important}}@media (max-width:576px){.reviews-content-container{padding:1rem 0.75rem}.reviews-title-bar{margin-bottom:1.5rem}.reviews-title{font-size:1.5rem}.back-button{padding:0.6rem 1rem;font-size:0.9rem;width:100%;justify-content:center}.review-content{padding:1.25rem 1rem}.reviewer-meta{flex-direction:column;gap:0.5rem}.holidaycheck-extra{flex-direction:column;gap:0.5rem}.review-section{flex-direction:column;gap:0.75rem}.section-icon{width:auto;text-align:left}.review-footer{flex-direction:column;gap:1rem;align-items:flex-start}.review-actions{width:100%;justify-content:flex-end}.btn-reply{width:100%;justify-content:center}}.loading-container{min-height:calc(100vh - var(--navbar-height));display:flex;flex-direction:column;align-items:center;justify-content:center;position:fixed;top:var(--navbar-height);left:0;right:0;bottom:0;background-color:var(--background);z-index:999;opacity:1;visibility:visible;transition:opacity 0.3s ease,visibility 0.3s ease}.loading-container.hidden{opacity:0;visibility:hidden;pointer-events:none}.content-container{opacity:0;visibility:hidden;transition:opacity 0.3s ease,visibility 0.3s ease}.content-container.visible{opacity:1;visibility:visible}.reviews-content-container{position:relative}.reviews-content-container:has(.loading-container:not(.hidden)) main{opacity:0;visibility:hidden;pointer-events:none}.navbar{position:relative;z-index:1000}.detected-language{display:inline-flex;align-items:center;font-size:0.85rem;color:var(--gray-600);margin-right:0.5rem;transition:color 0.3s}.detected-language i{margin-right:0.25rem}.detected-language.language-detected{color:var(--success-color)}.detected-language.detection-error{color:var(--danger-color)}.rotate{animation:spin 1.5s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.btn-translate{background-color:transparent;border:none;color:var(--primary-color);cursor:pointer;padding:0.5rem;display:inline-flex;align-items:center;font-size:0.9rem;transition:color 0.3s}.btn-translate:hover{color:var(--dark-color)}.btn-translate i{margin-right:0.25rem}.translation-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;visibility:hidden;transition:opacity 0.3s,visibility 0.3s}.translation-modal.visible{opacity:1;visibility:visible}.translation-modal-content{background:var(--glass-background);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);border-radius:0.5rem;max-width:800px;width:90%;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 5px 15px rgba(0,0,0,0.2);transform:translateY(20px);transition:transform 0.3s}.translation-modal.visible .translation-modal-content{transform:translateY(0)}.translation-modal-header{padding:1rem 1.5rem;border-bottom:1px solid var(--gray-200);display:flex;align-items:center;justify-content:space-between}.translation-modal-header h3{margin:0;font-size:1.25rem;color:var(--dark-color)}.close-modal{background:transparent;border:none;font-size:1.5rem;line-height:1;cursor:pointer;color:var(--gray-600);transition:color 0.3s}.close-modal:hover{color:var(--dark-color)}.translation-modal-body{padding:1.5rem;overflow-y:auto;flex:1}.translation-section{margin-bottom:1.5rem}.translation-section:last-child{margin-bottom:0}.translation-section h4{margin:0 0 0.75rem;font-size:1rem;color:var(--gray-700);font-weight:600}.original-text,.translated-text{background-color:var(--gray-100);padding:1rem;border-radius:0.25rem;white-space:pre-wrap;font-size:0.95rem;line-height:1.5}.original-text{border-left:3px solid var(--gray-400)}.translated-text{border-left:3px solid var(--primary-color)}.translation-modal-footer{padding:1rem 1.5rem;border-top:1px solid var(--gray-200);display:flex;justify-content:flex-end}.translation-note{margin:0;font-size:0.85rem;color:var(--gray-500);font-style:italic}@media (max-width:768px){.translation-modal-content{width:95%;max-height:90vh}.translation-modal-header h3{font-size:1.1rem}.translation-section h4{font-size:0.95rem}.original-text,.translated-text{font-size:0.9rem;padding:0.75rem}}/* Cube loader styles have been moved to static/css/pages/reviews/loading.css to follow DRY principles and maintain a single source of truth */ .demo-banner .btn{background:rgba(255,255,255,0.9);color:var(--slate-800,#1e293b) !important;border:1px solid rgba(0,0,0,0.12)}.demo-banner .btn:hover{background:#ffffff;transform:translateY(-1px)}:root{--demo-primary-bg:rgba(79,70,229,0.06);--demo-primary-hover-bg:rgba(79,70,229,0.09);--demo-primary-border:rgba(79,70,229,0.20);--demo-primary-contrast-bg:rgba(255,255,255,0.85);--demo-primary-contrast-border:rgba(0,0,0,0.12);--demo-context-bg:rgba(79,70,229,0.06);--demo-context-border:rgba(79,70,229,0.18);--demo-business-bg:rgba(30,64,175,0.08);--demo-business-hover-bg:rgba(30,64,175,0.12);--demo-business-border:rgba(30,64,175,0.20);--demo-leisure-bg:rgba(124,58,237,0.08);--demo-leisure-hover-bg:rgba(124,58,237,0.12);--demo-leisure-border:rgba(124,58,237,0.20)}/* ===================================================== ENHANCED DEMO HEADER BANNERS ===================================================== */ .demo-banner{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;padding:1rem 2rem;border-radius:12px;margin:-2rem -2rem 2rem -2rem;box-shadow:var(--glass-shadow);opacity:0.92;transition:opacity 0.3s ease}.demo-banner:hover{opacity:1}.demo-banner-content{display:flex;justify-content:space-between;align-items:center;width:100%}.demo-banner-left{display:flex;align-items:center;gap:1rem}.demo-banner-right{flex-shrink:0}.demo-badge{background:var(--material-ultra-thin-bg);color:var(--glass-text-overlay);padding:0.25rem 0.75rem;border-radius:16px;font-weight:600;font-size:0.85rem;border:1px solid var(--material-ultra-thin-border);transition:all 0.3s ease}.demo-badge:hover{background:var(--material-thin-bg);color:white}.demo-text{color:var(--glass-text-overlay);font-weight:500}/* ===================================================== DEMO INDICATOR COMPONENTS ===================================================== */ .demo-indicator{display:flex;align-items:center;gap:0.5rem;background:var(--demo-primary-bg);color:#4f46e5;padding:0.5rem 0.75rem;border-radius:8px;font-size:0.875rem;font-weight:500;border:1px solid var(--demo-primary-border);transition:all 0.3s ease;opacity:0.85}.demo-indicator:hover{background:var(--demo-primary-hover-bg);opacity:1;transform:translateY(-1px)}.demo-indicator i{font-size:1rem;color:#4f46e5;opacity:0.8}/* ===================================================== CONTEXT BADGES (Minimal Demo Indicators) ===================================================== */ .context-badge{background:var(--demo-context-bg);color:#4f46e5;padding:0.25rem 0.5rem;border-radius:6px;font-size:0.75rem;font-weight:500;border:1px solid var(--demo-context-border);opacity:0.8;transition:all 0.3s ease}.context-badge:hover{background:var(--demo-primary-hover-bg);opacity:1}/* ===================================================== UNIVERSAL PROPERTY COMPONENTS ===================================================== */ .back-button{display:inline-flex;align-items:center;gap:0.5rem;background:#6b7280;color:white;padding:0.5rem 1rem;border-radius:6px;text-decoration:none;font-size:0.875rem;font-weight:500;transition:background-color 0.2s ease;margin-bottom:1rem}.back-button:hover{background:#4b5563;color:white;text-decoration:none}.property-type{color:var(--slate-600,#475569);font-style:italic;margin-bottom:1rem;margin-top:0.5rem}.dashboard-title + .property-type{margin-top:-1rem}.property-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin:2rem 0}.property-stats-grid .stat-card{background:white;border-radius:12px;padding:1.5rem;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,0.1);border:1px solid #e5e7eb;backdrop-filter:none;-webkit-backdrop-filter:none}.dashboard .container .card .card-header{background:var(--material-thin-bg);color:var(--slate-800,#1e293b);padding:1.25rem 1.5rem;border-bottom:1px solid var(--material-thin-border);backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));-webkit-backdrop-filter:blur(var(--material-thin-blur)) saturate(var(--material-thin-saturate));border-radius:12px 12px 0 0}.dashboard .container .card .card-header h3{color:var(--slate-800,#1e293b);margin:0 0 0.5rem 0;font-size:1.25rem;font-weight:600}.dashboard .container .card .card-header small{color:var(--slate-500,#64748b);font-size:0.875rem}.stat-value{font-size:2.5rem;font-weight:700;color:#10b981;display:block}.stat-label{color:var(--slate-500,#64748b);font-size:0.875rem;font-weight:500;margin-top:0.5rem}body.page-demo .card-header small{color:var(--slate-500,#64748b)}/* ===================================================== PROPERTY-SPECIFIC STYLING ===================================================== */ .grand-plaza .demo-indicator{background:var(--demo-business-bg);color:#1e40af;border-color:var(--demo-business-border)}.grand-plaza .demo-indicator:hover{background:var(--demo-business-hover-bg)}.grand-plaza .demo-indicator i{color:#1e40af}.seaside-resort .demo-indicator{background:var(--demo-leisure-bg);color:#7c3aed;border-color:var(--demo-leisure-border)}.seaside-resort .demo-indicator:hover{background:var(--demo-leisure-hover-bg)}.seaside-resort .demo-indicator i{color:#7c3aed}/* ===================================================== RESPONSIVE DESIGN ===================================================== */ @media (max-width:768px){.demo-banner{padding:0.75rem 1rem;margin:-1rem -1rem 1rem -1rem}.demo-banner-content{flex-direction:column;gap:1rem;text-align:center}.demo-banner-left{flex-direction:column;gap:0.5rem}.demo-indicator{font-size:0.8rem;padding:0.4rem 0.6rem}.demo-badge{font-size:0.8rem;padding:0.2rem 0.6rem}}@media (max-width:480px){.demo-banner{border-radius:0 0 8px 8px}.demo-indicator{font-size:0.75rem;padding:0.35rem 0.5rem}.demo-text{font-size:0.9rem}}/* ===================================================== ACCESSIBILITY & REDUCED MOTION ===================================================== */ @media (prefers-reduced-motion:reduce){.demo-indicator,.demo-badge,.demo-banner{transition:none}.demo-indicator:hover{transform:none}}@media (prefers-contrast:high){.demo-indicator{background:var(--demo-primary-contrast-bg);border-color:var(--demo-primary-contrast-border);opacity:1}.demo-badge{background:var(--material-thin-bg);border:1px solid var(--material-thick-border)}}/* ===================================================== PRINT STYLES (Hide Demo Indicators) ===================================================== */ @media print{.demo-banner,.demo-indicator,.demo-badge,.context-badge{display:none !important}}/* ===================================================== LEGACY SUPPORT (Override Existing Inline Styles) ===================================================== */ .demo-indicator[style]{background:var(--demo-primary-bg) !important;color:#4f46e5 !important;opacity:0.85 !important}.demo-watermark::before{display:none !important}/* ===================================================== DEMO ANALYSIS PAGE COMPONENTS (Merged from analysis.css - Demo-only styling) ===================================================== */ .btn-sm{padding:0.5rem 1rem;font-size:0.875rem;border-radius:6px;min-height:36px}.overview-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;text-align:center}.stat-item{padding:1.5rem;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0}.stat-value{font-size:2.5rem;font-weight:bold;color:#10b981;margin-bottom:0.5rem}.stat-label{color:var(--slate-500,#64748b);font-size:0.875rem;text-transform:uppercase;letter-spacing:0.05em}.analysis-results{margin:2rem 0 !important;display:block !important;visibility:visible !important}.analysis-content{width:100% !important;display:block !important;visibility:visible !important}.analysis-grid{display:grid !important;grid-template-columns:repeat(auto-fit,minmax(320px,1fr)) !important;gap:2rem !important;margin-bottom:2rem !important;visibility:visible !important}.analysis-results .card,.analysis-grid .card{display:block !important;visibility:visible !important;opacity:1 !important;background:var(--material-ultra-thin-bg) !important;border:1px solid var(--material-ultra-thin-border) !important;border-radius:12px !important;margin-bottom:2rem !important}.analysis-results .card-body,.analysis-grid .card .card-body{display:block !important;visibility:visible !important;padding:2rem !important}.table-container{background:white !important;border-radius:12px !important;overflow:hidden !important;box-shadow:var(--glass-shadow) !important;margin-bottom:1rem !important;display:block !important;visibility:visible !important}.table{width:100% !important;border-collapse:collapse !important;margin:0 !important;display:table !important;visibility:visible !important;opacity:1 !important}.table thead{background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 100%)}.table th{padding:1.25rem 1.5rem;font-weight:600;color:#1f2937;border-bottom:2px solid var(--material-ultra-thin-bg);font-size:14px;text-align:left}.table td{padding:1.25rem 1.5rem;border-bottom:1px solid var(--material-ultra-thin-bg);font-size:15px;color:#374151;vertical-align:top}.table tbody tr:hover{background:var(--table-hover-bg)}.table tbody tr:last-child td{border-bottom:none}.badge{display:inline-block;padding:0.375rem 0.75rem;font-size:0.75rem;font-weight:600;border-radius:0.375rem;text-align:center;white-space:nowrap}.badge-success{background-color:#dcfce7;color:#166534;border:1px solid #bbf7d0}.badge-warning{background-color:#fef3c7;color:#92400e;border:1px solid #fde68a}.text-muted{color:#6b7280;font-size:0.875rem}.analysis-results .card-header,.analysis-grid .card .card-header{padding:1.5rem !important;border-bottom:1px solid #e2e8f0 !important;background:var(--material-thin-bg) !important;position:relative !important;display:block !important;visibility:visible !important}.card-header h3{margin:0 0 0.5rem 0;color:#1f2937;font-size:1.25rem;font-weight:600}.card-header small{color:#6b7280;font-size:0.875rem}.card-header.accent{background:linear-gradient(135deg,#10b981 0%,#059669 100%);color:white;border-bottom:1px solid var(--material-thin-border)}.card-header.accent h3{color:white}.card-header.accent small{color:var(--glass-text-overlay)}.card-header.accent .demo-indicator{background:var(--material-thin-bg);color:white;border:1px solid var(--material-thin-border)}.card-header.negative{background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%);color:white;border-bottom:1px solid var(--material-thin-border)}.card-header.negative h3{color:white}.card-header.negative small{color:var(--glass-text-overlay)}.card-header.negative .demo-indicator{background:var(--material-thin-bg);color:white;border:1px solid var(--material-thin-border)}.sentiment-bar{display:flex;align-items:center;gap:0.5rem}.sentiment-fill{height:8px;background:#10b981;border-radius:4px;position:relative}.sentiment-fill.positive{background:linear-gradient(90deg,#10b981,#34d399)}.impact-level{padding:2px 8px;border-radius:12px;font-size:0.75rem;font-weight:500}.impact-level.medium{background:var(--warning-bg);color:#f59e0b}.impact-level.low{background:var(--muted-bg);color:#6b7280}.keywords-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0.75rem;padding:1rem 0}.keyword-item{display:flex;justify-content:space-between;align-items:center;padding:0.75rem 1rem;background:#f8fafc;border-radius:8px;border-left:4px solid #e5e7eb;transition:all 0.2s ease}.keyword-item:hover{background:#f1f5f9;transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,0.1)}.keyword-item.high-frequency{border-left-color:#10b981;background:rgba(16,185,129,0.05)}.keyword-item.medium-frequency{border-left-color:#f59e0b;background:rgba(245,158,11,0.05)}.keyword-item.low-frequency{border-left-color:#6b7280;background:rgba(107,114,128,0.05)}.keyword-term{font-weight:600;color:#1f2937;font-size:0.875rem}.keyword-count{font-size:0.8125rem;color:#6b7280;font-weight:500}.insights-container{display:grid !important;grid-template-columns:repeat(auto-fit,minmax(300px,1fr)) !important;gap:1.5rem !important;visibility:visible !important;opacity:1 !important}.insight-item{padding:1.5rem;border-radius:8px;border:1px solid #e2e8f0;display:flex;gap:1rem}.insight-item.positive{background:var(--success-light-bg);border-color:var(--success-border)}.insight-item.improvement{background:var(--warning-light-bg);border-color:var(--warning-border)}.insight-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;flex-shrink:0}.insight-item.positive .insight-icon{background:var(--success-bg);color:#10b981}.insight-item.improvement .insight-icon{background:var(--warning-bg);color:#f59e0b}.insight-content h4{margin:0 0 0.5rem 0;color:#1f2937}.insight-content p{margin:0;color:#6b7280;font-size:0.875rem;line-height:1.5}.form-actions{display:flex;justify-content:center;gap:1rem;margin:2rem 0}.demo-cta-card{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:white;border:none;margin-top:2rem;border-radius:12px}.demo-cta-content{display:flex;align-items:center;justify-content:space-between;gap:2rem}.demo-cta-left h3{margin:0 0 0.5rem 0;color:white}.demo-cta-left p{margin:0;color:var(--glass-text-overlay)}.demo-cta-right{display:flex;gap:1rem;flex-shrink:0}.ai-assistant-trigger{width:100%;max-width:600px;margin:2rem auto;background:none;border:none;padding:0;cursor:pointer;transition:all 0.2s ease;display:block;border-radius:16px;overflow:hidden;box-shadow:var(--glass-shadow)}.ai-assistant-trigger:hover{transform:translateY(-2px);box-shadow:var(--glass-shadow-hover)}.trigger-content{display:flex;align-items:center;gap:1.5rem;padding:2rem;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:white;text-align:left}.trigger-icon{width:60px;height:60px;border-radius:50%;background:var(--material-thin-bg);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.5rem}.trigger-text{flex:1}.trigger-text h4{margin:0 0 0.5rem 0;font-size:1.25rem;font-weight:600;color:white}.trigger-text p{margin:0;opacity:0.9;font-size:0.95rem}.trigger-arrow{font-size:1.25rem;opacity:0.8;transition:transform 0.2s ease}.ai-assistant-trigger:hover .trigger-arrow{transform:translateX(4px)}/* ===================================================== REVIEW CARDS & NAVIGATION - Universal Components ===================================================== */ .demo-reviews-container{width:100%;margin:0;padding:0}.unified-reviews{width:100%;margin:0;padding:0}.navigation-section{margin:2rem 0;text-align:center}.analysis-link{display:inline-flex;align-items:center;gap:0.5rem;background:linear-gradient(135deg,#059669,#10b981);color:white;padding:0.75rem 1.5rem;border-radius:8px;text-decoration:none;font-weight:600;transition:transform 0.2s ease}.analysis-link:hover{transform:translateY(-2px);color:white;text-decoration:none}.insights-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:2rem}.insight-item{padding:1.5rem;border-radius:8px;border:1px solid #e2e8f0;display:flex;gap:1rem}.insight-item.positive{background:rgba(16,185,129,0.05);border-color:rgba(16,185,129,0.2)}.insight-item.improvement{background:rgba(245,158,11,0.05);border-color:rgba(245,158,11,0.2)}.insight-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;flex-shrink:0}.insight-item.positive .insight-icon{background:rgba(16,185,129,0.1);color:#10b981}.insight-item.improvement .insight-icon{background:rgba(245,158,11,0.1);color:#f59e0b}.insight-content h4{margin:0 0 0.5rem 0;color:#1f2937;font-size:1.125rem;font-weight:600}.insight-content p{margin:0;color:#6b7280;font-size:0.875rem;line-height:1.5}.analysis-cta{text-align:center;padding:2rem;background:var(--material-ultra-thin-bg);border-radius:12px;border:1px solid var(--material-ultra-thin-border);box-shadow:var(--glass-shadow);backdrop-filter:blur(8px);margin-top:2rem}.analysis-cta h4{margin:0 0 0.5rem 0;color:#1f2937;font-size:1.25rem;font-weight:600}.analysis-cta p{margin:0 0 1.5rem 0;color:#6b7280;font-size:0.95rem}.cta-banner{background:linear-gradient(135deg,#7c3aed,#a855f7);color:white;padding:2rem;border-radius:12px;text-align:center;margin:2rem 0}.cta-banner h3{margin-bottom:1rem;font-size:1.5rem}.cta-banner p{margin-bottom:1.5rem;opacity:0.9}.cta-button{background:white;color:#7c3aed;padding:0.75rem 2rem;border-radius:8px;text-decoration:none;font-weight:600;display:inline-block;transition:transform 0.2s ease}.cta-button:hover{transform:translateY(-2px);text-decoration:none;color:#7c3aed}.sentiment-score-card{background:linear-gradient(135deg,#059669,#10b981);color:white;border-radius:16px;padding:2rem;text-align:center;margin-bottom:2rem;box-shadow:var(--glass-shadow)}.sentiment-score-value{font-size:4rem;font-weight:700;margin:0;text-shadow:0 2px 4px rgba(0,0,0,0.2)}.sentiment-score-label{font-size:1.25rem;opacity:0.9;margin-top:0.5rem}.sentiment-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin:2rem 0}.sentiment-section{background:white;border-radius:12px;padding:1.5rem;box-shadow:var(--glass-shadow);border:1px solid #e5e7eb}.sentiment-section.positive{border-left:4px solid #10b981}.sentiment-section.negative{border-left:4px solid #f59e0b}.sentiment-section h4{margin:0 0 1rem 0;color:#1f2937;font-size:1.125rem;font-weight:600}.dimensions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin:2rem 0}.dimension-card{background:white;border-radius:12px;padding:1.5rem;text-align:center;box-shadow:var(--glass-shadow);border:1px solid #e5e7eb;transition:transform 0.2s ease}.dimension-card:hover{transform:translateY(-2px);box-shadow:var(--glass-shadow-hover)}.dimension-value{font-size:2.5rem;font-weight:700;color:#10b981;display:block;margin-bottom:0.5rem}.dimension-label{color:#6b7280;font-size:0.875rem;font-weight:500}.recommendations-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin:2rem 0}.recommendation-item{background:white;border-radius:12px;padding:1.5rem;box-shadow:var(--glass-shadow);border:1px solid #e5e7eb;border-left:4px solid #4f46e5}.recommendation-item h4{margin:0 0 0.75rem 0;color:#1f2937;font-size:1.125rem;font-weight:600}.recommendation-item p{margin:0;color:#6b7280;font-size:0.875rem;line-height:1.5}.floating-ai-assistant{position:fixed;bottom:2rem;right:2rem;z-index:1000;background:linear-gradient(135deg,#4f46e5,#7c3aed);border:none;border-radius:50%;width:64px;height:64px;cursor:pointer;box-shadow:0 8px 32px rgba(79,70,229,0.4);transition:all 0.3s ease;display:flex;align-items:center;justify-content:center;animation:float 3s ease-in-out infinite}.floating-ai-assistant:hover{transform:scale(1.1);box-shadow:0 12px 40px rgba(79,70,229,0.6)}.floating-ai-assistant i{font-size:1.5rem;color:white}.floating-ai-assistant::before{content:'';position:absolute;top:-2px;left:-2px;right:-2px;bottom:-2px;background:linear-gradient(45deg,#4f46e5,#7c3aed,#06b6d4,#10b981);border-radius:50%;z-index:-1;animation:spin 4s linear infinite;opacity:0.7}@keyframes float{0%,100%{transform:translateY(0px)}50%{transform:translateY(-8px)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.floating-ai-tooltip{position:absolute;bottom:120%;right:0;background:var(--material-thin-bg);backdrop-filter:blur(12px);border:1px solid var(--material-thin-border);border-radius:8px;padding:0.75rem 1rem;white-space:nowrap;font-size:0.875rem;color:#1f2937;opacity:0;transform:translateY(10px);transition:all 0.3s ease;pointer-events:none}.floating-ai-assistant:hover .floating-ai-tooltip{opacity:1;transform:translateY(0)}.liquid-glass-cta{background:var(--material-thin-bg);backdrop-filter:blur(12px);border:1px solid var(--material-thin-border);border-radius:20px;margin:3rem 0;padding:3rem;text-align:center;box-shadow:var(--glass-shadow-hover);position:relative;overflow:hidden}.liquid-glass-cta::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--glass-highlight),transparent);opacity:0.8}.liquid-glass-cta h3{margin:0 0 1rem 0;font-size:2rem;font-weight:700;background:linear-gradient(135deg,#1f2937,#4f46e5);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.liquid-glass-cta p{margin:0 0 2.5rem 0;color:#6b7280;font-size:1.1rem;line-height:1.6;opacity:0.9}.cta-actions{display:flex;gap:1.5rem;justify-content:center;align-items:center;flex-wrap:wrap}.cta-primary{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;padding:1rem 2.5rem;border-radius:12px;text-decoration:none;font-weight:600;font-size:1.1rem;border:none;cursor:pointer;transition:all 0.3s ease;box-shadow:0 4px 20px rgba(79,70,229,0.3);position:relative;overflow:hidden}.cta-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(79,70,229,0.4);color:white;text-decoration:none}.cta-secondary{background:var(--material-ultra-thin-bg);color:#4f46e5;padding:1rem 2.5rem;border-radius:12px;text-decoration:none;font-weight:600;font-size:1.1rem;border:1px solid var(--material-thin-border);transition:all 0.3s ease;backdrop-filter:blur(8px)}.cta-secondary:hover{background:var(--material-thin-bg);transform:translateY(-2px);color:#4f46e5;text-decoration:none;box-shadow:var(--glass-shadow)}/* ===================================================== DEMO ANALYSIS RESPONSIVE DESIGN ===================================================== */ @media (max-width:768px){.analysis-grid{grid-template-columns:1fr !important}.demo-cta-content{flex-direction:column;text-align:center}.demo-cta-right{flex-direction:column;width:100%}.insights-container{grid-template-columns:1fr !important}.insights-grid{grid-template-columns:1fr}.liquid-glass-cta{padding:2rem 1rem;margin:2rem 0;border-radius:16px}.liquid-glass-cta h3{font-size:1.5rem}.liquid-glass-cta p{font-size:1rem}.cta-actions{flex-direction:column;gap:1rem}.cta-primary,.cta-secondary{width:100%;text-align:center}}/* ======================================== SENTIMENT ANALYSIS COMPONENTS ======================================== */ .sentiment-score-description{margin-top:1rem;opacity:0.9;font-size:0.9rem}.sentiment-list{list-style:none;padding:0;margin:1rem 0 0 0}.sentiment-item-positive{background:#ecfdf5;padding:0.75rem 1rem;margin-bottom:0.5rem;border-radius:8px;border-left:3px solid #10b981}.sentiment-item-negative{background:#fffbeb;padding:0.75rem 1rem;margin-bottom:0.5rem;border-radius:8px;border-left:3px solid #f59e0b}/* ======================================== UNIFIED CTA COMPONENT ======================================== */ .unified-cta{margin:4rem 0;position:relative}.cta-glass-container{background:var(--material-thin-bg);backdrop-filter:blur(16px);border:1px solid var(--material-thin-border);border-radius:24px;padding:3rem;position:relative;overflow:hidden;box-shadow:var(--glass-shadow-hover)}.cta-geometric-border{position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;background:linear-gradient(135deg,rgba(79,70,229,0.2),rgba(79,70,229,0.1));border-radius:25px;z-index:-1;animation:subtleBorderPulse 3s ease-in-out infinite}@keyframes subtleBorderPulse{0%,100%{opacity:0.5}50%{opacity:0.8}}.cta-content-grid{position:relative;z-index:2}.cta-dynamic-title{font-size:2.5rem;font-weight:700;margin:0 0 2rem 0;line-height:1.2;text-align:center}.cta-title-line{color:#1f2937;margin-bottom:0.5rem}.cta-rotating-line{min-height:1.2em;display:flex;justify-content:center;align-items:center;position:relative}.cta-highlight-text{background:linear-gradient(135deg,#4f46e5,#7c3aed,#06b6d4);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:200% 200%;animation:gradientShift 4s ease-in-out infinite;position:relative;transition:opacity 0.3s ease}@keyframes gradientShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}.cta-rotating-line::after{content:'';position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:120px;height:4px;background:linear-gradient(135deg,#4f46e5,#7c3aed,#06b6d4);background-size:200% 200%;border-radius:2px;animation:gradientShift 3s ease-in-out infinite;box-shadow:0 2px 8px rgba(79,70,229,0.3)}.cta-subtitle{text-align:center;font-size:1.1rem;color:#6b7280;margin-bottom:3rem;font-weight:400;line-height:1.6;max-width:650px;margin-left:auto;margin-right:auto}.cta-actions{display:flex;justify-content:center;gap:1.5rem;margin-bottom:2rem}.cta-primary{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:white;padding:1rem 2.5rem;border-radius:12px;text-decoration:none;font-weight:600;font-size:1rem;position:relative;overflow:hidden;box-shadow:0 4px 20px rgba(79,70,229,0.3);transition:all 0.3s ease}.cta-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(79,70,229,0.4);color:white;text-decoration:none}.cta-shine-effect{position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);animation:shine 3s infinite}@keyframes shine{0%{left:-100%}100%{left:100%}}.cta-secondary{background:var(--material-ultra-thin-bg);color:#4f46e5;padding:1rem 2.5rem;border:1px solid var(--material-thin-border);border-radius:12px;text-decoration:none;font-weight:600;transition:all 0.3s ease;backdrop-filter:blur(8px)}.cta-secondary:hover{background:var(--material-thin-bg);color:#4f46e5;text-decoration:none;transform:translateY(-1px);box-shadow:var(--glass-shadow)}.cta-floating-elements{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none;opacity:0.4}.cta-float-circle{position:absolute;border-radius:50%;background:rgba(79,70,229,0.03);border:1px solid rgba(79,70,229,0.08)}.cta-circle-1{width:40px;height:40px;top:15%;left:15%;animation:subtleFloatMove1 12s ease-in-out infinite}.cta-circle-2{width:30px;height:30px;top:30%;right:20%;animation:subtleFloatMove2 10s ease-in-out infinite}.cta-circle-3{width:50px;height:50px;bottom:20%;left:25%;animation:subtleFloatMove3 15s ease-in-out infinite}@keyframes subtleFloatMove1{0%,100%{transform:translate(0,0)}50%{transform:translate(10px,-8px)}}@keyframes subtleFloatMove2{0%,100%{transform:translate(0,0)}50%{transform:translate(-8px,12px)}}@keyframes subtleFloatMove3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(6px,-10px) scale(1.05)}}@media (max-width:768px){.cta-glass-container{padding:2rem 1.5rem}.cta-actions{flex-direction:column;gap:1rem}.cta-dynamic-title{font-size:2rem}.cta-subtitle{font-size:1rem}}/* ============================================================================ MIGRATED FROM dashboard.css - Demo Review Styles (Section 2) Migrated:2025-09-05 Lines:1774-2330 (557 lines) Analysis:39 classes,0 dead code (100% active) Used in:demo_dashboard.html,demo-grand-plaza.html,demo-seaside-resort.html ============================================================================ */ .demo-reviews-container{display:flex;flex-direction:column;gap:1.5rem}.review-card{background:white;border-radius:16px;padding:1.5rem;margin-bottom:1.5rem;box-shadow:var(--material-ultra-thin-shadow);border:1px solid #e5e7eb;transition:all 0.3s cubic-bezier(0.25,0.1,0.25,1)}.review-card:hover{transform:translateY(-2px);box-shadow:var(--material-regular-shadow)}.review-card.response-selected{border-color:#10b981;box-shadow:0 4px 16px rgba(16,185,129,0.15)}.review-header{display:flex;flex-direction:column;align-items:flex-start;margin:-1.5rem -1.5rem 1rem -1.5rem;padding:1rem 1rem;border-bottom:1px solid #f3f4f6;background:transparent;gap:0.75rem}.platform-logo{display:flex;align-items:center;gap:0.75rem;width:100%}.platform-icon:not(img){width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#374151;transition:all 0.2s ease}.platform-name{font-weight:600;font-size:0.95rem;color:#374151}.review-rating{display:flex;align-items:center;gap:0.25rem;font-weight:600;width:100%;justify-content:flex-start}.booking-rating{color:#1976d2}.booking-rating .rating-value{font-size:1.25rem}.booking-rating .rating-scale{font-size:0.9rem;color:#666}.google-rating{color:#4285f4}.google-rating .stars{display:flex;gap:2px;flex-wrap:nowrap;flex-shrink:1;min-width:0}.google-rating .stars i{font-size:16px;flex-shrink:0}.google-rating .stars i.filled{color:#fbbf24}.google-rating .stars i:not(.filled){color:#d1d5db}.google-rating .rating-text{font-size:0.9rem;margin-left:0.25rem}.tripadvisor-rating{color:#00aa6c}.tripadvisor-rating .bubbles{display:flex;gap:3px}.tripadvisor-rating .bubbles i{font-size:14px}.tripadvisor-rating .bubbles i.filled{color:#00aa6c}.tripadvisor-rating .bubbles i:not(.filled){color:#d1d5db}.tripadvisor-rating .rating-text{font-size:0.9rem;margin-left:0.25rem}.reviewer-info{padding:0 1.25rem 1rem;display:flex;justify-content:space-between;align-items:center}.reviewer-details{display:flex;flex-direction:column;gap:0.25rem}.reviewer-name{font-weight:600;color:#111827;font-size:0.95rem}.reviewer-location{font-size:0.85rem;color:#6b7280}.review-date{font-size:0.85rem;color:#6b7280}.review-content{padding:0 1.25rem 1.25rem}.review-content p{line-height:1.6;color:#374151;margin:0;font-size:0.95rem}.review-actions{padding:0 1.25rem 1.25rem;display:flex;align-items:center;gap:1rem}.btn-generate-response{background:var(--material-regular-bg);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));color:var(--ai-icon-blue);border:1px solid var(--material-regular-border);padding:0.75rem 1.5rem;border-radius:8px;font-weight:600;font-size:0.9rem;cursor:pointer;transition:all 0.2s cubic-bezier(0.175,0.885,0.32,1.275);display:flex;align-items:center;gap:0.5rem;position:relative;overflow:hidden}.btn-generate-response::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ai-accent-gradient);opacity:0.08;pointer-events:none}.btn-generate-response:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--material-thick-shadow);background:var(--material-thick-bg)}.btn-generate-response:hover:not(:disabled)::before{opacity:0.12}.btn-generate-response:disabled{opacity:0.7;cursor:not-allowed}.response-status{display:flex;align-items:center;gap:0.5rem;color:#10b981;font-weight:600;font-size:0.9rem}.response-options{padding:1.5rem;background:#f9fafb;border-top:1px solid #e5e7eb;animation:slideDown 0.3s ease-out}@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.response-options-header h4{margin:0 0 1rem 0;color:#374151;font-size:1rem;font-weight:600}.response-option{background:white;border:1px solid #e5e7eb;border-radius:12px;padding:1.25rem;margin-bottom:1rem;transition:all 0.2s ease}.response-option:last-child{margin-bottom:0}.response-option:hover{border-color:#007AFF;box-shadow:0 2px 8px rgba(0,122,255,0.1)}.response-tone-label{font-weight:600;color:#007AFF;margin-bottom:0.75rem;font-size:0.9rem}.response-text{line-height:1.6;color:#374151;margin-bottom:1rem;font-size:0.9rem}.btn-select-response{background:white;color:#007AFF;border:1px solid #007AFF;padding:0.5rem 1rem;border-radius:6px;font-weight:600;font-size:0.85rem;cursor:pointer;transition:all 0.2s ease}.btn.btn-outline.btn-select-response,button.btn.btn-outline.btn-select-response{color:var(--slate-800,#1e293b) !important;border-color:var(--border-neutral,rgba(0,0,0,0.12))}.btn-select-response:hover:not(:disabled){background:#007AFF;color:white;transform:translateY(-1px)}.btn-select-response.btn-success{background:#10b981;color:white;border-color:#10b981}.btn-select-response:disabled{opacity:0.7;cursor:not-allowed}.booking-theme{border-left:4px solid #1976d2}.google-theme{border-left:4px solid #4285f4}.tripadvisor-theme{border-left:4px solid #00aa6c}.business-response{background:linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);border:1px solid #e2e8f0;border-radius:12px;margin-top:1rem;overflow:hidden;box-shadow:var(--material-ultra-thin-shadow);animation:slideDown 0.4s ease-out}.business-response-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:var(--material-regular-bg);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));color:var(--heading-color);border-bottom:1px solid var(--material-regular-border);position:relative;overflow:hidden}.business-response-header::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(30,41,59,0.08) 0%,rgba(51,65,85,0.08) 100%);pointer-events:none}.business-response-label{display:flex;align-items:center;gap:0.5rem;font-weight:600;font-size:0.9rem}.business-response-label i{color:#10b981;font-size:1rem}.response-tone-tag{background:rgba(16,185,129,0.2);color:#10b981;padding:0.25rem 0.5rem;border-radius:4px;font-size:0.75rem;font-weight:500;margin-left:0.5rem}.response-date{font-size:0.8rem;color:#94a3b8;font-weight:500}.business-response-content{padding:1.25rem}.response-text-display{margin:0;line-height:1.6;color:#374151;font-size:0.95rem;background:white;padding:1rem 1.25rem;border-radius:8px;border-left:4px solid #10b981;box-shadow:var(--material-ultra-thin-shadow);position:relative}.response-text-display::before{content:'"';position:absolute;top:-10px;left:10px;font-size:2rem;color:#10b981;font-family:serif;opacity:0.3}.booking-theme .business-response{border-left:4px solid #1976d2}.booking-theme .business-response-label i{color:#1976d2}.booking-theme .response-tone-tag{background:rgba(25,118,210,0.2);color:#1976d2}.booking-theme .response-text-display{border-left-color:#1976d2}.booking-theme .response-text-display::before{color:#1976d2}.google-theme .business-response{border-left:4px solid #4285f4}.google-theme .business-response-label i{color:#4285f4}.google-theme .response-tone-tag{background:rgba(66,133,244,0.2);color:#4285f4}.google-theme .response-text-display{border-left-color:#4285f4}.google-theme .response-text-display::before{color:#4285f4}.tripadvisor-theme .business-response{border-left:4px solid #00aa6c}.tripadvisor-theme .business-response-label i{color:#00aa6c}.tripadvisor-theme .response-tone-tag{background:rgba(0,170,108,0.2);color:#00aa6c}.tripadvisor-theme .response-text-display{border-left-color:#00aa6c}.tripadvisor-theme .response-text-display::before{color:#00aa6c}@media (max-width:768px){.review-header{flex-direction:column;align-items:flex-start;gap:0.75rem}.reviewer-info{flex-direction:column;align-items:flex-start;gap:0.5rem}.response-option{padding:1rem}.response-options{padding:1rem}.btn-generate-response{font-size:0.85rem;padding:0.625rem 1.25rem}.business-response-header{flex-direction:column;align-items:flex-start;gap:0.5rem;padding:1rem}.business-response-content{padding:1rem}.response-text-display{padding:0.875rem 1rem;font-size:0.9rem}}.properties-nav-intro{background:#f8fafc;border-left:4px solid #3b82f6;border-radius:8px;padding:1rem 1.5rem;margin-bottom:2rem}.properties-nav-intro p{margin:0;color:#1f2937;font-size:0.95rem;line-height:1.6}.properties-nav-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;margin-bottom:2rem}.property-nav-card{background:white;border:1px solid #e5e7eb;border-radius:12px;padding:1.5rem;box-shadow:var(--material-ultra-thin-shadow);transition:transform 0.2s ease,box-shadow 0.2s ease;display:flex;flex-direction:column;height:100%}.property-nav-card:hover{transform:translateY(-2px);box-shadow:var(--material-thin-shadow)}.property-nav-header{display:flex;gap:1rem;margin-bottom:1rem;align-items:flex-start}.property-nav-icon{width:48px;height:48px;border-radius:12px;background:var(--material-regular-bg);backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));-webkit-backdrop-filter:blur(var(--material-regular-blur)) saturate(var(--material-regular-saturate));border:1px solid var(--material-regular-border);color:var(--ai-icon-blue);display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0;position:relative;overflow:hidden}.property-nav-icon::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:var(--ai-accent-gradient);opacity:0.12;pointer-events:none}.property-nav-info{flex:1}.property-nav-info h4{margin:0 0 0.25rem 0;color:var(--slate-800,#1e293b);font-size:1.125rem;font-weight:600}.property-nav-type{margin:0 0 0.5rem 0;color:var(--slate-600,#475569);font-size:0.875rem;font-style:italic}.property-nav-stats{color:var(--slate-500,#64748b);font-size:0.75rem;font-weight:500}.property-nav-description{margin-bottom:1.5rem}.property-nav-description p{margin:0;color:var(--slate-700,#334155);font-size:0.875rem;line-height:1.5}.property-nav-actions{text-align:center}.property-nav-actions .btn{background:var(--color-surface,#ffffff);color:var(--slate-800,#1e293b) !important;border:1px solid var(--border-neutral,rgba(0,0,0,0.12))}.property-nav-actions .btn:hover{background:rgba(0,0,0,0.03)}.properties-nav-note{background:#fef3c7;border:1px solid #fbbf24;border-radius:8px;padding:1rem 1.5rem}.note-content{display:flex;align-items:flex-start;gap:0.75rem}.note-content i{color:#f59e0b;font-size:1.125rem;margin-top:0.125rem;flex-shrink:0}.note-text{color:#92400e;font-size:0.875rem;line-height:1.5}.note-text strong{color:#78350f}@media (max-width:768px){.properties-nav-grid{grid-template-columns:1fr;gap:1.5rem}.property-nav-header{flex-direction:column;text-align:center;gap:0.75rem}.property-nav-icon{align-self:center}.properties-nav-intro{padding:1rem}.note-content{flex-direction:column;gap:0.5rem;text-align:center}}@media (max-width:480px){.review-card{padding:1rem}.review-header{margin:-1rem -1rem 1rem -1rem;padding:0.75rem;gap:0.5rem}.google-rating .stars i{font-size:14px}}.btn.btn-outline.btn-select-response,button.btn.btn-outline.btn-select-response{background:var(--color-surface,#ffffff);color:var(--slate-800,#1e293b) !important;border-color:var(--border-neutral,rgba(0,0,0,0.12))}.btn.btn-outline.btn-select-response:hover,button.btn.btn-outline.btn-select-response:hover{background:rgba(0,0,0,0.03)}.btn-generate-response{background:var(--material-regular-bg,rgba(255,255,255,0.25));color:var(--ai-icon-blue,#0066CC);border:1px solid var(--material-regular-border,rgba(255,255,255,0.3))}