/* ======================================================
   Reorganized CSS — preserves original declarations
   (duplicates removed, order retained where relevant)
   Comments minimal and in English as requested.
   ====================================================== */
html body .gsc-webResult.gsc-result {
  display: contents !important;
}

/* Hover doar pe gs-result */
.gs-webResult.gs-result:hover {
  background-color: rgba(var(--color-primary), 0.1) !important;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.1) !important;
}

html.dark .gs-webResult.gs-result:hover {
  background-color: rgba(var(--color-primary-dark), 0.1) !important;
}

/* --------------------
   1. Global / Hidden elements
   -------------------- */
.gsc-result-info-container,
.gcsc-more-maybe-branding-root {
  display: none !important;
}

.gsc-url-top,
.gsc-url-bottom,
.gsc-thumbnail-inside .gsc-url-top,
.gsc-thumbnail-inside > .gs-title,
.gsc-thumbnail-inside .gs-title:first-child {
  display: none !important;
}

/* Keep default link/label colors for dark mode as originally provided */
.dark .gsc-table-cell-snippet-close .gs-title a,
.dark .gsc-webResult .gsc-table-cell-snippet-close .gs-title a,
.dark .gsc-orderby-label,
.dark .gsc-cursor-page {
  color: #E5E7EB !important;
}

/* Snippets / description in dark */
.dark .gsc-table-cell-snippet-close .gs-snippet {
  color: #CBD5E1 !important; /* lighter gray for readability */
}

.dark .gs-label,
.dark .gsc-cursor-current-page {
  color: #4962E9 !important;
}

/* --------------------
   2. Refinements / Tabs area
   -------------------- */

/* refinements area and tabs area borders/margins (dark & light handled separately below) */
.dark .gsc-refinementsArea {
  border-bottom: 1px solid #1E293B;
  clear: both;
  margin: 6px 0 4px 0;
}

.dark .gsc-tabsArea {
  clear: both;
  margin-top: 6px;
  border-bottom: 1px solid #1E293B;
}

/* Light Mode tabs */
html:not(.dark) .gsc-tabsArea {
  padding: 6px 8px;
  border-radius: 8px;
}

html:not(.dark) .gsc-tabHeader {
  background-color: #E5E7EB;
  color: #111827; /* normal text */
  padding: 4px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  display: inline-block;
  margin-right: 4px;
}

/* Active and hover for light */
html:not(.dark) .gsc-tabHeader.gsc-tabhActive {
  background-color: #4962E9;
  color: #fff !important;
}
html:not(.dark) .gsc-tabHeader.gsc-tabhInactive:hover {
  background-color: #3344A3;
  color: #fff;
}
html:not(.dark) .gsc-tabHeader.gsc-tabhInactive {
  background-color: #F9FAFB;
}

/* Dark Mode tabs */
html.dark .gsc-tabsArea {
  background-color: #0F172A;
  padding: 6px 8px 8px;
  border-radius: 8px;
}

html.dark .gsc-tabHeader {
  background-color: #1B2335;
  color: #E5E7EB;
  padding: 4px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  display: inline-block;
  margin-right: 4px;
}

html.dark .gsc-tabHeader.gsc-tabhActive {
  background-color: #4962E9;
  color: #fff !important;
}

html.dark .gsc-tabHeader.gsc-tabhInactive:hover {
  background-color: #3344A3;
  color: #fff;
}

/* --------------------
   3. Refinement Block Buttons
   -------------------- */

/* Light refinement block */
.gsc-refinementBlock {
  background-color: #F9FAFB; /* light gray background */
  padding: 6px 8px 8px;
  border-radius: 8px;
}

.gsc-refinementBlock .gsc-refinementHeader {
  background-color: #E5E7EB; /* slightly darker gray for headers */
  color: #111827; /* dark text for contrast */
  padding: 4px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
  display: inline-block;
  margin-right: 4px;
}

.gsc-refinementBlock .gsc-refinementHeader.gsc-refinementhActive {
  background-color: #4962E9; /* accent color */
  color: #fff;
}

.gsc-refinementBlock .gsc-refinementHeader:hover:not(.gsc-refinementhActive) {
  background-color: #3344A3; /* darker accent on hover */
  color: #fff;
}

