/**
 * Google Reviews Module – Stylesheet v3.0.0
 */

/* ============================================================ PROMĚNNÉ */
.gr-wrapper {
    --gr-primary:      #1a73e8;
    --gr-star-full:    #fbbc04;
    --gr-star-empty:   #dadce0;
    --gr-text:         #202124;
    --gr-text-muted:   #5f6368;
    --gr-bg:           #ffffff;
    --gr-bg-header:    #f8f9fa;
    --gr-border:       #e8eaed;
    --gr-radius:       12px;
    --gr-radius-sm:    8px;
    --gr-shadow:       0 1px 3px rgba(60,64,67,.12), 0 1px 2px rgba(60,64,67,.08);
    --gr-shadow-hover: 0 4px 12px rgba(60,64,67,.15), 0 2px 6px rgba(60,64,67,.10);
    --gr-font:         -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-family: var(--gr-font);
    color: var(--gr-text);
    margin: 2rem 0;
    box-sizing: border-box;
}
.gr-wrapper *, .gr-wrapper *::before, .gr-wrapper *::after { box-sizing: inherit; }

/* ============================================================ SKELETON LOADER */
@keyframes gr-shimmer {
    0%   { background-position: -400px 0; }
    100% { background-position: 400px 0; }
}

.gr-skeleton-block {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 800px 100%;
    animation: gr-shimmer 1.4s infinite linear;
    border-radius: 4px;
}

.gr-skeleton-header {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1.25rem 1.5rem;
    background: var(--gr-bg-header);
    border: 1px solid var(--gr-border);
    border-radius: var(--gr-radius) var(--gr-radius) 0 0;
    margin-bottom: 0;
}

.gr-skeleton-logo   { width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; }
.gr-skeleton-title  { width: 140px; height: 18px; }

.gr-skeleton-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
    padding: 1rem;
    background: var(--gr-bg);
    border: 1px solid var(--gr-border);
    border-top: none;
    border-radius: 0 0 var(--gr-radius) var(--gr-radius);
}

.gr-skeleton-card {
    background: var(--gr-bg);
    border: 1px solid var(--gr-border);
    border-radius: var(--gr-radius-sm);
    padding: 1.125rem;
    display: flex;
    flex-direction: column;
    gap: .75rem;
}

.gr-skeleton-row    { display: flex; gap: .75rem; align-items: flex-start; }
.gr-skeleton-lines  { flex: 1; display: flex; flex-direction: column; gap: .4rem; }
.gr-skeleton-avatar { width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0; }
.gr-skeleton-line   { width: 100%; height: 12px; }
.gr-skeleton-line--short  { width: 60%; }
.gr-skeleton-line--medium { width: 80%; }

