/* ========================================================== ATOSY ERP SUBJECT PROFILE CONTACT CARDS V1 ========================================================== */ .atosy-profile-contact-cards-v1 { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; margin-bottom: 14px !important; } /* ========================================================== CARD ========================================================== */ .atosy-profile-contact-card-v1 { padding: 12px 14px 14px !important; border: 1px solid rgba(41, 143, 118, .20) !important; border-radius: 14px !important; background: linear-gradient( 135deg, rgba(245, 253, 250, .96), rgba(251, 255, 253, .99) ) !important; box-shadow: 0 4px 14px rgba(22, 95, 76, .035) !important; } /* Website xanh nhẹ hơn */ .atosy-profile-contact-card-v1-website { border-color: rgba(43, 122, 220, .20) !important; background: linear-gradient( 135deg, rgba(246, 250, 255, .98), rgba(251, 253, 255, 1) ) !important; } /* ========================================================== HEADER ========================================================== */ .atosy-profile-contact-card-v1-head { margin-bottom: 10px !important; } .atosy-profile-contact-card-v1-head strong { display: block !important; color: #155747 !important; font-size: 11px !important; font-weight: 750 !important; line-height: 1.2 !important; } .atosy-profile-contact-card-v1-website .atosy-profile-contact-card-v1-head strong { color: #235e9f !important; } .atosy-profile-contact-card-v1-head span { display: block !important; margin-top: 2px !important; color: #7a918b !important; font-size: 9px !important; font-weight: 550 !important; line-height: 1.25 !important; } /* ========================================================== GRID ========================================================== */ .atosy-profile-contact-card-v1-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 0 12px !important; } /* * Website chỉ 1 field thì full width */ .atosy-profile-contact-card-v1-website .atosy-profile-contact-card-v1-grid { grid-template-columns: 1fr !important; } /* * Giữ field con sạch sẽ, * bỏ border ngoài nếu field cũ có đường chia. */ .atosy-profile-contact-card-v1-grid > * { min-width: 0 !important; } /* ========================================================== RESPONSIVE ========================================================== */ @media (max-width: 760px) { .atosy-profile-contact-card-v1-grid { grid-template-columns: 1fr !important; } } /* ========================================================== ATOSY PROFILE CONTACT SPACING V2 - tạo khoảng thở giữa header / card / field còn lại ========================================================== */ /* Toàn bộ cụm card con */ .atosy-profile-contact-cards-v1 { margin-top: 14px !important; margin-bottom: 16px !important; gap: 12px !important; } /* Từng card con */ .atosy-profile-contact-card-v1 { margin: 0 !important; padding: 14px 16px 15px !important; border-radius: 14px !important; } /* Header trong card */ .atosy-profile-contact-card-v1-head { margin-bottom: 12px !important; } /* Khoảng cách giữa các item bên trong card */ .atosy-profile-contact-card-v1-grid { row-gap: 10px !important; column-gap: 18px !important; } /* Nếu còn grid các kênh khác phía dưới, tạo khoảng cách với cụm card */ .atosy-profile-contact-cards-v1 + * { margin-top: 14px !important; } /* Tránh section ngoài bị quá sát */ .atosy-profile-contact-cards-v1 { padding-left: 2px !important; padding-right: 2px !important; } @media (max-width: 760px) { .atosy-profile-contact-cards-v1 { margin-top: 12px !important; margin-bottom: 14px !important; gap: 10px !important; } } /* ========================================================== ATOSY PROFILE CONTACT INNER ALIGN V3 - lùi đều 2 bên - thẳng với vùng nội dung phía dưới ========================================================== */ /* Cụm Email / Phone / Website */ .atosy-profile-contact-cards-v1 { width: auto !important; margin-top: 16px !important; margin-bottom: 18px !important; margin-left: 24px !important; margin-right: 24px !important; padding: 0 !important; gap: 14px !important; box-sizing: border-box !important; } /* Card con không tự nở vượt vùng căn lề */ .atosy-profile-contact-card-v1 { width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; margin-left: 0 !important; margin-right: 0 !important; } /* Giữ nội dung card thẳng hàng và thoáng */ .atosy-profile-contact-card-v1 { padding: 14px 16px 15px !important; } /* Khoảng cách với phần field bên dưới */ .atosy-profile-contact-cards-v1 + * { margin-top: 16px !important; } /* Mobile giảm lề */ @media (max-width: 760px) { .atosy-profile-contact-cards-v1 { margin-left: 12px !important; margin-right: 12px !important; } } /* ========================================================== ATOSY PROFILE ADDRESS CARD V1 ========================================================== */ .atosy-profile-contact-card-v1-address { border: 1px solid rgba(18, 184, 134, .22) !important; background: linear-gradient( 135deg, rgba(234, 252, 247, .84), rgba(255,255,255,.97) ) !important; } .atosy-profile-contact-card-v1-address [data-profile-contact-card="address"] { width: 100% !important; } .atosy-profile-contact-card-v1-address [data-profile-contact-card="address"] > * { width: 100% !important; max-width: none !important; grid-column: 1 / -1 !important; } /* ========================================================== ATOSY CONTACT CARDS REAL ORDER FIX Summary -> Address -> Email -> Phone -> Website ========================================================== */ /* * Cards Host giờ nằm BÊN TRONG fields grid, * nên bắt buộc span toàn bộ 2 cột. */ .atosy-subject-detail-v5-fields > .atosy-profile-contact-cards-v1 { grid-column: 1 / -1 !important; width: auto !important; } /* * Field Phương thức liên lạc đứng đầu và full width. */ .atosy-subject-detail-v5-field:has( .atosy-subject-detail-v5-field-label:first-child ) { min-width: 0; } /* * Address Card cùng hệ màu xanh contact, * full width giống Phone / Website. */ .atosy-profile-contact-card-v1-address { width: 100% !important; max-width: 100% !important; border: 1px solid rgba(41, 143, 118, .20) !important; background: linear-gradient( 135deg, rgba(245, 253, 250, .96), rgba(251, 255, 253, .99) ) !important; } .atosy-profile-contact-card-v1-address .atosy-profile-contact-card-v1-grid { grid-template-columns: 1fr !important; } .atosy-profile-contact-card-v1-address .atosy-subject-detail-v5-field { grid-column: 1 / -1 !important; width: 100% !important; max-width: none !important; }