/* Dark refinement block */
.dark .gsc-refinementBlock {
  background-color: #0F172A;
  padding: 6px 8px 10px;
  border-radius: 8px;
}
.dark .gsc-refinementBlock .gsc-refinementHeader {
  background-color: #1B2335;
  color: #E5E7EB;
  padding: 4px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.2s;
  display: inline-block;
  margin-right: 4px;
}
.dark .gsc-refinementBlock .gsc-refinementHeader.gsc-refinementhActive {
  background-color: #4962E9;
  color: #fff;
}
.dark .gsc-refinementBlock .gsc-refinementHeader:hover:not(.gsc-refinementhActive) {
  background-color: #3344A3;
  color: #fff;
}

/* --------------------
   4. Pagination
   -------------------- */

/* general pagination button style */
.gsc-cursor-page {
  font-size: 1.2rem; /* mărește textul (kept original) */
  padding: 8px 14px;
  margin: 0 4px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* current page */
.gsc-cursor-current-page {
  background-color: #2563eb; /* albastru frumos */
  font-weight: 600;
}

/* responsive change for pagination */
@media (max-width: 600px) {
  .gsc-cursor-page {
    font-size: 1.0rem;
    padding: 2px 1px;
  }
}

/* hover for pagination (kept original behavior) */
.gsc-cursor-page:hover:not(.gsc-cursor-current-page) {
  background-color: #e5e7eb;
}

/* center pagination box */
.gsc-cursor-box {
  display: flex;
  justify-content: center;
  margin-top: 1rem;
}

/* --------------------
   5. Hide / small overrides used earlier
   -------------------- */

.gsc-result-info-container,
.gcsc-more-maybe-branding-root {
  display: none !important;
}

/* --------------------
   6. Buttons & search controls
   -------------------- */

.gsc-search-button, 
.gsc-search-button-v2 {
  border-radius: 6px !important; /* adjust px as you like */
}

.gsc-search-button-v2:hover {
  background: #3344A3 !important;
}

/* --------------------
   7. Result cards — main wrapper (kept original heavy overrides)
   -------------------- */

/* dark variant of card background kept */
.dark .gsc-webResult.gsc-result,
.dark .gs-webResult.gs-result {
  background: #1E293B !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
}

/* image box border resets in dark mode kept as originally specified */
.dark .gs-web-image-box .gs-image, .gs-promotion-image-box .gs-promotion-image {
  border: 0px solid #e2e2e2;
}

/* popup image box */
.gs-imageResult-popup .gs-image-popup-box {
  width: calc(100% - 10px) !important;
  position: absolute;
  padding: 5px;
  margin: 5px;
  left: 0;
  bottom: 0;
  background: rgba(51, 51, 51, 0.8);
  display: none;
}

/* force the internal table/result wrapper to be a horizontal row (kept duplicates consolidated) */
.gsc-table-result {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
  gap: 1rem !important;
}

/* --------------------
   8. Text column (title + snippet)
   -------------------- */

.gsc-table-cell-snippet-close {
  order: 1 !important;
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 0 !important;
}

/* Title inside left column */
.gsc-table-cell-snippet-close .gs-title,
.gsc-table-cell-snippet-close .gs-title a,
.gsc-webResult .gsc-table-cell-snippet-close .gs-title a {
  flex: 0 0 33.33% !important; /* preserved from original */
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  display: block !important;
  margin-bottom: 4px !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  color: #202124 !important;
  text-decoration: none !important;
}

/* dark title color preserved earlier (there were dark-specific title selectors) */
.dark .gsc-table-cell-snippet-close .gs-title a {
  color: #E5E7EB !important;
}

/* Snippet column style (kept original color & size) */
.gsc-table-cell-snippet-close .gs-snippet {
  flex: 0 0 33.33% !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  display: block !important;
  line-height: 1.4 !important;
  color: #5f6368 !important;
  font-size: 0.92rem !important;
}

/* dark snippet color already defined above; keep redundancy minimal but preserved */

/* --------------------
   9. Thumbnail column + image transforms
   -------------------- */

.gsc-table-cell-thumbnail.gsc-thumbnail {
  order: 2 !important;
  flex: 0 0 33.33% !important;
  /* later we clamp to fixed 150px in another section for horizontal card layout; keep this general here */
  height: 96px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  overflow: hidden !important;
}

/* alternate thumbnail sizing used elsewhere — keep both (original had both definitions) */
.gsc-table-cell-thumbnail.gsc-thumbnail {
  /* keep both sets but note: the second definition for horizontal card below sets flex:0 0 150px !important */
}

/* Image inside thumbnail (multiple original selectors consolidated) */
.gsc-thumbnail img,
.gsc-table-cell-thumbnail img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.28s ease !important;
  transform-origin: center center; /* preserve recent transform-origin declaration */
}