/* ============================================================ HLAVIČKA */
.gr-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    background: var(--gr-bg-header);
    border: 1px solid var(--gr-border);
    border-radius: var(--gr-radius) var(--gr-radius) 0 0;
}
.gr-header-left  { display: flex; align-items: center; gap: .625rem; flex: 1 1 auto; min-width: 0; }
.gr-google-logo  { flex-shrink: 0; display: block; }
.gr-business-name { font-size: 1rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gr-header-right { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.gr-overall-score { font-size: 1.75rem; font-weight: 700; line-height: 1; }
.gr-total-count  { font-size: .813rem; color: var(--gr-text-muted); white-space: nowrap; }

/* ============================================================ TLAČÍTKO */
.gr-btn-write {
    display: inline-flex; align-items: center; padding: .5rem 1rem;
    font-size: .875rem; font-weight: 500; color: var(--gr-primary);
    background: transparent; border: 1.5px solid var(--gr-primary);
    border-radius: 20px; text-decoration: none; white-space: nowrap;
    transition: background .2s, color .2s;
}
.gr-btn-write:hover, .gr-btn-write:focus { background: var(--gr-primary); color: #fff; text-decoration: none; outline: none; }

/* ============================================================ GRID */
.gr-reviews-grid {
    display: grid; gap: 1rem; padding: 1rem;
    background: var(--gr-bg); border: 1px solid var(--gr-border);
    border-top: none; border-radius: 0 0 var(--gr-radius) var(--gr-radius);
}
.gr-cols-auto { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.gr-cols-1    { grid-template-columns: 1fr; }
.gr-cols-2    { grid-template-columns: repeat(2, 1fr); }
.gr-cols-3    { grid-template-columns: repeat(3, 1fr); }

/* ============================================================ KARTA */
.gr-card {
    background: var(--gr-bg); border: 1px solid var(--gr-border);
    border-radius: var(--gr-radius-sm); padding: 1.125rem;
    box-shadow: var(--gr-shadow); display: flex; flex-direction: column; gap: .75rem;
    transition: box-shadow .2s, transform .2s;
}
.gr-card:hover { box-shadow: var(--gr-shadow-hover); transform: translateY(-2px); }
.gr-card-header { display: flex; align-items: flex-start; gap: .75rem; }
.gr-avatar { flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background: #e8f0fe; display: flex; align-items: center; justify-content: center; }
.gr-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gr-avatar-initials { font-size: 1rem; font-weight: 600; color: var(--gr-primary); text-transform: uppercase; user-select: none; }
.gr-author { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.gr-author-name { font-size: .9rem; font-weight: 600; color: var(--gr-text); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
a.gr-author-name:hover { text-decoration: underline; color: var(--gr-primary); }
.gr-card-meta { display: flex; align-items: center; gap: .375rem; flex-wrap: wrap; }
.gr-time { font-size: .75rem; color: var(--gr-text-muted); }
.gr-card-text { font-size: .875rem; line-height: 1.6; color: var(--gr-text); word-break: break-word; }

/* ============================================================ HVĚZDIČKY */
.gr-stars { display: inline-flex; align-items: center; gap: 1px; line-height: 1; }
.gr-stars--large .gr-star { font-size: 1.125rem; }
.gr-star { font-size: .875rem; line-height: 1; display: inline-block; }
.gr-star--full, .gr-star--half { color: var(--gr-star-full); }
.gr-star--empty { color: var(--gr-star-empty); }

/* ============================================================ STAVY */
.gr-no-reviews {
    padding: 2rem 1.5rem; text-align: center; color: var(--gr-text-muted); font-size: .9rem;
    background: var(--gr-bg); border: 1px solid var(--gr-border); border-top: none;
    border-radius: 0 0 var(--gr-radius) var(--gr-radius);
}
.gr-admin-error {
    padding: 1rem 1.25rem; border: 1px solid #ffc107; background: #fff3cd;
    border-radius: var(--gr-radius-sm); color: #664d03; font-size: .875rem; margin: 1rem 0;
}

/* ============================================================ RESPONZIVITA */
@media (max-width: 768px) {
    .gr-header { flex-direction: column; align-items: flex-start; }
    .gr-cols-2, .gr-cols-3, .gr-cols-auto { grid-template-columns: 1fr; }
    .gr-skeleton-cards { grid-template-columns: 1fr; }
    .gr-overall-score { font-size: 1.5rem; }
}

/* ============================================================ DARK MODE */
@media (prefers-color-scheme: dark) {
    .gr-wrapper { --gr-text: #e8eaed; --gr-text-muted: #9aa0a6; --gr-bg: #1e1e1e; --gr-bg-header: #2d2d2d; --gr-border: #3c3c3c; }
    .gr-card { background: #2d2d2d; }
    .gr-avatar { background: #1a3a6e; }
    .gr-skeleton-block { background: linear-gradient(90deg, #2d2d2d 25%, #3c3c3c 50%, #2d2d2d 75%); background-size: 800px 100%; }
}

@media print {
    .gr-card { box-shadow: none; border: 1px solid #ccc; break-inside: avoid; }
    .gr-btn-write { display: none; }
}
