/* HZ Download Portal – Frontend Styles */

/* ── MY DOWNLOADS PAGE ── */
.hz-my-downloads { padding: 8px 0; }

.hz-dl-intro { color: #555; margin-bottom: 20px; font-size: 14px; }

.hz-dl-list { display: flex; flex-direction: column; gap: 12px; }

.hz-dl-card {
    display:       flex;
    align-items:   center;
    gap:           16px;
    background:    #fff;
    border:        1px solid #e0e0e0;
    border-radius: 8px;
    padding:       16px 20px;
    transition:    box-shadow .2s;
    flex-wrap:     wrap;
}
.hz-dl-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,.08); }
.hz-dl-card.hz-dl-expired { opacity: .6; background: #fafafa; }

.hz-dl-icon { font-size: 32px; flex-shrink: 0; }

.hz-dl-info { flex: 1; min-width: 180px; }
.hz-dl-name { font-size: 15px; font-weight: 600; color: #1a1a2e; display: block; margin-bottom: 4px; }

.hz-dl-meta { display: flex; flex-wrap: wrap; gap: 8px; font-size: 12px; color: #777; margin-bottom: 6px; }

.hz-dl-type {
    background: #f0f0f0; border-radius: 3px; padding: 1px 6px;
    font-weight: 700; font-family: monospace; color: #444;
}
.hz-dl-size::before  { content: '· '; }
.hz-dl-order::before { content: '· '; }

.hz-dl-stats { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; }

.hz-dl-count { color: #555; }
.hz-dl-expiry { padding: 2px 8px; border-radius: 20px; font-size: 11px; }
.hz-expiry-ok       { background: #d4edda; color: #155724; }
.hz-expiry-expired  { background: #f8d7da; color: #721c24; }

.hz-dl-action { flex-shrink: 0; }

.hz-dl-btn {
    display:         inline-flex;
    align-items:     center;
    gap:             6px;
    padding:         9px 20px;
    border-radius:   5px;
    font-size:       13px;
    font-weight:     600;
    text-decoration: none;
    transition:      opacity .15s, transform .1s;
    border:          none;
    cursor:          pointer;
}
.hz-dl-btn:hover { opacity: .88; transform: translateY(-1px); }

.hz-dl-btn-primary {
    background: #1a1a2e;
    color:      #fff;
}
.hz-dl-btn-disabled {
    background: #e0e0e0;
    color:      #888;
    cursor:     not-allowed;
}

/* Empty state */
.hz-dl-empty {
    text-align: center;
    padding:    60px 20px;
    color:      #888;
}
.hz-dl-empty-icon { font-size: 56px; margin-bottom: 16px; }
.hz-dl-empty h3   { font-size: 20px; color: #444; margin-bottom: 8px; }
.hz-dl-empty p    { margin-bottom: 20px; }

/* ── ORDER DOWNLOADS ── */
.hz-order-downloads {
    margin-top:    20px;
    padding:       16px 20px;
    background:    #f0f7ff;
    border:        1px solid #c8dff5;
    border-radius: 8px;
}

.hz-order-dl-title {
    font-size:     16px;
    font-weight:   700;
    margin:        0 0 14px;
    color:         #1a1a2e;
}

.hz-order-dl-row {
    display:         flex;
    align-items:     center;
    gap:             16px;
    padding:         10px 0;
    border-bottom:   1px solid #d0e6f8;
    flex-wrap:       wrap;
}
.hz-order-dl-row:last-child { border-bottom: none; }

.hz-order-dl-info { flex: 1; }
.hz-order-dl-info strong { font-size: 14px; color: #1a1a2e; }
.hz-dl-size { display: block; font-size: 11px; color: #888; }

.hz-order-dl-stats { font-size: 12px; color: #666; }

.hz-dl-btn-order {
    white-space:   nowrap;
    padding:       6px 14px;
    font-size:     12px;
}

/* ── DIGITAL CATALOG PAGE ── */
.hz-catalog { padding: 8px 0; }

.hz-catalog-header {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    margin-bottom:   24px;
}
.hz-catalog-count { font-size: 13px; color: #888; margin: 0; }

.hz-catalog-grid {
    display:               grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap:                   20px;
}

.hz-catalog-card {
    background:    #fff;
    border:        1px solid #e0e0e0;
    border-radius: 8px;
    overflow:      hidden;
    display:       flex;
    flex-direction: column;
    transition:    box-shadow .2s, transform .2s;
}
.hz-catalog-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.10);
    transform:  translateY(-2px);
}

.hz-catalog-img-wrap {
    display:         block;
    overflow:        hidden;
    background:      #f5f5f5;
    aspect-ratio:    4/3;
}
.hz-catalog-img {
    width:      100%;
    height:     100%;
    object-fit: cover;
    transition: transform .3s;
}
.hz-catalog-card:hover .hz-catalog-img { transform: scale(1.04); }

.hz-catalog-img-placeholder {
    display:         flex;
    align-items:     center;
    justify-content: center;
    color:           #bbb;
    font-size:       48px;
}

.hz-catalog-body { padding: 14px 16px; flex: 1; }
.hz-catalog-title {
    font-size:     15px;
    font-weight:   700;
    margin:        0 0 6px;
    line-height:   1.3;
}
.hz-catalog-title a { color: #1a1a2e; text-decoration: none; }
.hz-catalog-title a:hover { color: #1a73e8; }

.hz-catalog-desc {
    font-size:   13px;
    color:       #666;
    margin:      0 0 10px;
    line-height: 1.5;
}

.hz-catalog-meta { display: flex; flex-wrap: wrap; gap: 6px; }

.hz-catalog-badge {
    display:       inline-block;
    padding:       2px 8px;
    border-radius: 20px;
    font-size:     11px;
    font-weight:   700;
}
.hz-badge-type  { background: #e8f0fe; color: #1a73e8; }
.hz-badge-count { background: #f0f4ff; color: #555;    }

.hz-catalog-footer {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         10px 16px 14px;
    border-top:      1px solid #f0f0f0;
}
.hz-catalog-price { font-size: 16px; font-weight: 700; color: #1a1a2e; }

.hz-catalog-empty {
    text-align: center;
    padding:    60px 20px;
    color:      #888;
}
.hz-catalog-empty .material-icons { font-size: 56px; display: block; margin-bottom: 12px; }

/* Responsive */
@media (max-width: 640px) {
    .hz-dl-card   { flex-direction: column; align-items: flex-start; }
    .hz-dl-action { width: 100%; }
    .hz-dl-btn    { width: 100%; justify-content: center; }
    .hz-order-dl-row { flex-direction: column; align-items: flex-start; }
}

/* ── FOOTER LINK LIST ── */
.hz-footer-col { padding: 0; }

.hz-footer-title {
    font-size:     14px;
    font-weight:   700;
    color:         inherit;
    margin-bottom: 10px;
}

.hz-footer-list {
    list-style: none;
    margin:     0;
    padding:    0;
}

.hz-footer-list li { margin-bottom: 6px; }

.hz-footer-list a {
    font-size:       13px;
    color:           inherit;
    opacity:         .8;
    text-decoration: none;
    transition:      opacity .15s;
}
.hz-footer-list a:hover { opacity: 1; text-decoration: underline; }