﻿.patterns-archive{max-width:1200px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.patterns-archive .patterns-archive__header{text-align:center;margin-bottom:40px;padding:40px 20px;background:linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,.05)}.patterns-archive .patterns-archive__header .patterns-archive__title{font-size:2.5rem;font-weight:700;color:#333;margin-bottom:10px;background:linear-gradient(135deg, #007cba 0%, #005a87 100%);-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);background-clip:text}@media(max-width: 768px){.patterns-archive .patterns-archive__header .patterns-archive__title{font-size:2rem}}.patterns-archive .patterns-archive__header .patterns-archive__description{font-size:1.1rem;color:#666;max-width:600px;margin:0 auto;line-height:1.6}.patterns-archive .patterns-filters{background:linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);padding:30px;margin-bottom:40px;border:1px solid #e9ecef;border-radius:12px;box-shadow:0 4px 6px rgba(0,0,0,.05);backdrop-filter:blur(10px)}.patterns-archive .patterns-filters .filter-row{display:flex;gap:20px;margin-bottom:20px;flex-wrap:wrap}.patterns-archive .patterns-filters .filter-row:last-child{margin-bottom:0}.patterns-archive .patterns-filters .filter-row .filter-group{flex:1;min-width:200px;max-width:300px}.patterns-archive .patterns-filters .filter-row .filter-group label{display:block;margin-bottom:8px;font-weight:600;color:#333;font-size:14px;text-transform:uppercase;letter-spacing:.5px}.patterns-archive .patterns-filters .filter-row .filter-group select,.patterns-archive .patterns-filters .filter-row .filter-group input[type=text]{width:100%;padding:12px 16px;border:2px solid #e9ecef;border-radius:8px;font-size:14px;transition:all .2s ease;background:#fff;box-sizing:border-box}.patterns-archive .patterns-filters .filter-row .filter-group select:focus,.patterns-archive .patterns-filters .filter-row .filter-group input[type=text]:focus{outline:none;border-color:#007cba;box-shadow:0 0 0 3px rgba(0,124,186,.1);transform:translateY(-1px)}.patterns-archive .patterns-filters .filter-row .filter-group select::placeholder,.patterns-archive .patterns-filters .filter-row .filter-group input[type=text]::placeholder{color:#adb5bd}.patterns-archive .patterns-filters .filter-actions{display:flex;gap:12px;justify-content:center;padding-top:20px;border-top:1px solid #e9ecef}.patterns-archive .patterns-filters .filter-actions .filter-button{display:inline-block;padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px;text-decoration:none;transition:all .2s ease;padding:12px 24px;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;border-radius:8px;background:#007cba;color:#fff;box-shadow:0 2px 4px rgba(0,124,186,.2)}.patterns-archive .patterns-filters .filter-actions .filter-button:hover{background:#005a87;transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,124,186,.3)}.patterns-archive .patterns-filters .filter-actions .filter-button.reset{background:rgba(0,0,0,0);color:#007cba;border:2px solid #007cba;box-shadow:none}.patterns-archive .patterns-filters .filter-actions .filter-button.reset:hover{background:#007cba;color:#fff;border-color:#007cba}.patterns-archive .patterns-filters .filter-actions .filter-button:active{transform:translateY(0)}.patterns-archive .patterns-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));gap:20px;margin-bottom:30px}@media(max-width: 768px){.patterns-archive .patterns-grid{grid-template-columns:1fr}}.patterns-archive .pattern-card{box-shadow:0 2px 4px rgba(0,0,0,.1);border-radius:8px;overflow:hidden;background:#fff;transition:transform .2s ease,box-shadow .2s ease;overflow:hidden;border:1px solid #e1e5e9;box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.06)}.patterns-archive .pattern-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.15);border-color:#007cba}.patterns-archive .pattern-card:hover .pattern-card__overlay{opacity:1}.patterns-archive .pattern-card__inner{position:relative}.patterns-archive .pattern-card__thumbnail{position:relative;height:200px;overflow:hidden;background:#f8f9fa}.patterns-archive .pattern-card__thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform .2s ease}.patterns-archive .pattern-card__thumbnail--empty{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%)}.patterns-archive .pattern-card__thumbnail:hover img{transform:scale(1.05)}.patterns-archive .pattern-card__overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;justify-content:space-between;padding:16px;background:rgba(0,0,0,.8);opacity:0;transition:opacity .2s ease;z-index:2}.patterns-archive .pattern-card__overlay-content{display:flex;align-items:center;justify-content:space-between;width:100%}.patterns-archive .pattern-card__title{flex:1;text-align:left}.patterns-archive .pattern-card__title h3{color:#fff;font-size:16px;font-weight:600;margin:0;text-shadow:0 2px 4px rgba(0,0,0,.5);line-height:1.2}@media(max-width: 768px){.patterns-archive .pattern-card__title h3{font-size:14px}}.patterns-archive .pattern-card__copy,.patterns-archive .pattern-card__locked,.patterns-archive .pattern-card__preview{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:none;border-radius:6px;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;transition:all .2s ease;white-space:nowrap;box-shadow:0 2px 4px rgba(0,0,0,.2)}.patterns-archive .pattern-card__copy svg,.patterns-archive .pattern-card__locked svg,.patterns-archive .pattern-card__preview svg{width:16px;height:16px;flex-shrink:0}.patterns-archive .pattern-card__copy span,.patterns-archive .pattern-card__locked span,.patterns-archive .pattern-card__preview span{font-size:11px;font-weight:600}.patterns-archive .pattern-card__copy:hover,.patterns-archive .pattern-card__locked:hover,.patterns-archive .pattern-card__preview:hover{transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,.3)}.patterns-archive .pattern-card__copy:active,.patterns-archive .pattern-card__locked:active,.patterns-archive .pattern-card__preview:active{transform:translateY(0)}.patterns-archive .pattern-card__copy{background:hsla(0,0%,100%,.95);color:#007cba}.patterns-archive .pattern-card__copy:hover{background:#fff;color:#005a87}.patterns-archive .pattern-card__locked{background:rgba(220,53,69,.9);color:#fff;cursor:not-allowed}.patterns-archive .pattern-card__locked:hover{background:#dc3545}.patterns-archive .pattern-card__preview{background:rgba(0,123,186,.9);color:#fff;align-self:flex-end}.patterns-archive .pattern-card__preview:hover{background:#007cba}.patterns-archive .pattern-card__no-image{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);color:hsla(0,0%,100%,.8);font-size:14px;font-weight:500;text-align:center;z-index:1}.patterns-archive .patterns-pagination{display:flex;justify-content:center;margin-top:40px}.patterns-archive .patterns-pagination .pagination-links{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.patterns-archive .patterns-pagination .pagination-links a,.patterns-archive .patterns-pagination .pagination-links span{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:8px 12px;border:2px solid #e9ecef;text-decoration:none;color:#333;border-radius:8px;transition:all .2s ease;font-weight:500;background:#fff}.patterns-archive .patterns-pagination .pagination-links a.current,.patterns-archive .patterns-pagination .pagination-links span.current{background:#007cba;color:#fff;border-color:#007cba;box-shadow:0 2px 4px rgba(0,124,186,.2)}.patterns-archive .patterns-pagination .pagination-links a:hover:not(.current),.patterns-archive .patterns-pagination .pagination-links span:hover:not(.current){background:#f8f9fa;border-color:#007cba;color:#007cba;transform:translateY(-1px);box-shadow:0 2px 4px rgba(0,0,0,.1)}.patterns-archive .patterns-pagination .pagination-links a:not(.current):first-child::before,.patterns-archive .patterns-pagination .pagination-links span:not(.current):first-child::before{content:"«";margin-right:4px}.patterns-archive .patterns-pagination .pagination-links a:not(.current):last-child::after,.patterns-archive .patterns-pagination .pagination-links span:not(.current):last-child::after{content:"»";margin-left:4px}.patterns-archive .no-patterns{text-align:center;padding:40px 20px;color:#666}.patterns-archive .no-patterns .no-patterns-icon{font-size:48px;margin-bottom:20px;opacity:.5}.loading{display:flex;align-items:center;justify-content:center;padding:40px}.loading .spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #007cba;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.patterns-pagination{display:flex;justify-content:center;margin-top:100px;margin-bottom:20px}.patterns-pagination ul.page-numbers{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;margin:0;padding:0;list-style:none}.patterns-pagination li{margin:0}.patterns-pagination li a.page-numbers,.patterns-pagination li span.page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:5px 8px;border:1px solid #e9ecef;text-decoration:none;color:#495057;border-radius:6px;transition:all .2s ease;background:#fff;font-weight:500;font-size:14px;line-height:1}.patterns-pagination li a.page-numbers:hover:not(.current),.patterns-pagination li span.page-numbers:hover:not(.current){background:#f8f9fa;border-color:#007cba;color:#007cba;transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.1)}.patterns-pagination li a.page-numbers.current,.patterns-pagination li span.page-numbers.current{background:#007cba;color:#fff;border-color:#007cba;box-shadow:0 4px 8px rgba(0,124,186,.2);font-weight:600}.patterns-pagination li a.page-numbers.dots,.patterns-pagination li span.page-numbers.dots{display:none}.patterns-pagination li:first-child a.page-numbers::before{content:"‹";margin-right:4px;font-size:16px}.patterns-pagination li:last-child a.page-numbers::after{content:"›";margin-left:4px;font-size:16px}.patterns-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:10000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;backdrop-filter:blur(4px)}.patterns-modal.is-open{opacity:1;visibility:visible}.patterns-modal__content{position:relative;max-width:90vw;max-height:90vh;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 25px 50px rgba(0,0,0,.4);transform:scale(0.9) translateY(20px);opacity:0;transition:all .3s cubic-bezier(0.34, 1.56, 0.64, 1)}.is-open .patterns-modal__content{transform:scale(1) translateY(0);opacity:1}.patterns-modal__image{display:block;max-width:100%;height:auto;object-fit:contain}.patterns-modal__close{position:absolute;top:20px;right:20px;background:hsla(0,0%,100%,.9);color:#333;border:none;border-radius:50%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:24px;font-weight:300;transition:all .2s ease;box-shadow:0 2px 8px rgba(0,0,0,.1);z-index:10}.patterns-modal__close:hover{background:#fff;transform:scale(1.05);box-shadow:0 4px 12px rgba(0,0,0,.15)}.patterns-modal__close:active{transform:scale(0.95)}.patterns-modal__info{padding:24px;background:linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);border-top:1px solid #dee2e6;display:flex;align-items:center;justify-content:space-between;gap:20px}.patterns-modal__info .pattern-title{margin:0;font-size:20px;font-weight:600;color:#2d3748;line-height:1.3;flex:1}.patterns-modal__info .pattern-actions{display:flex;gap:12px;margin:0;flex-shrink:0;align-items:center}.patterns-modal__info .pattern-actions .pattern-card__copy,.patterns-modal__info .pattern-actions .pattern-card__locked{margin:0;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:500;transition:all .2s ease;border:2px solid rgba(0,0,0,0);min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px}.patterns-modal__info .pattern-actions .pattern-card__copy svg,.patterns-modal__info .pattern-actions .pattern-card__locked svg{width:18px;height:18px;flex-shrink:0}.patterns-modal__info .pattern-actions .pattern-card__copy span,.patterns-modal__info .pattern-actions .pattern-card__locked span{font-size:13px;font-weight:600}.patterns-modal__info .pattern-actions .pattern-card__copy:hover,.patterns-modal__info .pattern-actions .pattern-card__locked:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.15)}.patterns-modal__info .pattern-actions .pattern-card__copy:active,.patterns-modal__info .pattern-actions .pattern-card__locked:active{transform:translateY(0)}.patterns-modal__info .pattern-actions .pattern-card__copy{background:linear-gradient(135deg, #007cba 0%, #005a87 100%);color:#fff;border-color:#007cba}.patterns-modal__info .pattern-actions .pattern-card__copy:hover{background:linear-gradient(135deg, #005a87 0%, #004466 100%);border-color:#005a87}.patterns-modal__info .pattern-actions .pattern-card__copy:disabled{opacity:.7;cursor:not-allowed;transform:none}.patterns-modal__info .pattern-actions .pattern-card__locked{background:linear-gradient(135deg, #dc3545 0%, #c82333 100%);color:#fff;cursor:not-allowed;border-color:#dc3545}.patterns-modal__info .pattern-actions .pattern-card__locked:hover{background:linear-gradient(135deg, #c82333 0%, #a02622 100%);transform:none}@media(max-width: 768px){.patterns-archive .patterns-filters .filter-row{flex-direction:column;gap:15px}.patterns-archive .patterns-filters .filter-row .filter-group{min-width:auto}.patterns-archive .patterns-filters .filter-actions{flex-direction:column}.patterns-archive .patterns-filters .filter-actions .filter-button{width:100%;text-align:center}.patterns-archive .pattern-card .pattern-content .pattern-actions{flex-direction:column}.patterns-archive .pattern-card .pattern-content .pattern-actions .action-button{width:100%;text-align:center}.patterns-modal__content{max-width:95vw;max-height:95vh;border-radius:12px}.patterns-modal__close{width:40px;height:40px;font-size:20px}.patterns-modal__info{padding:20px;flex-direction:column;align-items:flex-start;gap:16px}.patterns-modal__info .pattern-title{font-size:18px;margin:0}.patterns-modal__info .pattern-actions{margin:0;width:100%;flex-direction:column;gap:10px}.patterns-modal__info .pattern-actions .pattern-card__copy,.patterns-modal__info .pattern-actions .pattern-card__locked{width:100%;justify-content:center;padding:12px 20px;font-size:15px}.patterns-modal__info .pattern-actions .pattern-card__copy span,.patterns-modal__info .pattern-actions .pattern-card__locked span{font-size:14px}}.single-pattern-container{max-width:800px;margin:0 auto;padding:40px 20px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.single-pattern-container .pattern-header{margin-bottom:40px;padding-bottom:20px;border-bottom:2px solid #e9ecef}.single-pattern-container .pattern-header h1{font-size:2.5rem;color:#333;margin-bottom:20px;line-height:1.2}.single-pattern-container .pattern-header .pattern-meta{display:flex;gap:30px;flex-wrap:wrap}.single-pattern-container .pattern-header .pattern-meta .pattern-categories strong,.single-pattern-container .pattern-header .pattern-meta .pattern-tags strong{color:#007cba;margin-right:8px}.single-pattern-container .pattern-header .pattern-meta .pattern-categories a,.single-pattern-container .pattern-header .pattern-meta .pattern-tags a{color:#005a87;text-decoration:none;padding:4px 8px;background:#f8f9fa;border-radius:4px;font-size:14px;transition:all .2s ease}.single-pattern-container .pattern-header .pattern-meta .pattern-categories a:hover,.single-pattern-container .pattern-header .pattern-meta .pattern-tags a:hover{background:#007cba;color:#fff}.single-pattern-container .pattern-content{margin-bottom:40px;line-height:1.6}.single-pattern-container .pattern-content p{margin-bottom:20px;font-size:16px}.single-pattern-container .pattern-content pre{background:#f8f9fa;padding:20px;border-radius:8px;overflow-x:auto;margin:20px 0;border:1px solid #e9ecef}.single-pattern-container .pattern-content code{background:#f8f9fa;padding:2px 6px;border-radius:4px;font-family:"Monaco","Menlo","Ubuntu Mono",monospace;font-size:14px}.single-pattern-container .pattern-actions{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.single-pattern-container .pattern-actions .copy-pattern-btn{display:inline-block;padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px;text-decoration:none;transition:all .2s ease;background:#007cba;color:#fff;padding:12px 24px;font-weight:600;border-radius:8px;transition:all .2s ease}.single-pattern-container .pattern-actions .copy-pattern-btn:hover{background:#005a87;transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,.15)}.single-pattern-container .pattern-actions .copy-pattern-btn .copy-icon{margin-right:8px}.single-pattern-container .pattern-actions .back-to-library-btn{display:inline-block;padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px;text-decoration:none;transition:all .2s ease;background:rgba(0,0,0,0);color:#007cba;border:2px solid #007cba;padding:12px 24px;font-weight:600;border-radius:8px;transition:all .2s ease}.single-pattern-container .pattern-actions .back-to-library-btn:hover{background:#007cba;color:#fff;transform:translateY(-1px)}/*# sourceMappingURL=frontend.css.map */