/* Hover transforms — original file had different hover scales in two places.*/

.gsc-webResult.gsc-result:hover .gsc-table-cell-thumbnail img {
  transform: scale(3.00) !important; /* original later occurrence — kept to preserve original cascade */
}

/* Also an explicit non-hover scale was present in original — keep it */
.gsc-thumbnail img {
  transform: scale(3.0);
}

/* --------------------
   10. Horizontal card variant with fixed thumbnail width (kept original)
   -------------------- */

.gsc-webResult.gsc-result,
.gs-webResult.gs-result {
  /* re-declared intentionally (consolidated earlier) to preserve original horizontal card alignment */
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 1.25rem !important;
  padding: 14px 18px !important;
  background: #fff !important;
  margin: 8px 0 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
  width: 100% !important;
}

/* Fixed-size thumbnail (right) to align row height as in original */
.gsc-table-cell-thumbnail.gsc-thumbnail {
  flex: 0 0 150px !important;    /* fixed width preserved from original */
  height: 96px !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Additional hover effect duplicate consolidated above (kept) */

/* --------------------
   11. Hide repeated URL blocks and show visibleUrl styling (as original)
   -------------------- */

.gsc-url-top,
.gsc-url-bottom,
.gsc-thumbnail-inside .gsc-url-top {
  display: none !important;
}

/* Visible breadcrumb / domain */
.gsc-table-cell-snippet-close .gs-visibleUrl,
.gsc-table-cell-snippet-close .gs-visibleUrl-short,
.gsc-table-cell-snippet-close .gs-visibleUrl-long {
  font-size: 0.78rem !important;
  color: #1a73e8 !important;
  margin-top: 6px !important;
  word-break: break-all !important;
}

/* --------------------
   12. Responsive stacks (kept exactly as original breakpoints and rules)
   -------------------- */

@media (max-width: 720px) {
  .gsc-webResult.gsc-result,
  .gs-webResult.gs-result,
  .gsc-table-result {
    flex-direction: column !important;
  }

  .gsc-table-cell-snippet-close .gs-title,
  .gsc-table-cell-snippet-close .gs-snippet,
  .gsc-table-cell-thumbnail.gsc-thumbnail {
    flex: 0 0 auto !important;
    width: 100% !important;
  }

  /* mobile: image on top variant (original also had order:-1 in one area) */
  .gsc-table-cell-thumbnail.gsc-thumbnail {
    order: -1 !important;
    width: 110% !important;
    flex: 0 0 auto !important;
  }

  .gsc-table-cell-snippet-close {
    justify-content: flex-start !important;
    padding-top: 10px !important;
  }

  .gsc-cursor-page {
    font-size: 1.0rem;
    padding: 2px 1px;
  }
}

/* --------------------
   13. Google results/controls styling (inputs, wrappers, and overrides)
   -------------------- */

.google-results .gsc-input-box {
  border: 0;
  background: none;
}

.google-results .gsib_a {
  padding: 0;
}

.gsc-webResult.gsc-result, .gsc-results .gsc-imageResult,
.google-results .gsc-control-cse {
  border: 0;
  background: none !important;
}

.google-results .gsc-webResult.gsc-result {
  border-width: 0;
  border-bottom: 0px solid #e5e7eb;
}

.dark .gsc-webResult.gsc-result {
  border-width: 0;
  border-bottom: 0px solid #1e293b;
}

/* refinement active border color kept */
.gsc-refinementHeader.gsc-refinementhActive {
  border-bottom: 0px solid #1a73e8 !important;
}

/* snippet color anchors preserved from original variables usage */
.google-results .gs-webResult:not(.gs-no-results-result):not(.gs-error-result) .gs-snippet, .gs-fileFormatType,
.google-results .gsc-result-info {
  color: rgba(var(--color-secondary), 1);
}

/* Input style */
.google-results input.gsc-input {
  display: block;
  width: 100%;
  border-width: 0 !important;
  background-color: #f9fafb;
  --tw-shadow: 0 1px 2px 0 #0000000d;
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
  --tw-ring-color: #e5e7eb;
  border-radius: .5rem;
  padding: .5rem .75rem !important;
  font-size: .875rem;
  line-height: 1.25rem;
}

.dark .google-results input.gsc-input {
  background-color: #1e293b !important;
  --tw-ring-color: #1e293b;
}

.google-results .gsc-above-wrapper-area {
  border-bottom: 1px solid #e5e7eb;
}

.dark .google-results .gsc-above-wrapper-area {
  border-bottom: 1px solid #1e293b;
}

/* More-on-google area layout preserved */
.google-results .gcsc-more-maybe-branding-root {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.google-results .gcsc-find-more-on-google {
  display: flex;
  align-items: center;
  color: rgba(var(--color-text), 1);
}

.dark .google-results .gcsc-find-more-on-google {
  color: rgba(var(--color-text-dark), 1);
}

.google-results .gcsc-find-more-on-google-magnifier {
  fill: rgba(var(--color-primary), 1);
}

.dark .google-results .gcsc-find-more-on-google-magnifier {
  fill: rgba(var(--color-primary-dark), 1);
}

/* Title/link color variables preserved */
.google-results .gs-webResult.gs-result a.gs-title:link, 
.google-results .gs-webResult.gs-result a.gs-title:link b, 
.google-results .gs-imageResult a.gs-title:link, 
.google-results .gs-imageResult a.gs-title:link b,
.google-results .gsc-results .gsc-cursor-box .gsc-cursor-page.gsc-cursor-current-page {
  color: rgba(var(--color-text), 1);
}

.dark .google-results .gs-webResult.gs-result a.gs-title:link, 
.dark .google-results .gs-webResult.gs-result a.gs-title:link b, 
.dark .google-results .gs-imageResult a.gs-title:link, 
.dark .google-results .gs-imageResult a.gs-title:link b,
.dark .google-results .gsc-results .gsc-cursor-box .gsc-cursor-page.gsc-cursor-current-page {
  color: rgba(var(--color-text-dark), 1);
}

/* pagination appearance reset inside google-results preserved */
.google-results .gsc-results .gsc-cursor-box .gsc-cursor-page {
  border-color: transparent;
  background-color: transparent;
}

/* hover/border effects preserved */
.google-results .gsc-webResult.gsc-result:hover {
  border-color: #e5e7eb;
}

.dark .google-results .gsc-webResult.gsc-result:hover {
  border-color: #1e293b;
}

.google-results .gsc-webResult.gsc-result:hover {
  background-color: rgba(var(--color-primary), .1) !important;
}

.dark .google-results .gsc-webResult.gsc-result:hover {
  background-color: rgba(var(--color-primary-dark), .1) !important;
}

/* padding preserved */
.google-results .gsc-webResult.gsc-result {
  padding: 10px;
}

/* desktop table fallbacks preserved from original */
@media not all and (min-width: 1024px) {
  .google-results table tbody {
    display: table-row-group;
  }
  .google-results table td {
    display: table-cell;
  }
  .google-results table tr {
    display: table-row;
  }
}

/* active tab styling preserved */
.google-results .gsc-tabHeader.gsc-tabhActive {
  border-bottom: 0px solid rgba(var(--color-primary), 1) !important;
  color: rgba(var(--color-text), 1) !important;
}

.dark .google-results .gsc-tabHeader.gsc-tabhActive {
  border-bottom: 0px solid rgba(var(--color-primary-dark), 1) !important;
}

/* option container + selected option preserved */
.google-results .gsc-option-menu-container {
  display: flex;
  align-items: center;
}
.google-results .gsc-selected-option {
  white-space: nowrap;
}
.google-results .gsc-orderby {
  display: flex;
  align-items: center;
  justify-content: end;
}

/* ======================================================
   End of reorganized CSS (kept original declarations)
   ====================================================== */
