/* WP Gallerie Photo Pro Plus - Frontend CSS */

.wpgpp-gallery { margin: 25px 0; font-family: inherit; }
.wpgpp-error, .wpgpp-empty { padding: 15px; background: #f8f8f8; border-left: 4px solid #dc3232; color: #50575e; }
.wpgpp-empty { border-left-color: #999; }

/* Album heading */
.wpgpp-album-heading { margin-bottom: 20px; }
.wpgpp-album-name { margin: 0 0 8px; font-size: 1.6em; }
.wpgpp-album-meta { color: #666; font-size: .9em; margin-bottom: 8px; }
.wpgpp-album-desc { color: #444; }

/* Item de base */
.wpgpp-item { margin: 0; padding: 0; position: relative; overflow: hidden; cursor: pointer; }
.wpgpp-item-img img { display: block; width: 100%; height: auto; transition: transform .4s; }
.wpgpp-item:hover .wpgpp-item-img img { transform: scale(1.04); }

/* Caption */
.wpgpp-caption {
    padding: 10px 12px;
    background: #fff;
    color: #222;
}
.wpgpp-cap-title { font-weight: 600; margin-bottom: 3px; }
.wpgpp-cap-meta { font-size: .85em; color: #666; margin-bottom: 3px; }
.wpgpp-cap-desc { font-size: .9em; color: #444; }

/* ---- GRID ---- */
.wpgpp-grid .wpgpp-grid-inner {
    display: grid;
    gap: 12px;
}
.wpgpp-cols-1 .wpgpp-grid-inner, .wpgpp-cols-1 .wpgpp-lightbox-grid { grid-template-columns: 1fr; }
.wpgpp-cols-2 .wpgpp-grid-inner, .wpgpp-cols-2 .wpgpp-lightbox-grid { grid-template-columns: repeat(2, 1fr); }
.wpgpp-cols-3 .wpgpp-grid-inner, .wpgpp-cols-3 .wpgpp-lightbox-grid { grid-template-columns: repeat(3, 1fr); }
.wpgpp-cols-4 .wpgpp-grid-inner, .wpgpp-cols-4 .wpgpp-lightbox-grid { grid-template-columns: repeat(4, 1fr); }
.wpgpp-cols-5 .wpgpp-grid-inner, .wpgpp-cols-5 .wpgpp-lightbox-grid { grid-template-columns: repeat(5, 1fr); }
.wpgpp-cols-6 .wpgpp-grid-inner, .wpgpp-cols-6 .wpgpp-lightbox-grid { grid-template-columns: repeat(6, 1fr); }
.wpgpp-cols-7 .wpgpp-grid-inner, .wpgpp-cols-7 .wpgpp-lightbox-grid { grid-template-columns: repeat(7, 1fr); }
.wpgpp-cols-8 .wpgpp-grid-inner, .wpgpp-cols-8 .wpgpp-lightbox-grid { grid-template-columns: repeat(8, 1fr); }

.wpgpp-grid .wpgpp-item {
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
    transition: box-shadow .2s, transform .2s;
}
.wpgpp-grid .wpgpp-item:hover { box-shadow: 0 6px 20px rgba(0,0,0,.15); transform: translateY(-2px); }
.wpgpp-grid .wpgpp-item-img { aspect-ratio: 4 / 3; overflow: hidden; }
.wpgpp-grid .wpgpp-item-img img { width: 100%; height: 100%; object-fit: cover; }

/* ---- MASONRY ---- */
.wpgpp-masonry .wpgpp-masonry-inner {
    column-gap: 12px;
}
.wpgpp-cols-2.wpgpp-masonry .wpgpp-masonry-inner { column-count: 2; }
.wpgpp-cols-3.wpgpp-masonry .wpgpp-masonry-inner { column-count: 3; }
.wpgpp-cols-4.wpgpp-masonry .wpgpp-masonry-inner { column-count: 4; }
.wpgpp-cols-5.wpgpp-masonry .wpgpp-masonry-inner { column-count: 5; }
.wpgpp-cols-6.wpgpp-masonry .wpgpp-masonry-inner { column-count: 6; }
.wpgpp-masonry .wpgpp-mas-item {
    break-inside: avoid;
    margin-bottom: 12px;
    display: block;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
}

/* ---- CAROUSEL ---- */
.wpgpp-carousel { position: relative; }
.wpgpp-carousel-viewport {
    position: relative;
    overflow: hidden;
    border-radius: 6px;
}
.wpgpp-carousel-track {
    display: flex;
    transition: transform .5s cubic-bezier(.16,.68,.4,1);
    will-change: transform;
}
.wpgpp-carousel-slide {
    flex: 0 0 100%;
    box-sizing: border-box;
}
.wpgpp-carousel-slide .wpgpp-item-img {
    aspect-ratio: 16 / 9;
    background: transparent;
    display: flex; align-items: center; justify-content: center;
}
.wpgpp-carousel-slide .wpgpp-item-img img { width: 100%; height: 100%; object-fit: contain; }
.wpgpp-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,.55);
    color: #fff;
    border: 0;
    padding: 0;
    margin: 0;
    width: 42px;
    height: 42px;
    box-sizing: border-box;
    border-radius: 50%;
    cursor: pointer;
    z-index: 3;
    transition: background .2s;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.wpgpp-nav:focus { outline: 2px solid rgba(255,255,255,.4); outline-offset: 2px; }
.wpgpp-nav:hover { background: rgba(0,0,0,.8); }
.wpgpp-nav .wpgpp-icon { display: block; width: 24px; height: 24px; }
.wpgpp-prev { left: 10px; }
.wpgpp-next { right: 10px; }
.wpgpp-dots { text-align: center; margin-top: 10px; }
.wpgpp-dots button {
    width: 10px; height: 10px;
    padding: 0; margin: 0 4px;
    border-radius: 50%;
    border: 0;
    background: #ccc;
    cursor: pointer;
    transition: background .2s;
}
.wpgpp-dots button.is-active { background: #333; }

/* ---- SLIDESHOW ---- */
.wpgpp-slideshow .wpgpp-slideshow-stage {
    position: relative;
    aspect-ratio: 16 / 9;
    background: transparent;
    border-radius: 6px;
    overflow: hidden;
}
.wpgpp-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .8s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.wpgpp-slide.is-active { opacity: 1; z-index: 2; }
.wpgpp-slide .wpgpp-item-img { width: 100%; height: 100%; }
.wpgpp-slide .wpgpp-item-img img { width: 100%; height: 100%; object-fit: contain; }
.wpgpp-slide .wpgpp-caption {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    background: linear-gradient(to top, rgba(0,0,0,.8), transparent);
    color: #fff;
    padding: 40px 20px 15px;
}
.wpgpp-slide .wpgpp-cap-title, .wpgpp-slide .wpgpp-cap-meta, .wpgpp-slide .wpgpp-cap-desc { color: #fff; }
.wpgpp-slide .wpgpp-cap-meta { color: #ddd; }

/* ---- JUSTIFIED ---- */
.wpgpp-justified .wpgpp-justified-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.wpgpp-just-item {
    flex-grow: 1;
    height: 220px;
    max-height: 220px;
    overflow: hidden;
    border-radius: 4px;
    position: relative;
}
.wpgpp-just-item .wpgpp-item-img { height: 100%; }
.wpgpp-just-item .wpgpp-item-img img { height: 100%; width: 100%; object-fit: cover; }
.wpgpp-just-item .wpgpp-caption {
    position: absolute; left: 0; right: 0; bottom: 0;
    background: linear-gradient(to top, rgba(0,0,0,.75), transparent);
    color: #fff;
    padding: 30px 10px 8px;
    opacity: 0;
    transition: opacity .3s;
}
.wpgpp-just-item .wpgpp-caption .wpgpp-cap-title,
.wpgpp-just-item .wpgpp-caption .wpgpp-cap-meta,
.wpgpp-just-item .wpgpp-caption .wpgpp-cap-desc { color: #fff; }
.wpgpp-just-item:hover .wpgpp-caption { opacity: 1; }

/* ---- MOSAIC ---- */
.wpgpp-mosaic-inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 180px;
    gap: 10px;
}
.wpgpp-mos-item {
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    background: #f0f0f0;
}
.wpgpp-mos-item .wpgpp-item-img { width: 100%; height: 100%; }
.wpgpp-mos-item .wpgpp-item-img img { width: 100%; height: 100%; object-fit: cover; }
.wpgpp-mos-item.is-large { grid-column: span 2; grid-row: span 2; }
.wpgpp-mos-item.is-wide { grid-column: span 2; }
.wpgpp-mos-item.is-tall { grid-row: span 2; }
.wpgpp-mos-item .wpgpp-caption {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    background: linear-gradient(to top, rgba(0,0,0,.75), transparent);
    color: #fff;
    padding: 30px 12px 10px;
    opacity: 0;
    transition: opacity .3s;
}
.wpgpp-mos-item .wpgpp-caption .wpgpp-cap-title,
.wpgpp-mos-item .wpgpp-caption .wpgpp-cap-meta,
.wpgpp-mos-item .wpgpp-caption .wpgpp-cap-desc { color: #fff; }
.wpgpp-mos-item:hover .wpgpp-caption { opacity: 1; }

/* ---- TIMELINE ---- */
.wpgpp-timeline-inner { position: relative; padding-left: 30px; }
.wpgpp-timeline-inner::before {
    content: '';
    position: absolute;
    left: 10px; top: 0; bottom: 0;
    width: 2px;
    background: #3498db;
}
.wpgpp-timeline-block { margin-bottom: 40px; position: relative; }
.wpgpp-timeline-marker {
    position: relative;
    margin-bottom: 15px;
}
.wpgpp-timeline-marker::before {
    content: '';
    position: absolute;
    left: -27px; top: 6px;
    width: 14px; height: 14px;
    background: #3498db;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #3498db;
}
.wpgpp-timeline-marker span {
    display: inline-block;
    background: #3498db;
    color: #fff;
    padding: 4px 12px;
    border-radius: 4px;
    font-weight: 600;
    font-size: .9em;
    text-transform: capitalize;
}
.wpgpp-timeline-images {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;
}
.wpgpp-tl-item {
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,.1);
}
.wpgpp-tl-item .wpgpp-item-img { aspect-ratio: 1 / 1; }
.wpgpp-tl-item .wpgpp-item-img img { width: 100%; height: 100%; object-fit: cover; }

/* ---- POLAROID ---- */
.wpgpp-polaroid-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    padding: 20px 0;
}
.wpgpp-pol-item {
    background: #fff;
    padding: 10px 10px 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.1);
    transition: transform .3s, box-shadow .3s, z-index 0s .3s;
    max-width: 240px;
    z-index: 1;
}
.wpgpp-pol-item .wpgpp-item-img { width: 220px; height: 220px; overflow: hidden; background: #f2f2f2; }
.wpgpp-pol-item .wpgpp-item-img img { width: 100%; height: 100%; object-fit: cover; }
.wpgpp-pol-item:hover {
    transform: rotate(0deg) scale(1.05) !important;
    box-shadow: 0 10px 25px rgba(0,0,0,.25);
    z-index: 5;
    transition: transform .3s, box-shadow .3s, z-index 0s 0s;
}
.wpgpp-pol-caption {
    font-family: 'Caveat', 'Brush Script MT', cursive;
    font-size: 1.3em;
    text-align: center;
    margin-top: 8px;
    padding: 0 6px 6px;
    color: #333;
}

/* ---- LIGHTBOX GRID (mode "lightbox only") ---- */
.wpgpp-lightbox-grid { display: grid; gap: 8px; }
.wpgpp-lb-item {
    display: block;
    overflow: hidden;
    border-radius: 4px;
    aspect-ratio: 1 / 1;
    position: relative;
}
.wpgpp-lb-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s; }
.wpgpp-lb-item:hover img { transform: scale(1.08); }

/* ---- LIGHTBOX MODAL ---- */
.wpgpp-lightbox-modal {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.92);
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity .25s;
}
.wpgpp-lightbox-modal.is-open { opacity: 1; }
.wpgpp-lb-img-wrap {
    max-width: 92vw;
    max-height: 82vh;
    position: relative;
}
.wpgpp-lb-img-wrap img {
    max-width: 92vw;
    max-height: 82vh;
    display: block;
    box-shadow: 0 10px 40px rgba(0,0,0,.5);
}
.wpgpp-lb-close {
    position: absolute;
    top: 15px;
    right: 20px;
    background: rgba(255,255,255,.15);
    border: 0;
    padding: 0;
    margin: 0;
    color: #fff;
    width: 40px;
    height: 40px;
    box-sizing: border-box;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.wpgpp-lb-close:hover { background: rgba(255,255,255,.3); }
.wpgpp-lb-prev, .wpgpp-lb-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,.15);
    color: #fff;
    border: 0;
    padding: 0;
    margin: 0;
    width: 50px;
    height: 50px;
    box-sizing: border-box;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.wpgpp-lb-prev { left: 20px; }
.wpgpp-lb-next { right: 20px; }
.wpgpp-lb-prev:hover, .wpgpp-lb-next:hover { background: rgba(255,255,255,.3); }
.wpgpp-lb-close .wpgpp-icon,
.wpgpp-lb-prev .wpgpp-icon,
.wpgpp-lb-next .wpgpp-icon { display: block; width: 24px; height: 24px; }
.wpgpp-lb-close:focus, .wpgpp-lb-prev:focus, .wpgpp-lb-next:focus { outline: 2px solid rgba(255,255,255,.4); outline-offset: 2px; }
.wpgpp-lb-info {
    position: absolute;
    bottom: 20px; left: 0; right: 0;
    text-align: center;
    color: #fff;
    padding: 0 20px;
}
.wpgpp-lb-info-title { font-size: 1.2em; font-weight: 600; margin-bottom: 4px; }
.wpgpp-lb-info-meta { font-size: .9em; color: #ccc; margin-bottom: 4px; }
.wpgpp-lb-info-desc { font-size: .9em; max-width: 700px; margin: 0 auto; color: #eee; }

/* ---- Responsive ---- */
@media (max-width: 768px) {
    .wpgpp-cols-3 .wpgpp-grid-inner, .wpgpp-cols-4 .wpgpp-grid-inner,
    .wpgpp-cols-5 .wpgpp-grid-inner, .wpgpp-cols-6 .wpgpp-grid-inner,
    .wpgpp-cols-7 .wpgpp-grid-inner, .wpgpp-cols-8 .wpgpp-grid-inner,
    .wpgpp-cols-3 .wpgpp-lightbox-grid, .wpgpp-cols-4 .wpgpp-lightbox-grid,
    .wpgpp-cols-5 .wpgpp-lightbox-grid, .wpgpp-cols-6 .wpgpp-lightbox-grid { grid-template-columns: repeat(2, 1fr); }
    .wpgpp-cols-3.wpgpp-masonry .wpgpp-masonry-inner,
    .wpgpp-cols-4.wpgpp-masonry .wpgpp-masonry-inner,
    .wpgpp-cols-5.wpgpp-masonry .wpgpp-masonry-inner,
    .wpgpp-cols-6.wpgpp-masonry .wpgpp-masonry-inner { column-count: 2; }
    .wpgpp-mosaic-inner { grid-template-columns: repeat(2, 1fr); }
    .wpgpp-mos-item.is-large { grid-column: span 2; }
}
@media (max-width: 480px) {
    .wpgpp-grid-inner, .wpgpp-lightbox-grid,
    [class*="wpgpp-cols-"] .wpgpp-grid-inner,
    [class*="wpgpp-cols-"] .wpgpp-lightbox-grid { grid-template-columns: 1fr !important; }
    [class*="wpgpp-cols-"].wpgpp-masonry .wpgpp-masonry-inner { column-count: 1 !important; }
    .wpgpp-mosaic-inner { grid-template-columns: 1fr; }
    .wpgpp-mos-item.is-large, .wpgpp-mos-item.is-wide { grid-column: span 1; }
}
