/* Custom CSS for LÜN Kft. */

/* Smooth scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Background grid pattern */
.bg-grid-pattern {
  background-size: 30px 30px;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.05) 1px, transparent 1px),
                    linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 1px, transparent 1px);
}

/* Animation utilities */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fadeIn {
  animation: fadeIn 0.25s ease-out forwards;
}

@keyframes blob {
  0% { transform: translate(0px, 0px) scale(1); }
  33% { transform: translate(30px, -40px) scale(1.1); }
  66% { transform: translate(-20px, 20px) scale(0.9); }
  100% { transform: translate(0px, 0px) scale(1); }
}
.animate-blob {
  animation: blob 8s infinite ease-in-out;
}
.animation-delay-2000 {
  animation-delay: 2s;
}

/* Tab buttons state on main page */
.doc-tab-btn.active {
  background-color: #f2721d !important;
  color: #ffffff !important;
  border-color: #f2721d !important;
  box-shadow: 0 4px 12px rgba(242, 114, 29, 0.25);
}
.doc-tab-btn.active i {
  color: #ffffff !important;
}
.doc-tab-btn:not(.active) {
  background-color: #ffffff;
  color: #475569;
}
.doc-tab-btn:not(.active):hover {
  background-color: #fff7ed;
  color: #ea580c;
}

/* Floating Popup Layer Component (Széchenyi infoblokk & general popups) */
.site-popup,
#corner-image-container {
  position: fixed !important;
  z-index: 99999 !important;
  transition: opacity 0.3s ease, transform 0.3s ease;
  display: block;
  max-width: calc(100vw - 30px) !important;
}

.site-popup.popup-hidden,
.site-popup[style*="display: none"],
#corner-image-container.popup-hidden {
  display: none !important;
}
.site-popup.pos-bottom-right,
#corner-image-container.pos-bottom-right {
  bottom: 18px !important;
  right: 18px !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
}
.site-popup.pos-bottom-left,
#corner-image-container.pos-bottom-left {
  bottom: 18px !important;
  left: 18px !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
}
.site-popup.pos-top-right,
#corner-image-container.pos-top-right {
  top: 90px !important;
  right: 18px !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
}
.site-popup.pos-top-left,
#corner-image-container.pos-top-left {
  top: 90px !important;
  left: 18px !important;
  bottom: auto !important;
  right: auto !important;
  transform: none !important;
}
.site-popup.pos-center,
#corner-image-container.pos-center {
  top: 50% !important;
  left: 50% !important;
  bottom: auto !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
}
.site-popup-wrapper {
  position: relative !important;
  display: inline-block !important;
  border: none !important;
  border-radius: 0 !important;
}
.site-popup .corner-image,
#corner-image-container .corner-image,
.corner-image {
  width: 400px;
  max-width: calc(100vw - 36px);
  height: auto;
  display: block;
  border-radius: 0 !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  border: none !important;
  outline: none !important;
  background: transparent !important;
}
.site-popup .corner-image-close-btn,
.site-popup .close-btn,
#corner-image-container .corner-image-close-btn,
#corner-image-container .close-btn,
.corner-image-close-btn,
.close-btn {
  position: absolute !important;
  top: -10px !important;
  right: -10px !important;
  background: #dc2626 !important;
  color: #ffffff !important;
  font-size: 13px !important;
  width: 26px !important;
  height: 26px !important;
  text-align: center !important;
  line-height: 22px !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  font-weight: 800 !important;
  font-family: Arial, sans-serif !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
  transition: transform 0.15s ease, background-color 0.15s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 2px solid #ffffff !important;
  z-index: 100000 !important;
  user-select: none !important;
}
.site-popup .corner-image-close-btn:hover,
.site-popup .close-btn:hover,
#corner-image-container .corner-image-close-btn:hover,
#corner-image-container .close-btn:hover,
.corner-image-close-btn:hover,
.close-btn:hover {
  background-color: #b91c1c !important;
  transform: scale(1.15) !important;
}

/* Tender filter buttons */
.tender-filter-btn.active {
  background-color: #0f2b48;
  color: #ffffff;
  border-color: #0f2b48;
}
.tender-filter-btn:not(.active) {
  background-color: #ffffff;
  color: #64748b;
}
.tender-filter-btn:not(.active):hover {
  background-color: #f1f5f9;
  color: #0f2b48;
}

/* Admin tab buttons state */
.admin-nav-btn.active {
  background-color: #fff7ed;
  color: #ea580c;
  font-weight: 700;
}
.admin-nav-btn:not(.active) {
  color: #475569;
}
.admin-nav-btn:not(.active):hover {
  background-color: #f8fafc;
  color: #0f2b48;
}
.admin-sub-btn.active i {
  color: #ea580c !important;
}
.admin-group-header.has-active {
  color: #ea580c;
  font-weight: 700;
}

