/* Porovnanie papagájov v1 */
.cmp-main{max-width:1100px;margin:0 auto;padding:20px}

/* Hero */
.cmp-hero{text-align:center;padding:40px 20px 30px;background:linear-gradient(135deg,#e8f5e9,#c8e6c9);border-radius:16px;margin-bottom:28px}
.cmp-hero h1{font-size:clamp(1.5rem,3.5vw,2rem);color:#1a332a;margin:12px 0 8px}
.cmp-hero p{font-size:1rem;color:#5a6b5a}

/* Search */
.cmp-selector{margin-bottom:24px}
.cmp-search-wrap{position:relative;max-width:500px;margin:0 auto 12px}
.cmp-search{width:100%;padding:14px 14px 14px 42px;border:2px solid #e0e0e0;border-radius:12px;font-size:1rem;font-family:inherit;outline:none;transition:border-color .2s}
.cmp-search:focus{border-color:#4CAF50;box-shadow:0 0 0 3px rgba(76,175,80,.1)}
.cmp-search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);pointer-events:none}

/* Dropdown */
.cmp-dropdown{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.1);z-index:100;max-height:340px;overflow-y:auto;margin-top:4px}
.cmp-dd-item{display:flex;align-items:center;gap:12px;padding:10px 16px;cursor:pointer;transition:background .15s}
.cmp-dd-item:hover{background:#f0fdf0}
.cmp-dd-item img{width:40px;height:40px;border-radius:8px;object-fit:cover}
.cmp-dd-noimg{width:40px;height:40px;border-radius:8px;background:#e8f5e9}
.cmp-dd-item strong{color:#1a332a;font-size:.95rem}
.cmp-dd-item small{color:#888;font-size:.8rem}

/* Selected tags */
.cmp-selected{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.cmp-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#e8f5e9;border:1px solid #c8e6c9;border-radius:20px;font-size:.88rem;font-weight:600;color:#1a332a}
.cmp-tag img{width:24px;height:24px;border-radius:50%;object-fit:cover}
.cmp-tag button{background:none;border:none;color:#999;font-size:1.2rem;cursor:pointer;padding:0 0 0 4px;line-height:1}
.cmp-tag button:hover{color:#c62828}
.cmp-tag-hint{display:inline-flex;align-items:center;padding:6px 12px;color:#999;font-size:.85rem;border:1px dashed #ddd;border-radius:20px}

/* Table wrap */
.cmp-table-wrap{overflow-x:auto;margin-bottom:24px;border-radius:12px;border:1px solid #e8f5e9;animation:cmpFade .4s ease}
@keyframes cmpFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.cmp-table table{width:100%;border-collapse:collapse;min-width:500px}
.cmp-table th{background:#f8faf8;padding:12px;font-size:.85rem;color:#1a332a;text-align:center;border-bottom:2px solid #e8f5e9;position:sticky;top:0;z-index:2}
.cmp-table td{padding:12px;text-align:center;border-bottom:1px solid #f0f0f0;font-size:.88rem;color:#333;vertical-align:middle}
.cmp-row-label{text-align:left!important;font-weight:600;color:#5a6b5a;white-space:nowrap;min-width:100px;background:#fafcfa;position:sticky;left:0;z-index:1}
.cmp-table tr:hover td{background:#f8fdf8}

/* Photo row */
.cmp-photo{width:80px;height:80px;border-radius:10px;object-fit:cover;display:block;margin:0 auto;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.cmp-nophoto{width:80px;height:80px;border-radius:10px;background:#e8f5e9;margin:0 auto}
.cmp-link{color:#2E7D32;text-decoration:none;font-weight:700;font-size:.95rem}
.cmp-link:hover{text-decoration:underline}

/* Bars in table */
.cmp-bars{display:flex;gap:3px;justify-content:center;margin-bottom:2px}
.cmp-bar{width:16px;height:10px;border-radius:2px;background:#e0e0e0}
.cmp-bar.fill{opacity:1}
.cmp-best{display:inline-block;padding:2px 8px;background:#e8f5e9;color:#2E7D32;border-radius:10px;font-size:.7rem;font-weight:700;margin-top:4px}
.cmp-cell-best{background:#fffde7!important}
.cmp-yes{color:#2E7D32;font-weight:700}
.cmp-no{color:#999}
.cmp-cell{max-width:180px}

/* Actions */
.cmp-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:28px}
.cmp-share-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:#2E7D32;color:#fff;border:none;border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s}
.cmp-share-btn:hover{background:#1B5E20;transform:translateY(-2px)}
.cmp-share-btn svg{flex-shrink:0}
.cmp-reset-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:#fff;color:#5a6b5a;border:2px solid #e0e0e0;border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;font-family:inherit;transition:all .2s}
.cmp-reset-btn:hover{border-color:#4CAF50;color:#2E7D32}
.cmp-reset-btn svg{flex-shrink:0}

/* Suggestions */
.cmp-suggestions{margin-bottom:28px}
.cmp-suggestions h2{font-size:1.2rem;color:#1a332a;text-align:center;margin-bottom:16px}
.cmp-sug-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;max-width:700px;margin:0 auto}
.cmp-sug-card{display:block;padding:20px;background:#fff;border:2px solid #e8f5e9;border-radius:12px;text-decoration:none;text-align:center;transition:all .2s}
.cmp-sug-card:hover{border-color:#4CAF50;transform:translateY(-3px);box-shadow:0 6px 16px rgba(46,125,50,.1)}
.cmp-sug-vs{font-size:1.05rem;font-weight:700;color:#1a332a;display:block;margin-bottom:4px}
.cmp-sug-vs em{color:#4CAF50;font-style:normal;font-weight:400;font-size:.85rem}
.cmp-sug-card small{color:#888;font-size:.82rem}

/* Info */
.cmp-info{background:#f8faf8;border-radius:12px;padding:28px;margin-top:32px;border:1px solid #e8f5e9}
.cmp-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.cmp-info-item{display:flex;align-items:center;gap:12px}
.cmp-info-item strong{color:#1a332a;font-size:.95rem}
.cmp-info-item small{color:#888;font-size:.8rem}

/* Mobile */
@media(max-width:700px){
    .cmp-main{padding:12px}
    .cmp-hero{padding:28px 16px 24px}
    .cmp-info-grid{grid-template-columns:1fr}
    .cmp-sug-grid{grid-template-columns:1fr 1fr}
    .cmp-photo{width:60px;height:60px}
    .cmp-table th,.cmp-table td{padding:8px 6px;font-size:.8rem}
    .cmp-row-label{min-width:80px;font-size:.78rem}
}
@media(max-width:480px){
    .cmp-sug-grid{grid-template-columns:1fr}
    .cmp-actions{flex-direction:column;align-items:center}
}