/* Document submenu items (matching standard sub-nav styling, no unselected pills or backgrounds) */
.admin-nested-btn:not(.active) {
  background-color: transparent !important;
  color: #475569 !important;
}
.admin-nested-btn:not(.active):hover {
  background-color: #f8fafc !important;
  color: #0f2b48 !important;
}
.admin-nested-btn:not(.active) span {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.admin-nested-btn.active span[id^="sidebar-"] {
  color: #ea580c !important;
  font-weight: 700;
}

/* Navbar active state */
.nav-link {
  position: relative;
}
.nav-link::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 50%;
  width: 0;
  height: 2px;
  background-color: #f2721d;
  transition: all 0.2s ease;
  transform: translateX(-50%);
}
.nav-link:hover::after {
  width: 100%;
}

/* Draggable activities styling */
.drag-handle {
  cursor: grab;
  user-select: none;
  touch-action: none;
}
.drag-handle:active {
  cursor: grabbing;
}
.act-item {
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, opacity 0.15s ease;
}
.act-item.dragging {
  opacity: 0.45;
  transform: scale(0.99);
  background-color: #f8fafc;
  border-style: dashed;
  border-color: #ea580c;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
}
.act-item.drag-over {
  border-color: #ea580c;
  border-width: 2px;
  background-color: #fff7ed;
  transform: translateY(2px);
}
.act-icon-preview {
  transition: transform 0.2s ease, background-color 0.2s ease;
}
.act-icon-preview:hover {
  transform: scale(1.08);
}

/* Document & Regulation item cards & tabs: crisp white, no dull grey */
.doc-subtab-btn {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}
.doc-subtab-btn:not(.active) {
  background-color: #ffffff !important;
  border-color: #e2e8f0;
  color: #334155;
}
.doc-subtab-btn:not(.active):hover {
  border-color: #f2721d !important;
  color: #ea580c !important;
  background-color: #ffffff !important;
}
.proc-row, .reg-row, .gdoc-row, .remun-row, .report-row {
  background-color: #ffffff;
}
.proc-row.dragging, .reg-row.dragging, .gdoc-row.dragging, .remun-row.dragging, .report-row.dragging {
  opacity: 0.55;
  background-color: #fff7ed !important;
  border-color: #f2721d !important;
  border-style: dashed;
}
.proc-row.drag-over, .reg-row.drag-over, .gdoc-row.drag-over, .remun-row.drag-over, .report-row.drag-over {
  background-color: #fff7ed !important;
  border-color: #f2721d !important;
}

/* Stat Cards: Rectangular, subtle lift, deep shadow glow */
.stat-card {
  will-change: transform, box-shadow;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease, background-color 0.25s ease;
}
.stat-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.4), 0 10px 15px -5px rgba(242, 114, 29, 0.18);
  border-color: rgba(242, 114, 29, 0.65) !important;
}

/* Rich Hero Dynamic Ambient Background */
.hero-rich-bg {
  background: 
    radial-gradient(circle at 82% 28%, rgba(255, 237, 213, 0.32) 0%, transparent 48%),
    radial-gradient(circle at 18% 75%, rgba(154, 52, 18, 0.42) 0%, transparent 55%),
    radial-gradient(circle at 50% 50%, rgba(249, 115, 22, 0.25) 0%, transparent 60%),
    linear-gradient(135deg, #c2410c 0%, #d95a12 25%, #ea580c 50%, #f2721d 75%, #f97316 100%);
  position: relative;
}

/* Subtle Technical Drafting Coordinate Grid for Hero */
.hero-technical-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-size: 36px 36px;
  background-image: 
    linear-gradient(to right, rgba(255, 255, 255, 0.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.08) 1px, transparent 1px);
  opacity: 0.85;
}

/* Section Watermark Background Layers */
.section-watermark {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  user-select: none;
  z-index: 0;
}
.watermark-blueprint {
  background-image: url('../images/watermarks/pattern-blueprint.svg');
  background-repeat: repeat;
  background-position: center center;
  background-size: 680px 680px;
  opacity: 0.55;
}
.watermark-facilities {
  background-image: url('../images/watermarks/pattern-facilities.svg');
  background-repeat: repeat;
  background-position: center center;
  background-size: 720px 720px;
  opacity: 0.65;
}
.watermark-topo {
  background-image: url('../images/watermarks/pattern-topo.svg');
  background-repeat: repeat;
  background-position: center center;
  background-size: 760px 760px;
  opacity: 0.60;
}
.watermark-docs {
  background-image: url('../images/watermarks/pattern-docs.svg');
  background-repeat: repeat;
  background-position: center center;
  background-size: 700px 700px;
  opacity: 0.50;
}